@sellmate/design-system 1.0.59 → 1.0.61

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 (361) hide show
  1. package/dist/cjs/component.button-cqV-iCG5.js +90 -0
  2. package/dist/cjs/{component.textinput-BWW8c3OY.js → component.textinput-C4SsDjA1.js} +2 -2
  3. package/dist/cjs/design-system.cjs.js +1 -1
  4. package/dist/cjs/loader.cjs.js +1 -1
  5. package/dist/cjs/sd-action-modal.cjs.entry.js +1 -1
  6. package/dist/cjs/sd-badge.cjs.entry.js +1 -1
  7. package/dist/cjs/sd-barcode-input.cjs.entry.js +7 -7
  8. package/dist/cjs/{sd-button-v2.config-B4___nhv.js → sd-button-v2.config-CnqCQQMi.js} +26 -26
  9. package/dist/cjs/sd-button-v2_2.cjs.entry.js +5 -5
  10. package/dist/cjs/sd-button_4.cjs.entry.js +16 -14
  11. package/dist/cjs/sd-card.cjs.entry.js +1 -1
  12. package/dist/cjs/sd-confirm-modal.cjs.entry.js +2 -2
  13. package/dist/cjs/sd-date-picker-calendar.cjs.entry.js +166 -0
  14. package/dist/cjs/sd-date-picker-trigger.cjs.entry.js +51 -0
  15. package/dist/cjs/sd-date-picker.cjs.entry.js +84 -13
  16. package/dist/cjs/sd-date-picker.config-DWC_aiD2.js +175 -0
  17. package/dist/cjs/sd-date-range-picker-calendar.cjs.entry.js +280 -0
  18. package/dist/cjs/sd-date-range-picker.cjs.entry.js +85 -166
  19. package/dist/cjs/sd-dropdown-button.cjs.entry.js +12 -18
  20. package/dist/cjs/sd-form.cjs.entry.js +1 -1
  21. package/dist/cjs/sd-ghost-button.cjs.entry.js +19 -4
  22. package/dist/cjs/sd-guide.cjs.entry.js +3 -3
  23. package/dist/cjs/sd-input_2.cjs.entry.js +11 -11
  24. package/dist/cjs/sd-loading-spinner_3.cjs.entry.js +4 -4
  25. package/dist/cjs/sd-number-input.cjs.entry.js +3 -3
  26. package/dist/cjs/sd-popover.cjs.entry.js +2 -2
  27. package/dist/cjs/sd-portal.cjs.entry.js +1 -1
  28. package/dist/cjs/sd-progress.cjs.entry.js +2 -2
  29. package/dist/cjs/sd-radio-button-group.cjs.entry.js +1 -1
  30. package/dist/cjs/sd-radio-group.cjs.entry.js +2 -2
  31. package/dist/cjs/sd-radio.cjs.entry.js +111 -9
  32. package/dist/cjs/sd-select-dropdown_2.cjs.entry.js +3 -3
  33. package/dist/cjs/sd-select-group.cjs.entry.js +1 -1
  34. package/dist/cjs/sd-select-multiple-group.cjs.entry.js +1 -1
  35. package/dist/cjs/sd-select-multiple.cjs.entry.js +1 -1
  36. package/dist/cjs/sd-select-option-group.cjs.entry.js +3 -3
  37. package/dist/cjs/sd-select-v2-list-item_2.cjs.entry.js +6 -6
  38. package/dist/cjs/sd-select-v2-listbox_2.cjs.entry.js +5 -6
  39. package/dist/cjs/sd-select-v2.cjs.entry.js +3 -3
  40. package/dist/cjs/{sd-select-v2.config-BJXi4hMP.js → sd-select-v2.config-7xBJQhvx.js} +5 -6
  41. package/dist/cjs/sd-table.cjs.entry.js +4 -4
  42. package/dist/cjs/sd-tabs.cjs.entry.js +2 -2
  43. package/dist/cjs/sd-tag.cjs.entry.js +2 -2
  44. package/dist/cjs/sd-text-link.cjs.entry.js +3 -3
  45. package/dist/cjs/sd-textarea.cjs.entry.js +12 -12
  46. package/dist/cjs/sd-toast-container.cjs.entry.js +1 -1
  47. package/dist/cjs/sd-toast.cjs.entry.js +2 -2
  48. package/dist/cjs/sd-toggle-button.cjs.entry.js +1 -1
  49. package/dist/cjs/sd-toggle.cjs.entry.js +1 -1
  50. package/dist/collection/collection-manifest.json +4 -1
  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.config.js +6 -6
  54. package/dist/collection/components/sd-barcode-input/sd-barcode-input.js +1 -1
  55. package/dist/collection/components/sd-button/sd-button.css +1 -1
  56. package/dist/collection/components/sd-button/sd-button.js +5 -5
  57. package/dist/collection/components/sd-button-v2/sd-button-v2.config.js +27 -27
  58. package/dist/collection/components/sd-button-v2/sd-button-v2.css +7 -5
  59. package/dist/collection/components/sd-button-v2/sd-button-v2.js +2 -2
  60. package/dist/collection/components/sd-card/sd-card.js +1 -1
  61. package/dist/collection/components/sd-confirm-modal/sd-confirm-modal.js +2 -2
  62. package/dist/collection/components/sd-date-picker/sd-date-picker-calendar/sd-date-picker-calendar.css +117 -0
  63. package/dist/collection/components/sd-date-picker/sd-date-picker-calendar/sd-date-picker-calendar.js +246 -0
  64. package/dist/collection/components/sd-date-picker/sd-date-picker-trigger/sd-date-picker-trigger.css +38 -0
  65. package/dist/collection/components/sd-date-picker/sd-date-picker-trigger/sd-date-picker-trigger.js +159 -0
  66. package/dist/collection/components/sd-date-picker/sd-date-picker.config.js +69 -0
  67. package/dist/collection/components/sd-date-picker/sd-date-picker.css +8 -13
  68. package/dist/collection/components/sd-date-picker/sd-date-picker.js +392 -22
  69. package/dist/collection/components/sd-date-range-picker/sd-date-range-picker-calendar/sd-date-range-picker-calendar.css +184 -0
  70. package/dist/collection/components/sd-date-range-picker/sd-date-range-picker-calendar/sd-date-range-picker-calendar.js +361 -0
  71. package/dist/collection/components/sd-date-range-picker/sd-date-range-picker.config.js +9 -0
  72. package/dist/collection/components/sd-date-range-picker/sd-date-range-picker.css +5 -88
  73. package/dist/collection/components/sd-date-range-picker/sd-date-range-picker.js +408 -172
  74. package/dist/collection/components/sd-dropdown-button/sd-dropdown-button.config.js +7 -12
  75. package/dist/collection/components/sd-dropdown-button/sd-dropdown-button.css +2 -6
  76. package/dist/collection/components/sd-dropdown-button/sd-dropdown-button.js +4 -5
  77. package/dist/collection/components/sd-field/sd-field.css +8 -8
  78. package/dist/collection/components/sd-field/sd-field.js +5 -3
  79. package/dist/collection/components/sd-floating-portal/sd-floating-portal.js +1 -1
  80. package/dist/collection/components/sd-form/sd-form.js +1 -1
  81. package/dist/collection/components/sd-ghost-button/sd-ghost-button.config.js +8 -0
  82. package/dist/collection/components/sd-ghost-button/sd-ghost-button.js +5 -5
  83. package/dist/collection/components/sd-guide/sd-guide.css +1 -1
  84. package/dist/collection/components/sd-guide/sd-guide.js +2 -2
  85. package/dist/collection/components/sd-input/sd-input.config.js +6 -6
  86. package/dist/collection/components/sd-input/sd-input.css +0 -112
  87. package/dist/collection/components/sd-input/sd-input.js +2 -2
  88. package/dist/collection/components/sd-loading-spinner/sd-loading-spinner.js +1 -1
  89. package/dist/collection/components/sd-number-input/sd-number-input.js +3 -3
  90. package/dist/collection/components/sd-pagination/sd-pagination.js +2 -2
  91. package/dist/collection/components/sd-popover/sd-popover.js +2 -2
  92. package/dist/collection/components/sd-portal/sd-portal.js +1 -1
  93. package/dist/collection/components/sd-progress/sd-progress.js +2 -2
  94. package/dist/collection/components/sd-radio/sd-radio.config.js +30 -0
  95. package/dist/collection/components/sd-radio/sd-radio.css +43 -38
  96. package/dist/collection/components/sd-radio/sd-radio.js +60 -28
  97. package/dist/collection/components/sd-radio-button-group/sd-radio-button-group.js +1 -1
  98. package/dist/collection/components/sd-radio-group/sd-radio-group.css +43 -38
  99. package/dist/collection/components/sd-radio-group/sd-radio-group.js +1 -1
  100. package/dist/collection/components/sd-select/sd-select-dropdown/sd-select-dropdown.js +2 -2
  101. package/dist/collection/components/sd-select/sd-select-option/sd-select-option.js +1 -1
  102. package/dist/collection/components/sd-select/sd-select-search-input/sd-select-search-input.js +3 -3
  103. package/dist/collection/components/sd-select/sd-select.js +1 -1
  104. package/dist/collection/components/sd-select-group/sd-select-group.js +1 -1
  105. package/dist/collection/components/sd-select-multiple/sd-select-multiple.js +1 -1
  106. package/dist/collection/components/sd-select-multiple-group/sd-select-multiple-group.js +1 -1
  107. package/dist/collection/components/sd-select-multiple-group/sd-select-option-group/sd-select-option-group.js +3 -3
  108. package/dist/collection/components/sd-select-v2/sd-select-v2-list-item/sd-select-v2-list-item.js +2 -2
  109. package/dist/collection/components/sd-select-v2/sd-select-v2-list-item-search/sd-select-v2-list-item-search.js +3 -3
  110. package/dist/collection/components/sd-select-v2/sd-select-v2-listbox/sd-select-v2-listbox.css +1 -1
  111. package/dist/collection/components/sd-select-v2/sd-select-v2-listbox/sd-select-v2-listbox.js +1 -2
  112. package/dist/collection/components/sd-select-v2/sd-select-v2-trigger/sd-select-v2-trigger.js +2 -2
  113. package/dist/collection/components/sd-select-v2/sd-select-v2.config.js +1 -2
  114. package/dist/collection/components/sd-select-v2/sd-select-v2.js +3 -3
  115. package/dist/collection/components/sd-table/sd-table.js +4 -4
  116. package/dist/collection/components/sd-tabs/sd-tabs.js +2 -2
  117. package/dist/collection/components/sd-tag/sd-tag.js +2 -2
  118. package/dist/collection/components/sd-text-link/sd-text-link.js +3 -3
  119. package/dist/collection/components/sd-textarea/sd-textarea.config.js +11 -11
  120. package/dist/collection/components/sd-textarea/sd-textarea.js +1 -1
  121. package/dist/collection/components/sd-toast/sd-toast.js +2 -2
  122. package/dist/collection/components/sd-toast-container/sd-toast-container.js +1 -1
  123. package/dist/collection/components/sd-toggle/sd-toggle.js +1 -1
  124. package/dist/collection/components/sd-toggle-button/sd-toggle-button.js +1 -1
  125. package/dist/collection/components/sd-tooltip/sd-tooltip.js +2 -2
  126. package/dist/components/{p-B9t9pwo_.js → p-5OtzmjLh.js} +1 -1
  127. package/dist/components/{p-iZSyoiHU.js → p-98NWgkAU.js} +1 -1
  128. package/dist/components/{p-tR70yRjm.js → p-AdSqif48.js} +1 -1
  129. package/dist/components/p-B1XBwjCW.js +1 -0
  130. package/dist/components/p-BFaIxm6b.js +1 -0
  131. package/dist/components/p-BHQirDZt.js +1 -0
  132. package/dist/components/{p-bBjbkCP1.js → p-BP-QKaKz.js} +1 -1
  133. package/dist/components/p-BSZadK9N.js +1 -0
  134. package/dist/components/{p-DxzIjbQJ.js → p-BUAwjF_Z.js} +1 -1
  135. package/dist/components/{p-TF5CQvFs.js → p-BVBMsoZP.js} +1 -1
  136. package/dist/components/p-BWgJ9XTj.js +1 -0
  137. package/dist/components/{p-DuqfYDrU.js → p-BbtO5CEW.js} +1 -1
  138. package/dist/components/p-BsJy4pgR.js +1 -0
  139. package/dist/components/{p-C9GMwYKA.js → p-BtH5wWA5.js} +1 -1
  140. package/dist/components/p-C-kw2p2a.js +1 -0
  141. package/dist/components/p-C-qSDgVU.js +1 -0
  142. package/dist/components/p-C4i826lM.js +1 -0
  143. package/dist/components/{p-BIpitpaB.js → p-CE1Hmoij.js} +1 -1
  144. package/dist/components/p-CEa1HSpw.js +1 -0
  145. package/dist/components/p-CJwbBrt5.js +1 -0
  146. package/dist/components/p-CYRGa0VL.js +1 -0
  147. package/dist/components/{p-DmkL7H5j.js → p-Ci3yfjxH.js} +1 -1
  148. package/dist/components/p-ClgihpRm.js +1 -0
  149. package/dist/components/{p-5aLT6ILZ.js → p-D-Y0-FQk.js} +1 -1
  150. package/dist/components/p-D0wZv01W.js +1 -0
  151. package/dist/components/{p-BZwAZpfW.js → p-D93Cb_Vw.js} +1 -1
  152. package/dist/components/{p-IRd25v7v.js → p-DCv5afjJ.js} +1 -1
  153. package/dist/components/p-DPipeCRI.js +1 -0
  154. package/dist/components/{p-DB_gU4hh.js → p-DdBIc8AE.js} +1 -1
  155. package/dist/components/{p-mnDAufNv.js → p-DlujHEXS.js} +1 -1
  156. package/dist/components/{p-CKl79fdN.js → p-gTPCqs3t.js} +1 -1
  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-v2.js +1 -1
  161. package/dist/components/sd-button.js +1 -1
  162. package/dist/components/sd-calendar.js +1 -1
  163. package/dist/components/sd-card.js +1 -1
  164. package/dist/components/sd-confirm-modal.js +1 -1
  165. package/dist/components/sd-date-picker-calendar.d.ts +11 -0
  166. package/dist/components/sd-date-picker-calendar.js +1 -0
  167. package/dist/components/sd-date-picker-trigger.d.ts +11 -0
  168. package/dist/components/sd-date-picker-trigger.js +1 -0
  169. package/dist/components/sd-date-picker.js +1 -1
  170. package/dist/components/sd-date-range-picker-calendar.d.ts +11 -0
  171. package/dist/components/sd-date-range-picker-calendar.js +1 -0
  172. package/dist/components/sd-date-range-picker.js +1 -1
  173. package/dist/components/sd-dropdown-button.js +1 -1
  174. package/dist/components/sd-field.js +1 -1
  175. package/dist/components/sd-file-picker.js +1 -1
  176. package/dist/components/sd-floating-portal.js +1 -1
  177. package/dist/components/sd-form.js +1 -1
  178. package/dist/components/sd-ghost-button.js +1 -1
  179. package/dist/components/sd-guide.js +1 -1
  180. package/dist/components/sd-input.js +1 -1
  181. package/dist/components/sd-loading-spinner.js +1 -1
  182. package/dist/components/sd-modal-container.js +1 -1
  183. package/dist/components/sd-number-input.js +1 -1
  184. package/dist/components/sd-pagination.js +1 -1
  185. package/dist/components/sd-popover.js +1 -1
  186. package/dist/components/sd-portal.js +1 -1
  187. package/dist/components/sd-progress.js +1 -1
  188. package/dist/components/sd-radio-button-group.js +1 -1
  189. package/dist/components/sd-radio-group.js +1 -1
  190. package/dist/components/sd-radio.js +1 -1
  191. package/dist/components/sd-select-dropdown.js +1 -1
  192. package/dist/components/sd-select-group.js +1 -1
  193. package/dist/components/sd-select-multiple-group.js +1 -1
  194. package/dist/components/sd-select-multiple.js +1 -1
  195. package/dist/components/sd-select-option-group.js +1 -1
  196. package/dist/components/sd-select-option.js +1 -1
  197. package/dist/components/sd-select-search-input.js +1 -1
  198. package/dist/components/sd-select-v2-list-item-search.js +1 -1
  199. package/dist/components/sd-select-v2-list-item.js +1 -1
  200. package/dist/components/sd-select-v2-listbox.js +1 -1
  201. package/dist/components/sd-select-v2-trigger.js +1 -1
  202. package/dist/components/sd-select-v2.js +1 -1
  203. package/dist/components/sd-select.js +1 -1
  204. package/dist/components/sd-table.js +1 -1
  205. package/dist/components/sd-tabs.js +1 -1
  206. package/dist/components/sd-tag.js +1 -1
  207. package/dist/components/sd-text-link.js +1 -1
  208. package/dist/components/sd-textarea.js +1 -1
  209. package/dist/components/sd-toast-container.js +1 -1
  210. package/dist/components/sd-toast.js +1 -1
  211. package/dist/components/sd-toggle-button.js +1 -1
  212. package/dist/components/sd-toggle.js +1 -1
  213. package/dist/components/sd-tooltip.js +1 -1
  214. package/dist/design-system/design-system.css +1 -1
  215. package/dist/design-system/design-system.esm.js +1 -1
  216. package/dist/design-system/{p-6aaacaef.entry.js → p-00207f08.entry.js} +1 -1
  217. package/dist/design-system/{p-cf7d46cf.entry.js → p-067b0b3c.entry.js} +1 -1
  218. package/dist/design-system/p-0e6f5a99.entry.js +1 -0
  219. package/dist/design-system/p-13fed1bd.entry.js +1 -0
  220. package/dist/design-system/{p-5db2b37b.entry.js → p-14b67a6e.entry.js} +1 -1
  221. package/dist/design-system/{p-0c026571.entry.js → p-22a4972a.entry.js} +1 -1
  222. package/dist/design-system/{p-dea33b4d.entry.js → p-27df33c1.entry.js} +1 -1
  223. package/dist/design-system/p-28058050.entry.js +1 -0
  224. package/dist/design-system/p-2bd887ca.entry.js +1 -0
  225. package/dist/design-system/{p-4e13256e.entry.js → p-30055371.entry.js} +1 -1
  226. package/dist/design-system/{p-15c051cb.entry.js → p-3ac6a626.entry.js} +1 -1
  227. package/dist/design-system/{p-10dd9343.entry.js → p-3d10be45.entry.js} +1 -1
  228. package/dist/design-system/p-3f04d68a.entry.js +1 -0
  229. package/dist/design-system/{p-266ff86b.entry.js → p-4272b9e6.entry.js} +1 -1
  230. package/dist/design-system/p-5d2e8779.entry.js +1 -0
  231. package/dist/design-system/{p-eb11f6cc.entry.js → p-614c9883.entry.js} +1 -1
  232. package/dist/design-system/{p-3f657bf8.entry.js → p-62992b73.entry.js} +1 -1
  233. package/dist/design-system/p-6610c16b.entry.js +1 -0
  234. package/dist/design-system/p-72b564ed.entry.js +1 -0
  235. package/dist/design-system/{p-00e236e1.entry.js → p-739ac181.entry.js} +1 -1
  236. package/dist/design-system/{p-8f947287.entry.js → p-7dce4241.entry.js} +1 -1
  237. package/dist/design-system/{p-99b6157f.entry.js → p-7e4c0a36.entry.js} +1 -1
  238. package/dist/design-system/p-8b5b2866.entry.js +1 -0
  239. package/dist/design-system/p-90f51f65.entry.js +1 -0
  240. package/dist/design-system/{p-09369f2c.entry.js → p-9ae589c4.entry.js} +1 -1
  241. package/dist/design-system/p-B1XBwjCW.js +1 -0
  242. package/dist/design-system/p-BsrEibf7.js +1 -0
  243. package/dist/design-system/p-C3eQSZx-.js +1 -0
  244. package/dist/design-system/p-C4i826lM.js +1 -0
  245. package/dist/design-system/p-CJwbBrt5.js +1 -0
  246. package/dist/design-system/{p-47f068ca.entry.js → p-a03ad24f.entry.js} +1 -1
  247. package/dist/design-system/p-a6bc8512.entry.js +1 -0
  248. package/dist/design-system/p-afeb740a.entry.js +1 -0
  249. package/dist/design-system/p-b3e0e6f4.entry.js +1 -0
  250. package/dist/design-system/p-ba90dc5f.entry.js +1 -0
  251. package/dist/design-system/p-bad88292.entry.js +1 -0
  252. package/dist/design-system/p-c59191d3.entry.js +1 -0
  253. package/dist/design-system/p-cbb5575d.entry.js +1 -0
  254. package/dist/design-system/{p-3686b44e.entry.js → p-ce6a0b0f.entry.js} +1 -1
  255. package/dist/design-system/{p-3fff78c7.entry.js → p-d07448fe.entry.js} +1 -1
  256. package/dist/design-system/{p-a7e4994e.entry.js → p-d1a94401.entry.js} +1 -1
  257. package/dist/design-system/p-d75e0dc0.entry.js +1 -0
  258. package/dist/design-system/{p-fd11ac4d.entry.js → p-e9c28bdc.entry.js} +1 -1
  259. package/dist/design-system/{p-d8a3e32d.entry.js → p-e9ed9c00.entry.js} +1 -1
  260. package/dist/design-system/{p-391cf704.entry.js → p-f8567970.entry.js} +1 -1
  261. package/dist/design-system/p-fa22f13c.entry.js +1 -0
  262. package/dist/design-system/{p-cee768a2.entry.js → p-fa8b64c2.entry.js} +1 -1
  263. package/dist/esm/component.button-B1XBwjCW.js +88 -0
  264. package/dist/esm/{component.textinput-DSNs8RRn.js → component.textinput-CJwbBrt5.js} +2 -2
  265. package/dist/esm/design-system.js +1 -1
  266. package/dist/esm/loader.js +1 -1
  267. package/dist/esm/sd-action-modal.entry.js +1 -1
  268. package/dist/esm/sd-badge.entry.js +1 -1
  269. package/dist/esm/sd-barcode-input.entry.js +7 -7
  270. package/dist/esm/{sd-button-v2.config-C7s1j4_P.js → sd-button-v2.config-CV4xelxV.js} +26 -26
  271. package/dist/esm/sd-button-v2_2.entry.js +5 -5
  272. package/dist/esm/sd-button_4.entry.js +16 -14
  273. package/dist/esm/sd-card.entry.js +1 -1
  274. package/dist/esm/sd-confirm-modal.entry.js +2 -2
  275. package/dist/esm/sd-date-picker-calendar.entry.js +164 -0
  276. package/dist/esm/sd-date-picker-trigger.entry.js +49 -0
  277. package/dist/esm/sd-date-picker.config-C4i826lM.js +169 -0
  278. package/dist/esm/sd-date-picker.entry.js +84 -13
  279. package/dist/esm/sd-date-range-picker-calendar.entry.js +278 -0
  280. package/dist/esm/sd-date-range-picker.entry.js +86 -167
  281. package/dist/esm/sd-dropdown-button.entry.js +12 -18
  282. package/dist/esm/sd-form.entry.js +1 -1
  283. package/dist/esm/sd-ghost-button.entry.js +19 -4
  284. package/dist/esm/sd-guide.entry.js +3 -3
  285. package/dist/esm/sd-input_2.entry.js +11 -11
  286. package/dist/esm/sd-loading-spinner_3.entry.js +4 -4
  287. package/dist/esm/sd-number-input.entry.js +3 -3
  288. package/dist/esm/sd-popover.entry.js +2 -2
  289. package/dist/esm/sd-portal.entry.js +1 -1
  290. package/dist/esm/sd-progress.entry.js +2 -2
  291. package/dist/esm/sd-radio-button-group.entry.js +1 -1
  292. package/dist/esm/sd-radio-group.entry.js +2 -2
  293. package/dist/esm/sd-radio.entry.js +111 -9
  294. package/dist/esm/sd-select-dropdown_2.entry.js +3 -3
  295. package/dist/esm/sd-select-group.entry.js +1 -1
  296. package/dist/esm/sd-select-multiple-group.entry.js +1 -1
  297. package/dist/esm/sd-select-multiple.entry.js +1 -1
  298. package/dist/esm/sd-select-option-group.entry.js +3 -3
  299. package/dist/esm/sd-select-v2-list-item_2.entry.js +6 -6
  300. package/dist/esm/sd-select-v2-listbox_2.entry.js +5 -6
  301. package/dist/esm/{sd-select-v2.config-o9Ugc4Ua.js → sd-select-v2.config-C3eQSZx-.js} +5 -6
  302. package/dist/esm/sd-select-v2.entry.js +3 -3
  303. package/dist/esm/sd-table.entry.js +4 -4
  304. package/dist/esm/sd-tabs.entry.js +2 -2
  305. package/dist/esm/sd-tag.entry.js +2 -2
  306. package/dist/esm/sd-text-link.entry.js +3 -3
  307. package/dist/esm/sd-textarea.entry.js +12 -12
  308. package/dist/esm/sd-toast-container.entry.js +1 -1
  309. package/dist/esm/sd-toast.entry.js +2 -2
  310. package/dist/esm/sd-toggle-button.entry.js +1 -1
  311. package/dist/esm/sd-toggle.entry.js +1 -1
  312. package/dist/types/components/sd-date-picker/sd-date-picker-calendar/sd-date-picker-calendar.d.ts +26 -0
  313. package/dist/types/components/sd-date-picker/sd-date-picker-trigger/sd-date-picker-trigger.d.ts +11 -0
  314. package/dist/types/components/sd-date-picker/sd-date-picker.config.d.ts +71 -0
  315. package/dist/types/components/sd-date-picker/sd-date-picker.d.ts +32 -6
  316. package/dist/types/components/sd-date-range-picker/sd-date-range-picker-calendar/sd-date-range-picker-calendar.d.ts +38 -0
  317. package/dist/types/components/sd-date-range-picker/sd-date-range-picker.config.d.ts +9 -0
  318. package/dist/types/components/sd-date-range-picker/sd-date-range-picker.d.ts +38 -33
  319. package/dist/types/components/sd-dropdown-button/sd-dropdown-button.config.d.ts +0 -1
  320. package/dist/types/components/sd-ghost-button/sd-ghost-button.config.d.ts +2 -1
  321. package/dist/types/components/sd-radio/sd-radio.config.d.ts +29 -0
  322. package/dist/types/components/sd-radio/sd-radio.d.ts +4 -2
  323. package/dist/types/components/sd-select-v2/sd-select-v2.config.d.ts +0 -1
  324. package/dist/types/components.d.ts +388 -15
  325. package/hydrate/index.js +1239 -439
  326. package/hydrate/index.mjs +1239 -439
  327. package/package.json +1 -1
  328. package/dist/cjs/component.button-DUsddONR.js +0 -109
  329. package/dist/components/p-B3CfLqLu.js +0 -1
  330. package/dist/components/p-BXuZFSsU.js +0 -1
  331. package/dist/components/p-BcM38Hvd.js +0 -1
  332. package/dist/components/p-C2uZkOBj.js +0 -1
  333. package/dist/components/p-C8kA64_1.js +0 -1
  334. package/dist/components/p-CDR-4auv.js +0 -1
  335. package/dist/components/p-CSCkf9FA.js +0 -1
  336. package/dist/components/p-DCJWAesd.js +0 -1
  337. package/dist/components/p-DSNs8RRn.js +0 -1
  338. package/dist/components/p-DhoIsdd7.js +0 -1
  339. package/dist/components/p-DkMewZNL.js +0 -1
  340. package/dist/components/p-Ebd0AYb5.js +0 -1
  341. package/dist/design-system/p-184649a9.entry.js +0 -1
  342. package/dist/design-system/p-1cf60275.entry.js +0 -1
  343. package/dist/design-system/p-2a25b3dc.entry.js +0 -1
  344. package/dist/design-system/p-374fdc7a.entry.js +0 -1
  345. package/dist/design-system/p-3b824d36.entry.js +0 -1
  346. package/dist/design-system/p-3fdfb2ed.entry.js +0 -1
  347. package/dist/design-system/p-43512d46.entry.js +0 -1
  348. package/dist/design-system/p-4e9413c0.entry.js +0 -1
  349. package/dist/design-system/p-5213773b.entry.js +0 -1
  350. package/dist/design-system/p-5ba8caa2.entry.js +0 -1
  351. package/dist/design-system/p-74079256.entry.js +0 -1
  352. package/dist/design-system/p-8187020e.entry.js +0 -1
  353. package/dist/design-system/p-99bcc635.entry.js +0 -1
  354. package/dist/design-system/p-BcM38Hvd.js +0 -1
  355. package/dist/design-system/p-DSNs8RRn.js +0 -1
  356. package/dist/design-system/p-c2a0f10d.entry.js +0 -1
  357. package/dist/design-system/p-c7c0aa6c.entry.js +0 -1
  358. package/dist/design-system/p-ePjRdqmD.js +0 -1
  359. package/dist/design-system/p-efe684e6.entry.js +0 -1
  360. package/dist/design-system/p-o9Ugc4Ua.js +0 -1
  361. package/dist/esm/component.button-BcM38Hvd.js +0 -107
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", shadowDom: false, 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-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-control-xs-font-size:12px;--sd-system-typography-control-xs-font-weight:500;--sd-system-typography-control-xs-text-decoration:none;--sd-system-typography-control-xs-line-height:22px;--sd-system-typography-control-sm-default-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-control-sm-default-font-size:12px;--sd-system-typography-control-sm-default-font-weight:500;--sd-system-typography-control-sm-default-text-decoration:none;--sd-system-typography-control-sm-default-line-height:20px;--sd-system-typography-control-sm-underline-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-control-sm-underline-font-size:12px;--sd-system-typography-control-sm-underline-font-weight:500;--sd-system-typography-control-sm-underline-text-decoration:underline;--sd-system-typography-control-sm-underline-line-height:22px;--sd-system-typography-control-md-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-control-md-font-size:16px;--sd-system-typography-control-md-font-weight:500;--sd-system-typography-control-md-text-decoration:none;--sd-system-typography-control-md-line-height:26px;--sd-system-typography-control-lg-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-control-lg-font-size:18px;--sd-system-typography-control-lg-font-weight:500;--sd-system-typography-control-lg-text-decoration:none;--sd-system-typography-control-lg-line-height:30px;--sd-system-typography-feedback-xs-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-feedback-xs-font-size:11px;--sd-system-typography-feedback-xs-font-weight:500;--sd-system-typography-feedback-xs-line-height:18px;--sd-system-typography-feedback-xs-text-decoration:none;--sd-system-typography-feedback-sm-regular-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-feedback-sm-regular-font-size:12px;--sd-system-typography-feedback-sm-regular-font-weight:400;--sd-system-typography-feedback-sm-regular-line-height:22px;--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-line-height:20px;--sd-system-typography-feedback-sm-bold-text-decoration:none;--sd-system-typography-feedback-sm-underline-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-feedback-sm-underline-font-size:12px;--sd-system-typography-feedback-sm-underline-font-weight:500;--sd-system-typography-feedback-sm-underline-line-height:20px;--sd-system-typography-feedback-sm-underline-text-decoration:underline;--sd-system-typography-feedback-md-bold-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-feedback-md-bold-font-size:14px;--sd-system-typography-feedback-md-bold-font-weight:700;--sd-system-typography-feedback-md-bold-line-height:24px;--sd-system-typography-feedback-md-bold-text-decoration:none;--sd-system-typography-feedback-md-underline-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-feedback-md-underline-font-size:14px;--sd-system-typography-feedback-md-underline-font-weight:700;--sd-system-typography-feedback-md-underline-line-height:24px;--sd-system-typography-feedback-md-underline-text-decoration:underline;--sd-system-typography-heading-sm-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-heading-sm-font-weight:700;--sd-system-typography-heading-sm-font-size:14px;--sd-system-typography-heading-sm-line-height:24px;--sd-system-typography-heading-sm-text-decoration:none;--sd-system-typography-heading-md-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-heading-md-font-weight:700;--sd-system-typography-heading-md-font-size:16px;--sd-system-typography-heading-md-text-decoration:none;--sd-system-typography-heading-md-line-height:26px;--sd-system-typography-heading-lg-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-heading-lg-font-weight:700;--sd-system-typography-heading-lg-font-size:18px;--sd-system-typography-heading-lg-line-height:30px;--sd-system-typography-heading-lg-text-decoration:none;--sd-system-typography-field-sm-default-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-field-sm-default-font-weight:400;--sd-system-typography-field-sm-default-font-size:12px;--sd-system-typography-field-sm-default-line-height:20px;--sd-system-typography-field-sm-default-text-decoration:none;--sd-system-typography-field-sm-medium-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-field-sm-medium-font-weight:500;--sd-system-typography-field-sm-medium-font-size:12px;--sd-system-typography-field-sm-medium-text-decoration:none;--sd-system-typography-field-sm-medium-line-height:20px;--sd-system-typography-field-sm-bold-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-field-sm-bold-font-weight:700;--sd-system-typography-field-sm-bold-font-size:12px;--sd-system-typography-field-sm-bold-text-decoration:none;--sd-system-typography-field-sm-bold-line-height:20px;--sd-system-typography-field-md-default-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-field-md-default-font-weight:400;--sd-system-typography-field-md-default-font-size:16px;--sd-system-typography-field-md-default-line-height:26px;--sd-system-typography-field-md-default-text-decoration:none;--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:16px;--sd-system-typography-field-md-bold-line-height:26px;--sd-system-typography-field-md-bold-text-decoration:none;--sd-system-size-control-xs-height:24px;--sd-system-size-control-sm-height:28px;--sd-system-size-control-md-height:36px;--sd-system-size-control-lg-height:62px;--sd-system-size-icon-xxxs:8px;--sd-system-size-icon-xxs:10px;--sd-system-size-icon-xs:12px;--sd-system-size-icon-sm:16px;--sd-system-size-icon-md:20px;--sd-system-size-icon-lg:24px;--sd-system-size-icon-xl:36px;--sd-system-size-feedback-arrow-width:16px;--sd-system-size-feedback-arrow-height:12px;--sd-system-size-feedback-xs-height:20px;--sd-system-size-feedback-sm-height:24px;--sd-system-size-feedback-md-height:28px;--sd-system-size-field-control:16px;--sd-system-size-field-icon:12px;--sd-system-size-field-sm-height:28px;--sd-system-size-field-md-height:36px;--sd-system-space-control-xs-padding-x:8px;--sd-system-space-control-xs-gap:4px;--sd-system-space-control-sm-padding-x:12px;--sd-system-space-control-sm-gap:6px;--sd-system-space-control-md-padding-x:20px;--sd-system-space-control-md-gap:8px;--sd-system-space-control-lg-padding-x:28px;--sd-system-space-control-lg-gap:12px;--sd-system-space-feedback-xs-padding-x:6px;--sd-system-space-feedback-xs-gap:4px;--sd-system-space-feedback-sm-padding-x:8px;--sd-system-space-feedback-sm-gap:6px;--sd-system-space-feedback-md-padding-x:12px;--sd-system-space-feedback-md-gap:8px;--sd-system-space-stack-gap-tight:2px;--sd-system-space-stack-gap-normal:4px;--sd-system-space-field-sm-padding-x:12px;--sd-system-space-field-sm-padding-y:4px;--sd-system-space-field-sm-container-gap:8px;--sd-system-space-field-sm-gap:12px;--sd-system-space-field-md-padding-x:16px;--sd-system-space-field-md-container-gap:12px;--sd-system-space-field-md-gap:16px;--sd-system-radius-control-default:4px;--sd-system-radius-feedback-xs-square:6px;--sd-system-radius-feedback-sm-square:8px;--sd-system-radius-feedback-pill:9999px;--sd-system-radius-field-sm:4px;--sd-system-radius-field-md:6px;--sd-system-border-width-control-default:1px;--sd-system-border-width-field-default:1px;--sd-system-color-bg-screen:#EEEEEE;--sd-system-color-bg-frame:#FFFFFF;--sd-system-color-bg-brand:#025497;--sd-system-color-bg-subtle:#1F8AE1;--sd-system-color-bg-accent-default:#0075FF;--sd-system-color-bg-accent-light:#F5FAFF;--sd-system-color-bg-deep:#07284A;--sd-system-color-bg-danger-default:#E30000;--sd-system-color-bg-danger-light:#FCEFEF;--sd-system-color-bg-danger-light-default:#FB4444;--sd-system-color-bg-danger-light-light:#FCEFEF;--sd-system-color-bg-warning:#FF6B00;--sd-system-color-bg-caution:#FFC700;--sd-system-color-bg-progress:#0075FF;--sd-system-color-bg-success-default:#00973C;--sd-system-color-bg-success-light:#12B553;--sd-system-color-bg-disabled:#E1E1E1;--sd-system-color-content-primary:#222222;--sd-system-color-content-secondary:#555555;--sd-system-color-content-tertiary:#888888;--sd-system-color-content-quaternary:#AAAAAA;--sd-system-color-content-brand:#005CC9;--sd-system-color-content-subtle:#066D9B;--sd-system-color-content-accent:#0075FF;--sd-system-color-content-danger-default:#E30000;--sd-system-color-content-danger-light:#FB4444;--sd-system-color-content-warning:#FF6B00;--sd-system-color-content-inverse:#FFFFFF;--sd-system-color-text-disabled:#888888;--sd-system-color-link-accent:#006AC1;--sd-system-color-icon-brand:#025497;--sd-system-color-icon-accent:#0075FF;--sd-system-color-icon-danger:#E30000;--sd-system-color-icon-warning:#FF6B00;--sd-system-color-icon-success:#00973C;--sd-system-color-icon-inverse:#FFFFFF;--sd-system-color-icon-disabled:#BBBBBB;--sd-system-color-border-default:#E1E1E1;--sd-system-color-border-accent:#0075FF;--sd-system-color-border-danger:#FB4444;--sd-system-color-border-success:#12B553;--sd-system-color-border-disabled:#CCCCCC;--sd-system-color-red-strong:#FB4444;--sd-system-color-red-subtle:#FCEFEF;--sd-system-color-orange-strong:#FF6B00;--sd-system-color-orange-subtle:#FEF1EA;--sd-system-color-yellow-strong:#916C0D;--sd-system-color-yellow-moderate:#FFC700;--sd-system-color-yellow-subtle:#FFF7DD;--sd-system-color-green-strong:#00973C;--sd-system-color-green-subtle:#E8F9EF;--sd-system-color-blue-strong:#0075FF;--sd-system-color-blue-subtle:#E6F1FF;--sd-system-color-darkblue-strong:#006AC1;--sd-system-color-darkblue-subtle:#EAF5FE;--sd-system-color-indigo-strong:#004290;--sd-system-color-indigo-subtle:#EFF6FF;--sd-system-color-grey-strong:#737373;--sd-system-color-grey-subtle:#EEEEEE;--sd-system-color-field-bg-default:#FFFFFF;--sd-system-color-field-bg-hover:#0075FF;--sd-system-color-field-border-default:#AAAAAA;--sd-system-color-field-border-focus:#0075FF;--sd-system-color-field-border-hover:#0075FF;--sd-system-color-field-border-danger:#FB4444;--sd-system-color-field-border-success:#12B553;--sd-system-color-field-text-default:#222222;--sd-system-color-field-text-placeholder:#AAAAAA;--sd-system-color-field-icon-default:#888888;--sd-system-color-divider-default:#E1E1E1;--sd-button-xs-height:24px;--sd-button-xs-padding-x:8px;--sd-button-xs-gap:4px;--sd-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-xs-typography-font-size:12px;--sd-button-xs-typography-font-weight:500;--sd-button-xs-typography-text-decoration:none;--sd-button-xs-typography-line-height:22px;--sd-button-xs-icon:12px;--sd-button-sm-height:28px;--sd-button-sm-padding-x:12px;--sd-button-sm-gap:6px;--sd-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-sm-typography-font-size:12px;--sd-button-sm-typography-font-weight:500;--sd-button-sm-typography-text-decoration:none;--sd-button-sm-typography-line-height:20px;--sd-button-sm-icon:16px;--sd-button-md-height:36px;--sd-button-md-padding-x:20px;--sd-button-md-gap:8px;--sd-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-md-typography-font-size:16px;--sd-button-md-typography-font-weight:500;--sd-button-md-typography-text-decoration:none;--sd-button-md-typography-line-height:26px;--sd-button-md-icon:20px;--sd-button-lg-height:62px;--sd-button-lg-padding-x:28px;--sd-button-lg-gap:12px;--sd-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-lg-typography-font-size:18px;--sd-button-lg-typography-font-weight:500;--sd-button-lg-typography-text-decoration:none;--sd-button-lg-typography-line-height:30px;--sd-button-lg-icon:24px;--sd-button-radius-default:4px;--sd-button-border-width-default:1px;--sd-button-border-disabled:#CCCCCC;--sd-button-label-xs-min-width:36px;--sd-button-label-sm-min-width:70px;--sd-button-label-md-min-width:100px;--sd-button-label-lg-min-width:120px;--sd-button-leading-icon-xs-min-width:44px;--sd-button-leading-icon-sm-min-width:70px;--sd-button-leading-icon-md-min-width:100px;--sd-button-leading-icon-lg-min-width:120px;--sd-button-dropdown-xs-min-width:60px;--sd-button-dropdown-sm-min-width:76px;--sd-button-dropdown-md-min-width:106px;--sd-button-icon-only-xs-width:24px;--sd-button-icon-only-sm-width:28px;--sd-button-icon-only-md-width:36px;--sd-button-icon-only-lg-width:62px;--sd-button-bg-disabled:#E1E1E1;--sd-button-text-disabled:#888888;--sd-button-icon-disabled:#BBBBBB;--sd-button-brand-strong-bg-default:#025497;--sd-button-brand-strong-bg-hover:#004177;--sd-button-brand-strong-content:#FFFFFF;--sd-button-brand-strong-dropdown-divider:#006AC1;--sd-button-brand-subtle-bg-default:#1F8AE1;--sd-button-brand-subtle-bg-hover:#006AC1;--sd-button-brand-subtle-content:#FFFFFF;--sd-button-brand-subtle-dropdown-divider:#5CB0F3;--sd-button-brand-outline-bg-default:#FFFFFF;--sd-button-brand-outline-bg-hover:#EAF5FE;--sd-button-brand-outline-border:#025497;--sd-button-brand-outline-content:#025497;--sd-button-neutral-outline-bg-default:#FFFFFF;--sd-button-neutral-outline-bg-hover:#EEEEEE;--sd-button-neutral-outline-border:#888888;--sd-button-neutral-outline-content:#222222;--sd-button-danger-strong-bg-default:#E30000;--sd-button-danger-strong-bg-hover:#AD0000;--sd-button-danger-strong-content:#FFFFFF;--sd-button-danger-strong-dropdown-divider:#FF7C7C;--sd-button-danger-outline-bg-default:#FFFFFF;--sd-button-danger-outline-bg-hover:#FCEFEF;--sd-button-danger-outline-border:#E30000;--sd-button-danger-outline-content:#E30000;--sd-ghost-button-ghost-button-xxs-size:16px;--sd-ghost-button-ghost-button-xxs-icon:12px;--sd-ghost-button-ghost-button-xs-size:24px;--sd-ghost-button-ghost-button-xs-icon:16px;--sd-ghost-button-ghost-button-sm-size:28px;--sd-ghost-button-ghost-button-sm-icon:20px;--sd-ghost-button-ghost-button-md-size:36px;--sd-ghost-button-ghost-button-md-icon:24px;--sd-ghost-button-ghost-button-lg-size:62px;--sd-ghost-button-ghost-button-lg-icon:36px;--sd-ghost-button-ghost-button-radius:4px;--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-text-link-text-link-gap:4px;--sd-text-link-text-link-size-icon:16px;--sd-text-link-text-link-typography-default-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-text-link-text-link-typography-default-font-size:12px;--sd-text-link-text-link-typography-default-font-weight:500;--sd-text-link-text-link-typography-default-text-decoration:none;--sd-text-link-text-link-typography-default-line-height:20px;--sd-text-link-text-link-typography-underline-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-text-link-text-link-typography-underline-font-size:12px;--sd-text-link-text-link-typography-underline-font-weight:500;--sd-text-link-text-link-typography-underline-text-decoration:underline;--sd-text-link-text-link-typography-underline-line-height:22px;--sd-text-link-text-link-content-default:#222222;--sd-text-link-text-link-content-disabled:#888888;--sd-text-link-text-link-icon-default:#006AC1;--sd-text-link-text-link-icon-disabled:#BBBBBB;--sd-tag-tag-xs-height:20px;--sd-tag-tag-xs-padding-x:6px;--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-line-height:20px;--sd-tag-tag-sm-typography-text-decoration:none;--sd-tag-tag-sm-radius:6px;--sd-tag-tag-md-height:28px;--sd-tag-tag-md-padding-x:12px;--sd-tag-tag-md-gap:6px;--sd-tag-tag-md-icon:16px;--sd-tag-tag-md-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-tag-tag-md-typography-font-size:14px;--sd-tag-tag-md-typography-font-weight:700;--sd-tag-tag-md-typography-line-height:24px;--sd-tag-tag-md-typography-text-decoration:none;--sd-tag-tag-md-radius:8px;--sd-tag-tag-red-content:#FB4444;--sd-tag-tag-red-bg:#FCEFEF;--sd-tag-tag-orange-content:#FF6B00;--sd-tag-tag-orange-bg:#FEF1EA;--sd-tag-tag-yellow-content:#916C0D;--sd-tag-tag-yellow-bg:#FFF7DD;--sd-tag-tag-green-content:#00973C;--sd-tag-tag-green-bg:#E8F9EF;--sd-tag-tag-blue-content:#0075FF;--sd-tag-tag-blue-bg:#E6F1FF;--sd-tag-tag-darkblue-content:#006AC1;--sd-tag-tag-darkblue-bg:#EAF5FE;--sd-tag-tag-indigo-content:#004290;--sd-tag-tag-indigo-bg:#EFF6FF;--sd-tag-tag-grey-content:#737373;--sd-tag-tag-grey-bg:#EEEEEE;--sd-badge-badge-size:6px;--sd-badge-badge-radius:9999px;--sd-badge-badge-red:#FB4444;--sd-badge-badge-orange:#FF6B00;--sd-badge-badge-yellow:#FFC700;--sd-badge-badge-green:#00973C;--sd-badge-badge-blue:#0075FF;--sd-badge-badge-darkblue:#006AC1;--sd-badge-badge-indigo:#004290;--sd-badge-badge-grey:#737373;--sd-tooltip-tooltip-radius:6px;--sd-tooltip-tooltip-padding-y:12px;--sd-tooltip-tooltip-padding-x:16px;--sd-tooltip-tooltip-gap:12px;--sd-tooltip-tooltip-arrow-width:16px;--sd-tooltip-tooltip-arrow-height:12px;--sd-tooltip-tooltip-close-icon:20px;--sd-tooltip-tooltip-close-color:#888888;--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-line-height:20px;--sd-tooltip-tooltip-danger-typography-text-decoration:none;--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-line-height:20px;--sd-tooltip-tooltip-warning-typography-text-decoration:none;--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-line-height:20px;--sd-tooltip-tooltip-accent-typography-text-decoration:none;--sd-popover-popover-radius:6px;--sd-popover-popover-padding-y:16px;--sd-popover-popover-padding-x:20px;--sd-popover-popover-gap:12px;--sd-popover-popover-body-gap:12px;--sd-popover-popover-contents-gap:4px;--sd-popover-popover-arrow-width:16px;--sd-popover-popover-arrow-height:12px;--sd-popover-popover-close-icon:12px;--sd-popover-popover-close-color:#888888;--sd-popover-popover-bg:#07284A;--sd-popover-popover-title-color:#FFFFFF;--sd-popover-popover-title-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-popover-popover-title-typography-font-size:14px;--sd-popover-popover-title-typography-font-weight:700;--sd-popover-popover-title-typography-line-height:24px;--sd-popover-popover-title-typography-text-decoration:none;--sd-popover-popover-description-color:#FFFFFF;--sd-popover-popover-description-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-popover-popover-description-typography-font-size:12px;--sd-popover-popover-description-typography-font-weight:500;--sd-popover-popover-description-typography-line-height:20px;--sd-popover-popover-description-typography-text-decoration:none;--sd-popover-popover-sub-action-color:#D8D8D8;--sd-popover-popover-sub-action-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-popover-popover-sub-action-typography-font-size:12px;--sd-popover-popover-sub-action-typography-font-weight:700;--sd-popover-popover-sub-action-typography-line-height:20px;--sd-popover-popover-sub-action-typography-text-decoration:none;--sd-toast-toast-radius:8px;--sd-toast-toast-padding-y:12px;--sd-toast-toast-padding-x:24px;--sd-toast-toast-gap:16px;--sd-toast-toast-icon:16px;--sd-toast-toast-typography-default-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-toast-toast-typography-default-font-size:14px;--sd-toast-toast-typography-default-font-weight:700;--sd-toast-toast-typography-default-line-height:24px;--sd-toast-toast-typography-default-text-decoration:none;--sd-toast-toast-typography-link-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-toast-toast-typography-link-font-size:14px;--sd-toast-toast-typography-link-font-weight:700;--sd-toast-toast-typography-link-line-height:24px;--sd-toast-toast-typography-link-text-decoration:underline;--sd-toast-toast-default-bg:#07284A;--sd-toast-toast-default-content:#FFFFFF;--sd-toast-toast-danger-bg:#FB4444;--sd-toast-toast-danger-content:#FFFFFF;--sd-toast-toast-caution-bg:#FFC700;--sd-toast-toast-caution-content:#222222;--sd-toast-toast-complete-bg:#00973C;--sd-toast-toast-complete-content:#FFFFFF;--sd-toast-toast-accent-bg:#005CC9;--sd-toast-toast-accent-content:#FFFFFF;--sd-checkbox-checkbox-size:16px;--sd-checkbox-checkbox-radius:2px;--sd-checkbox-checkbox-border-width:1px;--sd-checkbox-checkbox-gap:8px;--sd-checkbox-checkbox-icon:12px;--sd-checkbox-checkbox-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-checkbox-checkbox-typography-font-weight:400;--sd-checkbox-checkbox-typography-font-size:12px;--sd-checkbox-checkbox-typography-line-height:20px;--sd-checkbox-checkbox-typography-text-decoration:none;--sd-checkbox-checkbox-unchecked-bg-default:#FFFFFF;--sd-checkbox-checkbox-unchecked-bg-hover:#D9EAFF;--sd-checkbox-checkbox-unchecked-border-default:#AAAAAA;--sd-checkbox-checkbox-unchecked-border-hover:#0075FF;--sd-checkbox-checkbox-checked-bg-default:#0075FF;--sd-checkbox-checkbox-checked-icon-default:#FFFFFF;--sd-checkbox-checkbox-checked-icon-disabled:#BBBBBB;--sd-checkbox-checkbox-checked-icon-inverse:#FFFFFF;--sd-checkbox-checkbox-checked-border-inverse:#FFFFFF;--sd-checkbox-checkbox-label-default:#222222;--sd-checkbox-checkbox-label-inverse:#FFFFFF;--sd-checkbox-checkbox-bg-disabled:#E1E1E1;--sd-checkbox-checkbox-border-disabled:#CCCCCC;--sd-list-item-list-item-padding-y:4px;--sd-list-item-list-item-padding-right:12px;--sd-list-item-list-item-gap:8px;--sd-list-item-list-item-padding-left-depth1:12px;--sd-list-item-list-item-padding-left-depth2:20px;--sd-list-item-list-item-padding-left-depth3:28px;--sd-list-item-list-item-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-list-item-list-item-typography-font-weight:400;--sd-list-item-list-item-typography-font-size:12px;--sd-list-item-list-item-typography-line-height:20px;--sd-list-item-list-item-typography-text-decoration:none;--sd-list-item-list-item-bg-default:#FFFFFF;--sd-list-item-list-item-bg-hover:#0075FF;--sd-list-item-list-item-content-default:#222222;--sd-list-item-list-item-content-hover:#FFFFFF;--sd-list-item-list-item-content-disabled:#888888;--sd-list-item-list-item-indeterminate-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-list-item-list-item-indeterminate-typography-font-weight:700;--sd-list-item-list-item-indeterminate-typography-font-size:12px;--sd-list-item-list-item-indeterminate-typography-text-decoration:none;--sd-list-item-list-item-indeterminate-typography-line-height:20px;--sd-list-item-list-item-depth1-bg-default:#EFF6FF;--sd-list-item-list-item-depth1-bg-disabled:#EEEEEE;--sd-list-item-list-item-depth1-border-color:#E1E1E1;--sd-list-item-list-item-depth1-border-width:1px;--sd-list-item-list-item-depth1-title-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-list-item-list-item-depth1-title-typography-font-weight:700;--sd-list-item-list-item-depth1-title-typography-font-size:12px;--sd-list-item-list-item-depth1-title-typography-text-decoration:none;--sd-list-item-list-item-depth1-title-typography-line-height:20px;--sd-list-item-list-item-depth2-middle-bg:#F6F6F6;--sd-list-item-list-item-depth2-middle-title-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-list-item-list-item-depth2-middle-title-typography-font-weight:500;--sd-list-item-list-item-depth2-middle-title-typography-font-size:12px;--sd-list-item-list-item-depth2-middle-title-typography-text-decoration:none;--sd-list-item-list-item-depth2-middle-title-typography-line-height:20px;--sd-list-item-list-item-count-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-list-item-list-item-count-typography-font-weight:500;--sd-list-item-list-item-count-typography-font-size:12px;--sd-list-item-list-item-count-typography-text-decoration:none;--sd-list-item-list-item-count-typography-line-height:20px;--sd-list-item-list-item-count-color:#888888;--sd-list-box-padding-bottom:4px;--sd-list-box-radius:4px;--sd-list-box-bg:#FFFFFF;--sd-select-select-height:28px;--sd-select-select-radius:4px;--sd-select-select-border-width:1px;--sd-select-select-padding-x:12px;--sd-select-select-icon-default:#888888;--sd-select-select-icon-disabled:#BBBBBB;--sd-select-select-gap:8px;--sd-select-select-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-select-select-typography-font-weight:400;--sd-select-select-typography-font-size:12px;--sd-select-select-typography-line-height:20px;--sd-select-select-typography-text-decoration:none;--sd-select-select-border-default:#AAAAAA;--sd-select-select-border-hover:#0075FF;--sd-select-select-border-danger:#FB4444;--sd-select-select-border-disabled:#CCCCCC;--sd-select-select-bg-default:#FFFFFF;--sd-select-select-bg-disabled:#E1E1E1;--sd-select-select-text-default:#222222;--sd-select-select-text-disabled:#888888;--sd-select-select-addon-label-bg:#F6F6F6;--sd-select-select-addon-label-border-default:#AAAAAA;--sd-select-select-addon-label-border-disabled:#CCCCCC;--sd-select-select-size-icon:16px;--sd-field-field-label-sm-height:28px;--sd-field-field-label-sm-gap:6px;--sd-field-field-label-sm-icon:12px;--sd-field-field-label-sm-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-field-field-label-sm-typography-font-weight:700;--sd-field-field-label-sm-typography-font-size:12px;--sd-field-field-label-sm-typography-text-decoration:none;--sd-field-field-label-sm-typography-line-height:20px;--sd-field-field-label-md-height:36px;--sd-field-field-label-md-gap:8px;--sd-field-field-label-md-icon:16px;--sd-field-field-label-md-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-field-field-label-md-typography-font-weight:700;--sd-field-field-label-md-typography-font-size:16px;--sd-field-field-label-md-typography-line-height:26px;--sd-field-field-label-md-typography-text-decoration:none;--sd-field-field-addon-label-height:28px;--sd-field-field-addon-label-gap:6px;--sd-field-field-addon-label-padding-x:12px;--sd-field-field-addon-label-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-field-field-addon-label-typography-font-weight:500;--sd-field-field-addon-label-typography-font-size:12px;--sd-field-field-addon-label-typography-text-decoration:none;--sd-field-field-addon-label-typography-line-height:20px;--sd-field-field-addon-label-bg:#F6F6F6;--sd-field-field-addon-label-border-default:#AAAAAA;--sd-field-field-addon-label-border-disabled:#CCCCCC;--sd-field-field-addon-label-border-width:1px;--sd-textinput-input-sm-height:28px;--sd-textinput-input-sm-padding-x:12px;--sd-textinput-input-sm-padding-y:4px;--sd-textinput-input-sm-gap:8px;--sd-textinput-input-sm-radius:4px;--sd-textinput-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-textinput-input-sm-typography-font-weight:400;--sd-textinput-input-sm-typography-font-size:12px;--sd-textinput-input-sm-typography-line-height:20px;--sd-textinput-input-sm-typography-text-decoration:none;--sd-textinput-input-md-height:36px;--sd-textinput-input-md-padding-x:16px;--sd-textinput-input-md-gap:12px;--sd-textinput-input-md-radius:6px;--sd-textinput-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-textinput-input-md-typography-font-weight:400;--sd-textinput-input-md-typography-font-size:16px;--sd-textinput-input-md-typography-line-height:26px;--sd-textinput-input-md-typography-text-decoration:none;--sd-textinput-input-border-width:1px;--sd-textinput-input-border-default:#AAAAAA;--sd-textinput-input-border-focus:#0075FF;--sd-textinput-input-border-danger:#FB4444;--sd-textinput-input-border-success:#12B553;--sd-textinput-input-border-disabled:#CCCCCC;--sd-textinput-input-bg-default:#FFFFFF;--sd-textinput-input-bg-disabled:#E1E1E1;--sd-textinput-input-bg-barcode:#FAFAA1;--sd-textinput-input-text-default:#222222;--sd-textinput-input-text-placeholder:#AAAAAA;--sd-textinput-input-text-disabled:#888888;--sd-textinput-input-text-hint:#555555;--sd-textinput-input-text-error-message:#E30000;--sd-textinput-input-size-icon:16px;--sd-textinput-input-icon-default:#888888;--sd-textinput-input-unit-color:#888888;--sd-textinput-input-hint-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-textinput-input-hint-typography-font-weight:400;--sd-textinput-input-hint-typography-font-size:12px;--sd-textinput-input-hint-typography-line-height:20px;--sd-textinput-input-hint-typography-text-decoration:none;--sd-textinput-input-error-message-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-textinput-input-error-message-typography-font-weight:400;--sd-textinput-input-error-message-typography-font-size:12px;--sd-textinput-input-error-message-typography-line-height:20px;--sd-textinput-input-error-message-typography-text-decoration:none;--sd-textinput-input-contents-gap:4px;--sd-textinput-input-resizer-size:12px;--sd-textinput-input-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-gap:8px;--sd-number-input-number-input-sm-radius:4px;--sd-number-input-number-input-sm-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-number-input-number-input-sm-typography-font-weight:400;--sd-number-input-number-input-sm-typography-font-size:12px;--sd-number-input-number-input-sm-typography-line-height:20px;--sd-number-input-number-input-sm-typography-text-decoration:none;--sd-number-input-number-input-md-height:36px;--sd-number-input-number-input-md-padding-x:8px;--sd-number-input-number-input-md-gap:12px;--sd-number-input-number-input-md-radius:6px;--sd-number-input-number-input-md-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-number-input-number-input-md-typography-font-weight:400;--sd-number-input-number-input-md-typography-font-size:16px;--sd-number-input-number-input-md-typography-line-height:26px;--sd-number-input-number-input-md-typography-text-decoration:none;--sd-number-input-number-input-border-width:1px;--sd-number-input-number-input-contents-gap:4px;--sd-number-input-number-input-border-default:#AAAAAA;--sd-number-input-number-input-border-focus:#0075FF;--sd-number-input-number-input-border-danger:#FB4444;--sd-number-input-number-input-border-success:#12B553;--sd-number-input-number-input-border-disabled:#CCCCCC;--sd-number-input-number-input-bg-default:#FFFFFF;--sd-number-input-number-input-bg-disabled:#E1E1E1;--sd-number-input-number-input-text-default:#222222;--sd-number-input-number-input-text-placeholder:#AAAAAA;--sd-number-input-number-input-text-disabled:#888888;--sd-number-input-number-input-hint-color:#555555;--sd-number-input-number-input-hint-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-number-input-number-input-hint-typography-font-weight:400;--sd-number-input-number-input-hint-typography-font-size:12px;--sd-number-input-number-input-hint-typography-line-height:20px;--sd-number-input-number-input-hint-typography-text-decoration:none;--sd-number-input-number-input-error-message-color:#E30000;--sd-number-input-number-input-error-message-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-number-input-number-input-error-message-typography-font-weight:400;--sd-number-input-number-input-error-message-typography-font-size:12px;--sd-number-input-number-input-error-message-typography-line-height:20px;--sd-number-input-number-input-error-message-typography-text-decoration:none;--sd-number-input-number-input-stepper-sm-size:20px;--sd-number-input-number-input-stepper-md-size:24px;--sd-number-input-number-input-stepper-radius:4px;--sd-number-input-number-input-stepper-bg-default:#EFF6FF;--sd-number-input-number-input-stepper-bg-disabled:#EEEEEE;--sd-number-input-number-input-stepper-icon-default:#0075FF;--sd-number-input-number-input-stepper-icon-disabled:#BBBBBB;--sd-filepicker-filepicker-height:28px;--sd-filepicker-filepicker-padding-x:12px;--sd-filepicker-filepicker-gap:8px;--sd-filepicker-filepicker-radius:4px;--sd-filepicker-filepicker-border-width:1px;--sd-filepicker-filepicker-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-filepicker-filepicker-typography-font-weight:400;--sd-filepicker-filepicker-typography-font-size:12px;--sd-filepicker-filepicker-typography-line-height:20px;--sd-filepicker-filepicker-typography-text-decoration:none;--sd-filepicker-filepicker-size-icon:16px;--sd-filepicker-filepicker-contents-gap:4px;--sd-filepicker-filepicker-border-default:#AAAAAA;--sd-filepicker-filepicker-border-disabled:#CCCCCC;--sd-filepicker-filepicker-bg-default:#FFFFFF;--sd-filepicker-filepicker-bg-disabled:#E1E1E1;--sd-filepicker-filepicker-text-default:#222222;--sd-filepicker-filepicker-text-placeholder:#AAAAAA;--sd-filepicker-filepicker-text-disabled:#888888;--sd-filepicker-filepicker-icon-disabled:#BBBBBB;--sd-modal-modal-radius:8px;--sd-modal-modal-confirm-padding-x:32px;--sd-modal-modal-confirm-padding-y:40px;--sd-modal-modal-confirm-gap:40px;--sd-modal-modal-confirm-body-gap:20px;--sd-modal-modal-confirm-title-gap:12px;--sd-modal-modal-confirm-title-color:#222222;--sd-modal-modal-confirm-title-icon:32px;--sd-modal-modal-confirm-title-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-modal-modal-confirm-title-typography-font-weight:700;--sd-modal-modal-confirm-title-typography-font-size:18px;--sd-modal-modal-confirm-title-typography-line-height:30px;--sd-modal-modal-confirm-title-typography-text-decoration:none;--sd-modal-modal-confirm-button-gap:8px;--sd-modal-modal-confirm-message-color:#222222;--sd-modal-modal-confirm-positive-icon:#0075FF;--sd-modal-modal-confirm-negative-icon:#E30000;--sd-modal-modal-bg:#FFFFFF;--sd-modal-modal-close-size:20px;--sd-modal-modal-close-color:#888888;--sd-modal-modal-action-header-padding-x:24px;--sd-modal-modal-action-header-padding-y:20px;--sd-modal-modal-action-header-gap:12px;--sd-modal-modal-action-title-color:#033F59;--sd-modal-modal-action-title-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-modal-modal-action-title-typography-font-weight:700;--sd-modal-modal-action-title-typography-font-size:16px;--sd-modal-modal-action-title-typography-text-decoration:none;--sd-modal-modal-action-title-typography-line-height:26px;--sd-modal-modal-action-body-padding-x:20px;--sd-modal-modal-action-body-padding-bottom:20px;--sd-modal-modal-action-footer-padding-x:20px;--sd-modal-modal-action-footer-padding-y:8px;--sd-modal-modal-action-footer-gap:16px;--sd-modal-modal-action-footer-bg:#F6F6F6;--sd-modal-modal-action-footer-border:#E1E1E1}.bg-primary{background-color:var(--color-primary, #051d36)}.bg-secondary{background-color:var(--color-secondary, #555555)}.bg-accent{background-color:var(--color-accent, #9c27b0)}.bg-positive{background-color:var(--color-positive, #0075ff)}.bg-negative{background-color:var(--color-negative, #e30000)}.bg-info{background-color:var(--color-info, #00cd52)}.bg-warning{background-color:var(--color-warning, #f2c037)}.bg-red_99{background-color:var(--color-red_99, #220000)}.bg-red_95{background-color:var(--color-red_95, #440000)}.bg-red_90{background-color:var(--color-red_90, #5E0000)}.bg-red_85{background-color:var(--color-red_85, #820000)}.bg-red_80{background-color:var(--color-red_80, #AD0000)}.bg-red_75{background-color:var(--color-red_75, #E30000)}.bg-red_70{background-color:var(--color-red_70, #FB4444)}.bg-red_60{background-color:var(--color-red_60, #FF7C7C)}.bg-red_45{background-color:var(--color-red_45, #FFB5B5)}.bg-red_30{background-color:var(--color-red_30, #FFD3D3)}.bg-red_20{background-color:var(--color-red_20, #FCE6E6)}.bg-red_15{background-color:var(--color-red_15, #FCEFEF)}.bg-caution_bg{background-color:var(--color-caution_bg, #FEF1F1)}.bg-caution_icon{background-color:var(--color-caution_icon, #fd9595)}.bg-orange_99{background-color:var(--color-orange_99, #2F1100)}.bg-orange_95{background-color:var(--color-orange_95, #4D1B00)}.bg-orange_90{background-color:var(--color-orange_90, #752A00)}.bg-orange_85{background-color:var(--color-orange_85, #9B3700)}.bg-orange_75{background-color:var(--color-orange_75, #CE4900)}.bg-orange_65{background-color:var(--color-orange_65, #FF6B00)}.bg-orange_60{background-color:var(--color-orange_60, #FF7F22)}.bg-orange_55{background-color:var(--color-orange_55, #FFA452)}.bg-orange_45{background-color:var(--color-orange_45, #FFBC81)}.bg-orange_35{background-color:var(--color-orange_35, #FFD5AF)}.bg-orange_20{background-color:var(--color-orange_20, #FFEAD7)}.bg-orange_10{background-color:var(--color-orange_10, #FEF1EA)}.bg-header_alert{background-color:var(--color-header_alert, #FF7A00)}.bg-yellow_95{background-color:var(--color-yellow_95, #322700)}.bg-yellow_90{background-color:var(--color-yellow_90, #453702)}.bg-yellow_80{background-color:var(--color-yellow_80, #6C5602)}.bg-yellow_70{background-color:var(--color-yellow_70, #9C7A00)}.bg-yellow_60{background-color:var(--color-yellow_60, #C49900)}.bg-yellow_50{background-color:var(--color-yellow_50, #EBB800)}.bg-yellow_45{background-color:var(--color-yellow_45, #FFC700)}.bg-yellow_40{background-color:var(--color-yellow_40, #FFD643)}.bg-yellow_30{background-color:var(--color-yellow_30, #FEE17C)}.bg-yellow_25{background-color:var(--color-yellow_25, #FFE99E)}.bg-yellow_20{background-color:var(--color-yellow_20, #FEF1C4)}.bg-yellow_10{background-color:var(--color-yellow_10, #FFF7DD)}.bg-olive_95{background-color:var(--color-olive_95, #2C2C00)}.bg-olive_90{background-color:var(--color-olive_90, #454500)}.bg-olive_80{background-color:var(--color-olive_80, #636300)}.bg-olive_70{background-color:var(--color-olive_70, #838300)}.bg-olive_65{background-color:var(--color-olive_65, #A5A500)}.bg-olive_55{background-color:var(--color-olive_55, #C7C700)}.bg-olive_45{background-color:var(--color-olive_45, #DDDD12)}.bg-olive_30{background-color:var(--color-olive_30, #EEEE37)}.bg-olive_20{background-color:var(--color-olive_20, #F6F65F)}.bg-olive_15{background-color:var(--color-olive_15, #FAFAA1)}.bg-olive_10{background-color:var(--color-olive_10, #FBFBBF)}.bg-olive_05{background-color:var(--color-olive_05, #FEFED9)}.bg-green_99{background-color:var(--color-green_99, #001D0B)}.bg-green_95{background-color:var(--color-green_95, #003013)}.bg-green_90{background-color:var(--color-green_90, #00461C)}.bg-green_85{background-color:var(--color-green_85, #006629)}.bg-green_80{background-color:var(--color-green_80, #007B31)}.bg-green_75{background-color:var(--color-green_75, #00973C)}.bg-green_70{background-color:var(--color-green_70, #12B553)}.bg-green_65{background-color:var(--color-green_65, #2BCE6C)}.bg-green_55{background-color:var(--color-green_55, #6DE39C)}.bg-green_45{background-color:var(--color-green_45, #ACF4C9)}.bg-green_25{background-color:var(--color-green_25, #D4FAE3)}.bg-green_15{background-color:var(--color-green_15, #E8F9EF)}.bg-steelblue_99{background-color:var(--color-steelblue_99, #021a25)}.bg-steelblue_95{background-color:var(--color-steelblue_95, #02212f)}.bg-steelblue_90{background-color:var(--color-steelblue_90, #032d40)}.bg-steelblue_85{background-color:var(--color-steelblue_85, #033f59)}.bg-steelblue_80{background-color:var(--color-steelblue_80, #06587d)}.bg-steelblue_75{background-color:var(--color-steelblue_75, #066d9b)}.bg-steelblue_70{background-color:var(--color-steelblue_70, #128fc7)}.bg-steelblue_65{background-color:var(--color-steelblue_65, #229fd7)}.bg-steelblue_60{background-color:var(--color-steelblue_60, #50bff0)}.bg-steelblue_45{background-color:var(--color-steelblue_45, #a4e2fd)}.bg-steelblue_25{background-color:var(--color-steelblue_25, #d9f2fd)}.bg-steelblue_10{background-color:var(--color-steelblue_10, #ecf8fd)}.bg-oceanblue_99{background-color:var(--color-oceanblue_99, #011428)}.bg-oceanblue_95{background-color:var(--color-oceanblue_95, #03172d)}.bg-oceanblue_90{background-color:var(--color-oceanblue_90, #051d36)}.bg-oceanblue_85{background-color:var(--color-oceanblue_85, #07284a)}.bg-oceanblue_80{background-color:var(--color-oceanblue_80, #004177)}.bg-oceanblue_75{background-color:var(--color-oceanblue_75, #025497)}.bg-oceanblue_70{background-color:var(--color-oceanblue_70, #006ac1)}.bg-oceanblue_65{background-color:var(--color-oceanblue_65, #1f8ae1)}.bg-oceanblue_60{background-color:var(--color-oceanblue_60, #5cb0f3)}.bg-oceanblue_50{background-color:var(--color-oceanblue_50, #9cd1fc)}.bg-oceanblue_25{background-color:var(--color-oceanblue_25, #d5ebfe)}.bg-oceanblue_15{background-color:var(--color-oceanblue_15, #eaf5fe)}.bg-brilliantblue_99{background-color:var(--color-brilliantblue_99, #001226)}.bg-brilliantblue_95{background-color:var(--color-brilliantblue_95, #001b39)}.bg-brilliantblue_90{background-color:var(--color-brilliantblue_90, #002b5e)}.bg-brilliantblue_85{background-color:var(--color-brilliantblue_85, #004290)}.bg-brilliantblue_80{background-color:var(--color-brilliantblue_80, #005cc9)}.bg-brilliantblue_75{background-color:var(--color-brilliantblue_75, #0075ff)}.bg-brilliantblue_70{background-color:var(--color-brilliantblue_70, #2d8dff)}.bg-brilliantblue_60{background-color:var(--color-brilliantblue_60, #64abff)}.bg-brilliantblue_50{background-color:var(--color-brilliantblue_50, #93c4ff)}.bg-brilliantblue_40{background-color:var(--color-brilliantblue_40, #bbdaff)}.bg-brilliantblue_25{background-color:var(--color-brilliantblue_25, #d9eaff)}.bg-brilliantblue_20{background-color:var(--color-brilliantblue_20, #e6f1ff)}.bg-brilliantblue_10{background-color:var(--color-brilliantblue_10, #eff6ff)}.bg-brilliantblue_05{background-color:var(--color-brilliantblue_05, #f5faff)}.bg-grey_95{background-color:var(--color-grey_95, #222222)}.bg-grey_90{background-color:var(--color-grey_90, #333333)}.bg-grey_85{background-color:var(--color-grey_85, #444444)}.bg-grey_80{background-color:var(--color-grey_80, #555555)}.bg-grey_70{background-color:var(--color-grey_70, #737373)}.bg-grey_65{background-color:var(--color-grey_65, #888888)}.bg-grey_60{background-color:var(--color-grey_60, #999999)}.bg-grey_55{background-color:var(--color-grey_55, #aaaaaa)}.bg-grey_50{background-color:var(--color-grey_50, #bbbbbb)}.bg-grey_45{background-color:var(--color-grey_45, #cccccc)}.bg-grey_35{background-color:var(--color-grey_35, #D8D8D8)}.bg-grey_30{background-color:var(--color-grey_30, #e1e1e1)}.bg-grey_25{background-color:var(--color-grey_25, #E5E5E5)}.bg-grey_20{background-color:var(--color-grey_20, #eeeeee)}.bg-grey_10{background-color:var(--color-grey_10, #f6f6f6)}.bg-grey_05{background-color:var(--color-grey_05, #f9f9f9)}.bg-white{background-color:var(--color-white, #ffffff)}.bg-black{background-color:var(--color-black, #000000)}.text-primary{color:var(--color-primary, #051d36)}.text-secondary{color:var(--color-secondary, #555555)}.text-accent{color:var(--color-accent, #9c27b0)}.text-positive{color:var(--color-positive, #0075ff)}.text-negative{color:var(--color-negative, #e30000)}.text-info{color:var(--color-info, #00cd52)}.text-warning{color:var(--color-warning, #f2c037)}.text-red_99{color:var(--color-red_99, #220000)}.text-red_95{color:var(--color-red_95, #440000)}.text-red_90{color:var(--color-red_90, #5E0000)}.text-red_85{color:var(--color-red_85, #820000)}.text-red_80{color:var(--color-red_80, #AD0000)}.text-red_75{color:var(--color-red_75, #E30000)}.text-red_70{color:var(--color-red_70, #FB4444)}.text-red_60{color:var(--color-red_60, #FF7C7C)}.text-red_45{color:var(--color-red_45, #FFB5B5)}.text-red_30{color:var(--color-red_30, #FFD3D3)}.text-red_20{color:var(--color-red_20, #FCE6E6)}.text-red_15{color:var(--color-red_15, #FCEFEF)}.text-caution_bg{color:var(--color-caution_bg, #FEF1F1)}.text-caution_icon{color:var(--color-caution_icon, #fd9595)}.text-orange_99{color:var(--color-orange_99, #2F1100)}.text-orange_95{color:var(--color-orange_95, #4D1B00)}.text-orange_90{color:var(--color-orange_90, #752A00)}.text-orange_85{color:var(--color-orange_85, #9B3700)}.text-orange_75{color:var(--color-orange_75, #CE4900)}.text-orange_65{color:var(--color-orange_65, #FF6B00)}.text-orange_60{color:var(--color-orange_60, #FF7F22)}.text-orange_55{color:var(--color-orange_55, #FFA452)}.text-orange_45{color:var(--color-orange_45, #FFBC81)}.text-orange_35{color:var(--color-orange_35, #FFD5AF)}.text-orange_20{color:var(--color-orange_20, #FFEAD7)}.text-orange_10{color:var(--color-orange_10, #FEF1EA)}.text-header_alert{color:var(--color-header_alert, #FF7A00)}.text-yellow_95{color:var(--color-yellow_95, #322700)}.text-yellow_90{color:var(--color-yellow_90, #453702)}.text-yellow_80{color:var(--color-yellow_80, #6C5602)}.text-yellow_70{color:var(--color-yellow_70, #9C7A00)}.text-yellow_60{color:var(--color-yellow_60, #C49900)}.text-yellow_50{color:var(--color-yellow_50, #EBB800)}.text-yellow_45{color:var(--color-yellow_45, #FFC700)}.text-yellow_40{color:var(--color-yellow_40, #FFD643)}.text-yellow_30{color:var(--color-yellow_30, #FEE17C)}.text-yellow_25{color:var(--color-yellow_25, #FFE99E)}.text-yellow_20{color:var(--color-yellow_20, #FEF1C4)}.text-yellow_10{color:var(--color-yellow_10, #FFF7DD)}.text-olive_95{color:var(--color-olive_95, #2C2C00)}.text-olive_90{color:var(--color-olive_90, #454500)}.text-olive_80{color:var(--color-olive_80, #636300)}.text-olive_70{color:var(--color-olive_70, #838300)}.text-olive_65{color:var(--color-olive_65, #A5A500)}.text-olive_55{color:var(--color-olive_55, #C7C700)}.text-olive_45{color:var(--color-olive_45, #DDDD12)}.text-olive_30{color:var(--color-olive_30, #EEEE37)}.text-olive_20{color:var(--color-olive_20, #F6F65F)}.text-olive_15{color:var(--color-olive_15, #FAFAA1)}.text-olive_10{color:var(--color-olive_10, #FBFBBF)}.text-olive_05{color:var(--color-olive_05, #FEFED9)}.text-green_99{color:var(--color-green_99, #001D0B)}.text-green_95{color:var(--color-green_95, #003013)}.text-green_90{color:var(--color-green_90, #00461C)}.text-green_85{color:var(--color-green_85, #006629)}.text-green_80{color:var(--color-green_80, #007B31)}.text-green_75{color:var(--color-green_75, #00973C)}.text-green_70{color:var(--color-green_70, #12B553)}.text-green_65{color:var(--color-green_65, #2BCE6C)}.text-green_55{color:var(--color-green_55, #6DE39C)}.text-green_45{color:var(--color-green_45, #ACF4C9)}.text-green_25{color:var(--color-green_25, #D4FAE3)}.text-green_15{color:var(--color-green_15, #E8F9EF)}.text-steelblue_99{color:var(--color-steelblue_99, #021a25)}.text-steelblue_95{color:var(--color-steelblue_95, #02212f)}.text-steelblue_90{color:var(--color-steelblue_90, #032d40)}.text-steelblue_85{color:var(--color-steelblue_85, #033f59)}.text-steelblue_80{color:var(--color-steelblue_80, #06587d)}.text-steelblue_75{color:var(--color-steelblue_75, #066d9b)}.text-steelblue_70{color:var(--color-steelblue_70, #128fc7)}.text-steelblue_65{color:var(--color-steelblue_65, #229fd7)}.text-steelblue_60{color:var(--color-steelblue_60, #50bff0)}.text-steelblue_45{color:var(--color-steelblue_45, #a4e2fd)}.text-steelblue_25{color:var(--color-steelblue_25, #d9f2fd)}.text-steelblue_10{color:var(--color-steelblue_10, #ecf8fd)}.text-oceanblue_99{color:var(--color-oceanblue_99, #011428)}.text-oceanblue_95{color:var(--color-oceanblue_95, #03172d)}.text-oceanblue_90{color:var(--color-oceanblue_90, #051d36)}.text-oceanblue_85{color:var(--color-oceanblue_85, #07284a)}.text-oceanblue_80{color:var(--color-oceanblue_80, #004177)}.text-oceanblue_75{color:var(--color-oceanblue_75, #025497)}.text-oceanblue_70{color:var(--color-oceanblue_70, #006ac1)}.text-oceanblue_65{color:var(--color-oceanblue_65, #1f8ae1)}.text-oceanblue_60{color:var(--color-oceanblue_60, #5cb0f3)}.text-oceanblue_50{color:var(--color-oceanblue_50, #9cd1fc)}.text-oceanblue_25{color:var(--color-oceanblue_25, #d5ebfe)}.text-oceanblue_15{color:var(--color-oceanblue_15, #eaf5fe)}.text-brilliantblue_99{color:var(--color-brilliantblue_99, #001226)}.text-brilliantblue_95{color:var(--color-brilliantblue_95, #001b39)}.text-brilliantblue_90{color:var(--color-brilliantblue_90, #002b5e)}.text-brilliantblue_85{color:var(--color-brilliantblue_85, #004290)}.text-brilliantblue_80{color:var(--color-brilliantblue_80, #005cc9)}.text-brilliantblue_75{color:var(--color-brilliantblue_75, #0075ff)}.text-brilliantblue_70{color:var(--color-brilliantblue_70, #2d8dff)}.text-brilliantblue_60{color:var(--color-brilliantblue_60, #64abff)}.text-brilliantblue_50{color:var(--color-brilliantblue_50, #93c4ff)}.text-brilliantblue_40{color:var(--color-brilliantblue_40, #bbdaff)}.text-brilliantblue_25{color:var(--color-brilliantblue_25, #d9eaff)}.text-brilliantblue_20{color:var(--color-brilliantblue_20, #e6f1ff)}.text-brilliantblue_10{color:var(--color-brilliantblue_10, #eff6ff)}.text-brilliantblue_05{color:var(--color-brilliantblue_05, #f5faff)}.text-grey_95{color:var(--color-grey_95, #222222)}.text-grey_90{color:var(--color-grey_90, #333333)}.text-grey_85{color:var(--color-grey_85, #444444)}.text-grey_80{color:var(--color-grey_80, #555555)}.text-grey_70{color:var(--color-grey_70, #737373)}.text-grey_65{color:var(--color-grey_65, #888888)}.text-grey_60{color:var(--color-grey_60, #999999)}.text-grey_55{color:var(--color-grey_55, #aaaaaa)}.text-grey_50{color:var(--color-grey_50, #bbbbbb)}.text-grey_45{color:var(--color-grey_45, #cccccc)}.text-grey_35{color:var(--color-grey_35, #D8D8D8)}.text-grey_30{color:var(--color-grey_30, #e1e1e1)}.text-grey_25{color:var(--color-grey_25, #E5E5E5)}.text-grey_20{color:var(--color-grey_20, #eeeeee)}.text-grey_10{color:var(--color-grey_10, #f6f6f6)}.text-grey_05{color:var(--color-grey_05, #f9f9f9)}.text-white{color:var(--color-white, #ffffff)}.text-black{color:var(--color-black, #000000)}*,*::before,*::after{box-sizing:border-box}*{scroll-behavior:smooth}*::-webkit-scrollbar{opacity:0;width:8px;background:#E5E5E5}*::-webkit-scrollbar:horizontal{height:8px}*::-webkit-scrollbar-thumb{height:80px;background-color:#CCCCCC;border-radius:4px}*::-webkit-scrollbar-track{background-color:#E5E5E5}html{-moz-text-size-adjust:none;-webkit-text-size-adjust:none;text-size-adjust:none}body,h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin-block-end:0}ul[role=list],ol[role=list]{list-style:none}body{min-height:100vh;line-height:1.5}h1,h2,h3,h4,button,input,label{line-height:1}h1,h2,h3,h4{text-wrap:balance}a:not([class]){text-decoration-skip-ink:auto;color:currentColor}img,picture{max-width:100%;display:block}input,button,textarea,select{font-size:inherit}:target{scroll-margin-block:5ex}button{background:none;border:none;cursor:pointer;padding:0;outline:0}button:focus{outline:0 !important}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,input:-webkit-autofill:active{-webkit-text-fill-color:#000;-webkit-box-shadow:0 0 0px 1000px #fff inset;box-shadow:0 0 0px 1000px #fff inset;transition:background-color 5000s ease-in-out 0s}input:autofill,input:autofill:hover,input:autofill:focus,input:autofill:active{-webkit-text-fill-color:#000;-webkit-box-shadow:0 0 0px 1000px #fff inset;box-shadow:0 0 0px 1000px #fff inset;transition:background-color 5000s ease-in-out 0s}:host{display:inline-block;height:fit-content;line-height:0}.text-center{text-align:center}.text-right{text-align:right}.text-left{text-align:left}input[type=text],input[type=number],input[type=password],input[type=email],input[type=tel],textarea{padding-block:0px;padding-inline:0px}.sd-hoverable:hover>.sd-focus-helper{background:currentColor;opacity:0.15}.sd-hoverable:hover>.sd-focus-helper:before{opacity:0.1}.sd-hoverable:hover>.sd-focus-helper:after{opacity:0.4}.sd-focus-helper{position:absolute;top:0;left:0;width:100%;height:100%;border-radius:inherit;opacity:0;transition:background-color 0.3s cubic-bezier(0.25, 0.8, 0.5, 1), opacity 0.4s cubic-bezier(0.25, 0.8, 0.5, 1)}.sd-focus-helper:before,.sd-focus-helper:after{content:\"\";position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;border-radius:inherit;transition:background-color 0.3s cubic-bezier(0.25, 0.8, 0.5, 1), opacity 0.6s cubic-bezier(0.25, 0.8, 0.5, 1)}.sd-focus-helper:before{background:#000000}.sd-focus-helper:after{background:#ffffff}";
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-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-control-xs-font-size:12px;--sd-system-typography-control-xs-font-weight:500;--sd-system-typography-control-xs-text-decoration:none;--sd-system-typography-control-xs-line-height:22px;--sd-system-typography-control-sm-default-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-control-sm-default-font-size:12px;--sd-system-typography-control-sm-default-font-weight:500;--sd-system-typography-control-sm-default-text-decoration:none;--sd-system-typography-control-sm-default-line-height:20px;--sd-system-typography-control-sm-underline-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-control-sm-underline-font-size:12px;--sd-system-typography-control-sm-underline-font-weight:500;--sd-system-typography-control-sm-underline-text-decoration:underline;--sd-system-typography-control-sm-underline-line-height:22px;--sd-system-typography-control-md-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-control-md-font-size:16px;--sd-system-typography-control-md-font-weight:500;--sd-system-typography-control-md-text-decoration:none;--sd-system-typography-control-md-line-height:26px;--sd-system-typography-control-lg-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-control-lg-font-size:18px;--sd-system-typography-control-lg-font-weight:500;--sd-system-typography-control-lg-text-decoration:none;--sd-system-typography-control-lg-line-height:30px;--sd-system-typography-feedback-xs-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-feedback-xs-font-size:11px;--sd-system-typography-feedback-xs-font-weight:500;--sd-system-typography-feedback-xs-line-height:18px;--sd-system-typography-feedback-xs-text-decoration:none;--sd-system-typography-feedback-sm-regular-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-feedback-sm-regular-font-size:12px;--sd-system-typography-feedback-sm-regular-font-weight:400;--sd-system-typography-feedback-sm-regular-line-height:22px;--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-line-height:20px;--sd-system-typography-feedback-sm-bold-text-decoration:none;--sd-system-typography-feedback-sm-underline-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-feedback-sm-underline-font-size:12px;--sd-system-typography-feedback-sm-underline-font-weight:500;--sd-system-typography-feedback-sm-underline-line-height:20px;--sd-system-typography-feedback-sm-underline-text-decoration:underline;--sd-system-typography-feedback-md-bold-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-feedback-md-bold-font-size:14px;--sd-system-typography-feedback-md-bold-font-weight:700;--sd-system-typography-feedback-md-bold-line-height:24px;--sd-system-typography-feedback-md-bold-text-decoration:none;--sd-system-typography-feedback-md-underline-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-feedback-md-underline-font-size:14px;--sd-system-typography-feedback-md-underline-font-weight:700;--sd-system-typography-feedback-md-underline-line-height:24px;--sd-system-typography-feedback-md-underline-text-decoration:underline;--sd-system-typography-heading-sm-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-heading-sm-font-weight:700;--sd-system-typography-heading-sm-font-size:14px;--sd-system-typography-heading-sm-line-height:24px;--sd-system-typography-heading-sm-text-decoration:none;--sd-system-typography-heading-md-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-heading-md-font-weight:700;--sd-system-typography-heading-md-font-size:16px;--sd-system-typography-heading-md-text-decoration:none;--sd-system-typography-heading-md-line-height:26px;--sd-system-typography-heading-lg-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-heading-lg-font-weight:700;--sd-system-typography-heading-lg-font-size:18px;--sd-system-typography-heading-lg-line-height:30px;--sd-system-typography-heading-lg-text-decoration:none;--sd-system-typography-field-sm-default-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-field-sm-default-font-weight:400;--sd-system-typography-field-sm-default-font-size:12px;--sd-system-typography-field-sm-default-line-height:20px;--sd-system-typography-field-sm-default-text-decoration:none;--sd-system-typography-field-sm-medium-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-field-sm-medium-font-weight:500;--sd-system-typography-field-sm-medium-font-size:12px;--sd-system-typography-field-sm-medium-text-decoration:none;--sd-system-typography-field-sm-medium-line-height:20px;--sd-system-typography-field-sm-bold-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-field-sm-bold-font-weight:700;--sd-system-typography-field-sm-bold-font-size:12px;--sd-system-typography-field-sm-bold-text-decoration:none;--sd-system-typography-field-sm-bold-line-height:20px;--sd-system-typography-field-md-default-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-field-md-default-font-weight:400;--sd-system-typography-field-md-default-font-size:14px;--sd-system-typography-field-md-default-text-decoration:none;--sd-system-typography-field-md-default-line-height:24px;--sd-system-typography-field-md-medium-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-field-md-medium-font-weight:500;--sd-system-typography-field-md-medium-font-size:14px;--sd-system-typography-field-md-medium-text-decoration:none;--sd-system-typography-field-md-medium-line-height:24px;--sd-system-typography-field-md-bold-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-field-md-bold-font-weight:700;--sd-system-typography-field-md-bold-font-size:14px;--sd-system-typography-field-md-bold-text-decoration:none;--sd-system-typography-field-md-bold-line-height:24px;--sd-system-typography-field-lg-default-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-field-lg-default-font-weight:400;--sd-system-typography-field-lg-default-font-size:16px;--sd-system-typography-field-lg-default-line-height:26px;--sd-system-typography-field-lg-default-text-decoration:none;--sd-system-typography-field-lg-medium-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-field-lg-medium-font-weight:500;--sd-system-typography-field-lg-medium-font-size:16px;--sd-system-typography-field-lg-medium-line-height:26px;--sd-system-typography-field-lg-medium-text-decoration:none;--sd-system-typography-field-lg-bold-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-system-typography-field-lg-bold-font-weight:700;--sd-system-typography-field-lg-bold-font-size:16px;--sd-system-typography-field-lg-bold-line-height:26px;--sd-system-typography-field-lg-bold-text-decoration:none;--sd-system-size-control-xs-height:24px;--sd-system-size-control-sm-height:28px;--sd-system-size-control-md-height:36px;--sd-system-size-control-lg-height:62px;--sd-system-size-icon-xxxs:8px;--sd-system-size-icon-xxs:10px;--sd-system-size-icon-xs:12px;--sd-system-size-icon-sm:16px;--sd-system-size-icon-md:20px;--sd-system-size-icon-lg:24px;--sd-system-size-icon-xl:32px;--sd-system-size-feedback-arrow-width:16px;--sd-system-size-feedback-arrow-height:12px;--sd-system-size-feedback-xs-height:20px;--sd-system-size-feedback-sm-height:24px;--sd-system-size-feedback-md-height:28px;--sd-system-size-field-control:16px;--sd-system-size-field-icon:12px;--sd-system-size-field-sm-height:28px;--sd-system-size-field-md-height:36px;--sd-system-space-control-xs-padding-x:8px;--sd-system-space-control-xs-gap:4px;--sd-system-space-control-sm-padding-x:12px;--sd-system-space-control-sm-gap:6px;--sd-system-space-control-md-padding-x:20px;--sd-system-space-control-md-gap:8px;--sd-system-space-control-lg-padding-x:28px;--sd-system-space-control-lg-gap:12px;--sd-system-space-feedback-xs-padding-x:6px;--sd-system-space-feedback-xs-gap:4px;--sd-system-space-feedback-sm-padding-x:8px;--sd-system-space-feedback-sm-gap:6px;--sd-system-space-feedback-md-padding-x:12px;--sd-system-space-feedback-md-gap:8px;--sd-system-space-stack-gap-tight:2px;--sd-system-space-stack-gap-normal:4px;--sd-system-space-field-sm-padding-x:12px;--sd-system-space-field-sm-padding-y:4px;--sd-system-space-field-sm-container-gap:8px;--sd-system-space-field-sm-gap:12px;--sd-system-space-field-md-padding-x:16px;--sd-system-space-field-md-container-gap:12px;--sd-system-space-field-md-gap:16px;--sd-system-radius-control-sm:4px;--sd-system-radius-control-md:6px;--sd-system-radius-feedback-xs-square:6px;--sd-system-radius-feedback-sm-square:8px;--sd-system-radius-feedback-pill:9999px;--sd-system-radius-field-sm:4px;--sd-system-radius-field-md:6px;--sd-system-border-width-control-default:1px;--sd-system-border-width-field-default:1px;--sd-system-color-bg-screen:#EEEEEE;--sd-system-color-bg-frame:#FFFFFF;--sd-system-color-bg-brand:#025497;--sd-system-color-bg-subtle:#1F8AE1;--sd-system-color-bg-accent-default:#0075FF;--sd-system-color-bg-accent-light:#F5FAFF;--sd-system-color-bg-accent-light-default:#D9EAFF;--sd-system-color-bg-accent-light-light:#F5FAFF;--sd-system-color-bg-deep:#07284A;--sd-system-color-bg-danger-default:#E30000;--sd-system-color-bg-danger-light:#FCEFEF;--sd-system-color-bg-danger-light-default:#FB4444;--sd-system-color-bg-danger-light-light:#FCEFEF;--sd-system-color-bg-warning:#FF6B00;--sd-system-color-bg-caution:#FFC700;--sd-system-color-bg-progress:#0075FF;--sd-system-color-bg-success-default:#00973C;--sd-system-color-bg-success-light:#12B553;--sd-system-color-bg-disabled:#E1E1E1;--sd-system-color-content-primary:#222222;--sd-system-color-content-secondary:#555555;--sd-system-color-content-tertiary:#888888;--sd-system-color-content-quaternary:#AAAAAA;--sd-system-color-content-brand:#005CC9;--sd-system-color-content-subtle:#066D9B;--sd-system-color-content-accent:#0075FF;--sd-system-color-content-danger-default:#E30000;--sd-system-color-content-danger-light:#FB4444;--sd-system-color-content-warning:#FF6B00;--sd-system-color-content-inverse:#FFFFFF;--sd-system-color-text-disabled:#888888;--sd-system-color-link-accent:#006AC1;--sd-system-color-icon-brand:#025497;--sd-system-color-icon-accent:#0075FF;--sd-system-color-icon-danger:#E30000;--sd-system-color-icon-warning:#FF6B00;--sd-system-color-icon-success:#00973C;--sd-system-color-icon-inverse:#FFFFFF;--sd-system-color-icon-disabled:#BBBBBB;--sd-system-color-border-default:#E1E1E1;--sd-system-color-border-accent:#0075FF;--sd-system-color-border-danger:#FB4444;--sd-system-color-border-success:#12B553;--sd-system-color-border-disabled:#CCCCCC;--sd-system-color-red-strong:#FB4444;--sd-system-color-red-subtle:#FCEFEF;--sd-system-color-orange-strong:#FF6B00;--sd-system-color-orange-subtle:#FEF1EA;--sd-system-color-yellow-strong:#916C0D;--sd-system-color-yellow-moderate:#FFC700;--sd-system-color-yellow-subtle:#FFF7DD;--sd-system-color-green-strong:#00973C;--sd-system-color-green-subtle:#E8F9EF;--sd-system-color-blue-strong:#0075FF;--sd-system-color-blue-subtle:#E6F1FF;--sd-system-color-darkblue-strong:#006AC1;--sd-system-color-darkblue-subtle:#EAF5FE;--sd-system-color-indigo-strong:#004290;--sd-system-color-indigo-subtle:#EFF6FF;--sd-system-color-grey-strong:#737373;--sd-system-color-grey-subtle:#EEEEEE;--sd-system-color-field-bg-default:#FFFFFF;--sd-system-color-field-bg-hover:#0075FF;--sd-system-color-field-border-default:#AAAAAA;--sd-system-color-field-border-focus:#0075FF;--sd-system-color-field-border-hover:#0075FF;--sd-system-color-field-border-danger:#FB4444;--sd-system-color-field-border-success:#12B553;--sd-system-color-field-text-default:#222222;--sd-system-color-field-text-placeholder:#AAAAAA;--sd-system-color-field-icon-default:#888888;--sd-system-color-divider-default:#E1E1E1;--sd-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:22px;--sd-button-button-xs-icon:12px;--sd-button-button-sm-height:28px;--sd-button-button-sm-padding-x:12px;--sd-button-button-sm-gap:6px;--sd-button-button-sm-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-button-button-sm-typography-font-size:12px;--sd-button-button-sm-typography-font-weight:500;--sd-button-button-sm-typography-text-decoration:none;--sd-button-button-sm-typography-line-height:20px;--sd-button-button-sm-icon:16px;--sd-button-button-md-height:36px;--sd-button-button-md-padding-x:20px;--sd-button-button-md-gap:8px;--sd-button-button-md-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-button-button-md-typography-font-size:16px;--sd-button-button-md-typography-font-weight:500;--sd-button-button-md-typography-text-decoration:none;--sd-button-button-md-typography-line-height:26px;--sd-button-button-md-icon:20px;--sd-button-button-lg-height:62px;--sd-button-button-lg-padding-x:28px;--sd-button-button-lg-gap:12px;--sd-button-button-lg-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-button-button-lg-typography-font-size:18px;--sd-button-button-lg-typography-font-weight:500;--sd-button-button-lg-typography-text-decoration:none;--sd-button-button-lg-typography-line-height:30px;--sd-button-button-lg-icon:24px;--sd-button-button-radius-sm:4px;--sd-button-button-radius-md:6px;--sd-button-button-border-width-default:1px;--sd-button-button-border-disabled:#CCCCCC;--sd-button-button-icon-only-xs-width:24px;--sd-button-button-icon-only-sm-width:28px;--sd-button-button-icon-only-md-width:36px;--sd-button-button-icon-only-lg-width:62px;--sd-button-button-bg-disabled:#E1E1E1;--sd-button-button-text-disabled:#888888;--sd-button-button-icon-disabled:#BBBBBB;--sd-button-button-brand-strong-bg-default:#025497;--sd-button-button-brand-strong-bg-hover:#004177;--sd-button-button-brand-strong-content:#FFFFFF;--sd-button-button-brand-strong-dropdown-divider:#006AC1;--sd-button-button-brand-subtle-bg-default:#1F8AE1;--sd-button-button-brand-subtle-bg-hover:#006AC1;--sd-button-button-brand-subtle-content:#FFFFFF;--sd-button-button-brand-subtle-dropdown-divider:#5CB0F3;--sd-button-button-brand-outline-bg-default:#FFFFFF;--sd-button-button-brand-outline-bg-hover:#EAF5FE;--sd-button-button-brand-outline-border:#025497;--sd-button-button-brand-outline-content:#025497;--sd-button-button-neutral-outline-bg-default:#FFFFFF;--sd-button-button-neutral-outline-bg-hover:#EEEEEE;--sd-button-button-neutral-outline-border:#888888;--sd-button-button-neutral-outline-content:#222222;--sd-button-button-danger-strong-bg-default:#E30000;--sd-button-button-danger-strong-bg-hover:#AD0000;--sd-button-button-danger-strong-content:#FFFFFF;--sd-button-button-danger-strong-dropdown-divider:#FF7C7C;--sd-button-button-danger-outline-bg-default:#FFFFFF;--sd-button-button-danger-outline-bg-hover:#FCEFEF;--sd-button-button-danger-outline-border:#E30000;--sd-button-button-danger-outline-content:#E30000;--sd-ghost-button-ghost-button-xxs-size:16px;--sd-ghost-button-ghost-button-xxs-icon:12px;--sd-ghost-button-ghost-button-xs-size:24px;--sd-ghost-button-ghost-button-xs-icon:16px;--sd-ghost-button-ghost-button-sm-size:28px;--sd-ghost-button-ghost-button-sm-icon:20px;--sd-ghost-button-ghost-button-md-size:36px;--sd-ghost-button-ghost-button-md-icon:24px;--sd-ghost-button-ghost-button-lg-size:62px;--sd-ghost-button-ghost-button-lg-icon:32px;--sd-ghost-button-ghost-button-radius:4px;--sd-ghost-button-ghost-button-hover-opacity:5%;--sd-ghost-button-ghost-button-icon-disabled:#BBBBBB;--sd-ghost-button-ghost-button-default-content:#888888;--sd-ghost-button-ghost-button-default-hover-bg:#222222;--sd-ghost-button-ghost-button-danger-content:#E30000;--sd-ghost-button-ghost-button-danger-hover-bg:#E30000;--sd-ghost-button-ghost-button-action-content:#025497;--sd-ghost-button-ghost-button-action-hover-bg:#0075FF;--sd-ghost-button-ghost-button-inverse-content:#FFFFFF;--sd-ghost-button-ghost-button-inverse-disabled:#E1E1E1;--sd-ghost-button-ghost-button-inverse-hover-bg:#FFFFFF;--sd-text-link-text-link-gap:4px;--sd-text-link-text-link-size-icon:16px;--sd-text-link-text-link-typography-default-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-text-link-text-link-typography-default-font-size:12px;--sd-text-link-text-link-typography-default-font-weight:500;--sd-text-link-text-link-typography-default-text-decoration:none;--sd-text-link-text-link-typography-default-line-height:20px;--sd-text-link-text-link-typography-underline-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-text-link-text-link-typography-underline-font-size:12px;--sd-text-link-text-link-typography-underline-font-weight:500;--sd-text-link-text-link-typography-underline-text-decoration:underline;--sd-text-link-text-link-typography-underline-line-height:22px;--sd-text-link-text-link-content-default:#222222;--sd-text-link-text-link-content-disabled:#888888;--sd-text-link-text-link-icon-default:#006AC1;--sd-text-link-text-link-icon-disabled:#BBBBBB;--sd-tag-tag-xs-height:20px;--sd-tag-tag-xs-padding-x:6px;--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-line-height:20px;--sd-tag-tag-sm-typography-text-decoration:none;--sd-tag-tag-sm-radius:6px;--sd-tag-tag-md-height:28px;--sd-tag-tag-md-padding-x:12px;--sd-tag-tag-md-gap:6px;--sd-tag-tag-md-icon:16px;--sd-tag-tag-md-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-tag-tag-md-typography-font-size:14px;--sd-tag-tag-md-typography-font-weight:700;--sd-tag-tag-md-typography-line-height:24px;--sd-tag-tag-md-typography-text-decoration:none;--sd-tag-tag-md-radius:8px;--sd-tag-tag-red-content:#FB4444;--sd-tag-tag-red-bg:#FCEFEF;--sd-tag-tag-orange-content:#FF6B00;--sd-tag-tag-orange-bg:#FEF1EA;--sd-tag-tag-yellow-content:#916C0D;--sd-tag-tag-yellow-bg:#FFF7DD;--sd-tag-tag-green-content:#00973C;--sd-tag-tag-green-bg:#E8F9EF;--sd-tag-tag-blue-content:#0075FF;--sd-tag-tag-blue-bg:#E6F1FF;--sd-tag-tag-darkblue-content:#006AC1;--sd-tag-tag-darkblue-bg:#EAF5FE;--sd-tag-tag-indigo-content:#004290;--sd-tag-tag-indigo-bg:#EFF6FF;--sd-tag-tag-grey-content:#737373;--sd-tag-tag-grey-bg:#EEEEEE;--sd-badge-badge-size:6px;--sd-badge-badge-radius:9999px;--sd-badge-badge-red:#FB4444;--sd-badge-badge-orange:#FF6B00;--sd-badge-badge-yellow:#FFC700;--sd-badge-badge-green:#00973C;--sd-badge-badge-blue:#0075FF;--sd-badge-badge-darkblue:#006AC1;--sd-badge-badge-indigo:#004290;--sd-badge-badge-grey:#737373;--sd-tooltip-tooltip-radius:6px;--sd-tooltip-tooltip-padding-y:12px;--sd-tooltip-tooltip-padding-x:16px;--sd-tooltip-tooltip-gap:12px;--sd-tooltip-tooltip-arrow-width:16px;--sd-tooltip-tooltip-arrow-height:12px;--sd-tooltip-tooltip-default-bg:#07284A;--sd-tooltip-tooltip-default-content:#FFFFFF;--sd-tooltip-tooltip-default-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-tooltip-tooltip-default-typography-font-size:12px;--sd-tooltip-tooltip-default-typography-font-weight:500;--sd-tooltip-tooltip-default-typography-line-height:20px;--sd-tooltip-tooltip-default-typography-text-decoration:none;--sd-tooltip-tooltip-danger-bg:#FCEFEF;--sd-tooltip-tooltip-danger-content:#FB4444;--sd-tooltip-tooltip-danger-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-tooltip-tooltip-danger-typography-font-size:12px;--sd-tooltip-tooltip-danger-typography-font-weight:700;--sd-tooltip-tooltip-danger-typography-line-height:20px;--sd-tooltip-tooltip-danger-typography-text-decoration:none;--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-line-height:20px;--sd-tooltip-tooltip-warning-typography-text-decoration:none;--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-line-height:20px;--sd-tooltip-tooltip-accent-typography-text-decoration:none;--sd-popover-popover-radius:6px;--sd-popover-popover-padding-y:16px;--sd-popover-popover-padding-x:20px;--sd-popover-popover-gap:12px;--sd-popover-popover-body-gap:12px;--sd-popover-popover-contents-gap:4px;--sd-popover-popover-arrow-width:16px;--sd-popover-popover-arrow-height:12px;--sd-popover-popover-bg:#07284A;--sd-popover-popover-title-color:#FFFFFF;--sd-popover-popover-title-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-popover-popover-title-typography-font-size:14px;--sd-popover-popover-title-typography-font-weight:700;--sd-popover-popover-title-typography-line-height:24px;--sd-popover-popover-title-typography-text-decoration:none;--sd-popover-popover-description-color:#FFFFFF;--sd-popover-popover-description-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-popover-popover-description-typography-font-size:12px;--sd-popover-popover-description-typography-font-weight:500;--sd-popover-popover-description-typography-line-height:20px;--sd-popover-popover-description-typography-text-decoration:none;--sd-popover-popover-sub-action-color:#D8D8D8;--sd-popover-popover-sub-action-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-popover-popover-sub-action-typography-font-size:12px;--sd-popover-popover-sub-action-typography-font-weight:700;--sd-popover-popover-sub-action-typography-line-height:20px;--sd-popover-popover-sub-action-typography-text-decoration:none;--sd-toast-toast-radius:8px;--sd-toast-toast-padding-y:12px;--sd-toast-toast-padding-x:24px;--sd-toast-toast-gap:16px;--sd-toast-toast-icon:16px;--sd-toast-toast-typography-default-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-toast-toast-typography-default-font-size:14px;--sd-toast-toast-typography-default-font-weight:700;--sd-toast-toast-typography-default-line-height:24px;--sd-toast-toast-typography-default-text-decoration:none;--sd-toast-toast-typography-link-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-toast-toast-typography-link-font-size:14px;--sd-toast-toast-typography-link-font-weight:700;--sd-toast-toast-typography-link-line-height:24px;--sd-toast-toast-typography-link-text-decoration:underline;--sd-toast-toast-default-bg:#07284A;--sd-toast-toast-default-content:#FFFFFF;--sd-toast-toast-danger-bg:#FB4444;--sd-toast-toast-danger-content:#FFFFFF;--sd-toast-toast-caution-bg:#FFC700;--sd-toast-toast-caution-content:#222222;--sd-toast-toast-complete-bg:#00973C;--sd-toast-toast-complete-content:#FFFFFF;--sd-toast-toast-accent-bg:#005CC9;--sd-toast-toast-accent-content:#FFFFFF;--sd-checkbox-checkbox-size:16px;--sd-checkbox-checkbox-radius:2px;--sd-checkbox-checkbox-border-width:1px;--sd-checkbox-checkbox-gap:8px;--sd-checkbox-checkbox-icon:12px;--sd-checkbox-checkbox-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-checkbox-checkbox-typography-font-weight:400;--sd-checkbox-checkbox-typography-font-size:12px;--sd-checkbox-checkbox-typography-line-height:20px;--sd-checkbox-checkbox-typography-text-decoration:none;--sd-checkbox-checkbox-unchecked-bg-default:#FFFFFF;--sd-checkbox-checkbox-unchecked-bg-hover:#D9EAFF;--sd-checkbox-checkbox-unchecked-border-default:#AAAAAA;--sd-checkbox-checkbox-unchecked-border-hover:#0075FF;--sd-checkbox-checkbox-checked-bg-default:#0075FF;--sd-checkbox-checkbox-checked-icon-default:#FFFFFF;--sd-checkbox-checkbox-checked-icon-disabled:#BBBBBB;--sd-checkbox-checkbox-checked-icon-inverse:#FFFFFF;--sd-checkbox-checkbox-checked-border-inverse:#FFFFFF;--sd-checkbox-checkbox-label-default:#222222;--sd-checkbox-checkbox-label-inverse:#FFFFFF;--sd-checkbox-checkbox-bg-disabled:#E1E1E1;--sd-checkbox-checkbox-border-disabled:#CCCCCC;--sd-radio-radio-size:16px;--sd-radio-radio-radius:9999px;--sd-radio-radio-border-width:1px;--sd-radio-radio-gap:8px;--sd-radio-radio-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-radio-radio-typography-font-weight:400;--sd-radio-radio-typography-font-size:12px;--sd-radio-radio-typography-line-height:20px;--sd-radio-radio-typography-text-decoration:none;--sd-radio-radio-unchecked-bg-default:#FFFFFF;--sd-radio-radio-unchecked-bg-hover:#D9EAFF;--sd-radio-radio-unchecked-border-default:#AAAAAA;--sd-radio-radio-unchecked-border-hover:#0075FF;--sd-radio-radio-checked-border-default:#0075FF;--sd-radio-radio-checked-dot-default:#0075FF;--sd-radio-radio-bg-disabled:#E1E1E1;--sd-radio-radio-border-disabled:#CCCCCC;--sd-radio-radio-dot-disabled:#CCCCCC;--sd-radio-radio-label-default:#222222;--sd-list-item-list-item-padding-y:4px;--sd-list-item-list-item-padding-right:12px;--sd-list-item-list-item-gap:8px;--sd-list-item-list-item-padding-left-depth1:12px;--sd-list-item-list-item-padding-left-depth2:20px;--sd-list-item-list-item-padding-left-depth3:28px;--sd-list-item-list-item-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-list-item-list-item-typography-font-weight:400;--sd-list-item-list-item-typography-font-size:12px;--sd-list-item-list-item-typography-line-height:20px;--sd-list-item-list-item-typography-text-decoration:none;--sd-list-item-list-item-bg-default:#FFFFFF;--sd-list-item-list-item-bg-hover:#0075FF;--sd-list-item-list-item-content-default:#222222;--sd-list-item-list-item-content-hover:#FFFFFF;--sd-list-item-list-item-content-disabled:#888888;--sd-list-item-list-item-indeterminate-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-list-item-list-item-indeterminate-typography-font-weight:700;--sd-list-item-list-item-indeterminate-typography-font-size:12px;--sd-list-item-list-item-indeterminate-typography-text-decoration:none;--sd-list-item-list-item-indeterminate-typography-line-height:20px;--sd-list-item-list-item-depth1-bg-default:#EFF6FF;--sd-list-item-list-item-depth1-bg-disabled:#EEEEEE;--sd-list-item-list-item-depth1-border-color:#E1E1E1;--sd-list-item-list-item-depth1-border-width:1px;--sd-list-item-list-item-depth1-title-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-list-item-list-item-depth1-title-typography-font-weight:700;--sd-list-item-list-item-depth1-title-typography-font-size:12px;--sd-list-item-list-item-depth1-title-typography-text-decoration:none;--sd-list-item-list-item-depth1-title-typography-line-height:20px;--sd-list-item-list-item-depth2-middle-bg:#F6F6F6;--sd-list-item-list-item-depth2-middle-title-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-list-item-list-item-depth2-middle-title-typography-font-weight:500;--sd-list-item-list-item-depth2-middle-title-typography-font-size:12px;--sd-list-item-list-item-depth2-middle-title-typography-text-decoration:none;--sd-list-item-list-item-depth2-middle-title-typography-line-height:20px;--sd-list-item-list-item-count-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-list-item-list-item-count-typography-font-weight:500;--sd-list-item-list-item-count-typography-font-size:12px;--sd-list-item-list-item-count-typography-text-decoration:none;--sd-list-item-list-item-count-typography-line-height:20px;--sd-list-item-list-item-count-color:#888888;--sd-list-box-list-box-radius:4px;--sd-list-box-list-box-bg:#FFFFFF;--sd-select-select-height:28px;--sd-select-select-radius:4px;--sd-select-select-border-width:1px;--sd-select-select-padding-x:12px;--sd-select-select-icon-default:#888888;--sd-select-select-icon-disabled:#BBBBBB;--sd-select-select-gap:8px;--sd-select-select-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-select-select-typography-font-weight:400;--sd-select-select-typography-font-size:12px;--sd-select-select-typography-line-height:20px;--sd-select-select-typography-text-decoration:none;--sd-select-select-border-default:#AAAAAA;--sd-select-select-border-hover:#0075FF;--sd-select-select-border-danger:#FB4444;--sd-select-select-border-disabled:#CCCCCC;--sd-select-select-bg-default:#FFFFFF;--sd-select-select-bg-disabled:#E1E1E1;--sd-select-select-text-default:#222222;--sd-select-select-text-disabled:#888888;--sd-select-select-addon-label-bg:#F6F6F6;--sd-select-select-addon-label-border-default:#AAAAAA;--sd-select-select-addon-label-border-disabled:#CCCCCC;--sd-select-select-size-icon:16px;--sd-field-field-label-sm-height:28px;--sd-field-field-label-sm-gap:6px;--sd-field-field-label-sm-icon:12px;--sd-field-field-label-sm-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-field-field-label-sm-typography-font-weight:700;--sd-field-field-label-sm-typography-font-size:12px;--sd-field-field-label-sm-typography-text-decoration:none;--sd-field-field-label-sm-typography-line-height:20px;--sd-field-field-label-md-height:36px;--sd-field-field-label-md-gap:8px;--sd-field-field-label-md-icon:16px;--sd-field-field-label-md-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-field-field-label-md-typography-font-weight:700;--sd-field-field-label-md-typography-font-size:16px;--sd-field-field-label-md-typography-line-height:26px;--sd-field-field-label-md-typography-text-decoration:none;--sd-field-field-addon-label-height:28px;--sd-field-field-addon-label-gap:6px;--sd-field-field-addon-label-padding-x:12px;--sd-field-field-addon-label-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-field-field-addon-label-typography-font-weight:500;--sd-field-field-addon-label-typography-font-size:12px;--sd-field-field-addon-label-typography-text-decoration:none;--sd-field-field-addon-label-typography-line-height:20px;--sd-field-field-addon-label-bg:#F6F6F6;--sd-field-field-addon-label-border-default:#AAAAAA;--sd-field-field-addon-label-border-disabled:#CCCCCC;--sd-field-field-addon-label-border-width:1px;--sd-textinput-textinput-sm-height:28px;--sd-textinput-textinput-sm-padding-x:12px;--sd-textinput-textinput-sm-padding-y:4px;--sd-textinput-textinput-sm-gap:8px;--sd-textinput-textinput-sm-radius:4px;--sd-textinput-textinput-sm-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-textinput-textinput-sm-typography-font-weight:400;--sd-textinput-textinput-sm-typography-font-size:12px;--sd-textinput-textinput-sm-typography-line-height:20px;--sd-textinput-textinput-sm-typography-text-decoration:none;--sd-textinput-textinput-md-height:36px;--sd-textinput-textinput-md-padding-x:16px;--sd-textinput-textinput-md-gap:12px;--sd-textinput-textinput-md-radius:6px;--sd-textinput-textinput-md-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-textinput-textinput-md-typography-font-weight:400;--sd-textinput-textinput-md-typography-font-size:16px;--sd-textinput-textinput-md-typography-line-height:26px;--sd-textinput-textinput-md-typography-text-decoration:none;--sd-textinput-textinput-border-width:1px;--sd-textinput-textinput-border-default:#AAAAAA;--sd-textinput-textinput-border-focus:#0075FF;--sd-textinput-textinput-border-danger:#FB4444;--sd-textinput-textinput-border-success:#12B553;--sd-textinput-textinput-border-disabled:#CCCCCC;--sd-textinput-textinput-bg-default:#FFFFFF;--sd-textinput-textinput-bg-disabled:#E1E1E1;--sd-textinput-textinput-bg-barcode:#FAFAA1;--sd-textinput-textinput-text-default:#222222;--sd-textinput-textinput-text-placeholder:#AAAAAA;--sd-textinput-textinput-text-disabled:#888888;--sd-textinput-textinput-text-hint:#555555;--sd-textinput-textinput-text-error-message:#E30000;--sd-textinput-textinput-size-icon:16px;--sd-textinput-textinput-icon-default:#888888;--sd-textinput-textinput-unit-color:#888888;--sd-textinput-textinput-hint-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-textinput-textinput-hint-typography-font-weight:400;--sd-textinput-textinput-hint-typography-font-size:12px;--sd-textinput-textinput-hint-typography-line-height:20px;--sd-textinput-textinput-hint-typography-text-decoration:none;--sd-textinput-textinput-error-message-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-textinput-textinput-error-message-typography-font-weight:400;--sd-textinput-textinput-error-message-typography-font-size:12px;--sd-textinput-textinput-error-message-typography-line-height:20px;--sd-textinput-textinput-error-message-typography-text-decoration:none;--sd-textinput-textinput-contents-gap:4px;--sd-textinput-textinput-resizer-size:12px;--sd-textinput-textinput-resizer-color:#AAAAAA;--sd-number-input-number-input-sm-height:28px;--sd-number-input-number-input-sm-padding-x:6px;--sd-number-input-number-input-sm-gap:8px;--sd-number-input-number-input-sm-radius:4px;--sd-number-input-number-input-sm-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-number-input-number-input-sm-typography-font-weight:400;--sd-number-input-number-input-sm-typography-font-size:12px;--sd-number-input-number-input-sm-typography-line-height:20px;--sd-number-input-number-input-sm-typography-text-decoration:none;--sd-number-input-number-input-md-height:36px;--sd-number-input-number-input-md-padding-x:8px;--sd-number-input-number-input-md-gap:12px;--sd-number-input-number-input-md-radius:6px;--sd-number-input-number-input-md-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-number-input-number-input-md-typography-font-weight:400;--sd-number-input-number-input-md-typography-font-size:16px;--sd-number-input-number-input-md-typography-line-height:26px;--sd-number-input-number-input-md-typography-text-decoration:none;--sd-number-input-number-input-border-width:1px;--sd-number-input-number-input-contents-gap:4px;--sd-number-input-number-input-border-default:#AAAAAA;--sd-number-input-number-input-border-focus:#0075FF;--sd-number-input-number-input-border-danger:#FB4444;--sd-number-input-number-input-border-success:#12B553;--sd-number-input-number-input-border-disabled:#CCCCCC;--sd-number-input-number-input-bg-default:#FFFFFF;--sd-number-input-number-input-bg-disabled:#E1E1E1;--sd-number-input-number-input-text-default:#222222;--sd-number-input-number-input-text-placeholder:#AAAAAA;--sd-number-input-number-input-text-disabled:#888888;--sd-number-input-number-input-hint-color:#555555;--sd-number-input-number-input-hint-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-number-input-number-input-hint-typography-font-weight:400;--sd-number-input-number-input-hint-typography-font-size:12px;--sd-number-input-number-input-hint-typography-line-height:20px;--sd-number-input-number-input-hint-typography-text-decoration:none;--sd-number-input-number-input-error-message-color:#E30000;--sd-number-input-number-input-error-message-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-number-input-number-input-error-message-typography-font-weight:400;--sd-number-input-number-input-error-message-typography-font-size:12px;--sd-number-input-number-input-error-message-typography-line-height:20px;--sd-number-input-number-input-error-message-typography-text-decoration:none;--sd-number-input-number-input-stepper-sm-size:20px;--sd-number-input-number-input-stepper-md-size:24px;--sd-number-input-number-input-stepper-radius:4px;--sd-number-input-number-input-stepper-bg-default:#EFF6FF;--sd-number-input-number-input-stepper-bg-disabled:#EEEEEE;--sd-number-input-number-input-stepper-icon-default:#0075FF;--sd-number-input-number-input-stepper-icon-disabled:#BBBBBB;--sd-filepicker-filepicker-height:28px;--sd-filepicker-filepicker-padding-x:12px;--sd-filepicker-filepicker-gap:8px;--sd-filepicker-filepicker-radius:4px;--sd-filepicker-filepicker-border-width:1px;--sd-filepicker-filepicker-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-filepicker-filepicker-typography-font-weight:400;--sd-filepicker-filepicker-typography-font-size:12px;--sd-filepicker-filepicker-typography-line-height:20px;--sd-filepicker-filepicker-typography-text-decoration:none;--sd-filepicker-filepicker-size-icon:16px;--sd-filepicker-filepicker-contents-gap:4px;--sd-filepicker-filepicker-border-default:#AAAAAA;--sd-filepicker-filepicker-border-disabled:#CCCCCC;--sd-filepicker-filepicker-bg-default:#FFFFFF;--sd-filepicker-filepicker-bg-disabled:#E1E1E1;--sd-filepicker-filepicker-text-default:#222222;--sd-filepicker-filepicker-text-placeholder:#AAAAAA;--sd-filepicker-filepicker-text-disabled:#888888;--sd-filepicker-filepicker-icon-disabled:#BBBBBB;--sd-datepicker-datepicker-sm-height:28px;--sd-datepicker-datepicker-sm-padding-x:12px;--sd-datepicker-datepicker-sm-gap:8px;--sd-datepicker-datepicker-sm-icon:16px;--sd-datepicker-datepicker-sm-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-datepicker-datepicker-sm-typography-font-weight:400;--sd-datepicker-datepicker-sm-typography-font-size:12px;--sd-datepicker-datepicker-sm-typography-line-height:20px;--sd-datepicker-datepicker-sm-typography-text-decoration:none;--sd-datepicker-datepicker-sm-radius:4px;--sd-datepicker-datepicker-sm-date-gap:4px;--sd-datepicker-datepicker-md-height:36px;--sd-datepicker-datepicker-md-padding-x:16px;--sd-datepicker-datepicker-md-gap:12px;--sd-datepicker-datepicker-md-icon:20px;--sd-datepicker-datepicker-md-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-datepicker-datepicker-md-typography-font-weight:400;--sd-datepicker-datepicker-md-typography-font-size:16px;--sd-datepicker-datepicker-md-typography-line-height:26px;--sd-datepicker-datepicker-md-typography-text-decoration:none;--sd-datepicker-datepicker-md-radius:6px;--sd-datepicker-datepicker-md-date-gap:6px;--sd-datepicker-datepicker-border-width:1px;--sd-datepicker-datepicker-border-default:#AAAAAA;--sd-datepicker-datepicker-border-focus:#0075FF;--sd-datepicker-datepicker-border-disabled:#CCCCCC;--sd-datepicker-datepicker-bg-default:#FFFFFF;--sd-datepicker-datepicker-bg-disabled:#E1E1E1;--sd-datepicker-datepicker-icon-default:#888888;--sd-datepicker-datepicker-icon-disabled:#BBBBBB;--sd-datepicker-datepicker-text-default:#222222;--sd-datepicker-datepicker-text-hint:#555555;--sd-datepicker-datepicker-text-disabled:#888888;--sd-datepicker-datepicker-contents-gap:4px;--sd-datepicker-datepicker-hint-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-datepicker-datepicker-hint-typography-font-weight:400;--sd-datepicker-datepicker-hint-typography-font-size:12px;--sd-datepicker-datepicker-hint-typography-line-height:20px;--sd-datepicker-datepicker-hint-typography-text-decoration:none;--sd-datepicker-datepicker-calendar-bg:#FFFFFF;--sd-datepicker-datepicker-calendar-padding-x-y:24px;--sd-datepicker-datepicker-calendar-gap:12px;--sd-datepicker-datepicker-calendar-radius:8px;--sd-datepicker-datepicker-calendar-header-gap:8px;--sd-datepicker-datepicker-calendar-header-divider:#E1E1E1;--sd-datepicker-datepicker-calendar-header-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-datepicker-datepicker-calendar-header-typography-font-weight:500;--sd-datepicker-datepicker-calendar-header-typography-font-size:14px;--sd-datepicker-datepicker-calendar-header-typography-text-decoration:none;--sd-datepicker-datepicker-calendar-header-typography-line-height:24px;--sd-datepicker-datepicker-calendar-week-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-datepicker-datepicker-calendar-week-typography-font-weight:400;--sd-datepicker-datepicker-calendar-week-typography-font-size:12px;--sd-datepicker-datepicker-calendar-week-typography-line-height:20px;--sd-datepicker-datepicker-calendar-week-typography-text-decoration:none;--sd-datepicker-datepicker-calendar-week-color:#888888;--sd-datepicker-datepicker-calendar-grid-row-gap:4px;--sd-datepicker-datepicker-calendar-day-size: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:#888888;--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-modal-modal-radius:8px;--sd-modal-modal-confirm-padding-x:32px;--sd-modal-modal-confirm-padding-y:40px;--sd-modal-modal-confirm-gap:40px;--sd-modal-modal-confirm-body-gap:20px;--sd-modal-modal-confirm-title-gap:12px;--sd-modal-modal-confirm-title-color:#222222;--sd-modal-modal-confirm-title-icon:32px;--sd-modal-modal-confirm-title-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-modal-modal-confirm-title-typography-font-weight:700;--sd-modal-modal-confirm-title-typography-font-size:18px;--sd-modal-modal-confirm-title-typography-line-height:30px;--sd-modal-modal-confirm-title-typography-text-decoration:none;--sd-modal-modal-confirm-button-gap:8px;--sd-modal-modal-confirm-message-color:#222222;--sd-modal-modal-confirm-positive-icon:#0075FF;--sd-modal-modal-confirm-negative-icon:#E30000;--sd-modal-modal-bg:#FFFFFF;--sd-modal-modal-action-header-padding-x:24px;--sd-modal-modal-action-header-padding-y:20px;--sd-modal-modal-action-header-gap:12px;--sd-modal-modal-action-title-color:#033F59;--sd-modal-modal-action-title-typography-font-family:Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif;--sd-modal-modal-action-title-typography-font-weight:700;--sd-modal-modal-action-title-typography-font-size:16px;--sd-modal-modal-action-title-typography-text-decoration:none;--sd-modal-modal-action-title-typography-line-height:26px;--sd-modal-modal-action-body-padding-x:20px;--sd-modal-modal-action-body-padding-bottom:20px;--sd-modal-modal-action-footer-padding-x:20px;--sd-modal-modal-action-footer-padding-y:8px;--sd-modal-modal-action-footer-gap:16px;--sd-modal-modal-action-footer-bg:#F6F6F6;--sd-modal-modal-action-footer-border:#E1E1E1}.bg-primary{background-color:var(--color-primary, #051d36)}.bg-secondary{background-color:var(--color-secondary, #555555)}.bg-accent{background-color:var(--color-accent, #9c27b0)}.bg-positive{background-color:var(--color-positive, #0075ff)}.bg-negative{background-color:var(--color-negative, #e30000)}.bg-info{background-color:var(--color-info, #00cd52)}.bg-warning{background-color:var(--color-warning, #f2c037)}.bg-red_99{background-color:var(--color-red_99, #220000)}.bg-red_95{background-color:var(--color-red_95, #440000)}.bg-red_90{background-color:var(--color-red_90, #5E0000)}.bg-red_85{background-color:var(--color-red_85, #820000)}.bg-red_80{background-color:var(--color-red_80, #AD0000)}.bg-red_75{background-color:var(--color-red_75, #E30000)}.bg-red_70{background-color:var(--color-red_70, #FB4444)}.bg-red_60{background-color:var(--color-red_60, #FF7C7C)}.bg-red_45{background-color:var(--color-red_45, #FFB5B5)}.bg-red_30{background-color:var(--color-red_30, #FFD3D3)}.bg-red_20{background-color:var(--color-red_20, #FCE6E6)}.bg-red_15{background-color:var(--color-red_15, #FCEFEF)}.bg-caution_bg{background-color:var(--color-caution_bg, #FEF1F1)}.bg-caution_icon{background-color:var(--color-caution_icon, #fd9595)}.bg-orange_99{background-color:var(--color-orange_99, #2F1100)}.bg-orange_95{background-color:var(--color-orange_95, #4D1B00)}.bg-orange_90{background-color:var(--color-orange_90, #752A00)}.bg-orange_85{background-color:var(--color-orange_85, #9B3700)}.bg-orange_75{background-color:var(--color-orange_75, #CE4900)}.bg-orange_65{background-color:var(--color-orange_65, #FF6B00)}.bg-orange_60{background-color:var(--color-orange_60, #FF7F22)}.bg-orange_55{background-color:var(--color-orange_55, #FFA452)}.bg-orange_45{background-color:var(--color-orange_45, #FFBC81)}.bg-orange_35{background-color:var(--color-orange_35, #FFD5AF)}.bg-orange_20{background-color:var(--color-orange_20, #FFEAD7)}.bg-orange_10{background-color:var(--color-orange_10, #FEF1EA)}.bg-header_alert{background-color:var(--color-header_alert, #FF7A00)}.bg-yellow_95{background-color:var(--color-yellow_95, #322700)}.bg-yellow_90{background-color:var(--color-yellow_90, #453702)}.bg-yellow_80{background-color:var(--color-yellow_80, #6C5602)}.bg-yellow_70{background-color:var(--color-yellow_70, #9C7A00)}.bg-yellow_60{background-color:var(--color-yellow_60, #C49900)}.bg-yellow_50{background-color:var(--color-yellow_50, #EBB800)}.bg-yellow_45{background-color:var(--color-yellow_45, #FFC700)}.bg-yellow_40{background-color:var(--color-yellow_40, #FFD643)}.bg-yellow_30{background-color:var(--color-yellow_30, #FEE17C)}.bg-yellow_25{background-color:var(--color-yellow_25, #FFE99E)}.bg-yellow_20{background-color:var(--color-yellow_20, #FEF1C4)}.bg-yellow_10{background-color:var(--color-yellow_10, #FFF7DD)}.bg-olive_95{background-color:var(--color-olive_95, #2C2C00)}.bg-olive_90{background-color:var(--color-olive_90, #454500)}.bg-olive_80{background-color:var(--color-olive_80, #636300)}.bg-olive_70{background-color:var(--color-olive_70, #838300)}.bg-olive_65{background-color:var(--color-olive_65, #A5A500)}.bg-olive_55{background-color:var(--color-olive_55, #C7C700)}.bg-olive_45{background-color:var(--color-olive_45, #DDDD12)}.bg-olive_30{background-color:var(--color-olive_30, #EEEE37)}.bg-olive_20{background-color:var(--color-olive_20, #F6F65F)}.bg-olive_15{background-color:var(--color-olive_15, #FAFAA1)}.bg-olive_10{background-color:var(--color-olive_10, #FBFBBF)}.bg-olive_05{background-color:var(--color-olive_05, #FEFED9)}.bg-green_99{background-color:var(--color-green_99, #001D0B)}.bg-green_95{background-color:var(--color-green_95, #003013)}.bg-green_90{background-color:var(--color-green_90, #00461C)}.bg-green_85{background-color:var(--color-green_85, #006629)}.bg-green_80{background-color:var(--color-green_80, #007B31)}.bg-green_75{background-color:var(--color-green_75, #00973C)}.bg-green_70{background-color:var(--color-green_70, #12B553)}.bg-green_65{background-color:var(--color-green_65, #2BCE6C)}.bg-green_55{background-color:var(--color-green_55, #6DE39C)}.bg-green_45{background-color:var(--color-green_45, #ACF4C9)}.bg-green_25{background-color:var(--color-green_25, #D4FAE3)}.bg-green_15{background-color:var(--color-green_15, #E8F9EF)}.bg-steelblue_99{background-color:var(--color-steelblue_99, #021a25)}.bg-steelblue_95{background-color:var(--color-steelblue_95, #02212f)}.bg-steelblue_90{background-color:var(--color-steelblue_90, #032d40)}.bg-steelblue_85{background-color:var(--color-steelblue_85, #033f59)}.bg-steelblue_80{background-color:var(--color-steelblue_80, #06587d)}.bg-steelblue_75{background-color:var(--color-steelblue_75, #066d9b)}.bg-steelblue_70{background-color:var(--color-steelblue_70, #128fc7)}.bg-steelblue_65{background-color:var(--color-steelblue_65, #229fd7)}.bg-steelblue_60{background-color:var(--color-steelblue_60, #50bff0)}.bg-steelblue_45{background-color:var(--color-steelblue_45, #a4e2fd)}.bg-steelblue_25{background-color:var(--color-steelblue_25, #d9f2fd)}.bg-steelblue_10{background-color:var(--color-steelblue_10, #ecf8fd)}.bg-oceanblue_99{background-color:var(--color-oceanblue_99, #011428)}.bg-oceanblue_95{background-color:var(--color-oceanblue_95, #03172d)}.bg-oceanblue_90{background-color:var(--color-oceanblue_90, #051d36)}.bg-oceanblue_85{background-color:var(--color-oceanblue_85, #07284a)}.bg-oceanblue_80{background-color:var(--color-oceanblue_80, #004177)}.bg-oceanblue_75{background-color:var(--color-oceanblue_75, #025497)}.bg-oceanblue_70{background-color:var(--color-oceanblue_70, #006ac1)}.bg-oceanblue_65{background-color:var(--color-oceanblue_65, #1f8ae1)}.bg-oceanblue_60{background-color:var(--color-oceanblue_60, #5cb0f3)}.bg-oceanblue_50{background-color:var(--color-oceanblue_50, #9cd1fc)}.bg-oceanblue_25{background-color:var(--color-oceanblue_25, #d5ebfe)}.bg-oceanblue_15{background-color:var(--color-oceanblue_15, #eaf5fe)}.bg-brilliantblue_99{background-color:var(--color-brilliantblue_99, #001226)}.bg-brilliantblue_95{background-color:var(--color-brilliantblue_95, #001b39)}.bg-brilliantblue_90{background-color:var(--color-brilliantblue_90, #002b5e)}.bg-brilliantblue_85{background-color:var(--color-brilliantblue_85, #004290)}.bg-brilliantblue_80{background-color:var(--color-brilliantblue_80, #005cc9)}.bg-brilliantblue_75{background-color:var(--color-brilliantblue_75, #0075ff)}.bg-brilliantblue_70{background-color:var(--color-brilliantblue_70, #2d8dff)}.bg-brilliantblue_60{background-color:var(--color-brilliantblue_60, #64abff)}.bg-brilliantblue_50{background-color:var(--color-brilliantblue_50, #93c4ff)}.bg-brilliantblue_40{background-color:var(--color-brilliantblue_40, #bbdaff)}.bg-brilliantblue_25{background-color:var(--color-brilliantblue_25, #d9eaff)}.bg-brilliantblue_20{background-color:var(--color-brilliantblue_20, #e6f1ff)}.bg-brilliantblue_10{background-color:var(--color-brilliantblue_10, #eff6ff)}.bg-brilliantblue_05{background-color:var(--color-brilliantblue_05, #f5faff)}.bg-grey_95{background-color:var(--color-grey_95, #222222)}.bg-grey_90{background-color:var(--color-grey_90, #333333)}.bg-grey_85{background-color:var(--color-grey_85, #444444)}.bg-grey_80{background-color:var(--color-grey_80, #555555)}.bg-grey_70{background-color:var(--color-grey_70, #737373)}.bg-grey_65{background-color:var(--color-grey_65, #888888)}.bg-grey_60{background-color:var(--color-grey_60, #999999)}.bg-grey_55{background-color:var(--color-grey_55, #aaaaaa)}.bg-grey_50{background-color:var(--color-grey_50, #bbbbbb)}.bg-grey_45{background-color:var(--color-grey_45, #cccccc)}.bg-grey_35{background-color:var(--color-grey_35, #D8D8D8)}.bg-grey_30{background-color:var(--color-grey_30, #e1e1e1)}.bg-grey_25{background-color:var(--color-grey_25, #E5E5E5)}.bg-grey_20{background-color:var(--color-grey_20, #eeeeee)}.bg-grey_10{background-color:var(--color-grey_10, #f6f6f6)}.bg-grey_05{background-color:var(--color-grey_05, #f9f9f9)}.bg-white{background-color:var(--color-white, #ffffff)}.bg-black{background-color:var(--color-black, #000000)}.text-primary{color:var(--color-primary, #051d36)}.text-secondary{color:var(--color-secondary, #555555)}.text-accent{color:var(--color-accent, #9c27b0)}.text-positive{color:var(--color-positive, #0075ff)}.text-negative{color:var(--color-negative, #e30000)}.text-info{color:var(--color-info, #00cd52)}.text-warning{color:var(--color-warning, #f2c037)}.text-red_99{color:var(--color-red_99, #220000)}.text-red_95{color:var(--color-red_95, #440000)}.text-red_90{color:var(--color-red_90, #5E0000)}.text-red_85{color:var(--color-red_85, #820000)}.text-red_80{color:var(--color-red_80, #AD0000)}.text-red_75{color:var(--color-red_75, #E30000)}.text-red_70{color:var(--color-red_70, #FB4444)}.text-red_60{color:var(--color-red_60, #FF7C7C)}.text-red_45{color:var(--color-red_45, #FFB5B5)}.text-red_30{color:var(--color-red_30, #FFD3D3)}.text-red_20{color:var(--color-red_20, #FCE6E6)}.text-red_15{color:var(--color-red_15, #FCEFEF)}.text-caution_bg{color:var(--color-caution_bg, #FEF1F1)}.text-caution_icon{color:var(--color-caution_icon, #fd9595)}.text-orange_99{color:var(--color-orange_99, #2F1100)}.text-orange_95{color:var(--color-orange_95, #4D1B00)}.text-orange_90{color:var(--color-orange_90, #752A00)}.text-orange_85{color:var(--color-orange_85, #9B3700)}.text-orange_75{color:var(--color-orange_75, #CE4900)}.text-orange_65{color:var(--color-orange_65, #FF6B00)}.text-orange_60{color:var(--color-orange_60, #FF7F22)}.text-orange_55{color:var(--color-orange_55, #FFA452)}.text-orange_45{color:var(--color-orange_45, #FFBC81)}.text-orange_35{color:var(--color-orange_35, #FFD5AF)}.text-orange_20{color:var(--color-orange_20, #FFEAD7)}.text-orange_10{color:var(--color-orange_10, #FEF1EA)}.text-header_alert{color:var(--color-header_alert, #FF7A00)}.text-yellow_95{color:var(--color-yellow_95, #322700)}.text-yellow_90{color:var(--color-yellow_90, #453702)}.text-yellow_80{color:var(--color-yellow_80, #6C5602)}.text-yellow_70{color:var(--color-yellow_70, #9C7A00)}.text-yellow_60{color:var(--color-yellow_60, #C49900)}.text-yellow_50{color:var(--color-yellow_50, #EBB800)}.text-yellow_45{color:var(--color-yellow_45, #FFC700)}.text-yellow_40{color:var(--color-yellow_40, #FFD643)}.text-yellow_30{color:var(--color-yellow_30, #FEE17C)}.text-yellow_25{color:var(--color-yellow_25, #FFE99E)}.text-yellow_20{color:var(--color-yellow_20, #FEF1C4)}.text-yellow_10{color:var(--color-yellow_10, #FFF7DD)}.text-olive_95{color:var(--color-olive_95, #2C2C00)}.text-olive_90{color:var(--color-olive_90, #454500)}.text-olive_80{color:var(--color-olive_80, #636300)}.text-olive_70{color:var(--color-olive_70, #838300)}.text-olive_65{color:var(--color-olive_65, #A5A500)}.text-olive_55{color:var(--color-olive_55, #C7C700)}.text-olive_45{color:var(--color-olive_45, #DDDD12)}.text-olive_30{color:var(--color-olive_30, #EEEE37)}.text-olive_20{color:var(--color-olive_20, #F6F65F)}.text-olive_15{color:var(--color-olive_15, #FAFAA1)}.text-olive_10{color:var(--color-olive_10, #FBFBBF)}.text-olive_05{color:var(--color-olive_05, #FEFED9)}.text-green_99{color:var(--color-green_99, #001D0B)}.text-green_95{color:var(--color-green_95, #003013)}.text-green_90{color:var(--color-green_90, #00461C)}.text-green_85{color:var(--color-green_85, #006629)}.text-green_80{color:var(--color-green_80, #007B31)}.text-green_75{color:var(--color-green_75, #00973C)}.text-green_70{color:var(--color-green_70, #12B553)}.text-green_65{color:var(--color-green_65, #2BCE6C)}.text-green_55{color:var(--color-green_55, #6DE39C)}.text-green_45{color:var(--color-green_45, #ACF4C9)}.text-green_25{color:var(--color-green_25, #D4FAE3)}.text-green_15{color:var(--color-green_15, #E8F9EF)}.text-steelblue_99{color:var(--color-steelblue_99, #021a25)}.text-steelblue_95{color:var(--color-steelblue_95, #02212f)}.text-steelblue_90{color:var(--color-steelblue_90, #032d40)}.text-steelblue_85{color:var(--color-steelblue_85, #033f59)}.text-steelblue_80{color:var(--color-steelblue_80, #06587d)}.text-steelblue_75{color:var(--color-steelblue_75, #066d9b)}.text-steelblue_70{color:var(--color-steelblue_70, #128fc7)}.text-steelblue_65{color:var(--color-steelblue_65, #229fd7)}.text-steelblue_60{color:var(--color-steelblue_60, #50bff0)}.text-steelblue_45{color:var(--color-steelblue_45, #a4e2fd)}.text-steelblue_25{color:var(--color-steelblue_25, #d9f2fd)}.text-steelblue_10{color:var(--color-steelblue_10, #ecf8fd)}.text-oceanblue_99{color:var(--color-oceanblue_99, #011428)}.text-oceanblue_95{color:var(--color-oceanblue_95, #03172d)}.text-oceanblue_90{color:var(--color-oceanblue_90, #051d36)}.text-oceanblue_85{color:var(--color-oceanblue_85, #07284a)}.text-oceanblue_80{color:var(--color-oceanblue_80, #004177)}.text-oceanblue_75{color:var(--color-oceanblue_75, #025497)}.text-oceanblue_70{color:var(--color-oceanblue_70, #006ac1)}.text-oceanblue_65{color:var(--color-oceanblue_65, #1f8ae1)}.text-oceanblue_60{color:var(--color-oceanblue_60, #5cb0f3)}.text-oceanblue_50{color:var(--color-oceanblue_50, #9cd1fc)}.text-oceanblue_25{color:var(--color-oceanblue_25, #d5ebfe)}.text-oceanblue_15{color:var(--color-oceanblue_15, #eaf5fe)}.text-brilliantblue_99{color:var(--color-brilliantblue_99, #001226)}.text-brilliantblue_95{color:var(--color-brilliantblue_95, #001b39)}.text-brilliantblue_90{color:var(--color-brilliantblue_90, #002b5e)}.text-brilliantblue_85{color:var(--color-brilliantblue_85, #004290)}.text-brilliantblue_80{color:var(--color-brilliantblue_80, #005cc9)}.text-brilliantblue_75{color:var(--color-brilliantblue_75, #0075ff)}.text-brilliantblue_70{color:var(--color-brilliantblue_70, #2d8dff)}.text-brilliantblue_60{color:var(--color-brilliantblue_60, #64abff)}.text-brilliantblue_50{color:var(--color-brilliantblue_50, #93c4ff)}.text-brilliantblue_40{color:var(--color-brilliantblue_40, #bbdaff)}.text-brilliantblue_25{color:var(--color-brilliantblue_25, #d9eaff)}.text-brilliantblue_20{color:var(--color-brilliantblue_20, #e6f1ff)}.text-brilliantblue_10{color:var(--color-brilliantblue_10, #eff6ff)}.text-brilliantblue_05{color:var(--color-brilliantblue_05, #f5faff)}.text-grey_95{color:var(--color-grey_95, #222222)}.text-grey_90{color:var(--color-grey_90, #333333)}.text-grey_85{color:var(--color-grey_85, #444444)}.text-grey_80{color:var(--color-grey_80, #555555)}.text-grey_70{color:var(--color-grey_70, #737373)}.text-grey_65{color:var(--color-grey_65, #888888)}.text-grey_60{color:var(--color-grey_60, #999999)}.text-grey_55{color:var(--color-grey_55, #aaaaaa)}.text-grey_50{color:var(--color-grey_50, #bbbbbb)}.text-grey_45{color:var(--color-grey_45, #cccccc)}.text-grey_35{color:var(--color-grey_35, #D8D8D8)}.text-grey_30{color:var(--color-grey_30, #e1e1e1)}.text-grey_25{color:var(--color-grey_25, #E5E5E5)}.text-grey_20{color:var(--color-grey_20, #eeeeee)}.text-grey_10{color:var(--color-grey_10, #f6f6f6)}.text-grey_05{color:var(--color-grey_05, #f9f9f9)}.text-white{color:var(--color-white, #ffffff)}.text-black{color:var(--color-black, #000000)}*,*::before,*::after{box-sizing:border-box}*{scroll-behavior:smooth}*::-webkit-scrollbar{opacity:0;width:8px;background:#E5E5E5}*::-webkit-scrollbar:horizontal{height:8px}*::-webkit-scrollbar-thumb{height:80px;background-color:#CCCCCC;border-radius:4px}*::-webkit-scrollbar-track{background-color:#E5E5E5}html{-moz-text-size-adjust:none;-webkit-text-size-adjust:none;text-size-adjust:none}body,h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin-block-end:0}ul[role=list],ol[role=list]{list-style:none}body{min-height:100vh;line-height:1.5}h1,h2,h3,h4,button,input,label{line-height:1}h1,h2,h3,h4{text-wrap:balance}a:not([class]){text-decoration-skip-ink:auto;color:currentColor}img,picture{max-width:100%;display:block}input,button,textarea,select{font-size:inherit}:target{scroll-margin-block:5ex}button{background:none;border:none;cursor:pointer;padding:0;outline:0}button:focus{outline:0 !important}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,input:-webkit-autofill:active{-webkit-text-fill-color:#000;-webkit-box-shadow:0 0 0px 1000px #fff inset;box-shadow:0 0 0px 1000px #fff inset;transition:background-color 5000s ease-in-out 0s}input:autofill,input:autofill:hover,input:autofill:focus,input:autofill:active{-webkit-text-fill-color:#000;-webkit-box-shadow:0 0 0px 1000px #fff inset;box-shadow:0 0 0px 1000px #fff inset;transition:background-color 5000s ease-in-out 0s}:host{display:inline-block;height:fit-content;line-height:0}.text-center{text-align:center}.text-right{text-align:right}.text-left{text-align:left}input[type=text],input[type=number],input[type=password],input[type=email],input[type=tel],textarea{padding-block:0px;padding-inline:0px}.sd-hoverable:hover>.sd-focus-helper{background:currentColor;opacity:0.15}.sd-hoverable:hover>.sd-focus-helper:before{opacity:0.1}.sd-hoverable:hover>.sd-focus-helper:after{opacity:0.4}.sd-focus-helper{position:absolute;top:0;left:0;width:100%;height:100%;border-radius:inherit;opacity:0;transition:background-color 0.3s cubic-bezier(0.25, 0.8, 0.5, 1), opacity 0.4s cubic-bezier(0.25, 0.8, 0.5, 1)}.sd-focus-helper:before,.sd-focus-helper:after{content:\"\";position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;border-radius:inherit;transition:background-color 0.3s cubic-bezier(0.25, 0.8, 0.5, 1), opacity 0.6s cubic-bezier(0.25, 0.8, 0.5, 1)}.sd-focus-helper:before{background:#000000}.sd-focus-helper:after{background:#ffffff}";
136
136
 
137
137
  /*
138
138
  Stencil Hydrate Platform v4.43.2 | MIT Licensed | https://stenciljs.com
@@ -4837,7 +4837,7 @@ class SdActionModal {
4837
4837
  '--sd-action-modal-title-font-size': `${ACTION_MODAL_TITLE.fontSize}px`,
4838
4838
  '--sd-action-modal-title-line-height': `${ACTION_MODAL_TITLE.lineHeight}px`,
4839
4839
  };
4840
- return (hAsync("div", { key: 'b306dc102137e9b76faeeb19587dce32d670163c', class: "sd-action-modal", style: cssVars }, hAsync("header", { key: 'e6b9699e9943d1f4001b4cd23f99975474c3e86e', class: "sd-action-modal__header" }, hAsync("h2", { key: '4d30b98d01a191e4bdc3fb1ff772483dfd3a8397', class: "sd-action-modal__title" }, this.modalTitle), hAsync("div", { key: 'f1083fe5c2643d09dc4bad4c50064ffda2db65ab', class: "sd-action-modal__header-sub" }, hAsync("slot", { key: 'a11c9a13ae11569226ac11fb4be6b782667defeb', name: "header-sub-title" })), hAsync("sd-ghost-button", { key: 'e8a76ecd5d1388a79ac19705d634f40c05e6c2fc', class: "sd-action-modal__close", icon: "close", ariaLabel: "close", onClick: () => this.close.emit() })), hAsync("div", { key: 'eb615713a8fbfdd1c40c805e3146fc8341686c72', class: "sd-action-modal__body" }, hAsync("slot", { key: 'd56a3331bc2e94748f150c11dba9e5bd1fad8043', name: "body" })), hAsync("footer", { key: 'd80ad9de537846b01f79588e363bb40e76c64fba', class: "sd-action-modal__footer" }, hAsync("div", { key: '49187df32a64d18b2492995a80ce49df02e9303e', class: "sd-action-modal__footer-sub" }, hAsync("slot", { key: 'd73e66710152c0718d7cab6bbcbd1ab2cebf1f87', name: "bottom-sub-content" })), hAsync("sd-button-v2", { key: '03d2f2a0fa6960983c46e47460f623dfd42811a3', ...DEFAULT_BUTTON_PROPS, ...this.buttonProps, onSdClick: () => this.ok.emit() }))));
4840
+ return (hAsync("div", { key: 'a49f78c558f14d89b18569388c9f63899b2d8584', class: "sd-action-modal", style: cssVars }, hAsync("header", { key: 'b03ed5b4eed300a78711eae2b7491e46340c4f61', class: "sd-action-modal__header" }, hAsync("h2", { key: '05a21b4f9fb2be6149c46de6f3a2f1ea6e33e95d', class: "sd-action-modal__title" }, this.modalTitle), hAsync("div", { key: '641524d22a46c5da6c8ed1265a4f6bf311be4603', class: "sd-action-modal__header-sub" }, hAsync("slot", { key: 'b45fc41c0d895beadcd67314d56fb36f361f24b6', name: "header-sub-title" })), hAsync("sd-ghost-button", { key: 'aaeb806bab195f18cfa9c7af87c47ca8e63a6716', class: "sd-action-modal__close", icon: "close", ariaLabel: "close", onClick: () => this.close.emit() })), hAsync("div", { key: '248af7a4bb179a9077a54534cb7c590eacde29fb', class: "sd-action-modal__body" }, hAsync("slot", { key: 'af91ab4ad191c29ed3e72e05e6265d48781ed2e9', name: "body" })), hAsync("footer", { key: '938ccf2283d70a152c598c03e62af8ff17192f74', class: "sd-action-modal__footer" }, hAsync("div", { key: '28e18ee211a61cec38259459d9deb3a80e99d4ff', class: "sd-action-modal__footer-sub" }, hAsync("slot", { key: 'e3f2cafeb9978cb46f94c09692a924544cf1630a', name: "bottom-sub-content" })), hAsync("sd-button-v2", { key: '765bc516e06d757c728f5d68b371c07061be61e0', ...DEFAULT_BUTTON_PROPS, ...this.buttonProps, onSdClick: () => this.ok.emit() }))));
4841
4841
  }
4842
4842
  static get style() { return sdActionModalCss(); }
4843
4843
  static get cmpMeta() { return {
@@ -4888,7 +4888,7 @@ class SdBadge {
4888
4888
  label = '';
4889
4889
  render() {
4890
4890
  const resolvedColor = BADGE_COLOR_MAP[this.color] ?? BADGE_COLOR_MAP.blue;
4891
- return (hAsync("div", { key: '7535760a065f5b0afa35d58c6f3017cacb31f507', class: "sd-badge", style: { '--sd-badge-color': resolvedColor } }, hAsync("div", { key: '1a42bf60039e469b0676b0266f9cbde168e8c27e', class: "sd-badge__dot" }), hAsync("div", { key: '2296c4187b5222849dbe0472d19669376b53350f', class: "sd-badge__label" }, this.label)));
4891
+ return (hAsync("div", { key: 'ba4351faddf17a489fd4419e265d11279734a475', class: "sd-badge", style: { '--sd-badge-color': resolvedColor } }, hAsync("div", { key: '84fbfecbd5ae7fd68941817891b91b68aee1d9e2', class: "sd-badge__dot" }), hAsync("div", { key: 'ef53189b37a82d8daa3cce3b6cd9052d8352c8e7', class: "sd-badge__label" }, this.label)));
4892
4892
  }
4893
4893
  static get style() { return sdBadgeCss(); }
4894
4894
  static get cmpMeta() { return {
@@ -4916,7 +4916,7 @@ let nanoid = (size = 21) => {
4916
4916
  return id
4917
4917
  };
4918
4918
 
4919
- const input = {
4919
+ const textinput = {
4920
4920
  sm: {
4921
4921
  height: "28",
4922
4922
  paddingX: "12",
@@ -4957,11 +4957,11 @@ const input = {
4957
4957
  }
4958
4958
  };
4959
4959
  var inputTokens = {
4960
- input: input
4960
+ textinput: textinput
4961
4961
  };
4962
4962
 
4963
- const sm$3 = inputTokens.input.sm;
4964
- const md$3 = inputTokens.input.md;
4963
+ const sm$3 = inputTokens.textinput.sm;
4964
+ const md$3 = inputTokens.textinput.md;
4965
4965
  const BARCODE_INPUT_SIZE_MAP = {
4966
4966
  sm: {
4967
4967
  height: sm$3.height,
@@ -4983,9 +4983,9 @@ const BARCODE_INPUT_SIZE_MAP = {
4983
4983
  },
4984
4984
  };
4985
4985
  const BARCODE_INPUT_COLORS = {
4986
- bg: inputTokens.input.bg,
4987
- text: inputTokens.input.text,
4988
- icon: inputTokens.input.icon,
4986
+ bg: inputTokens.textinput.bg,
4987
+ text: inputTokens.textinput.text,
4988
+ icon: inputTokens.textinput.icon,
4989
4989
  };
4990
4990
 
4991
4991
  const sdBarcodeInputCss = () => `sd-icon{display:inline-block;line-height:0}sd-icon .sd-icon--rotate-90{transform:rotate(90deg)}sd-icon .sd-icon--rotate-180{transform:rotate(180deg)}sd-icon .sd-icon--rotate-270{transform:rotate(270deg)}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 #fafaa1 inset;box-shadow:0 0 0px 1000px #fafaa1 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 #fafaa1 inset;box-shadow:0 0 0px 1000px #fafaa1 inset;transition:background-color 5000s ease-in-out 0s}sd-barcode-input{display:inline-flex}sd-barcode-input .sd-barcode-input__content{width:100%;height:100%;display:flex;flex-flow:row nowrap;align-items:center;color:var(--sd-barcode-input-text-color);font-size:var(--sd-barcode-input-font-size);line-height:var(--sd-barcode-input-line-height);font-weight:var(--sd-barcode-input-font-weight);padding:0 var(--sd-barcode-input-padding-x);gap:var(--sd-barcode-input-gap)}sd-barcode-input .sd-barcode-input__content .sd-barcode-input__native{width:100%;height:100%;border:none;outline:none;background:transparent;font-size:inherit;line-height:inherit;font-weight:inherit;color:inherit}sd-barcode-input .sd-barcode-input__content .sd-barcode-input__native[disabled]{cursor:not-allowed;color:var(--sd-barcode-input-disabled-color)}sd-barcode-input .sd-barcode-input__content .sd-barcode-input__native::placeholder{color:var(--sd-barcode-input-placeholder-color)}sd-barcode-input .sd-barcode-input__content .sd-barcode-input__clear-icon{flex-shrink:0}sd-barcode-input .sd-barcode-input__content .sd-barcode-input__native[disabled]~.sd-barcode-input__clear-icon{cursor:not-allowed;pointer-events:none}`;
@@ -5095,7 +5095,7 @@ class SdBarcodeInput {
5095
5095
  '--sd-system-radius-field-sm': `${sizeTokens.radius}px`,
5096
5096
  '--sd-system-color-field-bg-default': BARCODE_INPUT_COLORS.bg.barcode,
5097
5097
  };
5098
- return (hAsync("sd-field", { key: '9987023d28947334836b6b0b0c5f493eab91c59c', name: this.name, label: this.label, addonLabel: this.addonLabel, hint: this.hint, errorMessage: this.errorMessage, width: this.width, rules: this.rules, error: this.error, disabled: this.disabled, focused: this.focused, hovered: this.hovered, status: this.status, icon: this.icon, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el), onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false), style: cssVars }, hAsync("label", { key: 'a3b70f106f4d05a82b9da0fda0c1450fef5a4bd4', class: "sd-barcode-input__content" }, hAsync("slot", { key: '5c6aa9b488ca414d191b538bca0bbcc1aca6cf75', name: "prefix" }), hAsync("input", { key: '94133a24b1ba1e691584a27c5ddd13ded76ff462', 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: '04d64be5bd466b68423e44caab9cc513610bef92', name: "suffix" }), this.clearable && this.internalValue && (hAsync("sd-ghost-button", { key: '052388d8e79b249752a6668db221af140b3eea1f', icon: "close", ariaLabel: "close", size: "xxs", disabled: this.disabled, class: "sd-barcode-input__clear-icon", onClick: async () => {
5098
+ return (hAsync("sd-field", { key: 'b9f59f804f48888086fb49e46e4bcbacaff57205', name: this.name, label: this.label, addonLabel: this.addonLabel, hint: this.hint, errorMessage: this.errorMessage, width: this.width, rules: this.rules, error: this.error, disabled: this.disabled, focused: this.focused, hovered: this.hovered, status: this.status, icon: this.icon, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el), onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false), style: cssVars }, hAsync("label", { key: 'eebe928e88c814817d172688af675b753db96d0b', class: "sd-barcode-input__content" }, hAsync("slot", { key: '5046c4bf4010d4ccbbb91d42e1c83f28674c19e5', name: "prefix" }), hAsync("input", { key: '0887d9587d834624e6a756299d00383a3ffd44b5', 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: 'c5140b914ea57234ed6babf26265cc7556f48e15', name: "suffix" }), this.clearable && this.internalValue && (hAsync("sd-ghost-button", { key: '45862d80442c826152bf5a8ac01e598a1222de42', icon: "close", ariaLabel: "close", size: "xxs", disabled: this.disabled, class: "sd-barcode-input__clear-icon", onClick: async () => {
5099
5099
  if (this.disabled)
5100
5100
  return;
5101
5101
  this.internalValue = '';
@@ -5150,110 +5150,91 @@ class SdBarcodeInput {
5150
5150
  }; }
5151
5151
  }
5152
5152
 
5153
- const xs = {
5154
- icon: "12"
5155
- };
5156
- const sm$2 = {
5157
- icon: "16"
5158
- };
5159
- const md$2 = {
5160
- icon: "20"
5161
- };
5162
- const lg = {
5163
- icon: "24"
5164
- };
5165
- const border = {
5166
- disabled: "#CCCCCC"
5167
- };
5168
- const dropdown = {
5153
+ const button = {
5169
5154
  xs: {
5170
- minWidth: "60"
5155
+ icon: "12"
5171
5156
  },
5172
5157
  sm: {
5173
- minWidth: "76"
5158
+ icon: "16"
5174
5159
  },
5175
5160
  md: {
5176
- minWidth: "106"
5177
- }
5178
- };
5179
- const bg = {
5180
- disabled: "#E1E1E1"
5181
- };
5182
- const text = {
5183
- disabled: "#888888"
5184
- };
5185
- const brand = {
5186
- strong: {
5187
- bg: {
5188
- "default": "#025497",
5189
- hover: "#004177"
5190
- },
5191
- content: "#FFFFFF",
5192
- dropdown: {
5193
- divider: "#006AC1"
5194
- }
5161
+ icon: "20"
5195
5162
  },
5196
- subtle: {
5197
- bg: {
5198
- "default": "#1F8AE1",
5199
- hover: "#006AC1"
5200
- },
5201
- content: "#FFFFFF",
5202
- dropdown: {
5203
- divider: "#5CB0F3"
5204
- }
5163
+ lg: {
5164
+ icon: "24"
5205
5165
  },
5206
- outline: {
5207
- bg: {
5208
- "default": "#FFFFFF",
5209
- hover: "#EAF5FE"
5210
- },
5211
- border: "#025497",
5212
- content: "#025497"
5213
- }
5214
- };
5215
- const neutral = {
5216
- outline: {
5217
- bg: {
5218
- "default": "#FFFFFF",
5219
- hover: "#EEEEEE"
5166
+ border: {
5167
+ disabled: "#CCCCCC"
5168
+ },
5169
+ bg: {
5170
+ disabled: "#E1E1E1"
5171
+ },
5172
+ text: {
5173
+ disabled: "#888888"
5174
+ },
5175
+ brand: {
5176
+ strong: {
5177
+ bg: {
5178
+ "default": "#025497",
5179
+ hover: "#004177"
5180
+ },
5181
+ content: "#FFFFFF",
5182
+ dropdown: {
5183
+ divider: "#006AC1"
5184
+ }
5220
5185
  },
5221
- border: "#888888",
5222
- content: "#222222"
5223
- }
5224
- };
5225
- const danger = {
5226
- strong: {
5227
- bg: {
5228
- "default": "#E30000",
5229
- hover: "#AD0000"
5186
+ subtle: {
5187
+ bg: {
5188
+ "default": "#1F8AE1",
5189
+ hover: "#006AC1"
5190
+ },
5191
+ content: "#FFFFFF",
5192
+ dropdown: {
5193
+ divider: "#5CB0F3"
5194
+ }
5230
5195
  },
5231
- content: "#FFFFFF",
5232
- dropdown: {
5233
- divider: "#FF7C7C"
5196
+ outline: {
5197
+ bg: {
5198
+ "default": "#FFFFFF",
5199
+ hover: "#EAF5FE"
5200
+ },
5201
+ border: "#025497",
5202
+ content: "#025497"
5234
5203
  }
5235
5204
  },
5236
- outline: {
5237
- bg: {
5238
- "default": "#FFFFFF",
5239
- hover: "#FCEFEF"
5205
+ neutral: {
5206
+ outline: {
5207
+ bg: {
5208
+ "default": "#FFFFFF",
5209
+ hover: "#EEEEEE"
5210
+ },
5211
+ border: "#888888",
5212
+ content: "#222222"
5213
+ }
5214
+ },
5215
+ danger: {
5216
+ strong: {
5217
+ bg: {
5218
+ "default": "#E30000",
5219
+ hover: "#AD0000"
5220
+ },
5221
+ content: "#FFFFFF",
5222
+ dropdown: {
5223
+ divider: "#FF7C7C"
5224
+ }
5240
5225
  },
5241
- border: "#E30000",
5242
- content: "#E30000"
5226
+ outline: {
5227
+ bg: {
5228
+ "default": "#FFFFFF",
5229
+ hover: "#FCEFEF"
5230
+ },
5231
+ border: "#E30000",
5232
+ content: "#E30000"
5233
+ }
5243
5234
  }
5244
5235
  };
5245
5236
  var buttonTokens = {
5246
- xs: xs,
5247
- sm: sm$2,
5248
- md: md$2,
5249
- lg: lg,
5250
- border: border,
5251
- dropdown: dropdown,
5252
- bg: bg,
5253
- text: text,
5254
- brand: brand,
5255
- neutral: neutral,
5256
- danger: danger
5237
+ button: button
5257
5238
  };
5258
5239
 
5259
5240
  const primary = "#051D36";
@@ -5523,13 +5504,13 @@ function resolveColor(input, fallback = '#025497') {
5523
5504
  return mapped || input;
5524
5505
  }
5525
5506
 
5526
- const sdButtonCss = () => `sd-button{display:inline-flex;width:fit-content;height:fit-content}.sd-button{--sd-button-height:34px;--sd-button-padding-x:20px;--sd-button-gap:8px;--sd-button-font-family:inherit;--sd-button-font-size:16px;--sd-button-font-weight:500;--sd-button-text-decoration:none;--sd-button-label-min-width:auto;--sd-button-icon-only-size:var(--sd-button-height);text-decoration:none;cursor:pointer;border-radius:var(--sd-button-radius-default, 4px);transition:all 0.2s ease-in-out;position:relative;overflow:hidden;white-space:nowrap;-webkit-user-select:none;user-select:none;box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;border:none;padding:0 var(--sd-button-padding-x);min-width:var(--sd-button-min-width, auto);min-height:var(--sd-button-height);font-family:var(--sd-button-font-family);font-size:var(--sd-button-font-size);font-weight:var(--sd-button-font-weight);text-decoration:var(--sd-button-text-decoration)}.sd-button--xs{--sd-button-height:var(--sd-button-xs-height, 24px);--sd-button-padding-x:var(--sd-button-xs-padding-x, 8px);--sd-button-gap:var(--sd-button-xs-gap, 4px);--sd-button-font-family:var(--sd-button-xs-typography-font-family, inherit);--sd-button-font-size:var(--sd-button-xs-typography-font-size, 12px);--sd-button-font-weight:var(--sd-button-xs-typography-font-weight, 500);--sd-button-text-decoration:var(--sd-button-xs-typography-text-decoration, none);--sd-button-label-min-width:var(--sd-button-label-xs-min-width, auto);--sd-button-icon-only-size:var(--sd-button-icon-only-xs-width, var(--sd-button-height));line-height:20px}.sd-button--sm{--sd-button-height:var(--sd-button-sm-height, 28px);--sd-button-padding-x:var(--sd-button-sm-padding-x, 12px);--sd-button-gap:var(--sd-button-sm-gap, 6px);--sd-button-font-family:var(--sd-button-sm-typography-font-family, inherit);--sd-button-font-size:var(--sd-button-sm-typography-font-size, 12px);--sd-button-font-weight:var(--sd-button-sm-typography-font-weight, 500);--sd-button-text-decoration:var(--sd-button-sm-typography-text-decoration, none);--sd-button-label-min-width:var(--sd-button-label-sm-min-width, auto);--sd-button-icon-only-size:var(--sd-button-icon-only-sm-width, var(--sd-button-height));line-height:20px}.sd-button--md{--sd-button-height:var(--sd-button-md-height, 34px);--sd-button-padding-x:var(--sd-button-md-padding-x, 20px);--sd-button-gap:var(--sd-button-md-gap, 8px);--sd-button-font-family:var(--sd-button-md-typography-font-family, inherit);--sd-button-font-size:var(--sd-button-md-typography-font-size, 16px);--sd-button-font-weight:var(--sd-button-md-typography-font-weight, 500);--sd-button-text-decoration:var(--sd-button-md-typography-text-decoration, none);--sd-button-label-min-width:var(--sd-button-label-md-min-width, auto);--sd-button-icon-only-size:var(--sd-button-icon-only-md-width, var(--sd-button-height));line-height:26px}.sd-button--lg{--sd-button-height:var(--sd-button-lg-height, 62px);--sd-button-padding-x:var(--sd-button-lg-padding-x, 28px);--sd-button-gap:var(--sd-button-lg-gap, 12px);--sd-button-font-family:var(--sd-button-lg-typography-font-family, inherit);--sd-button-font-size:var(--sd-button-lg-typography-font-size, 18px);--sd-button-font-weight:var(--sd-button-lg-typography-font-weight, 500);--sd-button-text-decoration:var(--sd-button-lg-typography-text-decoration, none);--sd-button-label-min-width:var(--sd-button-label-lg-min-width, auto);--sd-button-icon-only-size:var(--sd-button-icon-only-lg-width, var(--sd-button-height));line-height:30px}.sd-button--has-label{--sd-button-min-width:var(--sd-button-label-min-width, auto)}.sd-button--primary{background-color:var(--button-color);color:white;transition:filter 0.2s ease}.sd-button--primary::before{content:"";position:absolute;inset:0;background:#000000;opacity:0;transition:opacity 0.2s ease;z-index:0}.sd-button--primary:hover:not(.sd-button--disabled):not(.sd-button--loading)::before{opacity:0.25}.sd-button--outline{background:white;border:var(--sd-button-border-width-default, 1px) solid var(--button-color);color:var(--button-color)}.sd-button--outline::before{content:"";position:absolute;inset:0;background:var(--button-color);opacity:0;transition:opacity 0.2s ease;z-index:0}.sd-button--outline:hover:not(.sd-button--disabled):not(.sd-button--loading)::before{opacity:0.15}.sd-button--outline .sd-button__content{position:relative;z-index:1}.sd-button--ghost{background-color:transparent;color:var(--button-color);border-color:transparent}.sd-button--ghost::before{content:"";position:absolute;inset:0;background:var(--button-color);opacity:0;transition:opacity 0.2s ease;z-index:0}.sd-button--ghost:hover:not(.sd-button--disabled):not(.sd-button--loading)::before{opacity:0.15}.sd-button--ghost .sd-button__content{position:relative;z-index:1}.sd-button--disabled{border:var(--sd-button-border-width-default, 1px) solid var(--sd-button-border-disabled, #CCCCCC);background:var(--sd-button-bg-disabled, #E1E1E1);color:var(--sd-button-content-disabled, #888888);cursor:not-allowed !important}.sd-button--icon-only{padding:0;width:var(--sd-button-icon-only-size, var(--sd-button-height));min-width:var(--sd-button-icon-only-size, var(--sd-button-height));height:var(--sd-button-icon-only-size, var(--sd-button-height))}.sd-button--no-hover:hover::before{opacity:0 !important}.sd-button .sd-button__content{display:inline-flex;align-items:center;justify-content:center;gap:var(--sd-button-gap);z-index:1;font-weight:inherit}`;
5507
+ const sdButtonCss = () => `sd-button{display:inline-flex;width:fit-content;height:fit-content}.sd-button{--sd-button-height:34px;--sd-button-padding-x:20px;--sd-button-gap:8px;--sd-button-font-family:inherit;--sd-button-font-size:16px;--sd-button-font-weight:500;--sd-button-text-decoration:none;--sd-button-label-min-width:auto;--sd-button-icon-only-size:var(--sd-button-height);text-decoration:none;cursor:pointer;border-radius:var(--sd-button-radius-sm, 4px);transition:all 0.2s ease-in-out;position:relative;overflow:hidden;white-space:nowrap;-webkit-user-select:none;user-select:none;box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;border:none;padding:0 var(--sd-button-padding-x);min-width:var(--sd-button-min-width, auto);min-height:var(--sd-button-height);font-family:var(--sd-button-font-family);font-size:var(--sd-button-font-size);font-weight:var(--sd-button-font-weight);text-decoration:var(--sd-button-text-decoration)}.sd-button--xs{--sd-button-height:var(--sd-button-xs-height, 24px);--sd-button-padding-x:var(--sd-button-xs-padding-x, 8px);--sd-button-gap:var(--sd-button-xs-gap, 4px);--sd-button-font-family:var(--sd-button-xs-typography-font-family, inherit);--sd-button-font-size:var(--sd-button-xs-typography-font-size, 12px);--sd-button-font-weight:var(--sd-button-xs-typography-font-weight, 500);--sd-button-text-decoration:var(--sd-button-xs-typography-text-decoration, none);--sd-button-label-min-width:var(--sd-button-label-xs-min-width, auto);--sd-button-icon-only-size:var(--sd-button-icon-only-xs-width, var(--sd-button-height));line-height:20px}.sd-button--sm{--sd-button-height:var(--sd-button-sm-height, 28px);--sd-button-padding-x:var(--sd-button-sm-padding-x, 12px);--sd-button-gap:var(--sd-button-sm-gap, 6px);--sd-button-font-family:var(--sd-button-sm-typography-font-family, inherit);--sd-button-font-size:var(--sd-button-sm-typography-font-size, 12px);--sd-button-font-weight:var(--sd-button-sm-typography-font-weight, 500);--sd-button-text-decoration:var(--sd-button-sm-typography-text-decoration, none);--sd-button-label-min-width:var(--sd-button-label-sm-min-width, auto);--sd-button-icon-only-size:var(--sd-button-icon-only-sm-width, var(--sd-button-height));line-height:20px}.sd-button--md{--sd-button-height:var(--sd-button-md-height, 34px);--sd-button-padding-x:var(--sd-button-md-padding-x, 20px);--sd-button-gap:var(--sd-button-md-gap, 8px);--sd-button-font-family:var(--sd-button-md-typography-font-family, inherit);--sd-button-font-size:var(--sd-button-md-typography-font-size, 16px);--sd-button-font-weight:var(--sd-button-md-typography-font-weight, 500);--sd-button-text-decoration:var(--sd-button-md-typography-text-decoration, none);--sd-button-label-min-width:var(--sd-button-label-md-min-width, auto);--sd-button-icon-only-size:var(--sd-button-icon-only-md-width, var(--sd-button-height));line-height:26px}.sd-button--lg{--sd-button-height:var(--sd-button-lg-height, 62px);--sd-button-padding-x:var(--sd-button-lg-padding-x, 28px);--sd-button-gap:var(--sd-button-lg-gap, 12px);--sd-button-font-family:var(--sd-button-lg-typography-font-family, inherit);--sd-button-font-size:var(--sd-button-lg-typography-font-size, 18px);--sd-button-font-weight:var(--sd-button-lg-typography-font-weight, 500);--sd-button-text-decoration:var(--sd-button-lg-typography-text-decoration, none);--sd-button-label-min-width:var(--sd-button-label-lg-min-width, auto);--sd-button-icon-only-size:var(--sd-button-icon-only-lg-width, var(--sd-button-height));line-height:30px}.sd-button--has-label{--sd-button-min-width:var(--sd-button-label-min-width, auto)}.sd-button--primary{background-color:var(--button-color);color:white;transition:filter 0.2s ease}.sd-button--primary::before{content:"";position:absolute;inset:0;background:#000000;opacity:0;transition:opacity 0.2s ease;z-index:0}.sd-button--primary:hover:not(.sd-button--disabled):not(.sd-button--loading)::before{opacity:0.25}.sd-button--outline{background:white;border:var(--sd-button-border-width-default, 1px) solid var(--button-color);color:var(--button-color)}.sd-button--outline::before{content:"";position:absolute;inset:0;background:var(--button-color);opacity:0;transition:opacity 0.2s ease;z-index:0}.sd-button--outline:hover:not(.sd-button--disabled):not(.sd-button--loading)::before{opacity:0.15}.sd-button--outline .sd-button__content{position:relative;z-index:1}.sd-button--ghost{background-color:transparent;color:var(--button-color);border-color:transparent}.sd-button--ghost::before{content:"";position:absolute;inset:0;background:var(--button-color);opacity:0;transition:opacity 0.2s ease;z-index:0}.sd-button--ghost:hover:not(.sd-button--disabled):not(.sd-button--loading)::before{opacity:0.15}.sd-button--ghost .sd-button__content{position:relative;z-index:1}.sd-button--disabled{border:var(--sd-button-border-width-default, 1px) solid var(--sd-button-border-disabled, #CCCCCC);background:var(--sd-button-bg-disabled, #E1E1E1);color:var(--sd-button-content-disabled, #888888);cursor:not-allowed !important}.sd-button--icon-only{padding:0;width:var(--sd-button-icon-only-size, var(--sd-button-height));min-width:var(--sd-button-icon-only-size, var(--sd-button-height));height:var(--sd-button-icon-only-size, var(--sd-button-height))}.sd-button--no-hover:hover::before{opacity:0 !important}.sd-button .sd-button__content{display:inline-flex;align-items:center;justify-content:center;gap:var(--sd-button-gap);z-index:1;font-weight:inherit}`;
5527
5508
 
5528
5509
  const ICON_SIZES = {
5529
- xs: Number(buttonTokens.xs.icon),
5530
- sm: Number(buttonTokens.sm.icon),
5531
- md: Number(buttonTokens.md.icon),
5532
- lg: Number(buttonTokens.lg.icon),
5510
+ xs: Number(buttonTokens.button.xs.icon),
5511
+ sm: Number(buttonTokens.button.sm.icon),
5512
+ md: Number(buttonTokens.button.md.icon),
5513
+ lg: Number(buttonTokens.button.lg.icon),
5533
5514
  };
5534
5515
  class SdButton {
5535
5516
  constructor(hostRef) {
@@ -5579,7 +5560,7 @@ class SdButton {
5579
5560
  const buttonClasses = this.getButtonClasses();
5580
5561
  // 유틸로 색상 키 -> HEX 매핑 (없으면 원본 그대로)
5581
5562
  const resolvedColor = resolveColor(this.color);
5582
- return (hAsync("button", { key: '079f66bd47a67c5e7cf95ff6b0b6a10aa84697d5', class: `${buttonClasses} ${this.sdClass}`, type: this.type, disabled: this.disabled, style: { '--button-color': resolvedColor }, onClick: this.handleClick }, hAsync("div", { key: '78c7b1b6b7828fe93c5a2752fbaf41b0b8c17cb2', class: "sd-button__content" }, this.icon && (hAsync("sd-icon", { key: '3f0afbeec89e0064f404d4967870516c87f35ac2', class: "sd-button__icon sd-button__icon--left", name: this.icon, size: this.iconSize ?? ICON_SIZES[this.size], color: this.iconColor ?? (this.variant === 'primary' ? '#fff' : resolvedColor) })), this.label && hAsync("div", { key: '319ac39031f4118489d88eec50eb590067422f87', class: "sd-button__label" }, this.label), this.iconRight && (hAsync("sd-icon", { key: '3e25e709e39ffbaceec0863c4fc5c54b8d34d5e1', class: "sd-button__icon sd-button__icon--right", name: this.iconRight, size: ICON_SIZES[this.size], color: this.variant === 'primary' ? '#fff' : resolvedColor })))));
5563
+ return (hAsync("button", { key: 'b18b0e46ec5a26e35fd0c782c975c1e3f94c7bea', class: `${buttonClasses} ${this.sdClass}`, type: this.type, disabled: this.disabled, style: { '--button-color': resolvedColor }, onClick: this.handleClick }, hAsync("div", { key: '3364b81ca9323e88b56ccde7783417416ecec4a0', class: "sd-button__content" }, this.icon && (hAsync("sd-icon", { key: 'dbe12d21483f50cab4e7284fc340e5b02ec6578d', class: "sd-button__icon sd-button__icon--left", name: this.icon, size: this.iconSize ?? ICON_SIZES[this.size], color: this.iconColor ?? (this.variant === 'primary' ? '#fff' : resolvedColor) })), this.label && hAsync("div", { key: '793b3ef70ff8fbe7a043baf3b00097ab0c3bb59b', class: "sd-button__label" }, this.label), this.iconRight && (hAsync("sd-icon", { key: '9b35739d4c18c38f9487c806d4becc312146bed4', class: "sd-button__icon sd-button__icon--right", name: this.iconRight, size: ICON_SIZES[this.size], color: this.variant === 'primary' ? '#fff' : resolvedColor })))));
5583
5564
  }
5584
5565
  static get style() { return sdButtonCss(); }
5585
5566
  static get cmpMeta() { return {
@@ -5607,12 +5588,12 @@ class SdButton {
5607
5588
 
5608
5589
  const BUTTON_FOCUS_RING_COLOR = '#0075FF';
5609
5590
  const PRESET_DEFAULT_COLORS = {
5610
- primary: buttonTokens.brand.strong.bg.default,
5611
- secondary: buttonTokens.brand.subtle.bg.default,
5612
- primary_outline: buttonTokens.brand.outline.bg.default,
5613
- neutral_outline: buttonTokens.neutral.outline.bg.default,
5614
- danger: buttonTokens.danger.strong.bg.default,
5615
- danger_outline: buttonTokens.danger.outline.bg.default,
5591
+ primary: buttonTokens.button.brand.strong.bg.default,
5592
+ secondary: buttonTokens.button.brand.subtle.bg.default,
5593
+ primary_outline: buttonTokens.button.brand.outline.bg.default,
5594
+ neutral_outline: buttonTokens.button.neutral.outline.bg.default,
5595
+ danger: buttonTokens.button.danger.strong.bg.default,
5596
+ danger_outline: buttonTokens.button.danger.outline.bg.default,
5616
5597
  };
5617
5598
  const BUTTON_CONFIG = {
5618
5599
  primary_xs: {
@@ -5737,40 +5718,40 @@ const BUTTON_CONFIG = {
5737
5718
  },
5738
5719
  };
5739
5720
  const BUTTON_ICON_SIZES = {
5740
- xs: Number(buttonTokens.xs.icon),
5741
- sm: Number(buttonTokens.sm.icon),
5742
- md: Number(buttonTokens.md.icon),
5743
- lg: Number(buttonTokens.lg.icon),
5721
+ xs: Number(buttonTokens.button.xs.icon),
5722
+ sm: Number(buttonTokens.button.sm.icon),
5723
+ md: Number(buttonTokens.button.md.icon),
5724
+ lg: Number(buttonTokens.button.lg.icon),
5744
5725
  };
5745
5726
  const PRESET_HOVER_BACKGROUNDS$1 = {
5746
- primary: buttonTokens.brand.strong.bg.hover,
5747
- secondary: buttonTokens.brand.subtle.bg.hover,
5748
- primary_outline: buttonTokens.brand.outline.bg.hover,
5749
- neutral_outline: buttonTokens.neutral.outline.bg.hover,
5750
- danger: buttonTokens.danger.strong.bg.hover,
5751
- danger_outline: buttonTokens.danger.outline.bg.hover,
5727
+ primary: buttonTokens.button.brand.strong.bg.hover,
5728
+ secondary: buttonTokens.button.brand.subtle.bg.hover,
5729
+ primary_outline: buttonTokens.button.brand.outline.bg.hover,
5730
+ neutral_outline: buttonTokens.button.neutral.outline.bg.hover,
5731
+ danger: buttonTokens.button.danger.strong.bg.hover,
5732
+ danger_outline: buttonTokens.button.danger.outline.bg.hover,
5752
5733
  };
5753
5734
  const PRESET_CONTENT_COLORS$1 = {
5754
- primary: buttonTokens.brand.strong.content,
5755
- secondary: buttonTokens.brand.subtle.content,
5756
- primary_outline: buttonTokens.brand.outline.content,
5757
- neutral_outline: buttonTokens.neutral.outline.content,
5758
- danger: buttonTokens.danger.strong.content,
5759
- danger_outline: buttonTokens.danger.outline.content,
5735
+ primary: buttonTokens.button.brand.strong.content,
5736
+ secondary: buttonTokens.button.brand.subtle.content,
5737
+ primary_outline: buttonTokens.button.brand.outline.content,
5738
+ neutral_outline: buttonTokens.button.neutral.outline.content,
5739
+ danger: buttonTokens.button.danger.strong.content,
5740
+ danger_outline: buttonTokens.button.danger.outline.content,
5760
5741
  };
5761
5742
  const PRESET_BORDER_COLORS$1 = {
5762
5743
  primary: 'transparent',
5763
5744
  secondary: 'transparent',
5764
- primary_outline: buttonTokens.brand.outline.border,
5765
- neutral_outline: buttonTokens.neutral.outline.border,
5745
+ primary_outline: buttonTokens.button.brand.outline.border,
5746
+ neutral_outline: buttonTokens.button.neutral.outline.border,
5766
5747
  danger: 'transparent',
5767
- danger_outline: buttonTokens.danger.outline.border,
5748
+ danger_outline: buttonTokens.button.danger.outline.border,
5768
5749
  };
5769
5750
  const SIZE_SUFFIX_PATTERN = /_(xs|sm|md|lg)$/;
5770
5751
  const isButtonV2Name = (value) => value in BUTTON_CONFIG;
5771
5752
  const getPresetName = (value) => value.replace(SIZE_SUFFIX_PATTERN, '');
5772
5753
 
5773
- const sdButtonV2Css = () => `sd-button-v2{display:inline-flex;width:fit-content;height:fit-content}.sd-button-v2{--sd-button-v2-height:34px;--sd-button-v2-padding-x:20px;--sd-button-v2-gap:8px;--sd-button-v2-font-family:inherit;--sd-button-v2-font-size:16px;--sd-button-v2-font-weight:500;--sd-button-v2-text-decoration:none;--sd-button-v2-label-min-width:auto;--sd-button-v2-icon-only-size:var(--sd-button-v2-height);--sd-button-v2-bg:$oceanblue_75;--sd-button-v2-bg-hover:$oceanblue_80;--sd-button-v2-border:transparent;--sd-button-v2-content:$white;--sd-button-v2-current-content:var(--sd-button-v2-content);--sd-button-v2-current-icon:var(--sd-button-v2-content);display:inline-flex;align-items:center;justify-content:center;min-height:var(--sd-button-v2-height);min-width:var(--sd-button-v2-min-width, auto);padding:0 var(--sd-button-v2-padding-x);border:var(--sd-button-border-width-default, 1px) solid var(--sd-button-v2-border);border-radius:var(--sd-button-radius-default, 4px);background:var(--sd-button-v2-bg);color:var(--sd-button-v2-current-content);cursor:pointer;box-sizing:border-box;font-family:var(--sd-button-v2-font-family);font-size:var(--sd-button-v2-font-size);font-weight:var(--sd-button-v2-font-weight);line-height:1;text-decoration:var(--sd-button-v2-text-decoration);transition:background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;white-space:nowrap;-webkit-user-select:none;user-select:none}.sd-button-v2:hover:not(.sd-button-v2--disabled){background:var(--sd-button-v2-bg-hover)}.sd-button-v2:focus-visible{outline:0;box-shadow:0 0 0 2px var(--sd-button-v2-accent)}.sd-button-v2--xs{--sd-button-v2-height:var(--sd-button-xs-height, 24px);--sd-button-v2-padding-x:var(--sd-button-xs-padding-x, 8px);--sd-button-v2-gap:var(--sd-button-xs-gap, 4px);--sd-button-v2-font-family:var(--sd-button-xs-typography-font-family, inherit);--sd-button-v2-font-size:var(--sd-button-xs-typography-font-size, 12px);--sd-button-v2-font-weight:var(--sd-button-xs-typography-font-weight, 500);--sd-button-v2-text-decoration:var(--sd-button-xs-typography-text-decoration, none);--sd-button-v2-label-min-width:var(--sd-button-label-xs-min-width, auto);--sd-button-v2-icon-only-size:var(--sd-button-icon-only-xs-width, var(--sd-button-v2-height))}.sd-button-v2--sm{--sd-button-v2-height:var(--sd-button-sm-height, 28px);--sd-button-v2-padding-x:var(--sd-button-sm-padding-x, 12px);--sd-button-v2-gap:var(--sd-button-sm-gap, 6px);--sd-button-v2-font-family:var(--sd-button-sm-typography-font-family, inherit);--sd-button-v2-font-size:var(--sd-button-sm-typography-font-size, 12px);--sd-button-v2-font-weight:var(--sd-button-sm-typography-font-weight, 500);--sd-button-v2-text-decoration:var(--sd-button-sm-typography-text-decoration, none);--sd-button-v2-label-min-width:var(--sd-button-label-sm-min-width, auto);--sd-button-v2-icon-only-size:var(--sd-button-icon-only-sm-width, var(--sd-button-v2-height))}.sd-button-v2--md{--sd-button-v2-height:var(--sd-button-md-height, 34px);--sd-button-v2-padding-x:var(--sd-button-md-padding-x, 20px);--sd-button-v2-gap:var(--sd-button-md-gap, 8px);--sd-button-v2-font-family:var(--sd-button-md-typography-font-family, inherit);--sd-button-v2-font-size:var(--sd-button-md-typography-font-size, 16px);--sd-button-v2-font-weight:var(--sd-button-md-typography-font-weight, 500);--sd-button-v2-text-decoration:var(--sd-button-md-typography-text-decoration, none);--sd-button-v2-label-min-width:var(--sd-button-label-md-min-width, auto);--sd-button-v2-icon-only-size:var(--sd-button-icon-only-md-width, var(--sd-button-v2-height))}.sd-button-v2--lg{--sd-button-v2-height:var(--sd-button-lg-height, 62px);--sd-button-v2-padding-x:var(--sd-button-lg-padding-x, 28px);--sd-button-v2-gap:var(--sd-button-lg-gap, 12px);--sd-button-v2-font-family:var(--sd-button-lg-typography-font-family, inherit);--sd-button-v2-font-size:var(--sd-button-lg-typography-font-size, 18px);--sd-button-v2-font-weight:var(--sd-button-lg-typography-font-weight, 500);--sd-button-v2-text-decoration:var(--sd-button-lg-typography-text-decoration, none);--sd-button-v2-label-min-width:var(--sd-button-label-lg-min-width, auto);--sd-button-v2-icon-only-size:var(--sd-button-icon-only-lg-width, var(--sd-button-v2-height))}.sd-button-v2--has-label{--sd-button-v2-min-width:var(--sd-button-v2-label-min-width, auto)}.sd-button-v2--icon-only{width:var(--sd-button-v2-icon-only-size, var(--sd-button-v2-height));min-width:var(--sd-button-v2-icon-only-size, var(--sd-button-v2-height));height:var(--sd-button-v2-icon-only-size, var(--sd-button-v2-height));padding:0}.sd-button-v2--icon-only .sd-button-v2__content{gap:0}.sd-button-v2--disabled{border-color:var(--sd-button-border-disabled, #CCCCCC);background:var(--sd-button-bg-disabled, #E1E1E1);--sd-button-v2-current-content:var(--sd-button-text-disabled, $grey_65);--sd-button-v2-current-icon:var(--sd-button-icon-disabled, $grey_75);cursor:not-allowed}.sd-button-v2 .sd-button-v2__content{display:inline-flex;align-items:center;justify-content:center;gap:var(--sd-button-v2-gap)}.sd-button-v2 .sd-button-v2__label{font:inherit}`;
5754
+ const sdButtonV2Css = () => `sd-button-v2{display:inline-flex;width:fit-content;height:fit-content}.sd-button-v2{--sd-button-v2-height:34px;--sd-button-v2-padding-x:20px;--sd-button-v2-gap:8px;--sd-button-v2-font-family:inherit;--sd-button-v2-font-size:16px;--sd-button-v2-font-weight:500;--sd-button-v2-text-decoration:none;--sd-button-v2-label-min-width:auto;--sd-button-v2-icon-only-size:var(--sd-button-v2-height);--sd-button-v2-bg:$oceanblue_75;--sd-button-v2-bg-hover:$oceanblue_80;--sd-button-v2-border:transparent;--sd-button-v2-content:$white;--sd-button-v2-current-content:var(--sd-button-v2-content);--sd-button-v2-current-icon:var(--sd-button-v2-content);display:inline-flex;align-items:center;justify-content:center;min-height:var(--sd-button-v2-height);min-width:var(--sd-button-v2-min-width, auto);padding:0 var(--sd-button-v2-padding-x);border:var(--sd-button-border-width-default, 1px) solid var(--sd-button-v2-border);border-radius:var(--sd-button-radius-sm, 4px);background:var(--sd-button-v2-bg);color:var(--sd-button-v2-current-content);cursor:pointer;box-sizing:border-box;font-family:var(--sd-button-v2-font-family);font-size:var(--sd-button-v2-font-size);font-weight:var(--sd-button-v2-font-weight);line-height:1;text-decoration:var(--sd-button-v2-text-decoration);transition:background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;white-space:nowrap;-webkit-user-select:none;user-select:none}.sd-button-v2:hover:not(.sd-button-v2--disabled){background:var(--sd-button-v2-bg-hover)}.sd-button-v2:focus-visible{outline:0;box-shadow:0 0 0 2px var(--sd-button-v2-accent)}.sd-button-v2--xs{--sd-button-v2-height:var(--sd-button-xs-height, 24px);--sd-button-v2-padding-x:var(--sd-button-xs-padding-x, 8px);--sd-button-v2-gap:var(--sd-button-xs-gap, 4px);--sd-button-v2-font-family:var(--sd-button-xs-typography-font-family, inherit);--sd-button-v2-font-size:var(--sd-button-xs-typography-font-size, 12px);--sd-button-v2-font-weight:var(--sd-button-xs-typography-font-weight, 500);--sd-button-v2-text-decoration:var(--sd-button-xs-typography-text-decoration, none);--sd-button-v2-label-min-width:var(--sd-button-label-xs-min-width, 36px);--sd-button-v2-icon-only-size:var(--sd-button-icon-only-xs-width, var(--sd-button-v2-height))}.sd-button-v2--sm{--sd-button-v2-height:var(--sd-button-sm-height, 28px);--sd-button-v2-padding-x:var(--sd-button-sm-padding-x, 12px);--sd-button-v2-gap:var(--sd-button-sm-gap, 6px);--sd-button-v2-font-family:var(--sd-button-sm-typography-font-family, inherit);--sd-button-v2-font-size:var(--sd-button-sm-typography-font-size, 12px);--sd-button-v2-font-weight:var(--sd-button-sm-typography-font-weight, 500);--sd-button-v2-text-decoration:var(--sd-button-sm-typography-text-decoration, none);--sd-button-v2-label-min-width:var(--sd-button-label-sm-min-width, 70px);--sd-button-v2-icon-only-size:var(--sd-button-icon-only-sm-width, var(--sd-button-v2-height))}.sd-button-v2--md{--sd-button-v2-height:var(--sd-button-md-height, 34px);--sd-button-v2-padding-x:var(--sd-button-md-padding-x, 20px);--sd-button-v2-gap:var(--sd-button-md-gap, 8px);--sd-button-v2-font-family:var(--sd-button-md-typography-font-family, inherit);--sd-button-v2-font-size:var(--sd-button-md-typography-font-size, 16px);--sd-button-v2-font-weight:var(--sd-button-md-typography-font-weight, 500);--sd-button-v2-text-decoration:var(--sd-button-md-typography-text-decoration, none);--sd-button-v2-label-min-width:var(--sd-button-label-md-min-width, 100px);--sd-button-v2-icon-only-size:var(--sd-button-icon-only-md-width, var(--sd-button-v2-height));border-radius:var(--sd-button-radius-md, 6px)}.sd-button-v2--lg{--sd-button-v2-height:var(--sd-button-lg-height, 62px);--sd-button-v2-padding-x:var(--sd-button-lg-padding-x, 28px);--sd-button-v2-gap:var(--sd-button-lg-gap, 12px);--sd-button-v2-font-family:var(--sd-button-lg-typography-font-family, inherit);--sd-button-v2-font-size:var(--sd-button-lg-typography-font-size, 18px);--sd-button-v2-font-weight:var(--sd-button-lg-typography-font-weight, 500);--sd-button-v2-text-decoration:var(--sd-button-lg-typography-text-decoration, none);--sd-button-v2-label-min-width:var(--sd-button-label-lg-min-width, 120px);--sd-button-v2-icon-only-size:var(--sd-button-icon-only-lg-width, var(--sd-button-v2-height));border-radius:var(--sd-button-radius-md, 6px)}.sd-button-v2--has-label{--sd-button-v2-min-width:var(--sd-button-v2-label-min-width, auto)}.sd-button-v2--icon-only{width:var(--sd-button-v2-icon-only-size, var(--sd-button-v2-height));min-width:var(--sd-button-v2-icon-only-size, var(--sd-button-v2-height));height:var(--sd-button-v2-icon-only-size, var(--sd-button-v2-height));padding:0}.sd-button-v2--icon-only .sd-button-v2__content{gap:0}.sd-button-v2--disabled{border-color:var(--sd-button-border-disabled, #CCCCCC);background:var(--sd-button-bg-disabled, #E1E1E1);--sd-button-v2-current-content:var(--sd-button-text-disabled, $grey_65);--sd-button-v2-current-icon:var(--sd-button-icon-disabled, $grey_75);cursor:not-allowed}.sd-button-v2 .sd-button-v2__content{display:inline-flex;align-items:center;justify-content:center;gap:var(--sd-button-v2-gap)}.sd-button-v2 .sd-button-v2__label{font:inherit}`;
5774
5755
 
5775
5756
  class SdButtonV2 {
5776
5757
  constructor(hostRef) {
@@ -5837,13 +5818,13 @@ class SdButtonV2 {
5837
5818
  const hasLabel = Boolean(this.label);
5838
5819
  const iconOnly = !this.label && Boolean(this.icon);
5839
5820
  const accessibleName = iconOnly && this.ariaLabel.trim() ? this.ariaLabel : undefined;
5840
- return (hAsync("button", { key: '3ab72bde2ff033ba8bd23b1f419b3a2f879b9476', class: this.getButtonClasses(preset, config.size, hasLabel, iconOnly), type: this.type, disabled: this.disabled, "aria-label": accessibleName, style: {
5821
+ return (hAsync("button", { key: 'b61c65948aacc951a46fb4d6cce8e4df715c5ae5', class: this.getButtonClasses(preset, config.size, hasLabel, iconOnly), type: this.type, disabled: this.disabled, "aria-label": accessibleName, style: {
5841
5822
  '--sd-button-v2-bg': config.variant === 'primary' ? config.color : '#FFFFFF',
5842
5823
  '--sd-button-v2-bg-hover': PRESET_HOVER_BACKGROUNDS$1[preset],
5843
5824
  '--sd-button-v2-border': PRESET_BORDER_COLORS$1[preset],
5844
5825
  '--sd-button-v2-content': PRESET_CONTENT_COLORS$1[preset],
5845
5826
  '--sd-button-v2-accent': BUTTON_FOCUS_RING_COLOR,
5846
- }, onClick: this.handleClick }, hAsync("span", { key: 'acc839b6b89aef8065b7b5942167a0509496b689', class: "sd-button-v2__content" }, this.icon && (hAsync("sd-icon", { key: '0e8f758d3e0a40f6e021efd90e5cf86d52f18a27', class: "sd-button-v2__icon", name: this.icon, size: BUTTON_ICON_SIZES[config.size], color: "var(--sd-button-v2-current-icon)" })), this.label && hAsync("span", { key: '24ee2337a5b3e2a6df5053978e29428b3503849f', class: "sd-button-v2__label" }, this.label))));
5827
+ }, onClick: this.handleClick }, hAsync("span", { key: 'bdfe42f07909dee43ddd596eccc73eb0de7b59fd', class: "sd-button-v2__content" }, this.icon && (hAsync("sd-icon", { key: 'ec6b33b19f26f9732d969dd351f578706de37016', class: "sd-button-v2__icon", name: this.icon, size: BUTTON_ICON_SIZES[config.size], color: "var(--sd-button-v2-current-icon)" })), this.label && hAsync("span", { key: '1eebf5dacec105472215f2a1e33052c13366b40b', class: "sd-button-v2__label" }, this.label))));
5847
5828
  }
5848
5829
  static get style() { return sdButtonV2Css(); }
5849
5830
  static get cmpMeta() { return {
@@ -6080,7 +6061,7 @@ class SdCard {
6080
6061
  bordered = false;
6081
6062
  sdClass = '';
6082
6063
  render() {
6083
- return (hAsync(Fragment, { key: 'baaae6d4953d94fbc20cbd3762af5c63dd16ec97' }, hAsync("div", { key: '3505306be16d71a4eec5b479326d277294c64c66', class: `sd-card ${this.bordered ? 'sd-card--bordered' : ''} ${this.sdClass}` }, hAsync("slot", { key: 'f63c4a21b91cc398acb255a85d039f0d82c55857' }))));
6064
+ return (hAsync(Fragment, { key: '1097b68c59997cb041057ff7b77330275c52f7c7' }, hAsync("div", { key: 'a6eb3be04f9bcad7f712c0f28ff9750ebfd5697a', class: `sd-card ${this.bordered ? 'sd-card--bordered' : ''} ${this.sdClass}` }, hAsync("slot", { key: 'c2b5ae153d520f4078bb6e7ab4cd41f83eb32ad3' }))));
6084
6065
  }
6085
6066
  static get style() { return sdCardCss(); }
6086
6067
  static get cmpMeta() { return {
@@ -6379,9 +6360,9 @@ class SdConfirmModal {
6379
6360
  render() {
6380
6361
  const iconName = CONFIRM_MODAL_ICON_MAP[this.type];
6381
6362
  const iconColor = CONFIRM_MODAL_ICON_COLOR[this.type];
6382
- return (hAsync("div", { key: '8c4e6a948ffb27ea597dfc9d200b689c2667404a', class: "sd-confirm-modal" }, hAsync("sd-ghost-button", { key: '4acc52151149bdaf882e097fc12cae7ea10303c4', class: "sd-confirm-modal__close-button", icon: "close", ariaLabel: "close", onClick: () => this.close.emit() }), iconName && (hAsync("sd-icon", { key: '95ba699cf46bb6eaefdca98f37b45eef38e3e8b2', class: "sd-confirm-modal__icon", name: iconName, size: TITLE_ICON_SIZE, color: iconColor })), hAsync("h2", { key: 'bb58b92c976751935ba4984f46a41edf0ee7ecb9', class: `sd-confirm-modal__title ${this.titleClass}` }, this.modalTitle), hAsync("div", { key: 'eccfb9b1f1c87e75a4a768802720b5f3468f167a', class: "sd-confirm-modal__body" }, (this.topMessage ?? []).length > 0 && (hAsync("div", { key: '4c318650406ed9e75cc584ad3262d3782425fe31', class: "sd-confirm-modal__message" }, (this.topMessage ?? []).map(msg => (hAsync("p", { class: "sd-confirm-modal__message-text", innerHTML: msg }))))), this.showContentBox && (hAsync("div", { key: 'f19744c657f73883ecafcbddc6b69e055e4694ec', class: "sd-confirm-modal__content-box" }, this.tagContents ? (hAsync("div", { class: "sd-confirm-modal__custom-content", ref: el => {
6363
+ return (hAsync("div", { key: '5a81aa943cbaf554e665b5030c1c46e6aedc0a38', class: "sd-confirm-modal" }, hAsync("sd-ghost-button", { key: 'd4d48c22ce5cd3895adb6e48688907f7c9d4202a', class: "sd-confirm-modal__close-button", icon: "close", ariaLabel: "close", onClick: () => this.close.emit() }), iconName && (hAsync("sd-icon", { key: 'da157d4699b67cb75d25ee8d5da6694e13b874e4', class: "sd-confirm-modal__icon", name: iconName, size: TITLE_ICON_SIZE, color: iconColor })), hAsync("h2", { key: '4362cd4581cec25b4fd9b88206cc21f5ffa68ca9', class: `sd-confirm-modal__title ${this.titleClass}` }, this.modalTitle), hAsync("div", { key: '2169cdc63bc9affb0149e50f0fb94d08ec371bf5', class: "sd-confirm-modal__body" }, (this.topMessage ?? []).length > 0 && (hAsync("div", { key: '3f51315daed6bf8bce81137d8621c26b1960dac3', class: "sd-confirm-modal__message" }, (this.topMessage ?? []).map(msg => (hAsync("p", { class: "sd-confirm-modal__message-text", innerHTML: msg }))))), this.showContentBox && (hAsync("div", { key: '5826cd4b28b8b4c38f28bea030a43f32a2a4203e', class: "sd-confirm-modal__content-box" }, this.tagContents ? (hAsync("div", { class: "sd-confirm-modal__custom-content", ref: el => {
6383
6364
  this.customContentRef = el;
6384
- } })) : (hAsync("slot", { onSlotchange: () => this.syncHasSlottedContent() }, this.tagLabel && hAsync("sd-tag", { name: this.tagPreset, label: this.tagLabel }), this.slotLabel && (hAsync("span", { class: "sd-confirm-modal__slot-label" }, this.slotLabel)))))), (this.bottomMessage ?? []).length > 0 && (hAsync("div", { key: '32cdf1a8ad4289cde89c13d1d250bc93f9392c73', class: "sd-confirm-modal__message" }, (this.bottomMessage ?? []).map(msg => (hAsync("p", { class: "sd-confirm-modal__message-text", innerHTML: msg })))))), hAsync("div", { key: '1ced06b3bbc49593b9709fad227adcc3119e895b', class: "sd-confirm-modal__button" }, this.subButtonLabel && (hAsync("sd-button-v2", { key: 'cc7f45c6e6d3e0f925f581eff030e20dc0c40163', name: SUB_BUTTON_PRESET, label: this.subButtonLabel, onSdClick: () => this.cancel.emit() })), hAsync("sd-button-v2", { key: '78d55d4d0f2e2aae9d2692bbc142cf74d8d1795b', name: this.resolvedMainButton, label: this.mainButtonLabel, onSdClick: () => this.ok.emit() }))));
6365
+ } })) : (hAsync("slot", { onSlotchange: () => this.syncHasSlottedContent() }, this.tagLabel && hAsync("sd-tag", { name: this.tagPreset, label: this.tagLabel }), this.slotLabel && (hAsync("span", { class: "sd-confirm-modal__slot-label" }, this.slotLabel)))))), (this.bottomMessage ?? []).length > 0 && (hAsync("div", { key: 'a28bacaafc973b8b5d8be998c49d4b203f7ecc19', class: "sd-confirm-modal__message" }, (this.bottomMessage ?? []).map(msg => (hAsync("p", { class: "sd-confirm-modal__message-text", innerHTML: msg })))))), hAsync("div", { key: '791db1eb69ba9ef56fa0298d7539cde55b08e2ac', class: "sd-confirm-modal__button" }, this.subButtonLabel && (hAsync("sd-button-v2", { key: '08407e3d972c6828f58020be94aa81a93f5e0e8c', name: SUB_BUTTON_PRESET, label: this.subButtonLabel, onSdClick: () => this.cancel.emit() })), hAsync("sd-button-v2", { key: '6ef6528e54d2fe81ad96a546512a8a49b17f67d5', name: this.resolvedMainButton, label: this.mainButtonLabel, onSdClick: () => this.ok.emit() }))));
6385
6366
  }
6386
6367
  static get style() { return sdConfirmModalCss(); }
6387
6368
  static get cmpMeta() { return {
@@ -6472,7 +6453,175 @@ class SdDateBox {
6472
6453
  }; }
6473
6454
  }
6474
6455
 
6475
- const sdDatePickerCss = () => `.sd-date-picker.sc-sd-date-picker{width:100%;display:inline-block}.sd-date-picker.sc-sd-date-picker .sd-date-picker--disabled.sc-sd-date-picker .date-icon.sc-sd-date-picker{cursor:not-allowed !important;color:#888888 !important}.sd-date-picker.sc-sd-date-picker .sd-date-picker__input.sc-sd-date-picker{text-align:center !important}.sd-date-picker__menu.sc-sd-date-picker{border-radius:8px;box-shadow:2px 2px 12px 2px rgba(0, 0, 0, 0.2)}`;
6456
+ const datepicker = {
6457
+ sm: {
6458
+ height: "28",
6459
+ paddingX: "12",
6460
+ gap: "8",
6461
+ icon: "16",
6462
+ typography: {
6463
+ fontWeight: "400",
6464
+ fontSize: "12",
6465
+ lineHeight: "20"},
6466
+ radius: "4"},
6467
+ md: {
6468
+ height: "36",
6469
+ paddingX: "16",
6470
+ gap: "12",
6471
+ icon: "20",
6472
+ typography: {
6473
+ fontWeight: "400",
6474
+ fontSize: "16",
6475
+ lineHeight: "26"},
6476
+ radius: "6"},
6477
+ border: {
6478
+ "default": "#AAAAAA",
6479
+ focus: "#0075FF"},
6480
+ bg: {
6481
+ "default": "#FFFFFF"},
6482
+ icon: {
6483
+ "default": "#888888",
6484
+ disabled: "#BBBBBB"
6485
+ },
6486
+ text: {
6487
+ "default": "#222222",
6488
+ hint: "#555555",
6489
+ disabled: "#888888"
6490
+ },
6491
+ calendar: {
6492
+ bg: "#FFFFFF",
6493
+ paddingXY: "24",
6494
+ gap: "12",
6495
+ radius: "8",
6496
+ header: {
6497
+ gap: "8",
6498
+ divider: "#E1E1E1",
6499
+ typography: {
6500
+ fontWeight: "500",
6501
+ fontSize: "14",
6502
+ lineHeight: "24"
6503
+ }
6504
+ },
6505
+ week: {
6506
+ typography: {
6507
+ fontWeight: "400",
6508
+ fontSize: "12",
6509
+ lineHeight: "20"},
6510
+ color: "#888888"
6511
+ },
6512
+ grid: {
6513
+ rowGap: "4"
6514
+ },
6515
+ day: {
6516
+ size: "40",
6517
+ circle: {
6518
+ size: "32",
6519
+ radius: "9999"
6520
+ },
6521
+ "default": {
6522
+ text: "#222222"
6523
+ },
6524
+ hover: {
6525
+ text: "#222222",
6526
+ border: "#0075FF"
6527
+ },
6528
+ select: {
6529
+ bg: "#0075FF",
6530
+ text: "#FFFFFF"
6531
+ },
6532
+ disabled: {
6533
+ text: "#888888"
6534
+ },
6535
+ typography: {
6536
+ "default": {
6537
+ fontWeight: "400",
6538
+ fontSize: "14",
6539
+ lineHeight: "24"
6540
+ },
6541
+ bold: {
6542
+ fontWeight: "700"}
6543
+ }},
6544
+ range: {
6545
+ bg: "#D9EAFF",
6546
+ height: "32",
6547
+ panelGap: "24",
6548
+ divider: "#E1E1E1"}
6549
+ }
6550
+ };
6551
+ var datepickerTokens = {
6552
+ datepicker: datepicker
6553
+ };
6554
+
6555
+ const sm$2 = datepickerTokens.datepicker.sm;
6556
+ const md$2 = datepickerTokens.datepicker.md;
6557
+ const DATEPICKER_SIZE_MAP = {
6558
+ sm: {
6559
+ height: sm$2.height,
6560
+ paddingX: sm$2.paddingX,
6561
+ gap: sm$2.gap,
6562
+ iconSize: sm$2.icon,
6563
+ radius: sm$2.radius,
6564
+ fontSize: sm$2.typography.fontSize,
6565
+ lineHeight: sm$2.typography.lineHeight,
6566
+ fontWeight: sm$2.typography.fontWeight,
6567
+ },
6568
+ md: {
6569
+ height: md$2.height,
6570
+ paddingX: md$2.paddingX,
6571
+ gap: md$2.gap,
6572
+ iconSize: md$2.icon,
6573
+ radius: md$2.radius,
6574
+ fontSize: md$2.typography.fontSize,
6575
+ lineHeight: md$2.typography.lineHeight,
6576
+ fontWeight: md$2.typography.fontWeight,
6577
+ },
6578
+ };
6579
+ const DATEPICKER_COLORS = {
6580
+ border: datepickerTokens.datepicker.border,
6581
+ bg: datepickerTokens.datepicker.bg,
6582
+ icon: datepickerTokens.datepicker.icon,
6583
+ text: datepickerTokens.datepicker.text,
6584
+ };
6585
+ const CALENDAR_LAYOUT = {
6586
+ bg: datepickerTokens.datepicker.calendar.bg,
6587
+ paddingXY: datepickerTokens.datepicker.calendar.paddingXY,
6588
+ gap: datepickerTokens.datepicker.calendar.gap,
6589
+ radius: datepickerTokens.datepicker.calendar.radius,
6590
+ header: {
6591
+ gap: datepickerTokens.datepicker.calendar.header.gap,
6592
+ divider: datepickerTokens.datepicker.calendar.header.divider,
6593
+ fontSize: datepickerTokens.datepicker.calendar.header.typography.fontSize,
6594
+ lineHeight: datepickerTokens.datepicker.calendar.header.typography.lineHeight,
6595
+ fontWeight: datepickerTokens.datepicker.calendar.header.typography.fontWeight,
6596
+ },
6597
+ week: {
6598
+ fontSize: datepickerTokens.datepicker.calendar.week.typography.fontSize,
6599
+ lineHeight: datepickerTokens.datepicker.calendar.week.typography.lineHeight,
6600
+ fontWeight: datepickerTokens.datepicker.calendar.week.typography.fontWeight,
6601
+ color: datepickerTokens.datepicker.calendar.week.color,
6602
+ },
6603
+ grid: {
6604
+ rowGap: datepickerTokens.datepicker.calendar.grid.rowGap,
6605
+ },
6606
+ day: {
6607
+ size: datepickerTokens.datepicker.calendar.day.size,
6608
+ circleSize: datepickerTokens.datepicker.calendar.day.circle.size,
6609
+ circleRadius: datepickerTokens.datepicker.calendar.day.circle.radius,
6610
+ defaultText: datepickerTokens.datepicker.calendar.day.default.text,
6611
+ hoverText: datepickerTokens.datepicker.calendar.day.hover.text,
6612
+ hoverBorder: datepickerTokens.datepicker.calendar.day.hover.border,
6613
+ selectBg: datepickerTokens.datepicker.calendar.day.select.bg,
6614
+ selectText: datepickerTokens.datepicker.calendar.day.select.text,
6615
+ disabledText: datepickerTokens.datepicker.calendar.day.disabled.text,
6616
+ fontSize: datepickerTokens.datepicker.calendar.day.typography.default.fontSize,
6617
+ lineHeight: datepickerTokens.datepicker.calendar.day.typography.default.lineHeight,
6618
+ fontWeight: datepickerTokens.datepicker.calendar.day.typography.default.fontWeight,
6619
+ boldFontWeight: datepickerTokens.datepicker.calendar.day.typography.bold.fontWeight,
6620
+ },
6621
+ };
6622
+ const WEEK_LABELS = ['일', '월', '화', '수', '목', '금', '토'];
6623
+
6624
+ const sdDatePickerCss = () => `sd-date-picker{display:inline-flex}sd-date-picker sd-portal{display:none}sd-date-picker .sd-date-picker{position:relative;width:100%;height:100%}`;
6476
6625
 
6477
6626
  class SdDatePicker {
6478
6627
  constructor(hostRef) {
@@ -6480,251 +6629,788 @@ class SdDatePicker {
6480
6629
  this.update = createEvent(this, "sdUpdate", 7);
6481
6630
  this.viewChange = createEvent(this, "sdViewChange", 7);
6482
6631
  }
6632
+ static CLOSE_ANIMATION_DURATION = 150;
6483
6633
  get el() { return getElement(this); }
6484
6634
  value = null;
6485
- label;
6635
+ size = 'sm';
6636
+ placeholder = 'YYYY-MM-DD';
6637
+ selectable;
6638
+ disabled = false;
6639
+ width = '';
6640
+ // sd-field 공통 props
6641
+ label = '';
6642
+ addonLabel = '';
6643
+ hint = '';
6644
+ errorMessage = '';
6645
+ fieldName = '';
6646
+ rules = [];
6647
+ error = false;
6648
+ icon = undefined;
6649
+ labelTooltip = '';
6650
+ labelTooltipProps = null;
6651
+ isOpen = false;
6652
+ isAnimatingOut = false;
6653
+ focused = false;
6654
+ hovered = false;
6655
+ update;
6656
+ viewChange;
6657
+ triggerRef;
6658
+ formField;
6659
+ closeAnimationTimer;
6660
+ internalName = nanoid();
6661
+ watchIsOpen(newValue) {
6662
+ this.focused = newValue;
6663
+ }
6664
+ async sdValidate() {
6665
+ return this.formField?.sdValidate();
6666
+ }
6667
+ async sdReset() {
6668
+ return this.formField?.sdReset();
6669
+ }
6670
+ async sdResetValidate() {
6671
+ return this.formField?.sdResetValidation();
6672
+ }
6673
+ closeDropdown() {
6674
+ if (!this.isOpen)
6675
+ return;
6676
+ this.isOpen = false;
6677
+ this.isAnimatingOut = true;
6678
+ if (this.closeAnimationTimer)
6679
+ clearTimeout(this.closeAnimationTimer);
6680
+ this.closeAnimationTimer = setTimeout(() => {
6681
+ this.isAnimatingOut = false;
6682
+ }, SdDatePicker.CLOSE_ANIMATION_DURATION);
6683
+ }
6684
+ handleTriggerClick = () => {
6685
+ if (this.disabled)
6686
+ return;
6687
+ if (this.isOpen) {
6688
+ this.closeDropdown();
6689
+ }
6690
+ else {
6691
+ if (this.closeAnimationTimer)
6692
+ clearTimeout(this.closeAnimationTimer);
6693
+ this.isAnimatingOut = false;
6694
+ this.isOpen = true;
6695
+ }
6696
+ };
6697
+ handleSelect = (e) => {
6698
+ this.closeDropdown();
6699
+ this.value = e.detail;
6700
+ const nextValue = this.value;
6701
+ requestAnimationFrame(() => {
6702
+ this.update.emit(nextValue);
6703
+ });
6704
+ };
6705
+ handleViewChange = (e) => {
6706
+ this.viewChange.emit(e.detail);
6707
+ };
6708
+ disconnectedCallback() {
6709
+ if (this.closeAnimationTimer)
6710
+ clearTimeout(this.closeAnimationTimer);
6711
+ }
6712
+ render() {
6713
+ const sizeTokens = DATEPICKER_SIZE_MAP[this.size] ?? DATEPICKER_SIZE_MAP.md;
6714
+ const cssVars = {
6715
+ '--sd-system-size-field-sm-height': `${sizeTokens.height}px`,
6716
+ '--sd-system-radius-field-sm': `${sizeTokens.radius}px`,
6717
+ '--sd-system-color-field-border-default': DATEPICKER_COLORS.border.default,
6718
+ '--sd-system-color-field-border-focus': DATEPICKER_COLORS.border.focus,
6719
+ '--sd-system-color-field-bg-default': DATEPICKER_COLORS.bg.default,
6720
+ };
6721
+ return (hAsync("sd-field", { key: '713640ad88e27954a12e75f8672032374f9effef', name: this.fieldName || this.internalName, label: this.label, addonLabel: this.addonLabel, hint: this.hint, errorMessage: this.errorMessage, width: this.width, rules: this.rules, error: this.error, disabled: this.disabled, focused: this.focused, hovered: this.hovered, icon: this.icon, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el), onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false), style: cssVars }, hAsync("div", { key: '6f4d6a4dabd3909c647ba9e8d672f1c97a4f50ff', class: "sd-date-picker", ref: el => {
6722
+ this.triggerRef = el;
6723
+ } }, hAsync("sd-date-picker-trigger", { key: '06703672547b5a96b791eaacfbce4f7d23467e9c', displayText: this.value ?? '', placeholder: this.placeholder, disabled: this.disabled, size: this.size, onSdTriggerClick: this.handleTriggerClick })), (this.isOpen || this.isAnimatingOut) && (hAsync("sd-portal", { key: '74b099498b8cdf75038c5d3e4d81bd2f5ead9068', open: this.isOpen, parentRef: this.triggerRef, onSdClose: () => this.closeDropdown() }, hAsync("sd-date-picker-calendar", { key: '6385470ab1578662f38c6bc4409b0010e55975a5', value: this.value, selectable: this.selectable, onSdSelect: this.handleSelect, onSdViewChange: this.handleViewChange })))));
6724
+ }
6725
+ static get watchers() { return {
6726
+ "isOpen": [{
6727
+ "watchIsOpen": 0
6728
+ }]
6729
+ }; }
6730
+ static get style() { return sdDatePickerCss(); }
6731
+ static get cmpMeta() { return {
6732
+ "$flags$": 512,
6733
+ "$tagName$": "sd-date-picker",
6734
+ "$members$": {
6735
+ "value": [1025],
6736
+ "size": [1],
6737
+ "placeholder": [1],
6738
+ "selectable": [16],
6739
+ "disabled": [4],
6740
+ "width": [8],
6741
+ "label": [1],
6742
+ "addonLabel": [1, "addon-label"],
6743
+ "hint": [1],
6744
+ "errorMessage": [1, "error-message"],
6745
+ "fieldName": [1, "field-name"],
6746
+ "rules": [16],
6747
+ "error": [1028],
6748
+ "icon": [16],
6749
+ "labelTooltip": [1, "label-tooltip"],
6750
+ "labelTooltipProps": [16],
6751
+ "isOpen": [32],
6752
+ "isAnimatingOut": [32],
6753
+ "focused": [32],
6754
+ "hovered": [32],
6755
+ "sdValidate": [64],
6756
+ "sdReset": [64],
6757
+ "sdResetValidate": [64]
6758
+ },
6759
+ "$listeners$": undefined,
6760
+ "$lazyBundleId$": "-",
6761
+ "$attrsToReflect$": []
6762
+ }; }
6763
+ }
6764
+
6765
+ const sdDatePickerCalendarCss = () => `sd-date-picker-calendar{display:block}sd-date-picker-calendar .sd-date-picker-calendar{display:flex;flex-direction:column;gap:var(--calendar-gap);height:328px;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-picker-calendar .sd-date-picker-calendar__header{display:flex;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-picker-calendar .sd-date-picker-calendar__nav-group{display:inline-flex;align-items:center;gap:var(--calendar-gap)}sd-date-picker-calendar .sd-date-picker-calendar__nav-group-month{width:100%}sd-date-picker-calendar .sd-date-picker-calendar__label{display:inline-flex;align-items:center;justify-content:center;min-width:40px;text-align:center}sd-date-picker-calendar .sd-date-picker-calendar__label-month{width:100%}sd-date-picker-calendar .sd-date-picker-calendar__divider{display:inline-block;width:1px;height:16px;background:var(--calendar-header-divider)}sd-date-picker-calendar .sd-date-picker-calendar__week{display:grid;grid-template-columns:repeat(7, var(--calendar-day-size))}sd-date-picker-calendar .sd-date-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-picker-calendar .sd-date-picker-calendar__grid{display:grid;grid-template-columns:repeat(7, var(--calendar-day-size));row-gap:var(--calendar-grid-row-gap)}sd-date-picker-calendar .sd-date-picker-calendar__day{display:inline-flex;align-items:center;justify-content:center;width:var(--calendar-day-size);height:32px;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-picker-calendar .sd-date-picker-calendar__day-circle{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-picker-calendar .sd-date-picker-calendar__day:not(:disabled):hover .sd-date-picker-calendar__day-circle{border-radius:16px;border:1px solid var(--calendar-day-hover-border)}sd-date-picker-calendar .sd-date-picker-calendar__day--today .sd-date-picker-calendar__day-circle{font-weight:700}sd-date-picker-calendar .sd-date-picker-calendar__day--selected .sd-date-picker-calendar__day-circle{border-radius:16px;background:var(--calendar-day-select-bg);color:var(--calendar-day-select-text)}sd-date-picker-calendar .sd-date-picker-calendar__day--selected:not(:disabled):hover .sd-date-picker-calendar__day-circle{background:var(--calendar-day-select-bg);color:var(--calendar-day-select-text)}sd-date-picker-calendar .sd-date-picker-calendar__day--disabled{color:var(--calendar-day-disabled-text);background:none !important;cursor:not-allowed}sd-date-picker-calendar .sd-date-picker-calendar__day--empty{visibility:hidden;pointer-events:none}`;
6766
+
6767
+ class SdDatePickerCalendar {
6768
+ constructor(hostRef) {
6769
+ registerInstance(this, hostRef);
6770
+ this.select = createEvent(this, "sdSelect", 7);
6771
+ this.viewChange = createEvent(this, "sdViewChange", 7);
6772
+ }
6773
+ value = null;
6774
+ selectable;
6775
+ currentYear;
6776
+ currentMonth;
6777
+ select;
6778
+ viewChange;
6779
+ dateUtil = useDatePicker();
6780
+ componentWillLoad() {
6781
+ this.syncViewFromValue();
6782
+ }
6783
+ handleValueChange() {
6784
+ this.syncViewFromValue();
6785
+ }
6786
+ syncViewFromValue() {
6787
+ const base = this.value || today;
6788
+ const [year, month] = base.split('-').map(Number);
6789
+ this.currentYear = year;
6790
+ this.currentMonth = month;
6791
+ }
6792
+ formatDate(year, month, day) {
6793
+ return `${year}-${String(month).padStart(2, '0')}-${String(day).padStart(2, '0')}`;
6794
+ }
6795
+ get cells() {
6796
+ const year = this.currentYear;
6797
+ const month = this.currentMonth;
6798
+ const firstDayIndex = new Date(year, month - 1, 1).getDay();
6799
+ const daysInCurrent = new Date(year, month, 0).getDate();
6800
+ const prevMonth = month === 1 ? 12 : month - 1;
6801
+ const prevYear = month === 1 ? year - 1 : year;
6802
+ const daysInPrev = new Date(prevYear, prevMonth, 0).getDate();
6803
+ const nextMonth = month === 12 ? 1 : month + 1;
6804
+ const nextYear = month === 12 ? year + 1 : year;
6805
+ const cells = [];
6806
+ for (let i = firstDayIndex - 1; i >= 0; i--) {
6807
+ const day = daysInPrev - i;
6808
+ cells.push({
6809
+ date: this.formatDate(prevYear, prevMonth, day),
6810
+ day,
6811
+ inCurrentMonth: false,
6812
+ });
6813
+ }
6814
+ for (let day = 1; day <= daysInCurrent; day++) {
6815
+ cells.push({
6816
+ date: this.formatDate(year, month, day),
6817
+ day,
6818
+ inCurrentMonth: true,
6819
+ });
6820
+ }
6821
+ const remaining = (7 - (cells.length % 7)) % 7;
6822
+ for (let day = 1; day <= remaining; day++) {
6823
+ cells.push({
6824
+ date: this.formatDate(nextYear, nextMonth, day),
6825
+ day,
6826
+ inCurrentMonth: false,
6827
+ });
6828
+ }
6829
+ return cells;
6830
+ }
6831
+ emitViewChange() {
6832
+ this.viewChange.emit({ year: this.currentYear, month: this.currentMonth });
6833
+ }
6834
+ goPrevYear = (event) => {
6835
+ event.stopPropagation();
6836
+ this.currentYear -= 1;
6837
+ this.emitViewChange();
6838
+ };
6839
+ goNextYear = (event) => {
6840
+ event.stopPropagation();
6841
+ this.currentYear += 1;
6842
+ this.emitViewChange();
6843
+ };
6844
+ goPrevMonth = (event) => {
6845
+ event.stopPropagation();
6846
+ const { newYear, newMonth } = this.dateUtil.calculateYearMonth(this.currentYear, this.currentMonth, 'prev');
6847
+ this.currentYear = newYear;
6848
+ this.currentMonth = newMonth;
6849
+ this.emitViewChange();
6850
+ };
6851
+ goNextMonth = (event) => {
6852
+ event.stopPropagation();
6853
+ const { newYear, newMonth } = this.dateUtil.calculateYearMonth(this.currentYear, this.currentMonth, 'next');
6854
+ this.currentYear = newYear;
6855
+ this.currentMonth = newMonth;
6856
+ this.emitViewChange();
6857
+ };
6858
+ isDisabled(date) {
6859
+ if (!this.selectable)
6860
+ return false;
6861
+ const [start, end] = this.selectable;
6862
+ if (start && date < start)
6863
+ return true;
6864
+ if (end && date > end)
6865
+ return true;
6866
+ return false;
6867
+ }
6868
+ handleDayClick(cell) {
6869
+ if (this.isDisabled(cell.date))
6870
+ return;
6871
+ this.select.emit(cell.date);
6872
+ }
6873
+ render() {
6874
+ const cssVars = {
6875
+ '--calendar-bg': CALENDAR_LAYOUT.bg,
6876
+ '--calendar-padding': `${CALENDAR_LAYOUT.paddingXY}px`,
6877
+ '--calendar-gap': `${CALENDAR_LAYOUT.gap}px`,
6878
+ '--calendar-radius': `${CALENDAR_LAYOUT.radius}px`,
6879
+ '--calendar-header-gap': `${CALENDAR_LAYOUT.header.gap}px`,
6880
+ '--calendar-header-divider': CALENDAR_LAYOUT.header.divider,
6881
+ '--calendar-header-font-size': `${CALENDAR_LAYOUT.header.fontSize}px`,
6882
+ '--calendar-header-line-height': `${CALENDAR_LAYOUT.header.lineHeight}px`,
6883
+ '--calendar-header-font-weight': CALENDAR_LAYOUT.header.fontWeight,
6884
+ '--calendar-week-font-size': `${CALENDAR_LAYOUT.week.fontSize}px`,
6885
+ '--calendar-week-line-height': `${CALENDAR_LAYOUT.week.lineHeight}px`,
6886
+ '--calendar-week-font-weight': CALENDAR_LAYOUT.week.fontWeight,
6887
+ '--calendar-week-color': CALENDAR_LAYOUT.week.color,
6888
+ '--calendar-grid-row-gap': `${CALENDAR_LAYOUT.grid.rowGap}px`,
6889
+ '--calendar-day-size': `${CALENDAR_LAYOUT.day.size}px`,
6890
+ '--calendar-day-circle-size': `${CALENDAR_LAYOUT.day.circleSize}px`,
6891
+ '--calendar-day-circle-radius': `${CALENDAR_LAYOUT.day.circleRadius}px`,
6892
+ '--calendar-day-text': CALENDAR_LAYOUT.day.defaultText,
6893
+ '--calendar-day-hover-text': CALENDAR_LAYOUT.day.hoverText,
6894
+ '--calendar-day-hover-border': CALENDAR_LAYOUT.day.hoverBorder,
6895
+ '--calendar-day-select-bg': CALENDAR_LAYOUT.day.selectBg,
6896
+ '--calendar-day-select-text': CALENDAR_LAYOUT.day.selectText,
6897
+ '--calendar-day-disabled-text': CALENDAR_LAYOUT.day.disabledText,
6898
+ '--calendar-day-font-size': `${CALENDAR_LAYOUT.day.fontSize}px`,
6899
+ '--calendar-day-line-height': `${CALENDAR_LAYOUT.day.lineHeight}px`,
6900
+ '--calendar-day-font-weight': CALENDAR_LAYOUT.day.fontWeight,
6901
+ '--calendar-day-bold-font-weight': CALENDAR_LAYOUT.day.boldFontWeight,
6902
+ };
6903
+ return (hAsync("div", { key: 'df2517386d844ade51de158c511a7f2ec77714f9', class: "sd-date-picker-calendar", style: cssVars }, hAsync("div", { key: '16185a3b082fdf59f7ea325a96cf9d7f67622278', class: "sd-date-picker-calendar__header" }, hAsync("div", { key: 'bf6839f659dd01238310721284fae78f2189de8a', class: "sd-date-picker-calendar__nav-group" }, hAsync("sd-ghost-button", { key: '474514e32f4ce65b07e704f246a60104f0adec0e', ariaLabel: "prevYear", size: "xxs", icon: "chevronLeft", onClick: this.goPrevYear }), hAsync("span", { key: '51c0f67e762a2a9efd166eaeb066d28e6b412f7d', class: "sd-date-picker-calendar__label" }, this.currentYear), hAsync("sd-ghost-button", { key: '9fbb3f071917370764886ab63f2f39d90ff7224d', ariaLabel: "nextYear", size: "xxs", icon: "chevronRight", onClick: this.goNextYear })), hAsync("span", { key: 'b9afde6cc30bf791d487d16b67a50d4a270601f6', class: "sd-date-picker-calendar__divider", "aria-hidden": "true" }), hAsync("div", { key: '3d9c647a135376c524036eec85dc80c143225e2d', class: "sd-date-picker-calendar__nav-group sd-date-picker-calendar__nav-group-month" }, hAsync("sd-ghost-button", { key: '233351d0151458b088264872fca2bb75fa3d3d4f', ariaLabel: "prevMonth", size: "xxs", icon: "chevronLeft", onClick: this.goPrevMonth }), hAsync("span", { key: '26913dd888a4a3589edc3ae63345c2e02e418aa5', class: "sd-date-picker-calendar__label sd-date-picker-calendar__label-month" }, this.currentMonth, "\uC6D4"), hAsync("sd-ghost-button", { key: '7700394ff1c9f19a5559e829fb016f2d2a97b242', ariaLabel: "nextMonth", size: "xxs", icon: "chevronRight", onClick: this.goNextMonth }))), hAsync("div", { key: '7d2b2577092fb2f817bbd6fcb711425992d4ba34', class: "sd-date-picker-calendar__week" }, WEEK_LABELS.map(label => (hAsync("span", { key: label, class: "sd-date-picker-calendar__week-cell" }, label)))), hAsync("div", { key: 'c6784bcbf7c939eb1848cfa20f87f17534ade21e', class: "sd-date-picker-calendar__grid" }, this.cells.map(cell => {
6904
+ const isSelected = cell.inCurrentMonth && !!this.value && this.value === cell.date;
6905
+ const isToday = cell.inCurrentMonth && today === cell.date;
6906
+ const isDisabled = cell.inCurrentMonth && this.isDisabled(cell.date);
6907
+ return (hAsync("button", { type: "button", key: cell.date, class: {
6908
+ 'sd-date-picker-calendar__day': true,
6909
+ 'sd-date-picker-calendar__day--empty': !cell.inCurrentMonth,
6910
+ 'sd-date-picker-calendar__day--today': isToday,
6911
+ 'sd-date-picker-calendar__day--selected': isSelected,
6912
+ 'sd-date-picker-calendar__day--disabled': isDisabled,
6913
+ }, 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-date-picker-calendar__day-circle" }, cell.inCurrentMonth ? cell.day : '')));
6914
+ }))));
6915
+ }
6916
+ static get watchers() { return {
6917
+ "value": [{
6918
+ "handleValueChange": 0
6919
+ }]
6920
+ }; }
6921
+ static get style() { return sdDatePickerCalendarCss(); }
6922
+ static get cmpMeta() { return {
6923
+ "$flags$": 512,
6924
+ "$tagName$": "sd-date-picker-calendar",
6925
+ "$members$": {
6926
+ "value": [1],
6927
+ "selectable": [16],
6928
+ "currentYear": [32],
6929
+ "currentMonth": [32]
6930
+ },
6931
+ "$listeners$": undefined,
6932
+ "$lazyBundleId$": "-",
6933
+ "$attrsToReflect$": []
6934
+ }; }
6935
+ }
6936
+
6937
+ const sdDatePickerTriggerCss = () => `sd-date-picker-trigger{display:block;width:100%;height:100%}sd-date-picker-trigger .sd-date-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-date-picker-trigger .sd-date-picker-trigger--disabled{cursor:not-allowed}sd-date-picker-trigger .sd-date-picker-trigger__icon{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center}sd-date-picker-trigger .sd-date-picker-trigger__text{flex:1;min-width:0;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}`;
6938
+
6939
+ class SdDatePickerTrigger {
6940
+ constructor(hostRef) {
6941
+ registerInstance(this, hostRef);
6942
+ this.triggerClick = createEvent(this, "sdTriggerClick", 7);
6943
+ }
6944
+ displayText = '';
6945
+ placeholder = 'YYYY-MM-DD';
6946
+ disabled = false;
6947
+ size = 'md';
6948
+ triggerClick;
6949
+ handleClick = () => {
6950
+ if (this.disabled)
6951
+ return;
6952
+ this.triggerClick.emit();
6953
+ };
6954
+ render() {
6955
+ const sizeTokens = DATEPICKER_SIZE_MAP[this.size] ?? DATEPICKER_SIZE_MAP.md;
6956
+ const hasValue = !!this.displayText;
6957
+ const cssVars = {
6958
+ '--trigger-padding-x': `${sizeTokens.paddingX}px`,
6959
+ '--trigger-gap': `${sizeTokens.gap}px`,
6960
+ '--trigger-icon-size': `${sizeTokens.iconSize}px`,
6961
+ '--trigger-font-size': `${sizeTokens.fontSize}px`,
6962
+ '--trigger-line-height': `${sizeTokens.lineHeight}px`,
6963
+ '--trigger-font-weight': sizeTokens.fontWeight,
6964
+ '--trigger-radius': `${sizeTokens.radius}px`,
6965
+ '--trigger-text-color': this.disabled
6966
+ ? DATEPICKER_COLORS.text.disabled
6967
+ : hasValue
6968
+ ? DATEPICKER_COLORS.text.default
6969
+ : DATEPICKER_COLORS.text.hint,
6970
+ '--trigger-icon-color': this.disabled
6971
+ ? DATEPICKER_COLORS.icon.disabled
6972
+ : DATEPICKER_COLORS.icon.default,
6973
+ };
6974
+ return (hAsync("div", { key: 'e39df39c0b865be9f08e60787ea122dccaa7bff4', class: {
6975
+ 'sd-date-picker-trigger': true,
6976
+ 'sd-date-picker-trigger--disabled': this.disabled,
6977
+ }, style: cssVars, onClick: this.handleClick }, hAsync("sd-icon", { key: 'a04c576196fb9695a044485f30d459fd6e945b33', name: "date", size: Number(sizeTokens.iconSize), color: "var(--trigger-icon-color)", class: "sd-date-picker-trigger__icon" }), hAsync("span", { key: '94b4da3bc41f31519afbb49324548209582be850', class: "sd-date-picker-trigger__text" }, hasValue ? this.displayText : this.placeholder)));
6978
+ }
6979
+ static get style() { return sdDatePickerTriggerCss(); }
6980
+ static get cmpMeta() { return {
6981
+ "$flags$": 512,
6982
+ "$tagName$": "sd-date-picker-trigger",
6983
+ "$members$": {
6984
+ "displayText": [1, "display-text"],
6985
+ "placeholder": [1],
6986
+ "disabled": [4],
6987
+ "size": [1]
6988
+ },
6989
+ "$listeners$": undefined,
6990
+ "$lazyBundleId$": "-",
6991
+ "$attrsToReflect$": []
6992
+ }; }
6993
+ }
6994
+
6995
+ const RANGE_LAYOUT = {
6996
+ bg: datepickerTokens.datepicker.calendar.range.bg,
6997
+ height: datepickerTokens.datepicker.calendar.range.height,
6998
+ panelGap: datepickerTokens.datepicker.calendar.range.panelGap,
6999
+ divider: datepickerTokens.datepicker.calendar.range.divider,
7000
+ };
7001
+
7002
+ 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%}`;
7003
+
7004
+ class SdDateRangePicker {
7005
+ constructor(hostRef) {
7006
+ registerInstance(this, hostRef);
7007
+ this.update = createEvent(this, "sdUpdate", 7);
7008
+ this.viewChange = createEvent(this, "sdViewChange", 7);
7009
+ }
7010
+ static CLOSE_ANIMATION_DURATION = 150;
7011
+ get el() { return getElement(this); }
7012
+ value = null;
7013
+ size = 'sm';
7014
+ placeholder = 'YYYY-MM-DD ~ YYYY-MM-DD';
6486
7015
  selectable;
7016
+ maxRange;
6487
7017
  disabled = false;
6488
- placeholder = '';
7018
+ width = '';
7019
+ // sd-field 공통 props
7020
+ label = '';
7021
+ addonLabel = '';
7022
+ hint = '';
7023
+ errorMessage = '';
7024
+ fieldName = '';
7025
+ rules = [];
7026
+ error = false;
7027
+ icon = undefined;
7028
+ labelTooltip = '';
7029
+ labelTooltipProps = null;
6489
7030
  isOpen = false;
7031
+ isAnimatingOut = false;
7032
+ focused = false;
7033
+ hovered = false;
6490
7034
  update;
6491
7035
  viewChange;
6492
- inputEl;
6493
- openMenu() {
6494
- if (this.disabled)
7036
+ triggerRef;
7037
+ formField;
7038
+ closeAnimationTimer;
7039
+ internalName = nanoid();
7040
+ watchIsOpen(newValue) {
7041
+ this.focused = newValue;
7042
+ }
7043
+ async sdValidate() {
7044
+ return this.formField?.sdValidate();
7045
+ }
7046
+ async sdReset() {
7047
+ return this.formField?.sdReset();
7048
+ }
7049
+ async sdResetValidate() {
7050
+ return this.formField?.sdResetValidation();
7051
+ }
7052
+ closeDropdown() {
7053
+ if (!this.isOpen)
6495
7054
  return;
6496
- this.isOpen = true;
7055
+ this.isOpen = false;
7056
+ this.isAnimatingOut = true;
7057
+ if (this.closeAnimationTimer)
7058
+ clearTimeout(this.closeAnimationTimer);
7059
+ this.closeAnimationTimer = setTimeout(() => {
7060
+ this.isAnimatingOut = false;
7061
+ }, SdDateRangePicker.CLOSE_ANIMATION_DURATION);
6497
7062
  }
7063
+ handleTriggerClick = () => {
7064
+ if (this.disabled)
7065
+ return;
7066
+ if (this.isOpen) {
7067
+ this.closeDropdown();
7068
+ }
7069
+ else {
7070
+ if (this.closeAnimationTimer)
7071
+ clearTimeout(this.closeAnimationTimer);
7072
+ this.isAnimatingOut = false;
7073
+ this.isOpen = true;
7074
+ }
7075
+ };
6498
7076
  handleSelect = (e) => {
7077
+ this.closeDropdown();
6499
7078
  this.value = e.detail;
6500
- this.isOpen = false;
6501
- this.update.emit(e.detail);
6502
- };
6503
- handleClose = () => {
6504
- this.isOpen = false;
7079
+ const nextValue = this.value;
7080
+ requestAnimationFrame(() => {
7081
+ this.update.emit(nextValue);
7082
+ });
6505
7083
  };
6506
7084
  handleViewChange = (e) => {
6507
7085
  this.viewChange.emit(e.detail);
6508
7086
  };
7087
+ get displayText() {
7088
+ if (!this.value || !this.value[0] || !this.value[1])
7089
+ return '';
7090
+ return `${this.value[0]} ~ ${this.value[1]}`;
7091
+ }
7092
+ disconnectedCallback() {
7093
+ if (this.closeAnimationTimer)
7094
+ clearTimeout(this.closeAnimationTimer);
7095
+ }
6509
7096
  render() {
6510
- return (hAsync("div", { key: '160bd9b2bbd9d223d4df341ed2fbba79c1701c13', class: { 'sd-date-picker': true, 'sd-date-picker--disabled': this.disabled } }, hAsync("sd-input", { key: 'cf7c72c144f1222308eb936a14d1786863019126', ref: el => (this.inputEl = el), value: this.value, addonLabel: this.label, readonly: true, disabled: this.disabled, placeholder: this.placeholder, inputClass: "sd-date-picker__input", onClick: () => this.openMenu() }, hAsync("sd-icon", { key: '8651ba1d36749667f53e9f064b973cb336389ab3', slot: "prefix", name: "date", size: "16", color: this.disabled ? 'grey_65' : 'grey_70', class: "date-icon", onClick: () => this.openMenu() })), this.isOpen && (hAsync("sd-portal", { key: '6ee759cf5cbb0afc4cd8adf704a489ef6cffc8f9', open: this.isOpen, parentRef: this.inputEl, onSdClose: this.handleClose }, hAsync("div", { key: '96c038fea5102ffd780fd296534cc294bd1c6912', class: "sd-date-picker__menu" }, hAsync("sd-calendar", { key: 'bc8d14f98d5d56e6775f083e4096d1113c28a658', value: this.value, selectable: this.selectable, onSdSelect: this.handleSelect, onSdViewChange: this.handleViewChange }))))));
7097
+ const sizeTokens = DATEPICKER_SIZE_MAP[this.size] ?? DATEPICKER_SIZE_MAP.md;
7098
+ const cssVars = {
7099
+ '--sd-system-size-field-sm-height': `${sizeTokens.height}px`,
7100
+ '--sd-system-radius-field-sm': `${sizeTokens.radius}px`,
7101
+ '--sd-system-color-field-border-default': DATEPICKER_COLORS.border.default,
7102
+ '--sd-system-color-field-border-focus': DATEPICKER_COLORS.border.focus,
7103
+ '--sd-system-color-field-bg-default': DATEPICKER_COLORS.bg.default,
7104
+ };
7105
+ return (hAsync("sd-field", { key: '5c381ba40914b02d248b77852e8297ba367faed7', name: this.fieldName || this.internalName, label: this.label, addonLabel: this.addonLabel, hint: this.hint, errorMessage: this.errorMessage, width: this.width, rules: this.rules, error: this.error, disabled: this.disabled, focused: this.focused, hovered: this.hovered, icon: this.icon, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el), onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false), style: cssVars }, hAsync("div", { key: 'dee79baa195056a45b0af1c106b4f8890fc370a7', class: "sd-date-range-picker", ref: el => {
7106
+ this.triggerRef = el;
7107
+ } }, hAsync("sd-date-picker-trigger", { key: 'e5b46762012b35c8be2c56cbfbec22682ba7a3ed', displayText: this.displayText, placeholder: this.placeholder, disabled: this.disabled, size: this.size, onSdTriggerClick: this.handleTriggerClick })), (this.isOpen || this.isAnimatingOut) && (hAsync("sd-portal", { key: '47d0315e5a7baf3583286a730126ba0c4fdc1945', open: this.isOpen, parentRef: this.triggerRef, onSdClose: () => this.closeDropdown() }, hAsync("sd-date-range-picker-calendar", { key: '58b8765eacd17d7f7362ed67b8919eee8e89c68f', value: this.value, selectable: this.selectable, maxRange: this.maxRange, onSdSelect: this.handleSelect, onSdViewChange: this.handleViewChange })))));
6511
7108
  }
6512
- static get style() { return sdDatePickerCss(); }
7109
+ static get watchers() { return {
7110
+ "isOpen": [{
7111
+ "watchIsOpen": 0
7112
+ }]
7113
+ }; }
7114
+ static get style() { return sdDateRangePickerCss(); }
6513
7115
  static get cmpMeta() { return {
6514
- "$flags$": 514,
6515
- "$tagName$": "sd-date-picker",
7116
+ "$flags$": 512,
7117
+ "$tagName$": "sd-date-range-picker",
6516
7118
  "$members$": {
6517
- "value": [1537],
6518
- "label": [1],
7119
+ "value": [1040],
7120
+ "size": [1],
7121
+ "placeholder": [1],
6519
7122
  "selectable": [16],
7123
+ "maxRange": [2, "max-range"],
6520
7124
  "disabled": [4],
6521
- "placeholder": [1],
6522
- "isOpen": [32]
7125
+ "width": [8],
7126
+ "label": [1],
7127
+ "addonLabel": [1, "addon-label"],
7128
+ "hint": [1],
7129
+ "errorMessage": [1, "error-message"],
7130
+ "fieldName": [1, "field-name"],
7131
+ "rules": [16],
7132
+ "error": [1028],
7133
+ "icon": [16],
7134
+ "labelTooltip": [1, "label-tooltip"],
7135
+ "labelTooltipProps": [16],
7136
+ "isOpen": [32],
7137
+ "isAnimatingOut": [32],
7138
+ "focused": [32],
7139
+ "hovered": [32],
7140
+ "sdValidate": [64],
7141
+ "sdReset": [64],
7142
+ "sdResetValidate": [64]
6523
7143
  },
6524
7144
  "$listeners$": undefined,
6525
7145
  "$lazyBundleId$": "-",
6526
- "$attrsToReflect$": [["value", "value"]]
7146
+ "$attrsToReflect$": []
6527
7147
  }; }
6528
7148
  }
6529
7149
 
6530
- const sdDateRangePickerCss = () => `sd-date-range-picker.sc-sd-date-range-picker{width:fit-content;display:inline-flex}sd-date-range-picker.sc-sd-date-range-picker .sd-date-range-picker--disabled.sc-sd-date-range-picker .date-icon.sc-sd-date-range-picker{cursor:not-allowed !important;color:#888888 !important}sd-date-range-picker.sc-sd-date-range-picker .sd-date-range-picker--disabled.sc-sd-date-range-picker .sd-input__native.sc-sd-date-range-picker{color:#888888 !important}sd-date-range-picker.sc-sd-date-range-picker .sd-field.sc-sd-date-range-picker .sd-field__control.sc-sd-date-range-picker{min-width:210px}sd-date-range-picker.sc-sd-date-range-picker .sd-field.sc-sd-date-range-picker .sd-input__native.sc-sd-date-range-picker{margin-left:17px !important}.sd-date-range-picker__menu.sc-sd-date-range-picker{width:609px;box-sizing:border-box;border-radius:8px;padding:24px 19px;box-shadow:2px 2px 12px 2px rgba(0, 0, 0, 0.2);background:white}.sd-date-range-picker__menu.sc-sd-date-range-picker .sd-date-range-picker__header.sc-sd-date-range-picker{margin-bottom:16px;display:flex;flex-flow:row nowrap;align-items:center;justify-content:center}.sd-date-range-picker__menu.sc-sd-date-range-picker .sd-date-range-picker__header.sc-sd-date-range-picker .header-label.sc-sd-date-range-picker{margin:0 12px;width:40px;text-align:center;font-size:14px;line-height:24px}.sd-date-range-picker__menu.sc-sd-date-range-picker .sd-date-range-picker__body.sc-sd-date-range-picker{display:flex;flex-flow:row nowrap;align-items:stretch;gap:19px}.sd-date-range-picker__menu.sc-sd-date-range-picker .sd-date-range-picker__body.sc-sd-date-range-picker .calendar-container.sc-sd-date-range-picker{width:266px}.sd-date-range-picker__menu.sc-sd-date-range-picker .sd-date-range-picker__body.sc-sd-date-range-picker .calendar-container.sc-sd-date-range-picker .calendar-header.sc-sd-date-range-picker{width:100%;height:24px;line-height:24px;font-size:14px;text-align:center;position:relative;padding:0 5px}.sd-date-range-picker__menu.sc-sd-date-range-picker .sd-date-range-picker__body.sc-sd-date-range-picker .calendar-container.sc-sd-date-range-picker .calendar-header.sc-sd-date-range-picker button.sc-sd-date-range-picker{position:absolute;top:50%;transform:translateY(-50%)}.sd-date-range-picker__menu.sc-sd-date-range-picker .sd-date-range-picker__body.sc-sd-date-range-picker .calendar-container.sc-sd-date-range-picker .calendar-header.sc-sd-date-range-picker button.header-button-prev.sc-sd-date-range-picker{left:5px}.sd-date-range-picker__menu.sc-sd-date-range-picker .sd-date-range-picker__body.sc-sd-date-range-picker .calendar-container.sc-sd-date-range-picker .calendar-header.sc-sd-date-range-picker button.header-button-next.sc-sd-date-range-picker{right:5px;left:auto}.sd-date-range-picker__menu.sc-sd-date-range-picker .sd-date-range-picker__body.sc-sd-date-range-picker .calendar-container.sc-sd-date-range-picker .calendar-days.sc-sd-date-range-picker{padding:0 5px;margin-top:8px;display:grid;grid-template-columns:repeat(7, minmax(0, 1fr));column-gap:10px}.sd-date-range-picker__menu.sc-sd-date-range-picker .sd-date-range-picker__body.sc-sd-date-range-picker .calendar-container.sc-sd-date-range-picker .calendar-days.sc-sd-date-range-picker .day.sc-sd-date-range-picker{width:28px;height:20px;font-size:12px;line-height:20px;text-align:center;color:#888888}.sd-date-range-picker__menu.sc-sd-date-range-picker .sd-date-range-picker__body.sc-sd-date-range-picker .calendar-container.sc-sd-date-range-picker .calendar-body.sc-sd-date-range-picker{margin-top:12px;display:grid;grid-template-columns:repeat(7, minmax(0, 1fr))}.sd-date-range-picker__menu.sc-sd-date-range-picker .sd-date-range-picker__body.sc-sd-date-range-picker .separator.sc-sd-date-range-picker{width:1px;background-color:#D8D8D8}`;
7150
+ 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}`;
6531
7151
 
6532
- class SdDateRangePicker {
7152
+ class SdDateRangePickerCalendar {
6533
7153
  constructor(hostRef) {
6534
7154
  registerInstance(this, hostRef);
6535
- this.update = createEvent(this, "sdUpdate", 7);
7155
+ this.select = createEvent(this, "sdSelect", 7);
6536
7156
  this.viewChange = createEvent(this, "sdViewChange", 7);
6537
7157
  }
6538
- get el() { return getElement(this); }
6539
- value = ['', ''];
6540
- label;
7158
+ value = null;
6541
7159
  selectable;
6542
7160
  maxRange;
6543
- disabled = false;
6544
- placeholder = '';
6545
- isOpen = false;
6546
- dateRange = this.value;
7161
+ currentYear;
7162
+ currentMonth;
7163
+ pendingStart = '';
6547
7164
  hoverDate = '';
6548
- prevYear = Number(this.dateRange[0].split('-')[0]);
6549
- prevMonth = Number(this.dateRange[0].split('-')[1]);
6550
- update;
7165
+ displayValue = null;
7166
+ select;
6551
7167
  viewChange;
6552
- inputEl;
6553
7168
  dateUtil = useDatePicker();
6554
- tempDateRange = ['', ''];
6555
7169
  componentWillLoad() {
6556
- this.syncFromValue(this.value);
6557
- }
6558
- onValueChange(newValue) {
6559
- this.dateRange = [...newValue];
6560
- }
6561
- syncFromValue(value) {
6562
- this.dateRange = [...value];
6563
- this.resetCalendarByDateRange(value);
6564
- }
6565
- /* ----------------------------------
6566
- * Calendar View Logic
6567
- * ---------------------------------- */
6568
- resetCalendarByDateRange(range) {
6569
- // this.dateRange = this.value;
6570
- const start = range[0] || today;
6571
- const end = range[1] || start;
6572
- const [startYear, startMonth] = start.split('-').map(Number);
6573
- const [todayYear, todayMonth] = today.split('-').map(Number);
6574
- if (end <= today) {
6575
- // A. 완전 과거 검색(당월 포함X): 좌측 = 시작월 / 우측 = 종료월
6576
- this.prevYear = startYear;
6577
- this.prevMonth = startMonth;
6578
- }
6579
- else if (start < today && end > today) {
6580
- // B. 과거~미래 걸침(당월 포함O): 좌측 = 오늘의 달
6581
- this.prevYear = todayYear;
6582
- this.prevMonth = todayMonth;
6583
- }
6584
- else {
6585
- // C. 완전 미래 검색(당월 포함X): 좌측 = 시작월
6586
- this.prevYear = startYear;
6587
- this.prevMonth = startMonth;
6588
- }
7170
+ this.syncFromValue();
6589
7171
  }
6590
- get nextYear() {
6591
- return this.prevMonth === 12 ? this.prevYear + 1 : this.prevYear;
6592
- }
6593
- get nextMonth() {
6594
- return this.prevMonth === 12 ? 1 : this.prevMonth + 1;
6595
- }
6596
- get prevCalendar() {
6597
- return this.dateUtil.createCalendar(this.prevYear, this.prevMonth);
7172
+ handleValueChange() {
7173
+ this.syncFromValue();
6598
7174
  }
6599
- get nextCalendar() {
6600
- return this.dateUtil.createCalendar(this.nextYear, this.nextMonth);
7175
+ syncFromValue() {
7176
+ const base = this.value?.[0] || today;
7177
+ const [year, month] = base.split('-').map(Number);
7178
+ this.currentYear = year;
7179
+ this.currentMonth = month;
7180
+ this.pendingStart = '';
7181
+ this.hoverDate = '';
7182
+ this.displayValue = this.value ? [this.value[0], this.value[1]] : null;
6601
7183
  }
6602
- setPrevYear(year) {
6603
- this.prevYear = year;
7184
+ get rightYear() {
7185
+ return this.currentMonth === 12 ? this.currentYear + 1 : this.currentYear;
6604
7186
  }
6605
- setPrevMonth(month) {
6606
- this.prevMonth = month;
7187
+ get rightMonth() {
7188
+ return this.currentMonth === 12 ? 1 : this.currentMonth + 1;
6607
7189
  }
6608
- updateYearMonth(type) {
6609
- const { newYear, newMonth } = this.dateUtil.calculateYearMonth(this.prevYear, this.prevMonth, type);
6610
- this.setPrevYear(newYear);
6611
- this.setPrevMonth(newMonth);
6612
- this.viewChange.emit({ year: newYear, month: newMonth });
7190
+ formatDate(year, month, day) {
7191
+ return `${year}-${String(month).padStart(2, '0')}-${String(day).padStart(2, '0')}`;
6613
7192
  }
6614
- setHoverDate(date) {
6615
- this.hoverDate = date;
6616
- }
6617
- setDateRange(dateRange) {
6618
- this.dateRange = dateRange;
6619
- }
6620
- /* ----------------------------------
6621
- * UI Helpers
6622
- * ---------------------------------- */
6623
- formatDate(index, day) {
6624
- return this.dateUtil.formatDate(index === 0 ? this.prevYear : this.nextYear, index === 0 ? this.prevMonth : this.nextMonth, day);
6625
- }
6626
- getDateBoxType(date) {
6627
- const [start, end] = this.dateRange;
6628
- if (date === start)
6629
- return end ? 'start' : this.hoverDate < this.dateRange[0] ? 'end' : 'start';
6630
- if (date === end)
6631
- return 'end';
6632
- return '';
6633
- }
6634
- isDateInRange(date) {
6635
- const [start, end] = this.dateRange;
6636
- // 1. 날짜 범위가 완전히 선택된 경우
6637
- if (start && end) {
6638
- return date >= start && date <= end;
6639
- }
6640
- // 2. hover 상태의 날짜 범위를 확인
6641
- if (!this.hoverDate || !start || end) {
6642
- return false;
7193
+ buildCells(year, month) {
7194
+ const firstDayIndex = new Date(year, month - 1, 1).getDay();
7195
+ const daysInCurrent = new Date(year, month, 0).getDate();
7196
+ const prevMonth = month === 1 ? 12 : month - 1;
7197
+ const prevYear = month === 1 ? year - 1 : year;
7198
+ const daysInPrev = new Date(prevYear, prevMonth, 0).getDate();
7199
+ const nextMonth = month === 12 ? 1 : month + 1;
7200
+ const nextYear = month === 12 ? year + 1 : year;
7201
+ const cells = [];
7202
+ for (let i = firstDayIndex - 1; i >= 0; i--) {
7203
+ const day = daysInPrev - i;
7204
+ cells.push({
7205
+ date: this.formatDate(prevYear, prevMonth, day),
7206
+ day,
7207
+ inCurrentMonth: false,
7208
+ });
7209
+ }
7210
+ for (let day = 1; day <= daysInCurrent; day++) {
7211
+ cells.push({
7212
+ date: this.formatDate(year, month, day),
7213
+ day,
7214
+ inCurrentMonth: true,
7215
+ });
7216
+ }
7217
+ const remaining = (7 - (cells.length % 7)) % 7;
7218
+ for (let day = 1; day <= remaining; day++) {
7219
+ cells.push({
7220
+ date: this.formatDate(nextYear, nextMonth, day),
7221
+ day,
7222
+ inCurrentMonth: false,
7223
+ });
6643
7224
  }
6644
- // 3. dateRange[0]과 hoverDate를 기준으로 범위 계산
6645
- const [from, to] = start <= this.hoverDate ? [start, this.hoverDate] : [this.hoverDate, start];
6646
- return date >= from && date <= to;
7225
+ return cells;
6647
7226
  }
6648
- isDisabledDate(date) {
6649
- const [start, end] = this.dateRange;
6650
- if (this.maxRange && start && !end) {
6651
- const minDate = addDays(start, -this.maxRange);
6652
- const maxDate = addDays(start, this.maxRange);
6653
- return !(minDate <= date && date <= maxDate);
7227
+ emitViewChange() {
7228
+ this.viewChange.emit({ year: this.currentYear, month: this.currentMonth });
7229
+ }
7230
+ goPrevYear = (event) => {
7231
+ event.stopPropagation();
7232
+ this.currentYear -= 1;
7233
+ this.emitViewChange();
7234
+ };
7235
+ goNextYear = (event) => {
7236
+ event.stopPropagation();
7237
+ this.currentYear += 1;
7238
+ this.emitViewChange();
7239
+ };
7240
+ goPrevMonth = (event) => {
7241
+ event.stopPropagation();
7242
+ const { newYear, newMonth } = this.dateUtil.calculateYearMonth(this.currentYear, this.currentMonth, 'prev');
7243
+ this.currentYear = newYear;
7244
+ this.currentMonth = newMonth;
7245
+ this.emitViewChange();
7246
+ };
7247
+ goNextMonth = (event) => {
7248
+ event.stopPropagation();
7249
+ const { newYear, newMonth } = this.dateUtil.calculateYearMonth(this.currentYear, this.currentMonth, 'next');
7250
+ this.currentYear = newYear;
7251
+ this.currentMonth = newMonth;
7252
+ this.emitViewChange();
7253
+ };
7254
+ goToday = (event) => {
7255
+ event.stopPropagation();
7256
+ const [year, month] = today.split('-').map(Number);
7257
+ if (this.currentYear === year && this.currentMonth === month)
7258
+ return;
7259
+ this.currentYear = year;
7260
+ this.currentMonth = month;
7261
+ this.emitViewChange();
7262
+ };
7263
+ isDisabled(date) {
7264
+ if (this.selectable) {
7265
+ const [start, end] = this.selectable;
7266
+ if (start && date < start)
7267
+ return true;
7268
+ if (end && date > end)
7269
+ return true;
6654
7270
  }
6655
- if (!this.selectable || !this.selectable[0] || !this.selectable[1]) {
6656
- return false;
7271
+ if (this.maxRange && this.pendingStart) {
7272
+ const min = addDays(this.pendingStart, -this.maxRange);
7273
+ const max = addDays(this.pendingStart, this.maxRange);
7274
+ if (date < min || date > max)
7275
+ return true;
6657
7276
  }
6658
- return !(date >= this.selectable[0] && date <= this.selectable[1]);
7277
+ return false;
6659
7278
  }
6660
- /* ----------------------------------
6661
- * Interaction
6662
- * ---------------------------------- */
6663
- openMenu() {
6664
- if (this.disabled)
7279
+ handleDayClick(cell) {
7280
+ if (!cell.inCurrentMonth)
6665
7281
  return;
6666
- this.tempDateRange = [...this.dateRange];
6667
- this.resetCalendarByDateRange(this.dateRange);
6668
- this.isOpen = true;
7282
+ if (this.isDisabled(cell.date))
7283
+ return;
7284
+ const hasCompleteRange = !!this.displayValue && !!this.displayValue[0] && !!this.displayValue[1];
7285
+ if (!this.pendingStart || hasCompleteRange || cell.date < this.pendingStart) {
7286
+ this.pendingStart = cell.date;
7287
+ this.displayValue = null;
7288
+ this.hoverDate = '';
7289
+ return;
7290
+ }
7291
+ const newRange = [this.pendingStart, cell.date];
7292
+ this.pendingStart = '';
7293
+ this.hoverDate = '';
7294
+ this.displayValue = newRange;
7295
+ this.select.emit(newRange);
6669
7296
  }
6670
- closeMenu = () => {
6671
- if (!this.dateRange[0] || !this.dateRange[1]) {
6672
- this.dateRange = [...this.tempDateRange];
7297
+ handleDayHover(cell) {
7298
+ if (!cell.inCurrentMonth)
7299
+ return;
7300
+ if (this.pendingStart) {
7301
+ this.hoverDate = cell.date;
6673
7302
  }
6674
- this.isOpen = false;
6675
- };
6676
- handleDateClick(index, day) {
6677
- this.setHoverDate('');
6678
- const selectedDate = this.formatDate(index, day);
6679
- if (!this.dateRange[0] || !!this.dateRange[1] || selectedDate < this.dateRange[0]) {
6680
- this.setDateRange([selectedDate, '']);
6681
- return; // 아직 완료 아님
6682
- }
6683
- const newRange = [this.dateRange[0], selectedDate];
6684
- this.setDateRange(newRange);
6685
- this.value = newRange;
6686
- this.update.emit?.(newRange);
6687
- this.isOpen = false;
6688
7303
  }
6689
- handleDateHover(index, day) {
6690
- const hoverDate = this.formatDate(index, day);
6691
- this.setHoverDate(hoverDate);
7304
+ getRangeState(date, inCurrentMonth) {
7305
+ if (!inCurrentMonth) {
7306
+ return { inRange: false, isRangeStart: false, isRangeEnd: false, isSelectedEdge: false };
7307
+ }
7308
+ if (this.pendingStart) {
7309
+ const isStart = date === this.pendingStart;
7310
+ const previewEnd = this.hoverDate && this.hoverDate >= this.pendingStart ? this.hoverDate : '';
7311
+ const inPreview = !!previewEnd && date > this.pendingStart && date <= previewEnd;
7312
+ return {
7313
+ inRange: inPreview,
7314
+ isRangeStart: isStart,
7315
+ isRangeEnd: !!previewEnd && date === previewEnd,
7316
+ isSelectedEdge: isStart,
7317
+ };
7318
+ }
7319
+ if (this.displayValue && this.displayValue[0] && this.displayValue[1]) {
7320
+ const [start, end] = this.displayValue;
7321
+ const isStart = date === start;
7322
+ const isEnd = date === end;
7323
+ return {
7324
+ inRange: date > start && date < end,
7325
+ isRangeStart: isStart,
7326
+ isRangeEnd: isEnd,
7327
+ isSelectedEdge: isStart || isEnd,
7328
+ };
7329
+ }
7330
+ return { inRange: false, isRangeStart: false, isRangeEnd: false, isSelectedEdge: false };
7331
+ }
7332
+ renderHeader(year, month, isLeft) {
7333
+ const monthLabel = `${year}.${String(month).padStart(2, '0')}`;
7334
+ return (hAsync("div", { class: "sd-date-range-picker-calendar__header" }, hAsync("div", { class: "sd-date-range-picker-calendar__nav-group sd-date-range-picker-calendar__nav-group-month" }, hAsync("sd-ghost-button", { class: {
7335
+ 'sd-date-range-picker-calendar__nav-placeholder': !isLeft,
7336
+ }, ariaLabel: "prevMonth", size: "xxs", icon: "chevronLeft", onClick: this.goPrevMonth }), hAsync("span", { class: "sd-date-range-picker-calendar__label sd-date-range-picker-calendar__label-month" }, monthLabel), hAsync("sd-ghost-button", { class: {
7337
+ 'sd-date-range-picker-calendar__nav-placeholder': isLeft,
7338
+ }, ariaLabel: "nextMonth", size: "xxs", icon: "chevronRight", onClick: this.goNextMonth }))));
7339
+ }
7340
+ renderYearNav() {
7341
+ return (hAsync("div", { class: "sd-date-range-picker-calendar__top-bar" }, hAsync("div", { class: "sd-date-range-picker-calendar__year-nav" }, hAsync("sd-ghost-button", { ariaLabel: "prevYear", size: "xxs", icon: "chevronLeft", onClick: this.goPrevYear }), hAsync("span", { class: "sd-date-range-picker-calendar__label" }, this.currentYear), hAsync("sd-ghost-button", { ariaLabel: "nextYear", size: "xxs", icon: "chevronRight", onClick: this.goNextYear })), hAsync("button", { type: "button", class: "sd-date-range-picker-calendar__today-button", onClick: this.goToday }, "\uC624\uB298")));
7342
+ }
7343
+ renderPanel(year, month, isLeft) {
7344
+ const cells = this.buildCells(year, month);
7345
+ return (hAsync("div", { class: "sd-date-range-picker-calendar__panel" }, this.renderHeader(year, month, isLeft), hAsync("div", { class: "sd-date-range-picker-calendar__week" }, WEEK_LABELS.map(label => (hAsync("span", { key: label, class: "sd-date-range-picker-calendar__week-cell" }, label)))), hAsync("div", { class: "sd-date-range-picker-calendar__grid" }, cells.map(cell => {
7346
+ const { inRange, isRangeStart, isRangeEnd, isSelectedEdge } = this.getRangeState(cell.date, cell.inCurrentMonth);
7347
+ const isToday = cell.inCurrentMonth && today === cell.date;
7348
+ const isDisabled = cell.inCurrentMonth && this.isDisabled(cell.date);
7349
+ return (hAsync("button", { type: "button", key: cell.date, class: {
7350
+ 'sd-date-range-picker-calendar__day': true,
7351
+ 'sd-date-range-picker-calendar__day--empty': !cell.inCurrentMonth,
7352
+ 'sd-date-range-picker-calendar__day--today': isToday,
7353
+ 'sd-date-range-picker-calendar__day--in-range': inRange,
7354
+ 'sd-date-range-picker-calendar__day--range-start': isRangeStart,
7355
+ 'sd-date-range-picker-calendar__day--range-end': isRangeEnd,
7356
+ 'sd-date-range-picker-calendar__day--selected': isSelectedEdge,
7357
+ 'sd-date-range-picker-calendar__day--disabled': isDisabled,
7358
+ }, 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 : '')));
7359
+ }))));
6692
7360
  }
6693
7361
  render() {
6694
- return (hAsync("div", { key: 'ed71379abf9d60bfa21c9888ba0f84f543bc0fe2', class: {
6695
- 'sd-date-range-picker': true,
6696
- 'sd-date-range-picker--disabled': this.disabled,
6697
- } }, hAsync("sd-input", { key: 'd9b4269ee29ddf23dd80b5bcad2ded0d5edae8a6', ref: el => (this.inputEl = el), value: !!this.dateRange[0] ? `${this.dateRange[0]} ~ ${this.dateRange[1]}` : '', addonLabel: this.label, readonly: true, disabled: this.disabled, placeholder: this.placeholder, inputClass: "sd-date-range-picker__input", onClick: () => this.openMenu() }, hAsync("sd-icon", { key: 'a30448daa738ee75925974735f7a9948a47761e1', slot: "prefix", name: "date", size: "16", color: this.disabled ? 'grey_65' : 'grey_70', class: "date-icon", onClick: () => this.openMenu() })), this.isOpen && (hAsync("sd-portal", { key: '553abd0af76848be54788518507fbf0cc20db111', open: this.isOpen, parentRef: this.inputEl, onSdClose: this.closeMenu }, hAsync("div", { key: '152fb19e5c8dbd5e5f978b11868cc71b382255d8', class: "sd-date-range-picker__menu" }, hAsync("div", { key: '5d290d39d6aa8cc0d3a4394ac2f1d4bc93428bb3', class: "sd-date-range-picker__header mb-16pxr flex flex-nowrap items-center justify-center" }, hAsync("button", { key: 'b20caad91457bda87690629aa3fc34d4d2c5a673', type: "button", name: "prev", title: "Previous", onClick: () => {
6698
- this.setPrevYear(this.prevYear - 1);
6699
- this.viewChange.emit({ year: this.prevYear, month: this.prevMonth });
6700
- } }, hAsync("sd-icon", { key: '5f0e8014992b7269aed7d97a4a56263349c90afa', name: "arrowLeft", size: "12", color: "#CCCCCC" })), hAsync("div", { key: 'f324d84e338aa2779e471a123fc7b5220900389d', class: "header-label" }, this.prevYear), hAsync("button", { key: '18e331eb0c8fe3cc1eba2b718433ca7f7ec17b3e', type: "button", name: "next", title: "Next", onClick: () => {
6701
- this.setPrevYear(this.prevYear + 1);
6702
- this.viewChange.emit({ year: this.prevYear, month: this.prevMonth });
6703
- } }, hAsync("sd-icon", { key: '1ec935fbbb3ecbafb42df34905f62753dfd49da2', name: "arrowRight", size: "12", color: "#CCCCCC" }))), hAsync("div", { key: '47af9712b96158741a3fed052f4b1eb7bca08eef', class: "sd-date-range-picker__body" }, [this.prevCalendar, this.nextCalendar].map((calendar, index) => (hAsync(Fragment, null, index === 1 && hAsync("div", { class: "separator" }), hAsync("div", { key: index, class: "calendar-container" }, hAsync("div", { class: "calendar-header" }, hAsync("button", { type: "button", name: "month", title: "Month", class: index === 0 ? 'header-button-prev' : 'header-button-next', onClick: () => this.updateYearMonth(index === 0 ? 'prev' : 'next') }, hAsync("sd-icon", { name: index === 0 ? 'arrowLeft' : 'arrowRight', size: "12", color: "#CCCCCC" })), index === 0
6704
- ? `${this.prevYear}.${String(this.prevMonth).padStart(2, '0')}`
6705
- : `${this.nextYear}.${String(this.nextMonth).padStart(2, '0')}`), hAsync("div", { class: "calendar-days" }, ['일', '월', '화', '수', '목', '금', '토'].map(day => (hAsync("sd-date-box", { key: day, date: day, disabled: true, class: "day" })))), hAsync("div", { class: "calendar-body mt-12pxr grid grid-cols-7 gap-y-8pxr" }, [...calendar.prevMonthDays, ...calendar.days, ...calendar.afterMonthDays].map((day, idx) => (hAsync("sd-date-box", { key: `prev${day}_${idx}`, date: !day ? '' : Number(day), selected: this.dateRange.some(date => date === this.formatDate(index, Number(day))), type: this.getDateBoxType(this.formatDate(index, Number(day))), isToday: today === this.formatDate(index, Number(day)), disabled: !day ? true : this.isDisabledDate(this.formatDate(index, Number(day))), inRange: this.isDateInRange(this.formatDate(index, Number(day))), isStartDate: this.dateRange[0] === this.formatDate(index, Number(day)), isEndDate: this.dateRange[1] === this.formatDate(index, Number(day)), onSdClick: () => this.handleDateClick(index, Number(day)), onSdMouseOver: () => this.handleDateHover(index, Number(day)) }))))))))))))));
7362
+ const cssVars = {
7363
+ '--calendar-bg': CALENDAR_LAYOUT.bg,
7364
+ '--calendar-padding': `${CALENDAR_LAYOUT.paddingXY}px`,
7365
+ '--calendar-gap': `${CALENDAR_LAYOUT.gap}px`,
7366
+ '--calendar-radius': `${CALENDAR_LAYOUT.radius}px`,
7367
+ '--calendar-header-gap': `${CALENDAR_LAYOUT.header.gap}px`,
7368
+ '--calendar-header-divider': CALENDAR_LAYOUT.header.divider,
7369
+ '--calendar-header-font-size': `${CALENDAR_LAYOUT.header.fontSize}px`,
7370
+ '--calendar-header-line-height': `${CALENDAR_LAYOUT.header.lineHeight}px`,
7371
+ '--calendar-header-font-weight': CALENDAR_LAYOUT.header.fontWeight,
7372
+ '--calendar-week-font-size': `${CALENDAR_LAYOUT.week.fontSize}px`,
7373
+ '--calendar-week-line-height': `${CALENDAR_LAYOUT.week.lineHeight}px`,
7374
+ '--calendar-week-font-weight': CALENDAR_LAYOUT.week.fontWeight,
7375
+ '--calendar-week-color': CALENDAR_LAYOUT.week.color,
7376
+ '--calendar-grid-row-gap': `${CALENDAR_LAYOUT.grid.rowGap}px`,
7377
+ '--calendar-day-size': `${CALENDAR_LAYOUT.day.size}px`,
7378
+ '--calendar-day-circle-size': `${CALENDAR_LAYOUT.day.circleSize}px`,
7379
+ '--calendar-day-circle-radius': `${CALENDAR_LAYOUT.day.circleRadius}px`,
7380
+ '--calendar-day-text': CALENDAR_LAYOUT.day.defaultText,
7381
+ '--calendar-day-hover-text': CALENDAR_LAYOUT.day.hoverText,
7382
+ '--calendar-day-hover-border': CALENDAR_LAYOUT.day.hoverBorder,
7383
+ '--calendar-day-select-bg': CALENDAR_LAYOUT.day.selectBg,
7384
+ '--calendar-day-select-text': CALENDAR_LAYOUT.day.selectText,
7385
+ '--calendar-day-disabled-text': CALENDAR_LAYOUT.day.disabledText,
7386
+ '--calendar-day-font-size': `${CALENDAR_LAYOUT.day.fontSize}px`,
7387
+ '--calendar-day-line-height': `${CALENDAR_LAYOUT.day.lineHeight}px`,
7388
+ '--calendar-day-font-weight': CALENDAR_LAYOUT.day.fontWeight,
7389
+ '--range-bg': RANGE_LAYOUT.bg,
7390
+ '--range-height': `${RANGE_LAYOUT.height}px`,
7391
+ '--range-panel-gap': `${RANGE_LAYOUT.panelGap}px`,
7392
+ '--range-divider': RANGE_LAYOUT.divider,
7393
+ };
7394
+ return (hAsync(Fragment, { key: '5c9510be171a638870c8b86ef2c13c81d4920209' }, hAsync("div", { key: 'b9af5cf84625eb19039b6ab2b41622364cbbea82', class: "sd-date-range-picker-calendar", style: cssVars }, this.renderYearNav(), hAsync("div", { key: '83578cd21d5984e3ffbda26c90a96df82d78deb5', class: "sd-date-range-picker-calendar__panels" }, this.renderPanel(this.currentYear, this.currentMonth, true), hAsync("span", { key: '8c31d30b60f252adaafa1b830099743f6501e368', class: "sd-date-range-picker-calendar__divider", "aria-hidden": "true" }), this.renderPanel(this.rightYear, this.rightMonth, false)))));
6706
7395
  }
6707
7396
  static get watchers() { return {
6708
7397
  "value": [{
6709
- "onValueChange": 0
7398
+ "handleValueChange": 0
6710
7399
  }]
6711
7400
  }; }
6712
- static get style() { return sdDateRangePickerCss(); }
7401
+ static get style() { return sdDateRangePickerCalendarCss(); }
6713
7402
  static get cmpMeta() { return {
6714
- "$flags$": 514,
6715
- "$tagName$": "sd-date-range-picker",
7403
+ "$flags$": 512,
7404
+ "$tagName$": "sd-date-range-picker-calendar",
6716
7405
  "$members$": {
6717
- "value": [1040],
6718
- "label": [1],
7406
+ "value": [16],
6719
7407
  "selectable": [16],
6720
7408
  "maxRange": [2, "max-range"],
6721
- "disabled": [4],
6722
- "placeholder": [1],
6723
- "isOpen": [32],
6724
- "dateRange": [32],
7409
+ "currentYear": [32],
7410
+ "currentMonth": [32],
7411
+ "pendingStart": [32],
6725
7412
  "hoverDate": [32],
6726
- "prevYear": [32],
6727
- "prevMonth": [32]
7413
+ "displayValue": [32]
6728
7414
  },
6729
7415
  "$listeners$": undefined,
6730
7416
  "$lazyBundleId$": "-",
@@ -6834,20 +7520,15 @@ var systemTokens = {
6834
7520
 
6835
7521
  const DROPDOWN_BUTTON_NAMES = Object.keys(BUTTON_CONFIG).filter((name) => !name.endsWith('_lg'));
6836
7522
  const DROPDOWN_BUTTON_CONFIG = Object.fromEntries(DROPDOWN_BUTTON_NAMES.map(name => [name, BUTTON_CONFIG[name]]));
6837
- const DROPDOWN_BUTTON_MIN_WIDTHS = {
6838
- xs: buttonTokens.dropdown.xs.minWidth,
6839
- sm: buttonTokens.dropdown.sm.minWidth,
6840
- md: buttonTokens.dropdown.md.minWidth,
6841
- };
6842
7523
  const PRESET_HOVER_BACKGROUNDS = PRESET_HOVER_BACKGROUNDS$1;
6843
7524
  const PRESET_CONTENT_COLORS = PRESET_CONTENT_COLORS$1;
6844
7525
  const PRESET_BORDER_COLORS = PRESET_BORDER_COLORS$1;
6845
7526
  const PRESET_DIVIDER_COLORS = {
6846
- primary: buttonTokens.brand.strong.dropdown.divider,
6847
- secondary: buttonTokens.brand.subtle.dropdown.divider,
7527
+ primary: buttonTokens.button.brand.strong.dropdown.divider,
7528
+ secondary: buttonTokens.button.brand.subtle.dropdown.divider,
6848
7529
  primary_outline: PRESET_BORDER_COLORS.primary_outline,
6849
7530
  neutral_outline: PRESET_BORDER_COLORS.neutral_outline,
6850
- danger: buttonTokens.danger.strong.dropdown.divider,
7531
+ danger: buttonTokens.button.danger.strong.dropdown.divider,
6851
7532
  danger_outline: PRESET_BORDER_COLORS.danger_outline,
6852
7533
  };
6853
7534
  const MENU_ITEM_COLOR = systemTokens.color.content.secondary;
@@ -6877,13 +7558,13 @@ const PRESET_MENU_ITEM_ACTIVE_COLORS = {
6877
7558
  danger: MENU_ITEM_ACTIVE_COLOR,
6878
7559
  danger_outline: MENU_ITEM_ACTIVE_COLOR,
6879
7560
  };
6880
- const DROPDOWN_DISABLED_BACKGROUND = buttonTokens.bg.disabled;
6881
- const DROPDOWN_DISABLED_TEXT = buttonTokens.text.disabled;
6882
- const DROPDOWN_DISABLED_BORDER = buttonTokens.border.disabled;
7561
+ const DROPDOWN_DISABLED_BACKGROUND = buttonTokens.button.bg.disabled;
7562
+ const DROPDOWN_DISABLED_TEXT = buttonTokens.button.text.disabled;
7563
+ const DROPDOWN_DISABLED_BORDER = buttonTokens.button.border.disabled;
6883
7564
  const isDropdownButtonName = (value) => value in DROPDOWN_BUTTON_CONFIG;
6884
7565
  const getDropdownButtonPreset = (value) => getPresetName(value);
6885
7566
 
6886
- const sdDropdownButtonCss = () => `sd-dropdown-button{display:inline-flex;width:fit-content;height:fit-content}.sd-dropdown-button{display:inline-flex;position:relative}.sd-dropdown-button__trigger{--sd-dropdown-button-height:var(--sd-button-md-height, 34px);--sd-dropdown-button-padding-x:var(--sd-button-md-padding-x, 20px);--sd-dropdown-button-gap:var(--sd-button-md-gap, 8px);--sd-dropdown-button-font-family:var(--sd-button-md-typography-font-family, inherit);--sd-dropdown-button-font-size:var(--sd-button-md-typography-font-size, 12px);--sd-dropdown-button-font-weight:var(--sd-button-md-typography-font-weight, 500);--sd-dropdown-button-text-decoration:var(--sd-button-md-typography-text-decoration, none);--sd-dropdown-button-bg:#025497;--sd-dropdown-button-bg-hover:#004177;--sd-dropdown-button-border:transparent;--sd-dropdown-button-content:#ffffff;--sd-dropdown-button-current-content:var(--sd-dropdown-button-content);--sd-dropdown-button-divider:#006ac1;--sd-dropdown-button-accent:#006ac1;--sd-dropdown-button-min-width:106px;--sd-dropdown-button-disabled-bg:var(--sd-button-bg-disabled, $grey_30);--sd-dropdown-button-disabled-content:var(--sd-button-text-disabled, $grey_65);--sd-dropdown-button-disabled-border:var(--sd-button-border-disabled, $grey_45);display:inline-flex;align-items:stretch;justify-content:space-between;min-width:var(--sd-dropdown-button-min-width);min-height:var(--sd-dropdown-button-height);padding:0;border:var(--sd-button-border-width-default, 1px) solid var(--sd-dropdown-button-border);border-radius:var(--sd-button-radius-default, 4px);background:var(--sd-dropdown-button-bg);color:var(--sd-dropdown-button-current-content);cursor:pointer;box-sizing:border-box;font-family:var(--sd-dropdown-button-font-family);font-size:var(--sd-dropdown-button-font-size);font-weight:var(--sd-dropdown-button-font-weight);line-height:1;text-decoration:var(--sd-dropdown-button-text-decoration);transition:background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;white-space:nowrap}.sd-dropdown-button__trigger:hover:not(.sd-dropdown-button__trigger--disabled){background:var(--sd-dropdown-button-bg-hover)}.sd-dropdown-button__trigger:focus-visible{outline:0;box-shadow:0 0 0 2px var(--sd-dropdown-button-accent)}.sd-dropdown-button__trigger--xs{--sd-dropdown-button-height:var(--sd-button-xs-height, 24px);--sd-dropdown-button-padding-x:var(--sd-button-xs-padding-x, 8px);--sd-dropdown-button-gap:var(--sd-button-xs-gap, 4px);--sd-dropdown-button-font-family:var(--sd-button-xs-typography-font-family, inherit);--sd-dropdown-button-font-size:var(--sd-button-xs-typography-font-size, 12px);--sd-dropdown-button-font-weight:var(--sd-button-xs-typography-font-weight, 500);--sd-dropdown-button-text-decoration:var(--sd-button-xs-typography-text-decoration, none)}.sd-dropdown-button__trigger--sm{--sd-dropdown-button-height:var(--sd-button-sm-height, 28px);--sd-dropdown-button-padding-x:var(--sd-button-sm-padding-x, 12px);--sd-dropdown-button-gap:var(--sd-button-sm-gap, 6px);--sd-dropdown-button-font-family:var(--sd-button-sm-typography-font-family, inherit);--sd-dropdown-button-font-size:var(--sd-button-sm-typography-font-size, 12px);--sd-dropdown-button-font-weight:var(--sd-button-sm-typography-font-weight, 500);--sd-dropdown-button-text-decoration:var(--sd-button-sm-typography-text-decoration, none)}.sd-dropdown-button__trigger--md{--sd-dropdown-button-height:var(--sd-button-md-height, 34px);--sd-dropdown-button-padding-x:var(--sd-button-md-padding-x, 20px);--sd-dropdown-button-gap:var(--sd-button-md-gap, 8px);--sd-dropdown-button-font-family:var(--sd-button-md-typography-font-family, inherit);--sd-dropdown-button-font-size:var(--sd-button-md-typography-font-size, 16px);--sd-dropdown-button-font-weight:var(--sd-button-md-typography-font-weight, 500);--sd-dropdown-button-text-decoration:var(--sd-button-md-typography-text-decoration, none)}.sd-dropdown-button__trigger--disabled{border-color:var(--sd-dropdown-button-disabled-border);background:var(--sd-dropdown-button-disabled-bg);--sd-dropdown-button-current-content:var(--sd-dropdown-button-disabled-content);cursor:not-allowed}.sd-dropdown-button__trigger--disabled .sd-dropdown-button__trigger-divider{background:var(--sd-dropdown-button-disabled-border)}.sd-dropdown-button__trigger-label,.sd-dropdown-button__trigger-icon{display:inline-flex;align-items:center;justify-content:center}.sd-dropdown-button__trigger-label{flex:1 1 auto;min-width:0;padding:0 var(--sd-dropdown-button-padding-x)}.sd-dropdown-button__trigger-divider{align-self:stretch;width:1px;height:auto;background:var(--sd-dropdown-button-divider);opacity:0.9}.sd-dropdown-button__trigger-icon{flex:0 0 auto;min-width:calc(var(--sd-dropdown-button-height) - 2px);padding:0 calc(var(--sd-dropdown-button-gap) + 2px);transition:transform 0.2s ease}.sd-dropdown-button__trigger-icon--open{transform:rotate(180deg)}.sd-dropdown-button__menu{position:relative;display:grid;width:max-content;min-width:var(--sd-dropdown-button-menu-min-width, max-content);max-width:calc(100vw - 24px);padding:4px 0;border:0;border-radius:4px;background:#FFFFFF;box-shadow:2px 2px 12px 2px rgba(0, 0, 0, 0.1019607843);box-sizing:border-box;overflow:hidden}.sd-dropdown-button__menu-item{--sd-dropdown-button-menu-item-current-color:var(--sd-dropdown-button-menu-item-color);display:inline-flex;align-items:center;gap:8px;min-height:28px;width:100%;padding:0 12px;border:0;border-radius:0;background:transparent;color:var(--sd-dropdown-button-menu-item-current-color);cursor:pointer;box-sizing:border-box;font:inherit;text-align:left;transition:background-color 0.15s ease, color 0.15s ease}.sd-dropdown-button__menu-item--active{background:var(--sd-dropdown-button-menu-item-active-bg);--sd-dropdown-button-menu-item-current-color:var( --sd-dropdown-button-menu-item-active-color )}.sd-dropdown-button__menu-item--disabled{--sd-dropdown-button-menu-item-current-color:var(--sd-dropdown-button-disabled-content);cursor:not-allowed}.sd-dropdown-button__menu-item-icon{flex:0 0 auto}.sd-dropdown-button__menu-item-label{display:inline-flex;align-items:center;min-width:0;white-space:nowrap;font-size:12px}`;
7567
+ const sdDropdownButtonCss = () => `sd-dropdown-button{display:inline-flex;width:fit-content;height:fit-content}.sd-dropdown-button{display:inline-flex;position:relative}.sd-dropdown-button__trigger{--sd-dropdown-button-height:var(--sd-button-md-height, 34px);--sd-dropdown-button-padding-x:var(--sd-button-md-padding-x, 20px);--sd-dropdown-button-gap:var(--sd-button-md-gap, 8px);--sd-dropdown-button-font-family:var(--sd-button-md-typography-font-family, inherit);--sd-dropdown-button-font-size:var(--sd-button-md-typography-font-size, 12px);--sd-dropdown-button-font-weight:var(--sd-button-md-typography-font-weight, 500);--sd-dropdown-button-text-decoration:var(--sd-button-md-typography-text-decoration, none);--sd-dropdown-button-bg:#025497;--sd-dropdown-button-bg-hover:#004177;--sd-dropdown-button-border:transparent;--sd-dropdown-button-content:#ffffff;--sd-dropdown-button-current-content:var(--sd-dropdown-button-content);--sd-dropdown-button-divider:#006ac1;--sd-dropdown-button-accent:#006ac1;--sd-dropdown-button-disabled-bg:var(--sd-button-bg-disabled, $grey_30);--sd-dropdown-button-disabled-content:var(--sd-button-text-disabled, $grey_65);--sd-dropdown-button-disabled-border:var(--sd-button-border-disabled, $grey_45);display:inline-flex;align-items:stretch;justify-content:space-between;min-height:var(--sd-dropdown-button-height);padding:0;border:var(--sd-button-border-width-default, 1px) solid var(--sd-dropdown-button-border);border-radius:var(--sd-button-radius-sm, 4px);background:var(--sd-dropdown-button-bg);color:var(--sd-dropdown-button-current-content);cursor:pointer;box-sizing:border-box;font-family:var(--sd-dropdown-button-font-family);font-size:var(--sd-dropdown-button-font-size);font-weight:var(--sd-dropdown-button-font-weight);line-height:1;text-decoration:var(--sd-dropdown-button-text-decoration);transition:background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;white-space:nowrap}.sd-dropdown-button__trigger:hover:not(.sd-dropdown-button__trigger--disabled){background:var(--sd-dropdown-button-bg-hover)}.sd-dropdown-button__trigger:focus-visible{outline:0;box-shadow:0 0 0 2px var(--sd-dropdown-button-accent)}.sd-dropdown-button__trigger--xs{--sd-dropdown-button-height:var(--sd-button-xs-height, 24px);--sd-dropdown-button-padding-x:var(--sd-button-xs-padding-x, 8px);--sd-dropdown-button-gap:var(--sd-button-xs-gap, 4px);--sd-dropdown-button-font-family:var(--sd-button-xs-typography-font-family, inherit);--sd-dropdown-button-font-size:var(--sd-button-xs-typography-font-size, 12px);--sd-dropdown-button-font-weight:var(--sd-button-xs-typography-font-weight, 500);--sd-dropdown-button-text-decoration:var(--sd-button-xs-typography-text-decoration, none)}.sd-dropdown-button__trigger--sm{--sd-dropdown-button-height:var(--sd-button-sm-height, 28px);--sd-dropdown-button-padding-x:var(--sd-button-sm-padding-x, 12px);--sd-dropdown-button-gap:var(--sd-button-sm-gap, 6px);--sd-dropdown-button-font-family:var(--sd-button-sm-typography-font-family, inherit);--sd-dropdown-button-font-size:var(--sd-button-sm-typography-font-size, 12px);--sd-dropdown-button-font-weight:var(--sd-button-sm-typography-font-weight, 500);--sd-dropdown-button-text-decoration:var(--sd-button-sm-typography-text-decoration, none)}.sd-dropdown-button__trigger--md{--sd-dropdown-button-height:var(--sd-button-md-height, 34px);--sd-dropdown-button-padding-x:var(--sd-button-md-padding-x, 20px);--sd-dropdown-button-gap:var(--sd-button-md-gap, 8px);--sd-dropdown-button-font-family:var(--sd-button-md-typography-font-family, inherit);--sd-dropdown-button-font-size:var(--sd-button-md-typography-font-size, 16px);--sd-dropdown-button-font-weight:var(--sd-button-md-typography-font-weight, 500);--sd-dropdown-button-text-decoration:var(--sd-button-md-typography-text-decoration, none)}.sd-dropdown-button__trigger--disabled{border-color:var(--sd-dropdown-button-disabled-border);background:var(--sd-dropdown-button-disabled-bg);--sd-dropdown-button-current-content:var(--sd-dropdown-button-disabled-content);cursor:not-allowed}.sd-dropdown-button__trigger--disabled .sd-dropdown-button__trigger-divider{background:var(--sd-dropdown-button-disabled-border)}.sd-dropdown-button__trigger-label,.sd-dropdown-button__trigger-icon{display:inline-flex;align-items:center;justify-content:center}.sd-dropdown-button__trigger-label{flex:1 1 auto;min-width:0;padding:0 var(--sd-dropdown-button-padding-x)}.sd-dropdown-button__trigger-divider{align-self:stretch;width:1px;height:auto;background:var(--sd-dropdown-button-divider);opacity:0.9}.sd-dropdown-button__trigger-icon{flex:0 0 auto;min-width:calc(var(--sd-dropdown-button-height) - 2px);padding:0 calc(var(--sd-dropdown-button-gap) + 2px);transition:transform 0.2s ease}.sd-dropdown-button__trigger-icon--open{transform:rotate(180deg)}.sd-dropdown-button__menu{position:relative;display:grid;width:max-content;min-width:var(--sd-dropdown-button-menu-min-width, max-content);max-width:calc(100vw - 24px);padding:4px 0;border:0;border-radius:4px;background:#FFFFFF;box-shadow:2px 2px 12px 2px rgba(0, 0, 0, 0.1019607843);box-sizing:border-box;overflow:hidden}.sd-dropdown-button__menu-item{--sd-dropdown-button-menu-item-current-color:var(--sd-dropdown-button-menu-item-color);display:inline-flex;align-items:center;gap:8px;min-height:28px;width:100%;padding:0 12px;border:0;border-radius:0;background:transparent;color:var(--sd-dropdown-button-menu-item-current-color);cursor:pointer;box-sizing:border-box;font:inherit;text-align:left;transition:background-color 0.15s ease, color 0.15s ease}.sd-dropdown-button__menu-item--active{background:var(--sd-dropdown-button-menu-item-active-bg);--sd-dropdown-button-menu-item-current-color:var(--sd-dropdown-button-menu-item-active-color)}.sd-dropdown-button__menu-item--disabled{--sd-dropdown-button-menu-item-current-color:var(--sd-dropdown-button-disabled-content);cursor:not-allowed}.sd-dropdown-button__menu-item-icon{flex:0 0 auto}.sd-dropdown-button__menu-item-label{display:inline-flex;align-items:center;min-width:0;white-space:nowrap;font-size:12px}`;
6887
7568
 
6888
7569
  class SdDropdownButton extends BaseDropdownEvent {
6889
7570
  constructor(hostRef) {
@@ -7072,8 +7753,7 @@ class SdDropdownButton extends BaseDropdownEvent {
7072
7753
  }
7073
7754
  render() {
7074
7755
  const { config, preset } = this.resolvedConfig;
7075
- return (hAsync("div", { key: 'ec3cf7d184cbf49cc60a633b4a5de719a5903098', class: "sd-dropdown-button" }, hAsync("button", { key: '02a7208bc16fbd89af72d4dbc885951949507e11', type: "button", class: this.getTriggerClasses(preset, config.size, this.disabled, this.isOpen), disabled: this.disabled, "aria-haspopup": "menu", "aria-expanded": String(this.isOpen), onClick: this.toggleDropdown, ref: el => (this.triggerRef = el), style: {
7076
- '--sd-dropdown-button-min-width': `${DROPDOWN_BUTTON_MIN_WIDTHS[config.size]}px`,
7756
+ return (hAsync("div", { key: 'eaaa15c76c5c05dd8a7e103368ae5a884fd999b1', class: "sd-dropdown-button" }, hAsync("button", { key: '6e9dd2f7e7791ad7a4a17de1189bfc783cf61d69', type: "button", class: this.getTriggerClasses(preset, config.size, this.disabled, this.isOpen), disabled: this.disabled, "aria-haspopup": "menu", "aria-expanded": String(this.isOpen), onClick: this.toggleDropdown, ref: el => (this.triggerRef = el), style: {
7077
7757
  '--sd-dropdown-button-bg': config.color,
7078
7758
  '--sd-dropdown-button-bg-hover': PRESET_HOVER_BACKGROUNDS[preset],
7079
7759
  '--sd-dropdown-button-border': PRESET_BORDER_COLORS[preset],
@@ -7083,10 +7763,10 @@ class SdDropdownButton extends BaseDropdownEvent {
7083
7763
  '--sd-dropdown-button-disabled-bg': DROPDOWN_DISABLED_BACKGROUND,
7084
7764
  '--sd-dropdown-button-disabled-content': DROPDOWN_DISABLED_TEXT,
7085
7765
  '--sd-dropdown-button-disabled-border': DROPDOWN_DISABLED_BORDER,
7086
- } }, hAsync("span", { key: '04f3d92100e85b3aad59541a19002dc395c783fc', class: "sd-dropdown-button__trigger-label" }, this.label), hAsync("span", { key: '72a49942403856fecfc2415d7318ef549f80905c', class: "sd-dropdown-button__trigger-divider", "aria-hidden": "true" }), hAsync("span", { key: 'cc7926fb8b3eec86dfcbb3c0aec5d193fd202cca', class: {
7766
+ } }, hAsync("span", { key: '921f7f8c98537dd01645a95bef0468768dd8571c', class: "sd-dropdown-button__trigger-label" }, this.label), hAsync("span", { key: 'b871623ea1ba07cf797fd98e3057b01e7263234f', class: "sd-dropdown-button__trigger-divider", "aria-hidden": "true" }), hAsync("span", { key: '6c42e134ca5ed5291277c0316bceaf5bd6859363', class: {
7087
7767
  'sd-dropdown-button__trigger-icon': true,
7088
7768
  'sd-dropdown-button__trigger-icon--open': this.isOpen,
7089
- }, "aria-hidden": "true" }, hAsync("sd-icon", { key: '4540ee571613668bae9157221ff8550a07cd35fa', name: "chevronDown", size: 12, color: "var(--sd-dropdown-button-current-content)" }))), this.renderDropdown(preset)));
7769
+ }, "aria-hidden": "true" }, hAsync("sd-icon", { key: 'ae1df86b93b174cfc488f3fa079c62ff55ae2e67', name: "chevronDown", size: 12, color: "var(--sd-dropdown-button-current-content)" }))), this.renderDropdown(preset)));
7090
7770
  }
7091
7771
  static get watchers() { return {
7092
7772
  "isOpen": [{
@@ -7146,7 +7826,7 @@ var fieldTokens = {
7146
7826
  field: field
7147
7827
  };
7148
7828
 
7149
- 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:not(.sd-field--disabled):hover .sd-field__control{border:1px solid var(--sd-system-color-field-border-hover) !important;box-shadow:0px 0px 4px 0px rgba(0, 113, 255, 0.4)}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--has-label .sd-field__wrapper .sd-field__label{display:flex;align-items:center;height:var(--sd-field-label-height);margin-right:var(--sd-system-space-field-sm-gap)}sd-field .sd-field--has-label .sd-field__wrapper .sd-field__label__icon{margin-right:var(--sd-field-label-gap)}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}sd-field .sd-field--has-label .sd-field__wrapper .sd-field__label__tooltip{margin-left:var(--sd-field-label-gap)}sd-field .sd-field--has-addon .sd-field__control .sd-field__addon{display:flex;gap:var(--sd-field-addon-gap);align-items:center;white-space:nowrap;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-system-radius-field-sm) - 1px) 0 0 calc(var(--sd-system-radius-field-sm) - 1px)}sd-field .sd-field__wrapper{width:100%;height:var(--sd-system-size-field-sm-height);display:flex;align-items:center;flex-flow:row nowrap;position:relative;color:var(--sd-system-color-field-text-default);cursor:pointer;-webkit-user-select:none;user-select:none}sd-field .sd-field__wrapper .sd-field__control{position:relative;height:100%;display:flex;flex:1;min-width:0;border:1px solid var(--sd-system-color-field-border-default);border-radius:var(--sd-system-radius-field-sm);background:var(--sd-system-color-field-bg-default)}sd-field .sd-field--error:not(:hover) .sd-field__wrapper .sd-field__control{border:1px solid var(--sd-system-color-field-border-danger) !important}sd-field .sd-field.sd-field--focus .sd-field__wrapper .sd-field__control,sd-field .sd-field.sd-field--hover .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--pass .sd-field__wrapper .sd-field__control{border:1px solid var(--sd-system-color-field-border-success) !important}sd-field .sd-field .sd-field__error-message{color:var(--sd-textinput-input-text-error-message);font-size:var(--sd-textinput-input-error-message-typography-font-size);line-height:var(--sd-textinput-input-error-message-typography-line-height);margin-top:var(--sd-textinput-input-contents-gap)}sd-field .sd-field .sd-field__hint{color:var(--sd-textinput-input-text-hint);font-size:var(--sd-textinput-input-hint-typography-font-size);line-height:var(--sd-textinput-input-hint-typography-line-height);margin-top:var(--sd-textinput-input-contents-gap)}`;
7829
+ 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:not(.sd-field--disabled):hover .sd-field__control{border:1px solid var(--sd-system-color-field-border-hover) !important;box-shadow:0px 0px 4px 0px rgba(0, 113, 255, 0.4)}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--has-label .sd-field__wrapper .sd-field__label{display:flex;align-items:center;height:var(--sd-field-label-height);margin-right:var(--sd-system-space-field-sm-gap)}sd-field .sd-field--has-label .sd-field__wrapper .sd-field__label__icon{margin-right:var(--sd-field-label-gap)}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}sd-field .sd-field--has-label .sd-field__wrapper .sd-field__label__tooltip{margin-left:var(--sd-field-label-gap)}sd-field .sd-field--has-addon .sd-field__control .sd-field__addon{display:flex;gap:var(--sd-field-addon-gap);align-items:center;white-space:nowrap;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-system-radius-field-sm) - 1px) 0 0 calc(var(--sd-system-radius-field-sm) - 1px)}sd-field .sd-field__wrapper{width:100%;height:var(--sd-system-size-field-sm-height);display:flex;align-items:center;flex-flow:row nowrap;position:relative;color:var(--sd-system-color-field-text-default);cursor:pointer;-webkit-user-select:none;user-select:none}sd-field .sd-field__wrapper .sd-field__control{position:relative;height:100%;display:flex;flex:1;min-width:0;border:1px solid var(--sd-system-color-field-border-default);border-radius:var(--sd-system-radius-field-sm);background:var(--sd-system-color-field-bg-default)}sd-field .sd-field--error:not(:hover) .sd-field__wrapper .sd-field__control{border:1px solid var(--sd-system-color-field-border-danger) !important}sd-field .sd-field.sd-field--focus .sd-field__wrapper .sd-field__control,sd-field .sd-field.sd-field--hover .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--pass .sd-field__wrapper .sd-field__control{border:1px solid var(--sd-system-color-field-border-success) !important}sd-field .sd-field .sd-field__error-message{color:var(--sd-textinput-textinput-text-error-message);font-size:var(--sd-textinput-textinput-error-message-typography-font-size);line-height:var(--sd-textinput-textinput-error-message-typography-line-height);margin-top:var(--sd-textinput-textinput-contents-gap)}sd-field .sd-field .sd-field__hint{color:var(--sd-textinput-textinput-text-hint);font-size:var(--sd-textinput-textinput-hint-typography-font-size);line-height:var(--sd-textinput-textinput-hint-typography-line-height);margin-top:var(--sd-textinput-textinput-contents-gap)}`;
7150
7830
 
7151
7831
  const FORM_PARENT_TAGS = [
7152
7832
  'sd-select',
@@ -7158,6 +7838,8 @@ const FORM_PARENT_TAGS = [
7158
7838
  'sd-number-input',
7159
7839
  'sd-select-v2',
7160
7840
  'sd-file-picker',
7841
+ 'sd-date-picker',
7842
+ 'sd-date-range-picker',
7161
7843
  ];
7162
7844
  class SdField {
7163
7845
  constructor(hostRef) {
@@ -7298,12 +7980,12 @@ class SdField {
7298
7980
  '--sd-field-addon-border-width': `${addonTokens.border.width}px`,
7299
7981
  }
7300
7982
  : {};
7301
- return (hAsync("div", { key: 'e37722a9afbd78654328954262d4bc458634170a', class: {
7983
+ return (hAsync("div", { key: '3e4be9c9f1744faa0f763f0adc86c70bdceb8bbd', class: {
7302
7984
  'sd-field': true,
7303
7985
  'sd-field--has-label': !!this.label,
7304
7986
  'sd-field--has-addon': !!addon,
7305
7987
  [this.fieldStatus]: !!this.fieldStatus,
7306
- }, style: { ...labelCssVars, ...addonCssVars } }, hAsync("div", { key: '38440e5f21fba28ff49fd00bfd20189af9c43707', class: "sd-field__wrapper" }, this.renderLabel(this.label), hAsync("div", { key: 'b6d65e0db6667cbe9b4dd85ec72f9ecd08afa291', class: {
7988
+ }, style: { ...labelCssVars, ...addonCssVars } }, hAsync("div", { key: '240f8ffc487da6aa694aae2e2568a5c178233069', class: "sd-field__wrapper" }, this.renderLabel(this.label), hAsync("div", { key: '8d8273dfcf65dd7fe0dd6e565313470b491970a0', class: {
7307
7989
  'sd-field__control': true,
7308
7990
  'sd-field__control--has-addon': !!addon,
7309
7991
  }, style: this.width
@@ -7311,7 +7993,7 @@ class SdField {
7311
7993
  width: typeof this.width === 'number' ? `${this.width}px` : this.width,
7312
7994
  flex: 'none',
7313
7995
  }
7314
- : {} }, addon && hAsync("div", { key: '71a50d839dbbd7075c1f7f7b2daad0308ebc1225', class: "sd-field__addon" }, addon), hAsync("slot", { key: '5c0696834e82eddde81c6603d26373a745a1febb' }))), this.errorMsg || this.errorMessage ? (hAsync("div", { class: "sd-field__error-message" }, this.errorMsg || this.errorMessage)) : (this.hint && hAsync("div", { class: "sd-field__hint" }, this.hint))));
7996
+ : {} }, addon && hAsync("div", { key: 'b08657bb5fe753defdd273464a5faeabc1a7e57e', class: "sd-field__addon" }, addon), hAsync("slot", { key: '77c653b18f1cf4b3280e8deeff483ca22fbc0330' }))), this.errorMsg || this.errorMessage ? (hAsync("div", { class: "sd-field__error-message" }, this.errorMsg || this.errorMessage)) : (this.hint && hAsync("div", { class: "sd-field__hint" }, this.hint))));
7315
7997
  }
7316
7998
  renderLabel(label) {
7317
7999
  if (!label)
@@ -7774,7 +8456,7 @@ class SdFloatingPopover {
7774
8456
  this.close.emit();
7775
8457
  }
7776
8458
  render() {
7777
- return hAsync("slot", { key: '025daba88b77d9e250893b20261bfce08f37e332' });
8459
+ return hAsync("slot", { key: '4f7cf13fe78e7d4e906a2cda47de4258d9ceda74' });
7778
8460
  }
7779
8461
  static get style() { return sdFloatingPortalCss(); }
7780
8462
  static get cmpMeta() { return {
@@ -7859,7 +8541,7 @@ class SdForm {
7859
8541
  this.submitSuccess.emit();
7860
8542
  }
7861
8543
  render() {
7862
- return (hAsync("form", { key: '2a72e0fb172294913a22560311e8dfcc4b151968', onSubmit: e => this.onSubmit(e), class: this.formClass }, hAsync("slot", { key: 'd0bd0c7f915e10c7fd9aa36af68b2020035a43d4' })));
8544
+ return (hAsync("form", { key: 'd37e7f5291b9f340ed020aadbc7e111c6ac9d375', onSubmit: e => this.onSubmit(e), class: this.formClass }, hAsync("slot", { key: 'be3d12eb60e10a5b77dc9bd150ac2be23e08f3f0' })));
7863
8545
  }
7864
8546
  static get cmpMeta() { return {
7865
8547
  "$flags$": 772,
@@ -7897,7 +8579,7 @@ const ghostButton = {
7897
8579
  },
7898
8580
  lg: {
7899
8581
  size: "62",
7900
- icon: "36"
8582
+ icon: "32"
7901
8583
  },
7902
8584
  radius: "4",
7903
8585
  hover: {
@@ -7923,6 +8605,13 @@ const ghostButton = {
7923
8605
  hover: {
7924
8606
  bg: "#0075FF"
7925
8607
  }
8608
+ },
8609
+ inverse: {
8610
+ content: "#FFFFFF",
8611
+ disabled: "#E1E1E1",
8612
+ hover: {
8613
+ bg: "#FFFFFF"
8614
+ }
7926
8615
  }
7927
8616
  };
7928
8617
  var ghostButtonTokens = {
@@ -7958,13 +8647,21 @@ const GHOST_BUTTON_CONTENT_COLORS = {
7958
8647
  default: ghostButtonTokens.ghostButton.default.content,
7959
8648
  danger: ghostButtonTokens.ghostButton.danger.content,
7960
8649
  action: ghostButtonTokens.ghostButton.action.content,
8650
+ inverse: ghostButtonTokens.ghostButton.inverse.content,
7961
8651
  };
7962
8652
  const GHOST_BUTTON_HOVER_BG_COLORS = {
7963
8653
  default: ghostButtonTokens.ghostButton.default.hover.bg,
7964
8654
  danger: ghostButtonTokens.ghostButton.danger.hover.bg,
7965
8655
  action: ghostButtonTokens.ghostButton.action.hover.bg,
8656
+ inverse: ghostButtonTokens.ghostButton.inverse.hover.bg,
7966
8657
  };
7967
8658
  const GHOST_BUTTON_DISABLED_ICON = ghostButtonTokens.ghostButton.icon.disabled;
8659
+ const GHOST_BUTTON_DISABLED_COLORS = {
8660
+ default: GHOST_BUTTON_DISABLED_ICON,
8661
+ danger: GHOST_BUTTON_DISABLED_ICON,
8662
+ action: GHOST_BUTTON_DISABLED_ICON,
8663
+ inverse: ghostButtonTokens.ghostButton.inverse.disabled,
8664
+ };
7968
8665
 
7969
8666
  const sdGhostButtonCss = () => `sd-ghost-button{display:inline-flex;width:fit-content;height:fit-content}.sd-ghost-button{position:relative;display:inline-flex;align-items:center;justify-content:center;width:var(--sd-ghost-button-size);height:var(--sd-ghost-button-size);padding:0;border:none;border-radius:var(--sd-ghost-button-radius);background:transparent;cursor:pointer;box-sizing:border-box;transition:box-shadow 0.2s ease;-webkit-user-select:none;user-select:none}.sd-ghost-button::before{content:"";position:absolute;inset:0;border-radius:inherit;background:var(--sd-ghost-button-hover-bg);opacity:0;transition:opacity 0.2s ease;pointer-events:none}.sd-ghost-button:hover:not(.sd-ghost-button--disabled)::before{opacity:var(--sd-ghost-button-hover-opacity)}.sd-ghost-button:focus-visible{outline:0;box-shadow:0 0 0 2px var(--sd-ghost-button-accent)}.sd-ghost-button--disabled{cursor:not-allowed}`;
7970
8667
 
@@ -8004,10 +8701,10 @@ class SdGhostButton {
8004
8701
  render() {
8005
8702
  const sizeConfig = GHOST_BUTTON_SIZES[this.size];
8006
8703
  const contentColor = this.disabled
8007
- ? GHOST_BUTTON_DISABLED_ICON
8704
+ ? GHOST_BUTTON_DISABLED_COLORS[this.intent]
8008
8705
  : GHOST_BUTTON_CONTENT_COLORS[this.intent];
8009
8706
  const accessibleName = this.ariaLabel.trim() || undefined;
8010
- return (hAsync("button", { key: '8d6aa7e82d3e3f31638e98870283723fdb87e0e2', class: {
8707
+ return (hAsync("button", { key: '783888ed2c124bf8e08698de0bc2e904b86722e9', class: {
8011
8708
  'sd-ghost-button': true,
8012
8709
  'sd-ghost-button--disabled': this.disabled,
8013
8710
  }, type: "button", disabled: this.disabled, "aria-label": accessibleName, style: {
@@ -8016,7 +8713,7 @@ class SdGhostButton {
8016
8713
  '--sd-ghost-button-hover-bg': GHOST_BUTTON_HOVER_BG_COLORS[this.intent],
8017
8714
  '--sd-ghost-button-hover-opacity': GHOST_BUTTON_HOVER_OPACITY,
8018
8715
  '--sd-ghost-button-accent': GHOST_BUTTON_FOCUS_RING_COLOR,
8019
- }, onClick: this.handleClick }, hAsync("sd-icon", { key: 'd858b173e3f93c49703b31cde6be4fa81440ae7a', name: this.icon, size: sizeConfig.icon, color: contentColor })));
8716
+ }, onClick: this.handleClick }, hAsync("sd-icon", { key: '4ae4347b169267e6964c461126b6c9a4281578bb', name: this.icon, size: sizeConfig.icon, color: contentColor })));
8020
8717
  }
8021
8718
  static get style() { return sdGhostButtonCss(); }
8022
8719
  static get cmpMeta() { return {
@@ -8035,7 +8732,7 @@ class SdGhostButton {
8035
8732
  }; }
8036
8733
  }
8037
8734
 
8038
- const sdGuideCss = () => `@charset "UTF-8";sd-button{display:inline-flex;width:fit-content;height:fit-content}.sd-button{--sd-button-height:34px;--sd-button-padding-x:20px;--sd-button-gap:8px;--sd-button-font-family:inherit;--sd-button-font-size:16px;--sd-button-font-weight:500;--sd-button-text-decoration:none;--sd-button-label-min-width:auto;--sd-button-icon-only-size:var(--sd-button-height);text-decoration:none;cursor:pointer;border-radius:var(--sd-button-radius-default, 4px);transition:all 0.2s ease-in-out;position:relative;overflow:hidden;white-space:nowrap;-webkit-user-select:none;user-select:none;box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;border:none;padding:0 var(--sd-button-padding-x);min-width:var(--sd-button-min-width, auto);min-height:var(--sd-button-height);font-family:var(--sd-button-font-family);font-size:var(--sd-button-font-size);font-weight:var(--sd-button-font-weight);text-decoration:var(--sd-button-text-decoration)}.sd-button--xs{--sd-button-height:var(--sd-button-xs-height, 24px);--sd-button-padding-x:var(--sd-button-xs-padding-x, 8px);--sd-button-gap:var(--sd-button-xs-gap, 4px);--sd-button-font-family:var(--sd-button-xs-typography-font-family, inherit);--sd-button-font-size:var(--sd-button-xs-typography-font-size, 12px);--sd-button-font-weight:var(--sd-button-xs-typography-font-weight, 500);--sd-button-text-decoration:var(--sd-button-xs-typography-text-decoration, none);--sd-button-label-min-width:var(--sd-button-label-xs-min-width, auto);--sd-button-icon-only-size:var(--sd-button-icon-only-xs-width, var(--sd-button-height));line-height:20px}.sd-button--sm{--sd-button-height:var(--sd-button-sm-height, 28px);--sd-button-padding-x:var(--sd-button-sm-padding-x, 12px);--sd-button-gap:var(--sd-button-sm-gap, 6px);--sd-button-font-family:var(--sd-button-sm-typography-font-family, inherit);--sd-button-font-size:var(--sd-button-sm-typography-font-size, 12px);--sd-button-font-weight:var(--sd-button-sm-typography-font-weight, 500);--sd-button-text-decoration:var(--sd-button-sm-typography-text-decoration, none);--sd-button-label-min-width:var(--sd-button-label-sm-min-width, auto);--sd-button-icon-only-size:var(--sd-button-icon-only-sm-width, var(--sd-button-height));line-height:20px}.sd-button--md{--sd-button-height:var(--sd-button-md-height, 34px);--sd-button-padding-x:var(--sd-button-md-padding-x, 20px);--sd-button-gap:var(--sd-button-md-gap, 8px);--sd-button-font-family:var(--sd-button-md-typography-font-family, inherit);--sd-button-font-size:var(--sd-button-md-typography-font-size, 16px);--sd-button-font-weight:var(--sd-button-md-typography-font-weight, 500);--sd-button-text-decoration:var(--sd-button-md-typography-text-decoration, none);--sd-button-label-min-width:var(--sd-button-label-md-min-width, auto);--sd-button-icon-only-size:var(--sd-button-icon-only-md-width, var(--sd-button-height));line-height:26px}.sd-button--lg{--sd-button-height:var(--sd-button-lg-height, 62px);--sd-button-padding-x:var(--sd-button-lg-padding-x, 28px);--sd-button-gap:var(--sd-button-lg-gap, 12px);--sd-button-font-family:var(--sd-button-lg-typography-font-family, inherit);--sd-button-font-size:var(--sd-button-lg-typography-font-size, 18px);--sd-button-font-weight:var(--sd-button-lg-typography-font-weight, 500);--sd-button-text-decoration:var(--sd-button-lg-typography-text-decoration, none);--sd-button-label-min-width:var(--sd-button-label-lg-min-width, auto);--sd-button-icon-only-size:var(--sd-button-icon-only-lg-width, var(--sd-button-height));line-height:30px}.sd-button--has-label{--sd-button-min-width:var(--sd-button-label-min-width, auto)}.sd-button--primary{background-color:var(--button-color);color:white;transition:filter 0.2s ease}.sd-button--primary::before{content:"";position:absolute;inset:0;background:#000000;opacity:0;transition:opacity 0.2s ease;z-index:0}.sd-button--primary:hover:not(.sd-button--disabled):not(.sd-button--loading)::before{opacity:0.25}.sd-button--outline{background:white;border:var(--sd-button-border-width-default, 1px) solid var(--button-color);color:var(--button-color)}.sd-button--outline::before{content:"";position:absolute;inset:0;background:var(--button-color);opacity:0;transition:opacity 0.2s ease;z-index:0}.sd-button--outline:hover:not(.sd-button--disabled):not(.sd-button--loading)::before{opacity:0.15}.sd-button--outline .sd-button__content{position:relative;z-index:1}.sd-button--ghost{background-color:transparent;color:var(--button-color);border-color:transparent}.sd-button--ghost::before{content:"";position:absolute;inset:0;background:var(--button-color);opacity:0;transition:opacity 0.2s ease;z-index:0}.sd-button--ghost:hover:not(.sd-button--disabled):not(.sd-button--loading)::before{opacity:0.15}.sd-button--ghost .sd-button__content{position:relative;z-index:1}.sd-button--disabled{border:var(--sd-button-border-width-default, 1px) solid var(--sd-button-border-disabled, #CCCCCC);background:var(--sd-button-bg-disabled, #E1E1E1);color:var(--sd-button-content-disabled, #888888);cursor:not-allowed !important}.sd-button--icon-only{padding:0;width:var(--sd-button-icon-only-size, var(--sd-button-height));min-width:var(--sd-button-icon-only-size, var(--sd-button-height));height:var(--sd-button-icon-only-size, var(--sd-button-height))}.sd-button--no-hover:hover::before{opacity:0 !important}.sd-button .sd-button__content{display:inline-flex;align-items:center;justify-content:center;gap:var(--sd-button-gap);z-index:1;font-weight:inherit}sd-guide{display:inline-flex;align-items:center;height:fit-content;width:fit-content}sd-guide .sd-guide{display:inline-flex;align-items:center;height:fit-content;width:fit-content}sd-guide .sd-guide .sd-button{padding:0 16px 0 12px;border-radius:16px;color:#333333 !important;display:flex;align-items:center;transition:none}sd-guide .sd-guide .sd-button .sd-button__content{color:#333333 !important}sd-guide .sd-guide .sd-button .sd-button__content .sd-button__label{color:#333333 !important;margin-left:4px}sd-guide .sd-guide--active .sd-button{border:1px solid #00973C}sd-guide .sd-guide--active .sd-button .sd-button__content .sd-button__label{color:white !important}.sd-guide__popup{position:relative;padding:20px 32px;border-radius:8px;box-shadow:4px 4px 24px 4px rgba(0, 0, 0, 0.1);background:white}.sd-guide__popup>.sd-guide__popup__close{position:absolute;top:12px;right:12px}.sd-guide__popup__header{display:flex;align-items:center;gap:8px;margin-bottom:12px}.sd-guide__popup__header .sd-guide__popup__title{margin-top:0;font-size:16px;font-weight:700;line-height:26px;color:#333333}.sd-guide__popup__list{width:100%;padding:0;margin:0}.sd-guide__popup__list__item{display:flex;width:100%;align-items:start;list-style:none;color:#333333;font-size:12px;font-weight:400}.sd-guide__popup__list__item p{width:100%;padding:0;margin:0;word-wrap:break-word;word-break:break-word;white-space:normal;overflow-wrap:break-word;min-width:0}.sd-guide__popup__list__item::before{display:block;content:"-";width:6px;color:#333333;font-size:12px;font-weight:400;margin-left:10px;margin-right:12px;flex-shrink:0}.sd-guide__popup__list__item--depth-2::before{content:"•"}.sd-guide__popup__list__item--depth-2{padding-left:26px}`;
8735
+ const sdGuideCss = () => `@charset "UTF-8";sd-button{display:inline-flex;width:fit-content;height:fit-content}.sd-button{--sd-button-height:34px;--sd-button-padding-x:20px;--sd-button-gap:8px;--sd-button-font-family:inherit;--sd-button-font-size:16px;--sd-button-font-weight:500;--sd-button-text-decoration:none;--sd-button-label-min-width:auto;--sd-button-icon-only-size:var(--sd-button-height);text-decoration:none;cursor:pointer;border-radius:var(--sd-button-radius-sm, 4px);transition:all 0.2s ease-in-out;position:relative;overflow:hidden;white-space:nowrap;-webkit-user-select:none;user-select:none;box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;border:none;padding:0 var(--sd-button-padding-x);min-width:var(--sd-button-min-width, auto);min-height:var(--sd-button-height);font-family:var(--sd-button-font-family);font-size:var(--sd-button-font-size);font-weight:var(--sd-button-font-weight);text-decoration:var(--sd-button-text-decoration)}.sd-button--xs{--sd-button-height:var(--sd-button-xs-height, 24px);--sd-button-padding-x:var(--sd-button-xs-padding-x, 8px);--sd-button-gap:var(--sd-button-xs-gap, 4px);--sd-button-font-family:var(--sd-button-xs-typography-font-family, inherit);--sd-button-font-size:var(--sd-button-xs-typography-font-size, 12px);--sd-button-font-weight:var(--sd-button-xs-typography-font-weight, 500);--sd-button-text-decoration:var(--sd-button-xs-typography-text-decoration, none);--sd-button-label-min-width:var(--sd-button-label-xs-min-width, auto);--sd-button-icon-only-size:var(--sd-button-icon-only-xs-width, var(--sd-button-height));line-height:20px}.sd-button--sm{--sd-button-height:var(--sd-button-sm-height, 28px);--sd-button-padding-x:var(--sd-button-sm-padding-x, 12px);--sd-button-gap:var(--sd-button-sm-gap, 6px);--sd-button-font-family:var(--sd-button-sm-typography-font-family, inherit);--sd-button-font-size:var(--sd-button-sm-typography-font-size, 12px);--sd-button-font-weight:var(--sd-button-sm-typography-font-weight, 500);--sd-button-text-decoration:var(--sd-button-sm-typography-text-decoration, none);--sd-button-label-min-width:var(--sd-button-label-sm-min-width, auto);--sd-button-icon-only-size:var(--sd-button-icon-only-sm-width, var(--sd-button-height));line-height:20px}.sd-button--md{--sd-button-height:var(--sd-button-md-height, 34px);--sd-button-padding-x:var(--sd-button-md-padding-x, 20px);--sd-button-gap:var(--sd-button-md-gap, 8px);--sd-button-font-family:var(--sd-button-md-typography-font-family, inherit);--sd-button-font-size:var(--sd-button-md-typography-font-size, 16px);--sd-button-font-weight:var(--sd-button-md-typography-font-weight, 500);--sd-button-text-decoration:var(--sd-button-md-typography-text-decoration, none);--sd-button-label-min-width:var(--sd-button-label-md-min-width, auto);--sd-button-icon-only-size:var(--sd-button-icon-only-md-width, var(--sd-button-height));line-height:26px}.sd-button--lg{--sd-button-height:var(--sd-button-lg-height, 62px);--sd-button-padding-x:var(--sd-button-lg-padding-x, 28px);--sd-button-gap:var(--sd-button-lg-gap, 12px);--sd-button-font-family:var(--sd-button-lg-typography-font-family, inherit);--sd-button-font-size:var(--sd-button-lg-typography-font-size, 18px);--sd-button-font-weight:var(--sd-button-lg-typography-font-weight, 500);--sd-button-text-decoration:var(--sd-button-lg-typography-text-decoration, none);--sd-button-label-min-width:var(--sd-button-label-lg-min-width, auto);--sd-button-icon-only-size:var(--sd-button-icon-only-lg-width, var(--sd-button-height));line-height:30px}.sd-button--has-label{--sd-button-min-width:var(--sd-button-label-min-width, auto)}.sd-button--primary{background-color:var(--button-color);color:white;transition:filter 0.2s ease}.sd-button--primary::before{content:"";position:absolute;inset:0;background:#000000;opacity:0;transition:opacity 0.2s ease;z-index:0}.sd-button--primary:hover:not(.sd-button--disabled):not(.sd-button--loading)::before{opacity:0.25}.sd-button--outline{background:white;border:var(--sd-button-border-width-default, 1px) solid var(--button-color);color:var(--button-color)}.sd-button--outline::before{content:"";position:absolute;inset:0;background:var(--button-color);opacity:0;transition:opacity 0.2s ease;z-index:0}.sd-button--outline:hover:not(.sd-button--disabled):not(.sd-button--loading)::before{opacity:0.15}.sd-button--outline .sd-button__content{position:relative;z-index:1}.sd-button--ghost{background-color:transparent;color:var(--button-color);border-color:transparent}.sd-button--ghost::before{content:"";position:absolute;inset:0;background:var(--button-color);opacity:0;transition:opacity 0.2s ease;z-index:0}.sd-button--ghost:hover:not(.sd-button--disabled):not(.sd-button--loading)::before{opacity:0.15}.sd-button--ghost .sd-button__content{position:relative;z-index:1}.sd-button--disabled{border:var(--sd-button-border-width-default, 1px) solid var(--sd-button-border-disabled, #CCCCCC);background:var(--sd-button-bg-disabled, #E1E1E1);color:var(--sd-button-content-disabled, #888888);cursor:not-allowed !important}.sd-button--icon-only{padding:0;width:var(--sd-button-icon-only-size, var(--sd-button-height));min-width:var(--sd-button-icon-only-size, var(--sd-button-height));height:var(--sd-button-icon-only-size, var(--sd-button-height))}.sd-button--no-hover:hover::before{opacity:0 !important}.sd-button .sd-button__content{display:inline-flex;align-items:center;justify-content:center;gap:var(--sd-button-gap);z-index:1;font-weight:inherit}sd-guide{display:inline-flex;align-items:center;height:fit-content;width:fit-content}sd-guide .sd-guide{display:inline-flex;align-items:center;height:fit-content;width:fit-content}sd-guide .sd-guide .sd-button{padding:0 16px 0 12px;border-radius:16px;color:#333333 !important;display:flex;align-items:center;transition:none}sd-guide .sd-guide .sd-button .sd-button__content{color:#333333 !important}sd-guide .sd-guide .sd-button .sd-button__content .sd-button__label{color:#333333 !important;margin-left:4px}sd-guide .sd-guide--active .sd-button{border:1px solid #00973C}sd-guide .sd-guide--active .sd-button .sd-button__content .sd-button__label{color:white !important}.sd-guide__popup{position:relative;padding:20px 32px;border-radius:8px;box-shadow:4px 4px 24px 4px rgba(0, 0, 0, 0.1);background:white}.sd-guide__popup>.sd-guide__popup__close{position:absolute;top:12px;right:12px}.sd-guide__popup__header{display:flex;align-items:center;gap:8px;margin-bottom:12px}.sd-guide__popup__header .sd-guide__popup__title{margin-top:0;font-size:16px;font-weight:700;line-height:26px;color:#333333}.sd-guide__popup__list{width:100%;padding:0;margin:0}.sd-guide__popup__list__item{display:flex;width:100%;align-items:start;list-style:none;color:#333333;font-size:12px;font-weight:400}.sd-guide__popup__list__item p{width:100%;padding:0;margin:0;word-wrap:break-word;word-break:break-word;white-space:normal;overflow-wrap:break-word;min-width:0}.sd-guide__popup__list__item::before{display:block;content:"-";width:6px;color:#333333;font-size:12px;font-weight:400;margin-left:10px;margin-right:12px;flex-shrink:0}.sd-guide__popup__list__item--depth-2::before{content:"•"}.sd-guide__popup__list__item--depth-2{padding-left:26px}`;
8039
8736
 
8040
8737
  const GUIDE_LABEL = {
8041
8738
  help: '활용 TIP',
@@ -8088,9 +8785,9 @@ class SdGuide {
8088
8785
  };
8089
8786
  render() {
8090
8787
  const { name: iconName, size: iconSize, color: iconColor } = GUIDE_ICON[this.type];
8091
- return (hAsync("div", { key: 'd98a48deb586592dbb379acb4e3725a97601dccd', class: "sd-guide", style: {
8788
+ return (hAsync("div", { key: '0f70d3686c37c029635c93a8ad8f937fb2ca73c2', class: "sd-guide", style: {
8092
8789
  '--sd-guide-color': GUIDE_ICON[this.type].color,
8093
- } }, hAsync("sd-button", { key: '35b3215ac7d73f2ae9375ab46b2981b314769fdd', ref: el => (this.guideRef = el), class: this.guideClass, variant: this.popupShow ? 'primary' : 'outline', label: this.label || GUIDE_LABEL[this.type], size: "sm", color: this.popupShow ? GUIDE_ICON[this.type].color : 'grey_45', icon: iconName, iconColor: this.popupShow ? 'white' : iconColor, iconSize: iconSize, noHover: this.popupShow, onSdClick: this.handleClickGuide }), this.type === 'help' && this.popupShow && (hAsync("sd-portal", { key: '56bda42619f3f10fbdc428e3d11abc1a4a812029', open: this.popupShow, parentRef: this.guideRef, onSdClose: this.closeDropdown, offset: [0, 4] }, hAsync("div", { key: 'a73954469eb2f711ece68c8b17fe2d197b4fd515', style: { position: 'absolute', width: '0px', height: '0px' } }, hAsync("div", { key: 'bf07222fe61b7121d99f0ae39e1e7ffb539db1de', class: "sd-guide__popup", style: { width: this.popupWidth ? this.popupWidth + 'px' : '426px' } }, hAsync("sd-button", { key: 'c9b8d6c2a311e7a83e9c8b2568b3010e5619ad51', class: "sd-guide__popup__close", icon: "close", color: "grey_65", size: "md", variant: "ghost", noHover: true, onSdClick: this.closeDropdown }), hAsync("div", { key: 'da280eb73610cb0f70c5adbf10e413ea4d8a4629', class: "sd-guide__popup__header" }, hAsync("sd-icon", { key: 'ec73b6ed0777b464208e9bf94d96b044d8770714', name: "helpOutline", size: 24, color: "green_65" }), hAsync("h3", { key: '18a221c3dedb1882479c2a567b3c870d7dfd157b', class: "sd-guide__popup__title" }, this.popupTitle || GUIDE_LABEL[this.type])), hAsync("ul", { key: '5a8abec7b5c3246a5eb6a7ec45a3c16a05ccab72', class: "sd-guide__popup__list" }, this.renderListItem(this.message))))))));
8790
+ } }, hAsync("sd-button", { key: 'f07235cc53a908237af2f13a98f325340c83fd0e', ref: el => (this.guideRef = el), class: this.guideClass, variant: this.popupShow ? 'primary' : 'outline', label: this.label || GUIDE_LABEL[this.type], size: "sm", color: this.popupShow ? GUIDE_ICON[this.type].color : 'grey_45', icon: iconName, iconColor: this.popupShow ? 'white' : iconColor, iconSize: iconSize, noHover: this.popupShow, onSdClick: this.handleClickGuide }), this.type === 'help' && this.popupShow && (hAsync("sd-portal", { key: '9c5ade0db41a02a343bb77bc1dcb44d12dba6c04', open: this.popupShow, parentRef: this.guideRef, onSdClose: this.closeDropdown, offset: [0, 4] }, hAsync("div", { key: 'd59caf4107b678ce132accfe9f392c3cfa6b35f4', style: { position: 'absolute', width: '0px', height: '0px' } }, hAsync("div", { key: '22aa97a939e27454dec067effc6911aea6ace2a4', class: "sd-guide__popup", style: { width: this.popupWidth ? this.popupWidth + 'px' : '426px' } }, hAsync("sd-button", { key: '6bf404b6718bbd036acff51101538d967a2cd642', class: "sd-guide__popup__close", icon: "close", color: "grey_65", size: "md", variant: "ghost", noHover: true, onSdClick: this.closeDropdown }), hAsync("div", { key: 'a63aa9263715f57f2e8bf977c4849f868803a704', class: "sd-guide__popup__header" }, hAsync("sd-icon", { key: '8ba1969ada651d3226058bb9095ae8b794be1759', name: "helpOutline", size: 24, color: "green_65" }), hAsync("h3", { key: '41dd2533e146eae12ee7367a243e819362597761', class: "sd-guide__popup__title" }, this.popupTitle || GUIDE_LABEL[this.type])), hAsync("ul", { key: 'b45bfd9ff793f0c0860789d16c1c17fef2ad01d5', class: "sd-guide__popup__list" }, this.renderListItem(this.message))))))));
8094
8791
  }
8095
8792
  // 현재 2depth까지만 스타일 적용
8096
8793
  renderListItem(message, depth = 0) {
@@ -8649,8 +9346,8 @@ class SdIcon {
8649
9346
  }; }
8650
9347
  }
8651
9348
 
8652
- const sm$1 = inputTokens.input.sm;
8653
- const md$1 = inputTokens.input.md;
9349
+ const sm$1 = inputTokens.textinput.sm;
9350
+ const md$1 = inputTokens.textinput.md;
8654
9351
  const INPUT_SIZE_MAP = {
8655
9352
  sm: {
8656
9353
  height: sm$1.height,
@@ -8672,11 +9369,11 @@ const INPUT_SIZE_MAP = {
8672
9369
  },
8673
9370
  };
8674
9371
  const INPUT_COLORS = {
8675
- text: inputTokens.input.text,
8676
- icon: inputTokens.input.icon,
9372
+ text: inputTokens.textinput.text,
9373
+ icon: inputTokens.textinput.icon,
8677
9374
  };
8678
9375
 
8679
- const sdInputCss = () => `sd-icon{display:inline-block;line-height:0}sd-icon .sd-icon--rotate-90{transform:rotate(90deg)}sd-icon .sd-icon--rotate-180{transform:rotate(180deg)}sd-icon .sd-icon--rotate-270{transform:rotate(270deg)}.sd-date-picker{width:100%;display:inline-block}.sd-date-picker .sd-date-picker--disabled .date-icon{cursor:not-allowed !important;color:#888888 !important}.sd-date-picker .sd-date-picker__input{text-align:center !important}.sd-date-picker__menu{border-radius:8px;box-shadow:2px 2px 12px 2px rgba(0, 0, 0, 0.2)}sd-date-range-picker{width:fit-content;display:inline-flex}sd-date-range-picker .sd-date-range-picker--disabled .date-icon{cursor:not-allowed !important;color:#888888 !important}sd-date-range-picker .sd-date-range-picker--disabled .sd-input__native{color:#888888 !important}sd-date-range-picker .sd-field .sd-field__control{min-width:210px}sd-date-range-picker .sd-field .sd-input__native{margin-left:17px !important}.sd-date-range-picker__menu{width:609px;box-sizing:border-box;border-radius:8px;padding:24px 19px;box-shadow:2px 2px 12px 2px rgba(0, 0, 0, 0.2);background:white}.sd-date-range-picker__menu .sd-date-range-picker__header{margin-bottom:16px;display:flex;flex-flow:row nowrap;align-items:center;justify-content:center}.sd-date-range-picker__menu .sd-date-range-picker__header .header-label{margin:0 12px;width:40px;text-align:center;font-size:14px;line-height:24px}.sd-date-range-picker__menu .sd-date-range-picker__body{display:flex;flex-flow:row nowrap;align-items:stretch;gap:19px}.sd-date-range-picker__menu .sd-date-range-picker__body .calendar-container{width:266px}.sd-date-range-picker__menu .sd-date-range-picker__body .calendar-container .calendar-header{width:100%;height:24px;line-height:24px;font-size:14px;text-align:center;position:relative;padding:0 5px}.sd-date-range-picker__menu .sd-date-range-picker__body .calendar-container .calendar-header button{position:absolute;top:50%;transform:translateY(-50%)}.sd-date-range-picker__menu .sd-date-range-picker__body .calendar-container .calendar-header button.header-button-prev{left:5px}.sd-date-range-picker__menu .sd-date-range-picker__body .calendar-container .calendar-header button.header-button-next{right:5px;left:auto}.sd-date-range-picker__menu .sd-date-range-picker__body .calendar-container .calendar-days{padding:0 5px;margin-top:8px;display:grid;grid-template-columns:repeat(7, minmax(0, 1fr));column-gap:10px}.sd-date-range-picker__menu .sd-date-range-picker__body .calendar-container .calendar-days .day{width:28px;height:20px;font-size:12px;line-height:20px;text-align:center;color:#888888}.sd-date-range-picker__menu .sd-date-range-picker__body .calendar-container .calendar-body{margin-top:12px;display:grid;grid-template-columns:repeat(7, minmax(0, 1fr))}.sd-date-range-picker__menu .sd-date-range-picker__body .separator{width:1px;background-color:#D8D8D8}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}sd-input{display:inline-flex}sd-input .sd-input__content{width:100%;height:100%;display:flex;flex-flow:row nowrap;align-items:center;color:var(--sd-input-text-color);font-size:var(--sd-input-font-size);line-height:var(--sd-input-line-height);font-weight:var(--sd-input-font-weight);padding:0 var(--sd-input-padding-x);gap:var(--sd-input-gap)}sd-input .sd-input__content .sd-input__native{width:100%;height:100%;border:none;outline:none;background:transparent;font-size:inherit;line-height:inherit;font-weight:inherit;color:inherit}sd-input .sd-input__content .sd-input__native[disabled]{cursor:not-allowed;color:var(--sd-input-disabled-color)}sd-input .sd-input__content .sd-input__native::placeholder{color:var(--sd-input-placeholder-color)}sd-input .sd-input__content .sd-input__clear-icon,sd-input .sd-input__content .sd-input__password-icon{flex-shrink:0}sd-input .sd-input__content .sd-input__native[disabled]~.sd-input__clear-icon,sd-input .sd-input__content .sd-input__native[disabled]~.sd-input__password-icon{cursor:not-allowed;pointer-events:none}`;
9376
+ const sdInputCss = () => `sd-icon{display:inline-block;line-height:0}sd-icon .sd-icon--rotate-90{transform:rotate(90deg)}sd-icon .sd-icon--rotate-180{transform:rotate(180deg)}sd-icon .sd-icon--rotate-270{transform:rotate(270deg)}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}sd-input{display:inline-flex}sd-input .sd-input__content{width:100%;height:100%;display:flex;flex-flow:row nowrap;align-items:center;color:var(--sd-input-text-color);font-size:var(--sd-input-font-size);line-height:var(--sd-input-line-height);font-weight:var(--sd-input-font-weight);padding:0 var(--sd-input-padding-x);gap:var(--sd-input-gap)}sd-input .sd-input__content .sd-input__native{width:100%;height:100%;border:none;outline:none;background:transparent;font-size:inherit;line-height:inherit;font-weight:inherit;color:inherit}sd-input .sd-input__content .sd-input__native[disabled]{cursor:not-allowed;color:var(--sd-input-disabled-color)}sd-input .sd-input__content .sd-input__native::placeholder{color:var(--sd-input-placeholder-color)}sd-input .sd-input__content .sd-input__clear-icon,sd-input .sd-input__content .sd-input__password-icon{flex-shrink:0}sd-input .sd-input__content .sd-input__native[disabled]~.sd-input__clear-icon,sd-input .sd-input__content .sd-input__native[disabled]~.sd-input__password-icon{cursor:not-allowed;pointer-events:none}`;
8680
9377
 
8681
9378
  class SdInput {
8682
9379
  constructor(hostRef) {
@@ -8793,12 +9490,12 @@ class SdInput {
8793
9490
  '--sd-system-size-field-sm-height': `${sizeTokens.height}px`,
8794
9491
  '--sd-system-radius-field-sm': `${sizeTokens.radius}px`,
8795
9492
  };
8796
- return (hAsync("sd-field", { key: 'd5f554784340cbb9246165fb15124098e4f7165b', name: this.name, label: this.label, addonLabel: this.addonLabel, hint: this.hint, errorMessage: this.errorMessage, width: this.width, rules: this.rules, error: this.error, disabled: this.disabled, focused: this.focused, hovered: this.hovered, status: this.status, icon: this.icon, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el), onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false), style: cssVars }, hAsync("label", { key: '02225d57c5bd17dbe78c680f243ad3a9a4ab3b5d', class: "sd-input__content" }, hAsync("slot", { key: '1011876ea9726e62a19047b28a82932e43762436', name: "prefix" }), hAsync("input", { key: '10f4c594382aa002ba09a0012979ff930154fc7a', name: this.name, ref: el => (this.nativeEl = el), class: `sd-input__native ${this.inputClass}`, type: this.type === 'password' && this.passwordVisible ? 'text' : this.type, value: this.internalValue || '', placeholder: this.placeholder, disabled: this.disabled, readonly: this.readonly, autofocus: this.autoFocus, autocomplete: this.autocomplete || undefined, maxlength: this.maxlength, minlength: this.minlength, inputmode: this.inputmode, enterkeyhint: this.enterkeyhint, spellcheck: this.spellcheck, onInput: this.handleInput, onFocus: event => this.handleFocus('focus', event), onBlur: event => this.handleFocus('blur', event), style: this.inputStyle }), hAsync("slot", { key: '007d15357a81f13ab4db5ddf237110b9d1f1728b', name: "suffix" }), this.clearable && this.internalValue && !this.disabled && (hAsync("sd-ghost-button", { key: '92dfd40117cccdb48ebfc0056aa9e093546bbf6b', icon: "close", ariaLabel: "close", size: "xxs", disabled: this.disabled, class: "sd-input__clear-icon", onClick: async () => {
9493
+ return (hAsync("sd-field", { key: '16881490eb9d8d08aa0788be2dbb845b12f50269', name: this.name, label: this.label, addonLabel: this.addonLabel, hint: this.hint, errorMessage: this.errorMessage, width: this.width, rules: this.rules, error: this.error, disabled: this.disabled, focused: this.focused, hovered: this.hovered, status: this.status, icon: this.icon, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el), onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false), style: cssVars }, hAsync("label", { key: '04e71967c3b3f7bf4589a3aaf4505c5d67d615da', class: "sd-input__content" }, hAsync("slot", { key: '18476a19c8825734e475116586bab2711c1d84e3', name: "prefix" }), hAsync("input", { key: '7600e0ade86d1bca8ba6197d49bd72ef4d0778dd', name: this.name, ref: el => (this.nativeEl = el), class: `sd-input__native ${this.inputClass}`, type: this.type === 'password' && this.passwordVisible ? 'text' : this.type, value: this.internalValue || '', placeholder: this.placeholder, disabled: this.disabled, readonly: this.readonly, autofocus: this.autoFocus, autocomplete: this.autocomplete || undefined, maxlength: this.maxlength, minlength: this.minlength, inputmode: this.inputmode, enterkeyhint: this.enterkeyhint, spellcheck: this.spellcheck, onInput: this.handleInput, onFocus: event => this.handleFocus('focus', event), onBlur: event => this.handleFocus('blur', event), style: this.inputStyle }), hAsync("slot", { key: '5c98ef1acdb26a1c0f89fc04101c0315b017c08a', name: "suffix" }), this.clearable && this.internalValue && !this.disabled && (hAsync("sd-ghost-button", { key: 'f188270be3635c68d99a453eaba61f53d6bb2bc7', icon: "close", ariaLabel: "close", size: "xxs", disabled: this.disabled, class: "sd-input__clear-icon", onClick: async () => {
8797
9494
  if (this.disabled)
8798
9495
  return;
8799
9496
  this.internalValue = '';
8800
9497
  await this.formField?.sdValidate();
8801
- } })), this.type === 'password' && (hAsync("sd-ghost-button", { key: 'a4bef720b55a94a4a6ada002f4a2ffd1d0f8da24', icon: this.passwordVisible ? 'visibilityOn' : 'visibilityOff', ariaLabel: "visibility", size: "xxs", disabled: this.disabled, class: "sd-input__password-icon", onClick: () => {
9498
+ } })), this.type === 'password' && (hAsync("sd-ghost-button", { key: 'cedaceae0b81e007e4672a57c950bd6b23d045cd', icon: this.passwordVisible ? 'visibilityOn' : 'visibilityOff', ariaLabel: "visibility", size: "xxs", disabled: this.disabled, class: "sd-input__password-icon", onClick: () => {
8802
9499
  if (this.disabled)
8803
9500
  return;
8804
9501
  this.passwordVisible = !this.passwordVisible;
@@ -8871,7 +9568,7 @@ class SdLoadingSpinner {
8871
9568
  return resolveColor(this.color);
8872
9569
  }
8873
9570
  render() {
8874
- return (hAsync(Fragment, { key: '1a4edb8be9cc83ab900cd615ee30958d9822e98b' }, hAsync("svg", { key: '634070026b58303bf3423b10f37ed6603179b9b1', class: "sd-loading-spinner", width: "72px", height: "72px", viewBox: "25 25 50 50", style: { color: this.resolvedColor } }, hAsync("circle", { key: 'fda3f7e4f787176f6030e19a3f2c1dd59326d35a', class: "path", cx: "50", cy: "50", r: "20", fill: "none", stroke: "currentColor", "stroke-width": "5", "stroke-miterlimit": "10" }))));
9571
+ return (hAsync(Fragment, { key: 'a86933f554042c2d4b18836d37bb762d17080202' }, hAsync("svg", { key: 'd0f301366f4b28855bf609dc048fdc7d76fd0433', class: "sd-loading-spinner", width: "72px", height: "72px", viewBox: "25 25 50 50", style: { color: this.resolvedColor } }, hAsync("circle", { key: '64068446f4a6ec1892a00ca92da7a3f1f566891c', class: "path", cx: "50", cy: "50", r: "20", fill: "none", stroke: "currentColor", "stroke-width": "5", "stroke-miterlimit": "10" }))));
8875
9572
  }
8876
9573
  static get style() { return sdLoadingSpinnerCss(); }
8877
9574
  static get cmpMeta() { return {
@@ -9534,12 +10231,12 @@ class SdNumberInput {
9534
10231
  '--sd-textinput-input-hint-typography-line-height': `${NUMBER_INPUT_HINT.typography.lineHeight}px`,
9535
10232
  '--sd-textinput-input-contents-gap': `${NUMBER_INPUT_CONTENTS_GAP}px`,
9536
10233
  };
9537
- return (hAsync("sd-field", { key: 'c09a48d9c0bfb0eb6c4327e63ff190b4fee7eff9', name: this.name, label: this.label, addonLabel: this.addonLabel, hint: this.hint, errorMessage: this.errorMessage, width: this.width, rules: this.rules, error: this.error, disabled: this.disabled, focused: this.focused, hovered: this.hovered, status: this.status, ref: el => (this.formField = el), onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false), style: cssVars }, hAsync("div", { key: '7ba690b017d58326640083feb4f88ab74e20f7e3', class: "sd-number-input__content" }, this.useButton && (hAsync("button", { key: '0eb3ccd26428fce21d74b1e2f06258b054337017', type: "button", class: "sd-number-input__stepper sd-number-input__stepper--decrement", disabled: this.isDecrementDisabled(), onClick: this.handleDecrement, tabindex: -1 }, hAsync("sd-icon", { key: '4af528aa82ddc6f8abbee1fa8617f5fefc77f41b', name: "minus", size: iconSize, color: this.isDecrementDisabled()
10234
+ return (hAsync("sd-field", { key: 'd12c62be0352fcaa356450f7a534f3f1c684cf8e', name: this.name, label: this.label, addonLabel: this.addonLabel, hint: this.hint, errorMessage: this.errorMessage, width: this.width, rules: this.rules, error: this.error, disabled: this.disabled, focused: this.focused, hovered: this.hovered, status: this.status, ref: el => (this.formField = el), onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false), style: cssVars }, hAsync("div", { key: 'be7463579f63800d84531ed72fe84c47de7a005c', class: "sd-number-input__content" }, this.useButton && (hAsync("button", { key: '23f1e57fc26545bef557b1fc6d1827783ffe7144', type: "button", class: "sd-number-input__stepper sd-number-input__stepper--decrement", disabled: this.isDecrementDisabled(), onClick: this.handleDecrement, tabindex: -1 }, hAsync("sd-icon", { key: '9b918e18437423e3aec20e5cb66d0d84b3e59649', name: "minus", size: iconSize, color: this.isDecrementDisabled()
9538
10235
  ? NUMBER_INPUT_STEPPER.icon.disabled
9539
- : NUMBER_INPUT_STEPPER.icon.default }))), this.inputPrefix && (hAsync("span", { key: 'f524a85295c29dc02b6803d5a145d24d6d7c3f1b', class: "sd-number-input__prefix" }, this.inputPrefix)), hAsync("input", { key: '4f3c539cb82745b317ebc2e17f2852a5b386ba6b', 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: {
10236
+ : NUMBER_INPUT_STEPPER.icon.default }))), this.inputPrefix && (hAsync("span", { key: '0793d70a0040400cc4e1f3bfe8cafaa02f42a8c2', class: "sd-number-input__prefix" }, this.inputPrefix)), hAsync("input", { key: '31d91862988aa0ee3aabcd78a66844c37b9efac0', 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: {
9540
10237
  textAlign: this.useButton ? 'center' : 'right',
9541
10238
  ...this.inputStyle,
9542
- } }), this.inputSuffix && (hAsync("span", { key: '35a1cd706a87cf9320262b12aab7679cbb9eb7f2', class: "sd-number-input__suffix" }, this.inputSuffix)), this.useButton && (hAsync("button", { key: 'a818bf380ac32291155bf8a3c35cf9b9a007ec5e', type: "button", class: "sd-number-input__stepper sd-number-input__stepper--increment", disabled: this.isIncrementDisabled(), onClick: this.handleIncrement, tabindex: -1 }, hAsync("sd-icon", { key: '0d2e75fb5ebada9aa0846e807695d31f29b18647', name: "add", size: iconSize, color: this.isIncrementDisabled()
10239
+ } }), this.inputSuffix && (hAsync("span", { key: 'fab71e56d4876d0899b9744632d21fb41c344bb6', class: "sd-number-input__suffix" }, this.inputSuffix)), this.useButton && (hAsync("button", { key: '1b1c80f63d7bd8503a9d3c2cbbd5170a44d511bf', type: "button", class: "sd-number-input__stepper sd-number-input__stepper--increment", disabled: this.isIncrementDisabled(), onClick: this.handleIncrement, tabindex: -1 }, hAsync("sd-icon", { key: 'a0073de5e46fc8463f818ac2521725fb8eb7211f', name: "add", size: iconSize, color: this.isIncrementDisabled()
9543
10240
  ? NUMBER_INPUT_STEPPER.icon.disabled
9544
10241
  : NUMBER_INPUT_STEPPER.icon.default }))))));
9545
10242
  }
@@ -9670,12 +10367,12 @@ class SdPagination {
9670
10367
  }
9671
10368
  }
9672
10369
  render() {
9673
- return (hAsync("div", { key: 'd370dfd96244d439f83aa6f283ea3601b51ca8f1', class: this.paginationClasses }, hAsync("div", { key: '4287df0cbd99892e643b1e68ce051ac119c758d2', class: "prepend-btns" }, this.renderPrevButtons()), this.simple ? (hAsync("div", { class: "pagination-info" }, hAsync("span", { class: "current-page" }, this.currentPage), hAsync("span", null, "/"), hAsync("span", { class: "last-page" }, this.lastPage))) : (this.pageNumbers.map(n => (hAsync("button", { type: "button", "aria-current": this.currentPage === n ? 'page' : undefined, class: {
10370
+ return (hAsync("div", { key: '910b6487f1d2b5581116a19e4bdf4514fe961922', class: this.paginationClasses }, hAsync("div", { key: '1109809ea6c19088617f3ed4e3c878e60071084f', class: "prepend-btns" }, this.renderPrevButtons()), this.simple ? (hAsync("div", { class: "pagination-info" }, hAsync("span", { class: "current-page" }, this.currentPage), hAsync("span", null, "/"), hAsync("span", { class: "last-page" }, this.lastPage))) : (this.pageNumbers.map(n => (hAsync("button", { type: "button", "aria-current": this.currentPage === n ? 'page' : undefined, class: {
9674
10371
  'pagination-btn': true,
9675
10372
  'pagination-btn--selected': this.currentPage === n,
9676
10373
  }, disabled: this.currentPage === n, style: {
9677
10374
  '--pagination-btn-width': `${this.buttonWidth}px`,
9678
- }, onClick: () => this.handlePageChange(n) }, n)))), hAsync("div", { key: 'ad51e05546d929ac01898e93ab4285018837394a', class: "append-btns" }, this.renderNextButtons())));
10375
+ }, onClick: () => this.handlePageChange(n) }, n)))), hAsync("div", { key: '10a0645cba99193a64fbe1f2df90bef9b19da8d5', class: "append-btns" }, this.renderNextButtons())));
9679
10376
  }
9680
10377
  static get style() { return sdPaginationCss(); }
9681
10378
  static get cmpMeta() { return {
@@ -9747,14 +10444,14 @@ class SdPopover {
9747
10444
  this.showPopover = false;
9748
10445
  };
9749
10446
  render() {
9750
- return (hAsync(Fragment, { key: '6a0b64ce442f1bd1dc76f22a160172a87a63a1d8' }, this.label ? (hAsync("sd-button", { ref: el => (this.buttonEl = el), label: this.label, icon: this.icon, size: this.buttonSize, color: this.color, variant: this.buttonVariant, class: "sd-popover", onSdClick: () => (this.showPopover = !this.showPopover) })) : (hAsync("sd-icon", { ref: el => (this.buttonEl = el), name: this.icon, size: this.iconSize, color: this.color, class: "sd-popover", onClick: () => (this.showPopover = !this.showPopover) })), this.showPopover && (hAsync("sd-floating-portal", { key: 'e8d39da8af440c81773805331ab97a0105124d81', parentRef: this.buttonEl, onSdClose: this.handleClose, placement: this.placement, offset: this.popoverOffset }, hAsync("div", { key: 'f608e4dc384f48a9f52133055b718e305d1e9f86', class: {
10447
+ return (hAsync(Fragment, { key: '8b4e44957bff5bdb075568b15612b31fb42eaffc' }, this.label ? (hAsync("sd-button", { ref: el => (this.buttonEl = el), label: this.label, icon: this.icon, size: this.buttonSize, color: this.color, variant: this.buttonVariant, class: "sd-popover", onSdClick: () => (this.showPopover = !this.showPopover) })) : (hAsync("sd-icon", { ref: el => (this.buttonEl = el), name: this.icon, size: this.iconSize, color: this.color, class: "sd-popover", onClick: () => (this.showPopover = !this.showPopover) })), this.showPopover && (hAsync("sd-floating-portal", { key: 'e4b676771effb4a51593c6ae0a23f15bd34878a3', parentRef: this.buttonEl, onSdClose: this.handleClose, placement: this.placement, offset: this.popoverOffset }, hAsync("div", { key: 'c74dea7df660a3e8285f813d9cfe490c144f3093', class: {
9751
10448
  'sd-floating-menu': true,
9752
10449
  'sd-floating-menu--popover': true,
9753
10450
  [`sd-floating-menu--${this.placement}`]: true,
9754
10451
  [this.menuClass]: !!this.menuClass,
9755
10452
  }, style: {
9756
10453
  '--sd-floating-bg': popoverTokens.popover.bg,
9757
- } }, hAsync("i", { key: '8052d9f446b03770c22857048c88048f0bc982cd', class: `sd-floating-menu__arrow sd-floating-menu__arrow--${this.placement}` }, hAsync(TooltipArrow, { key: 'f6266c4da625b539f9864da6b09599a5b4bf07cb' })), hAsync("div", { key: '8de90282dae5ba223b6495c1f5ef9baaac88ed17', class: "sd-floating-menu__content" }, this.menuTitle && hAsync("div", { key: '79e26ede34d97abce06bfda8dc1bd29122c2e1ac', class: "sd-floating-menu__title" }, this.menuTitle), this.messages.length > 0 && (hAsync("div", { key: 'a25d8a379e373e136363a3bce19be76fd2fba182', class: "sd-floating-menu__messages" }, this.messages.map(message => (hAsync("div", null, message))))), this.buttons.length > 0 && (hAsync("div", { key: '9cf61069c654a2d884ae0660ec6ffceb563e3617', class: `sd-floating-menu__buttons sd-floating-menu__buttons--${this.buttons.length}` }, this.buttons.map(button => (hAsync("sd-button", { ...button })))))), this.useClose && (hAsync("sd-ghost-button", { key: '14ef6918e763521ff4db0a0f05e1598e767f257d', class: "sd-floating-menu__close-button", icon: "close", ariaLabel: "close", size: "xs", onClick: () => this.handleClose() })))))));
10454
+ } }, hAsync("i", { key: '7ff2cfecec309217bf1b5ad1f523e37737798120', class: `sd-floating-menu__arrow sd-floating-menu__arrow--${this.placement}` }, hAsync(TooltipArrow, { key: 'df1696d49eb0894805e59f3d0c1112be20e94d84' })), hAsync("div", { key: '0c4babf4b592f5457bdc83f72316a9e718e075aa', class: "sd-floating-menu__content" }, this.menuTitle && hAsync("div", { key: '4a8c4fb114b15068b49f5c6546080e8667ea12fe', class: "sd-floating-menu__title" }, this.menuTitle), this.messages.length > 0 && (hAsync("div", { key: '47646cb9cb596afcf3bf38e2b08cdef7074ff658', class: "sd-floating-menu__messages" }, this.messages.map(message => (hAsync("div", null, message))))), this.buttons.length > 0 && (hAsync("div", { key: '939eb40eba7beda3aac32abcdcb9f6cd75fb6b45', class: `sd-floating-menu__buttons sd-floating-menu__buttons--${this.buttons.length}` }, this.buttons.map(button => (hAsync("sd-button", { ...button })))))), this.useClose && (hAsync("sd-ghost-button", { key: 'fb73a35c3db25d2cde16aeb10f14005e82121c6a', class: "sd-floating-menu__close-button", icon: "close", ariaLabel: "close", size: "xs", onClick: () => this.handleClose() })))))));
9758
10455
  }
9759
10456
  static get watchers() { return {
9760
10457
  "show": [{
@@ -10014,7 +10711,7 @@ class SdPortal {
10014
10711
  this.close.emit();
10015
10712
  }
10016
10713
  render() {
10017
- return hAsync("slot", { key: 'c1e05f5d7c809418279e4ded8bbb8c4b29703bb1' });
10714
+ return hAsync("slot", { key: '07cb09b04ab2567afb15b9ae2cc189875f4b55b4' });
10018
10715
  }
10019
10716
  static get watchers() { return {
10020
10717
  "open": [{
@@ -10077,10 +10774,10 @@ class SdProgress {
10077
10774
  return this.statusColor[this.progressStatus];
10078
10775
  }
10079
10776
  render() {
10080
- return (hAsync("div", { key: 'f5b723807c29b9e4a742febaf7d2f984f9de61d5', style: {
10777
+ return (hAsync("div", { key: 'f50623b8a78ce370c5b36e0fc5ac6e04bb5e029c', style: {
10081
10778
  '--progress-color': this.progressColor,
10082
10779
  '--progress-percentage': `${this.progressPercentage}%`,
10083
- } }, this.type === 'bar' ? this.renderBarProgress() : this.renderSpinnerProgress(), this.label && hAsync("div", { key: '369e1b7805414b8a2fa5e44f4746435335a251cb', class: "sd-progress__label" }, this.label)));
10780
+ } }, this.type === 'bar' ? this.renderBarProgress() : this.renderSpinnerProgress(), this.label && hAsync("div", { key: '5a6414ee55f7d3300a9cc06e86376bfd1a123a64', class: "sd-progress__label" }, this.label)));
10084
10781
  }
10085
10782
  renderBarProgress() {
10086
10783
  return (hAsync("div", { class: `sd-progress__bar sd-progress__bar--${this.progressStatus}` }, hAsync("div", { class: ['sd-progress__bar__percent', this.progressPercentage < 100 ? 'proceed' : ''].join(' ') }), hAsync("div", { class: "sd-progress__bar__indicator sd-progress__bar__indicator--left" }, this.progressPercentage, "%"), hAsync("div", { class: "sd-progress__bar__indicator sd-progress__bar__indicator--right" }, this.progressPercentage, "%")));
@@ -10111,7 +10808,79 @@ class SdProgress {
10111
10808
  }; }
10112
10809
  }
10113
10810
 
10114
- const sdRadioCss = () => `sd-radio{display:inline-flex;width:fit-content}sd-radio .sd-radio{cursor:pointer;height:20px;display:inline-flex;align-items:center}sd-radio .sd-radio label{display:inline-flex;width:fit-content;align-items:center;gap:8px;cursor:pointer}sd-radio .sd-radio label input{display:inline-block;position:relative;appearance:none;margin:0;width:16px;height:16px;border:1px solid #888888;border-radius:50%;accent-color:#0075FF;background-color:white;cursor:pointer}sd-radio .sd-radio label input:checked{border-color:#0075FF;background-color:white}sd-radio .sd-radio label input:checked::before{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:10px;height:10px;border-radius:50%;background-color:#0075FF}sd-radio .sd-radio label input:disabled{border-color:#CCCCCC;background-color:#EEEEEE}sd-radio .sd-radio label input:disabled:checked::before{background-color:#CCCCCC}sd-radio .sd-radio label input:not(:disabled):hover{border-color:#0075FF;background-color:#D9EAFF}sd-radio .sd-radio--disabled{cursor:not-allowed !important}sd-radio .sd-radio--disabled label{cursor:not-allowed !important}sd-radio .sd-radio--disabled label input{cursor:not-allowed !important}`;
10811
+ const radio = {
10812
+ size: "16",
10813
+ borderWidth: "1",
10814
+ gap: "8",
10815
+ typography: {
10816
+ fontWeight: "400",
10817
+ fontSize: "12",
10818
+ lineHeight: "20"},
10819
+ unchecked: {
10820
+ bg: {
10821
+ "default": "#FFFFFF",
10822
+ hover: "#D9EAFF"
10823
+ },
10824
+ border: {
10825
+ "default": "#AAAAAA",
10826
+ hover: "#0075FF"
10827
+ }
10828
+ },
10829
+ checked: {
10830
+ border: {
10831
+ "default": "#0075FF"
10832
+ },
10833
+ dot: {
10834
+ "default": "#0075FF"
10835
+ }
10836
+ },
10837
+ bg: {
10838
+ disabled: "#E1E1E1"
10839
+ },
10840
+ border: {
10841
+ disabled: "#CCCCCC"
10842
+ },
10843
+ dot: {
10844
+ disabled: "#CCCCCC"
10845
+ },
10846
+ label: {
10847
+ "default": "#222222"
10848
+ }
10849
+ };
10850
+ var radioTokens = {
10851
+ radio: radio
10852
+ };
10853
+
10854
+ const RADIO_LAYOUT = {
10855
+ size: radioTokens.radio.size,
10856
+ borderWidth: radioTokens.radio.borderWidth,
10857
+ gap: radioTokens.radio.gap,
10858
+ };
10859
+ const RADIO_TYPOGRAPHY = {
10860
+ fontSize: radioTokens.radio.typography.fontSize,
10861
+ lineHeight: radioTokens.radio.typography.lineHeight,
10862
+ fontWeight: radioTokens.radio.typography.fontWeight,
10863
+ };
10864
+ const RADIO_COLORS = {
10865
+ unchecked: {
10866
+ bg: radioTokens.radio.unchecked.bg.default,
10867
+ bgHover: radioTokens.radio.unchecked.bg.hover,
10868
+ border: radioTokens.radio.unchecked.border.default,
10869
+ borderHover: radioTokens.radio.unchecked.border.hover,
10870
+ },
10871
+ checked: {
10872
+ border: radioTokens.radio.checked.border.default,
10873
+ dot: radioTokens.radio.checked.dot.default,
10874
+ },
10875
+ disabled: {
10876
+ bg: radioTokens.radio.bg.disabled,
10877
+ border: radioTokens.radio.border.disabled,
10878
+ dot: radioTokens.radio.dot.disabled,
10879
+ },
10880
+ label: radioTokens.radio.label.default,
10881
+ };
10882
+
10883
+ const sdRadioCss = () => `sd-radio{display:inline-flex;width:fit-content;height:var(--sd-radio-line-height);line-height:0}sd-radio .sd-radio{cursor:pointer;display:inline-flex;align-items:center;gap:var(--sd-radio-gap);height:var(--sd-radio-line-height);max-height:var(--sd-radio-line-height)}sd-radio .sd-radio>input{position:absolute;width:0;height:0;opacity:0;pointer-events:none}sd-radio .sd-radio>input:focus-visible+.sd-radio__circle{box-shadow:0 0 0 2px white, 0 0 0 4px var(--sd-radio-checked-border);outline:none}sd-radio .sd-radio__circle{position:relative;width:var(--sd-radio-size);height:var(--sd-radio-size);border-radius:50%;border:var(--sd-radio-border-width) solid var(--sd-radio-unchecked-border);box-sizing:border-box;background:var(--sd-radio-unchecked-bg);display:inline-flex;flex-shrink:0}sd-radio .sd-radio__label{font-size:var(--sd-radio-font-size);font-weight:var(--sd-radio-font-weight);color:var(--sd-radio-label-color);line-height:var(--sd-radio-line-height)}sd-radio .sd-radio:hover:not(.sd-radio--disabled) .sd-radio__circle{background:var(--sd-radio-unchecked-bg-hover);border-color:var(--sd-radio-unchecked-border-hover)}sd-radio .sd-radio--checked .sd-radio__circle{border-color:var(--sd-radio-checked-border)}sd-radio .sd-radio--checked .sd-radio__circle::after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:10px;height:10px;border-radius:50%;background:var(--sd-radio-checked-dot)}sd-radio .sd-radio--disabled{cursor:not-allowed}sd-radio .sd-radio--disabled .sd-radio__circle{background:var(--sd-radio-disabled-bg);border-color:var(--sd-radio-disabled-border)}sd-radio .sd-radio--disabled.sd-radio--checked .sd-radio__circle::after{background:var(--sd-radio-disabled-dot)}`;
10115
10884
 
10116
10885
  class SdRadio {
10117
10886
  constructor(hostRef) {
@@ -10119,36 +10888,66 @@ class SdRadio {
10119
10888
  this.update = createEvent(this, "sdUpdate", 7);
10120
10889
  }
10121
10890
  value;
10122
- disabled = false;
10123
10891
  val;
10892
+ disabled = false;
10124
10893
  label;
10125
10894
  update;
10126
- getRadioClasses() {
10127
- const isSelected = String(this.val) === String(this.value);
10128
- const classes = ['sd-radio', isSelected ? 'sd-radio--selected' : 'sd-radio--unselected'];
10895
+ valueChanged(newValue) {
10896
+ this.value = newValue;
10897
+ }
10898
+ get isSelected() {
10899
+ return String(this.val) === String(this.value);
10900
+ }
10901
+ get radioClasses() {
10902
+ const classes = [
10903
+ 'sd-radio',
10904
+ this.isSelected ? 'sd-radio--checked' : 'sd-radio--unchecked',
10905
+ ];
10129
10906
  if (this.disabled) {
10130
10907
  classes.push('sd-radio--disabled');
10131
10908
  }
10132
10909
  return classes.join(' ');
10133
10910
  }
10134
- handleRadioChange() {
10911
+ handleRadioChange = () => {
10135
10912
  if (this.disabled)
10136
10913
  return;
10137
10914
  this.value = this.val;
10138
10915
  this.update.emit(this.value);
10139
- }
10916
+ };
10140
10917
  render() {
10141
- const isSelected = String(this.val) === String(this.value);
10142
- return (hAsync("div", { key: 'e9d7875b19c108505e7dfd455432102c8035097f', "aria-label": String(this.val) || 'radio option', "aria-checked": isSelected ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false', class: this.getRadioClasses() }, hAsync("label", { key: `radio-${this.val}` }, hAsync("input", { key: 'cc0aa88287000b77c2329bba2371e9e4404f8203', type: "radio", name: String(this.val), value: String(this.val), checked: isSelected, disabled: this.disabled, onInput: () => this.handleRadioChange() }), this.val != null && (hAsync("span", { key: 'b2a371ef8bc4ccc57ffbbc6acc22bf4b9c391fc1', class: "sd-radio-group__label" }, this.label || String(this.val))))));
10918
+ const cssVars = {
10919
+ '--sd-radio-size': `${RADIO_LAYOUT.size}px`,
10920
+ '--sd-radio-border-width': `${RADIO_LAYOUT.borderWidth}px`,
10921
+ '--sd-radio-gap': `${RADIO_LAYOUT.gap}px`,
10922
+ '--sd-radio-font-size': `${RADIO_TYPOGRAPHY.fontSize}px`,
10923
+ '--sd-radio-line-height': `${RADIO_TYPOGRAPHY.lineHeight}px`,
10924
+ '--sd-radio-font-weight': RADIO_TYPOGRAPHY.fontWeight,
10925
+ '--sd-radio-unchecked-bg': RADIO_COLORS.unchecked.bg,
10926
+ '--sd-radio-unchecked-bg-hover': RADIO_COLORS.unchecked.bgHover,
10927
+ '--sd-radio-unchecked-border': RADIO_COLORS.unchecked.border,
10928
+ '--sd-radio-unchecked-border-hover': RADIO_COLORS.unchecked.borderHover,
10929
+ '--sd-radio-checked-border': RADIO_COLORS.checked.border,
10930
+ '--sd-radio-checked-dot': RADIO_COLORS.checked.dot,
10931
+ '--sd-radio-disabled-bg': RADIO_COLORS.disabled.bg,
10932
+ '--sd-radio-disabled-border': RADIO_COLORS.disabled.border,
10933
+ '--sd-radio-disabled-dot': RADIO_COLORS.disabled.dot,
10934
+ '--sd-radio-label-color': RADIO_COLORS.label,
10935
+ };
10936
+ return (hAsync("label", { key: '72b116f38c66acee8e68a839c3f062293d65129c', class: this.radioClasses, style: cssVars, "aria-checked": this.isSelected ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false' }, hAsync("input", { key: 'edcf50f09c198ae3fb993706dec757fd706fe0de', type: "radio", name: String(this.val), value: String(this.val), checked: this.isSelected, disabled: this.disabled, "aria-label": this.label || String(this.val), onInput: this.handleRadioChange }), hAsync("span", { key: '49ce92b075290f8aca715466456f4b7cdf3017e2', class: "sd-radio__circle" }), this.label && hAsync("span", { key: '99d2ce0d53daf5d8ef232f6984ef42e605a68541', class: "sd-radio__label" }, this.label)));
10143
10937
  }
10938
+ static get watchers() { return {
10939
+ "value": [{
10940
+ "valueChanged": 0
10941
+ }]
10942
+ }; }
10144
10943
  static get style() { return sdRadioCss(); }
10145
10944
  static get cmpMeta() { return {
10146
10945
  "$flags$": 512,
10147
10946
  "$tagName$": "sd-radio",
10148
10947
  "$members$": {
10149
10948
  "value": [1032],
10150
- "disabled": [4],
10151
10949
  "val": [8],
10950
+ "disabled": [4],
10152
10951
  "label": [1]
10153
10952
  },
10154
10953
  "$listeners$": undefined,
@@ -10200,7 +10999,7 @@ class SdRadioButtonGroup {
10200
10999
  }
10201
11000
  groupName = this.name || `sd-radio-button-group-${crypto.randomUUID()}`;
10202
11001
  render() {
10203
- return (hAsync("div", { key: '419d62e718ddcecb4a901f4c4bc98b560c8c4f01', class: this.getGroupClasses(), role: "radiogroup", "aria-disabled": this.disabled.toString() }, this.options.map(option => {
11002
+ return (hAsync("div", { key: '14c605d7b034dd83a33cdf34f58bf77201dfc74f', class: this.getGroupClasses(), role: "radiogroup", "aria-disabled": this.disabled.toString() }, this.options.map(option => {
10204
11003
  const isSelected = this.isOptionSelected(option);
10205
11004
  const isDisabled = this.isOptionDisabled(option);
10206
11005
  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-group__label" }, option.label)));
@@ -10223,7 +11022,7 @@ class SdRadioButtonGroup {
10223
11022
  }; }
10224
11023
  }
10225
11024
 
10226
- const sdRadioGroupCss = () => `sd-radio{display:inline-flex;width:fit-content}sd-radio .sd-radio{cursor:pointer;height:20px;display:inline-flex;align-items:center}sd-radio .sd-radio label{display:inline-flex;width:fit-content;align-items:center;gap:8px;cursor:pointer}sd-radio .sd-radio label input{display:inline-block;position:relative;appearance:none;margin:0;width:16px;height:16px;border:1px solid #888888;border-radius:50%;accent-color:#0075FF;background-color:white;cursor:pointer}sd-radio .sd-radio label input:checked{border-color:#0075FF;background-color:white}sd-radio .sd-radio label input:checked::before{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:10px;height:10px;border-radius:50%;background-color:#0075FF}sd-radio .sd-radio label input:disabled{border-color:#CCCCCC;background-color:#EEEEEE}sd-radio .sd-radio label input:disabled:checked::before{background-color:#CCCCCC}sd-radio .sd-radio label input:not(:disabled):hover{border-color:#0075FF;background-color:#D9EAFF}sd-radio .sd-radio--disabled{cursor:not-allowed !important}sd-radio .sd-radio--disabled label{cursor:not-allowed !important}sd-radio .sd-radio--disabled label input{cursor:not-allowed !important}sd-radio-group{display:inline-block}sd-radio-group .sd-radio-group{display:flex}sd-radio-group .sd-radio-group--vertical{flex-direction:column;gap:8px}sd-radio-group .sd-radio-group--horizontal{flex-direction:row;align-items:center;gap:20px}`;
11025
+ const sdRadioGroupCss = () => `sd-radio{display:inline-flex;width:fit-content;height:var(--sd-radio-line-height);line-height:0}sd-radio .sd-radio{cursor:pointer;display:inline-flex;align-items:center;gap:var(--sd-radio-gap);height:var(--sd-radio-line-height);max-height:var(--sd-radio-line-height)}sd-radio .sd-radio>input{position:absolute;width:0;height:0;opacity:0;pointer-events:none}sd-radio .sd-radio>input:focus-visible+.sd-radio__circle{box-shadow:0 0 0 2px white, 0 0 0 4px var(--sd-radio-checked-border);outline:none}sd-radio .sd-radio__circle{position:relative;width:var(--sd-radio-size);height:var(--sd-radio-size);border-radius:50%;border:var(--sd-radio-border-width) solid var(--sd-radio-unchecked-border);box-sizing:border-box;background:var(--sd-radio-unchecked-bg);display:inline-flex;flex-shrink:0}sd-radio .sd-radio__label{font-size:var(--sd-radio-font-size);font-weight:var(--sd-radio-font-weight);color:var(--sd-radio-label-color);line-height:var(--sd-radio-line-height)}sd-radio .sd-radio:hover:not(.sd-radio--disabled) .sd-radio__circle{background:var(--sd-radio-unchecked-bg-hover);border-color:var(--sd-radio-unchecked-border-hover)}sd-radio .sd-radio--checked .sd-radio__circle{border-color:var(--sd-radio-checked-border)}sd-radio .sd-radio--checked .sd-radio__circle::after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:10px;height:10px;border-radius:50%;background:var(--sd-radio-checked-dot)}sd-radio .sd-radio--disabled{cursor:not-allowed}sd-radio .sd-radio--disabled .sd-radio__circle{background:var(--sd-radio-disabled-bg);border-color:var(--sd-radio-disabled-border)}sd-radio .sd-radio--disabled.sd-radio--checked .sd-radio__circle::after{background:var(--sd-radio-disabled-dot)}sd-radio-group{display:inline-block}sd-radio-group .sd-radio-group{display:flex}sd-radio-group .sd-radio-group--vertical{flex-direction:column;gap:8px}sd-radio-group .sd-radio-group--horizontal{flex-direction:row;align-items:center;gap:20px}`;
10227
11026
 
10228
11027
  class SdRadioGroup {
10229
11028
  constructor(hostRef) {
@@ -10252,7 +11051,7 @@ class SdRadioGroup {
10252
11051
  return classes.join(' ');
10253
11052
  }
10254
11053
  render() {
10255
- return (hAsync("div", { key: '82979426bafc24b48858588ad186dfe069616883', class: this.getGroupClasses(), role: "radiogroup" }, this.options.map(option => {
11054
+ return (hAsync("div", { key: '4c34a3ab6790818e17c8452fa3233e7c720b8246', class: this.getGroupClasses(), role: "radiogroup" }, this.options.map(option => {
10256
11055
  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) }));
10257
11056
  })));
10258
11057
  }
@@ -10446,7 +11245,7 @@ class SdSelect extends BaseDropdownEvent {
10446
11245
  }
10447
11246
  };
10448
11247
  render() {
10449
- return (hAsync("sd-field", { key: 'f7cd0c34188712a30389d07bde7edc7875e9923b', label: this.label, name: this.name, rules: this.rules, error: this.error, disabled: this.disabled, icon: this.icon, addonLabel: this.addonLabel, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el) }, hAsync("div", { key: '460a8a23247e24a02bd25470105598914029e205', class: {
11248
+ return (hAsync("sd-field", { key: '33f8a4e75ab20389213be5643f479b806e8e78c3', label: this.label, name: this.name, rules: this.rules, error: this.error, disabled: this.disabled, icon: this.icon, addonLabel: this.addonLabel, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el) }, hAsync("div", { key: '148f21e1a19cf4f4b9e61b4192d631d85dbc57a4', class: {
10450
11249
  'sd-select': true,
10451
11250
  'sd-select--disabled': this.disabled,
10452
11251
  'sd-select--error': !!this.error,
@@ -10664,10 +11463,10 @@ class SdSelectDropdown {
10664
11463
  this.isScrolled = scrollTop > 0;
10665
11464
  };
10666
11465
  render() {
10667
- return (hAsync("div", { key: '47a99b4faac3adb110a548860ef094ba3bd4630a', class: {
11466
+ return (hAsync("div", { key: 'c2e248441cf6825fae9649ab3c3d01ab171ccb85', class: {
10668
11467
  'sd-select-dropdown': true,
10669
11468
  'sd-select-dropdown--ready': this.isDropdownReady,
10670
- }, style: this.dropdownSize, onScroll: this.handleDropdownScroll, ref: el => (this.dropdownRef = el) }, this.searchable && (hAsync("sd-select-search-input", { key: '0ed08c8a422d7d0be26ffcd68a424700feb6d66f', ref: el => (this.searchRef = el), isScrolled: this.isScrolled, searchText: this.searchText, onSdSearchInput: (event) => (this.searchText = event.detail || ''), onSdSearchFocus: () => (this.itemIndex = -1) })), this.filteredOptions.length > 0 ? (this.filteredOptions.map((option, index) => (hAsync("slot", { name: `option-${option.value}` }, hAsync("sd-select-option", { option: option, index: index, isSelected: this.isOptionSelected(option.value), isFocused: index === this.itemIndex, onOptionClick: ({ detail }) => this.optionClick.emit(detail), useCheckbox: this.useCheckbox }))))) : (hAsync("slot", { name: "option-placeholder" }, hAsync("div", { class: 'sd-select-option-placeholder' }, this.optionPlaceholder)))));
11469
+ }, style: this.dropdownSize, onScroll: this.handleDropdownScroll, ref: el => (this.dropdownRef = el) }, this.searchable && (hAsync("sd-select-search-input", { key: 'a6e9b0b74dbcd50d75bbfa51d452881298e9f439', ref: el => (this.searchRef = el), isScrolled: this.isScrolled, searchText: this.searchText, onSdSearchInput: (event) => (this.searchText = event.detail || ''), onSdSearchFocus: () => (this.itemIndex = -1) })), this.filteredOptions.length > 0 ? (this.filteredOptions.map((option, index) => (hAsync("slot", { name: `option-${option.value}` }, hAsync("sd-select-option", { option: option, index: index, isSelected: this.isOptionSelected(option.value), isFocused: index === this.itemIndex, onOptionClick: ({ detail }) => this.optionClick.emit(detail), useCheckbox: this.useCheckbox }))))) : (hAsync("slot", { name: "option-placeholder" }, hAsync("div", { class: 'sd-select-option-placeholder' }, this.optionPlaceholder)))));
10671
11470
  }
10672
11471
  static get watchers() { return {
10673
11472
  "filteredOptions": [{
@@ -10978,7 +11777,7 @@ class SdSelectGroup extends BaseDropdownEvent {
10978
11777
  });
10979
11778
  }
10980
11779
  render() {
10981
- return (hAsync("sd-field", { key: 'a0269e6ebfce2363c451fdb6afbe3979265ffb52', label: this.label, name: this.name, rules: this.rules, error: this.error, disabled: this.disabled, icon: this.icon, addonLabel: this.addonLabel, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el), style: { '--field-width': this.width || '200px' } }, hAsync("div", { key: '55c8f062080befa65986e29d3b7835146150302a', class: {
11780
+ return (hAsync("sd-field", { key: '205ef7aabb819067026cf0f0dfa2bc62f3e1d3dc', label: this.label, name: this.name, rules: this.rules, error: this.error, disabled: this.disabled, icon: this.icon, addonLabel: this.addonLabel, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el), style: { '--field-width': this.width || '200px' } }, hAsync("div", { key: 'b6db700cb68d1eaa1a99f959d3fd78c0e2088c3d', class: {
10982
11781
  'sd-select-group': true,
10983
11782
  'sd-select-group--open': this.isOpen,
10984
11783
  'sd-select-group--disabled': this.disabled,
@@ -11226,7 +12025,7 @@ class SdSelectMultiple extends BaseDropdownEvent {
11226
12025
  this.handleOptionSelection(option);
11227
12026
  };
11228
12027
  render() {
11229
- return (hAsync("sd-field", { key: 'c2509aa07a6d69bd24bca0afd708d92db47e8084', label: this.label, name: this.name, rules: this.rules, error: this.error, disabled: this.disabled, icon: this.icon, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el) }, hAsync("div", { key: 'd0e5ac84ad2aeb947b02b5a2cd4fbb66bf6e9419', class: {
12028
+ return (hAsync("sd-field", { key: '1e3954ff06d55a6feb8ff70cbba35e11a1b4863e', label: this.label, name: this.name, rules: this.rules, error: this.error, disabled: this.disabled, icon: this.icon, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el) }, hAsync("div", { key: '192dd606eaa8a7642dfaf28f342701694cbbc237', class: {
11230
12029
  'sd-select-multiple': true,
11231
12030
  'sd-select-multiple--open': this.isOpen,
11232
12031
  'sd-select-multiple--disabled': this.disabled,
@@ -11689,7 +12488,7 @@ class SdSelectMultipleGroup extends BaseDropdownEvent {
11689
12488
  });
11690
12489
  }
11691
12490
  render() {
11692
- return (hAsync("sd-field", { key: '350c7b2df807166a1439a2151f0f168385adac4a', label: this.label, name: this.name, rules: this.rules, error: this.error, disabled: this.disabled, icon: this.icon, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el), style: { '--field-width': this.width || '200px' } }, hAsync("div", { key: 'cce989263e1c7dcb38216e734aabe6eea643676a', class: {
12491
+ return (hAsync("sd-field", { key: '3cc9e5b2f1062e216a0dd738dff6918084c5e3b4', label: this.label, name: this.name, rules: this.rules, error: this.error, disabled: this.disabled, icon: this.icon, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el), style: { '--field-width': this.width || '200px' } }, hAsync("div", { key: '60be94c561be252d6cc822e6be60a5e31390a15f', class: {
11693
12492
  'sd-select-multiple-group': true,
11694
12493
  'sd-select-multiple-group--open': this.isOpen,
11695
12494
  'sd-select-multiple-group--disabled': this.disabled,
@@ -11822,7 +12621,7 @@ class SdSelectOption {
11822
12621
  }
11823
12622
  };
11824
12623
  render() {
11825
- return (hAsync("div", { key: 'b9844296973b6e85d3c3e3652671e89f470ec7a9', class: {
12624
+ return (hAsync("div", { key: '1e4afa2db7fcf6e8baddd533763536973d32c51d', class: {
11826
12625
  'sd-select__option': true,
11827
12626
  'sd-select__option--selected': this.isSelected,
11828
12627
  'sd-select__option--disabled': !!this.option.disabled,
@@ -11908,7 +12707,7 @@ class SdSelectOptionGroup {
11908
12707
  }
11909
12708
  };
11910
12709
  render() {
11911
- return (hAsync("div", { key: '9742c10ec20db29db941ac58666eb662b7b4275e', class: {
12710
+ return (hAsync("div", { key: 'd39aa4744aa498f8b2f7c77502f2c4f56e670296', class: {
11912
12711
  'sd-select__option-group': true,
11913
12712
  'sd-select__option-group--selected': !!this.isSelected,
11914
12713
  'sd-select__option-group--disabled': !!this.option.disabled,
@@ -11917,10 +12716,10 @@ class SdSelectOptionGroup {
11917
12716
  'sd-select__option-group--group': this.option.type === 'group',
11918
12717
  'sd-select__option-group--subgroup': this.option.type === 'subgroup',
11919
12718
  'sd-select__option-group--item': this.option.type === 'item',
11920
- }, onMouseEnter: () => (this.isHovered = true), onMouseLeave: () => (this.isHovered = false), style: this.optionStyle, "data-index": this.index, onClick: event => this.handleClick(this.option, this.isSelected, event) }, hAsync("div", { key: 'e09a53d6c7e9897266a6b7b2ba2725afd2d45f67', class: "sd-select__option-group__label-wrapper" }, this.useCheckbox && (hAsync("sd-checkbox", { key: '4b1d68eade6a25b44ad8c28c7bbaaf894d3b6158', value: this.isSelected, disabled: this.option.disabled, onClick: e => {
12719
+ }, onMouseEnter: () => (this.isHovered = true), onMouseLeave: () => (this.isHovered = false), style: this.optionStyle, "data-index": this.index, onClick: event => this.handleClick(this.option, this.isSelected, event) }, hAsync("div", { key: 'c856a933ddfa7084741cbb65d2075f3b59404ae7', class: "sd-select__option-group__label-wrapper" }, this.useCheckbox && (hAsync("sd-checkbox", { key: '455dde9674811174fb4b939ca37b5128085cd65d', value: this.isSelected, disabled: this.option.disabled, onClick: e => {
11921
12720
  e.preventDefault();
11922
12721
  this.handleClick(this.option, this.isSelected, e);
11923
- } })), hAsync("span", { key: '5bd439162ed1ac623a8bec83e31c924294c61b75', class: "sd-select__option-group-label" }, this.option.label), this.useIndicator && this.option.type !== 'item' && (hAsync("span", { key: '39a6367f373ffd7403eb37a40e119e1534e79d22', class: "sd-select__option-group__count-indicator" }, `(${this.countInfo?.selectedCount}/${this.countInfo?.totalCount})`)))));
12722
+ } })), hAsync("span", { key: '0255e9f2da18d3da01843ec61c9bc75150efcc4a', class: "sd-select__option-group-label" }, this.option.label), this.useIndicator && this.option.type !== 'item' && (hAsync("span", { key: '73c0a138d3e38f4fc8c8e94230aea82c89a7cb84', class: "sd-select__option-group__count-indicator" }, `(${this.countInfo?.selectedCount}/${this.countInfo?.totalCount})`)))));
11924
12723
  }
11925
12724
  static get style() { return sdSelectOptionGroupCss(); }
11926
12725
  static get cmpMeta() { return {
@@ -11969,17 +12768,17 @@ class SdSelectSearchInput {
11969
12768
  input?.focus({ preventScroll: true });
11970
12769
  }
11971
12770
  render() {
11972
- return (hAsync("div", { key: '2d211645dc4041411e187f248a260a23b7c544f6', class: {
12771
+ return (hAsync("div", { key: '356f1b606a50d6a247793aebd1609f509a08784e', class: {
11973
12772
  'sd-select-search-input': true,
11974
12773
  'sd-select-search-input--scrolled': !!this.isScrolled,
11975
- }, onClick: event => event.stopPropagation() }, hAsync("sd-input", { key: 'c609af0ab36359c8ccaea5827821dbc509d13eac', ref: el => (this.searchRef = el), value: this.searchText, placeholder: "\uAC80\uC0C9", clearable: true, inputStyle: { 'padding-left': '8px' }, autofocus: true, onSdUpdate: event => {
12774
+ }, onClick: event => event.stopPropagation() }, hAsync("sd-input", { key: '99162b5eeb831b771666246ecbd223c0a1b93d9c', ref: el => (this.searchRef = el), value: this.searchText, placeholder: "\uAC80\uC0C9", clearable: true, inputStyle: { 'padding-left': '8px' }, autofocus: true, onSdUpdate: event => {
11976
12775
  this.searchInput.emit(String(event?.detail));
11977
12776
  }, onSdFocus: () => {
11978
12777
  this.searchFocus.emit();
11979
12778
  }, onKeyDown: event => {
11980
12779
  if (event.code === 'Enter')
11981
12780
  event.stopPropagation();
11982
- } }, hAsync("sd-icon", { key: '96a511b1f8625c883ec50d5e2985ff396d7b57c7', name: "search", size: 16, color: "#737373", style: { marginRight: '4px' }, slot: "prefix" }))));
12781
+ } }, hAsync("sd-icon", { key: 'e8929cfab6ab5a483531c939de1b4c0c11f1b145', name: "search", size: 16, color: "#737373", style: { marginRight: '4px' }, slot: "prefix" }))));
11983
12782
  }
11984
12783
  static get style() { return sdSelectSearchInputCss(); }
11985
12784
  static get cmpMeta() { return {
@@ -12210,13 +13009,13 @@ class SdSelectV2 {
12210
13009
  this.closeDropdown();
12211
13010
  },
12212
13011
  };
12213
- return (hAsync("sd-field", { key: '85614fb127c63bec86a17e73ac1942aefbc62ad1', name: this.fieldName || this.internalName, label: this.label, addonLabel: this.addonLabel, hint: this.hint, errorMessage: this.errorMessage, width: this.width, rules: this.rules, error: this.error, disabled: this.disabled, focused: this.focused, hovered: this.hovered, icon: this.icon, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, onMouseEnter: () => {
13012
+ return (hAsync("sd-field", { key: '3bce41792a627708e9a947649106fdeaf63bf12f', name: this.fieldName || this.internalName, label: this.label, addonLabel: this.addonLabel, hint: this.hint, errorMessage: this.errorMessage, width: this.width, rules: this.rules, error: this.error, disabled: this.disabled, focused: this.focused, hovered: this.hovered, icon: this.icon, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, onMouseEnter: () => {
12214
13013
  this.hovered = true;
12215
13014
  }, onMouseLeave: () => {
12216
13015
  this.hovered = false;
12217
- } }, hAsync("div", { key: '4231e75590fec54915d580d7a4f6248232bca365', class: "sd-select-v2", ref: el => {
13016
+ } }, hAsync("div", { key: '994150030e4e7d87650de8dc8fd7b44d57c3b62b', class: "sd-select-v2", ref: el => {
12218
13017
  this.triggerRef = el;
12219
- } }, hAsync("sd-select-v2-trigger", { key: '4e75ec1af0ba09ba8cd63c795e527035114037a9', displayText: this.displayText, placeholder: this.placeholder, disabled: this.disabled, isOpen: this.isOpen, onSdTriggerClick: this.handleTriggerClick })), (this.isOpen || this.isAnimatingOut) && (hAsync("sd-portal", { key: 'de609975a56d52e542fc46a4d367b74bdcaa7e7b', ...portalProps }, hAsync("sd-select-v2-listbox", { key: '7d2fff4a3877701a68e422aa29e4f5a18e1d033c', name: this.name, options: this.options, value: this.value, emitValue: this.emitValue, triggerWidth: this.triggerWidth, maxWidth: this.resolvedMaxDropdownWidth, maxHeight: this.resolvedDropdownHeight, onSdOptionSelect: event => this.handleOptionSelect(event.detail) })))));
13018
+ } }, hAsync("sd-select-v2-trigger", { key: 'ff1d052c318bdec6d870bcc707fc33e40bc41f9c', displayText: this.displayText, placeholder: this.placeholder, disabled: this.disabled, isOpen: this.isOpen, onSdTriggerClick: this.handleTriggerClick })), (this.isOpen || this.isAnimatingOut) && (hAsync("sd-portal", { key: '0a1214c3f2fcc6c34afa2f5168c64edb305048ea', ...portalProps }, hAsync("sd-select-v2-listbox", { key: 'c3888dbe740611633a95ef8b58024bdfa558f15b', name: this.name, options: this.options, value: this.value, emitValue: this.emitValue, triggerWidth: this.triggerWidth, maxWidth: this.resolvedMaxDropdownWidth, maxHeight: this.resolvedDropdownHeight, onSdOptionSelect: event => this.handleOptionSelect(event.detail) })))));
12220
13019
  }
12221
13020
  static get watchers() { return {
12222
13021
  "isOpen": [{
@@ -12317,11 +13116,11 @@ var listItemTokens = {
12317
13116
  listItem: listItem
12318
13117
  };
12319
13118
 
12320
- const paddingBottom = "4";
12321
- const radius = "4";
13119
+ const listBox = {
13120
+ radius: "4"};
12322
13121
  var listBoxTokens = {
12323
- paddingBottom: paddingBottom,
12324
- radius: radius};
13122
+ listBox: listBox
13123
+ };
12325
13124
 
12326
13125
  // ── Select Trigger Tokens ──
12327
13126
  const SELECT_LAYOUT = {
@@ -12378,8 +13177,7 @@ const LIST_ITEM_COLORS = {
12378
13177
  }};
12379
13178
  // ── ListBox Tokens ──
12380
13179
  const LIST_BOX_LAYOUT = {
12381
- radius: listBoxTokens.radius,
12382
- paddingBottom: listBoxTokens.paddingBottom,
13180
+ radius: listBoxTokens.listBox.radius,
12383
13181
  };
12384
13182
  // ── Constants ──
12385
13183
  const SEARCH_THRESHOLD = 11;
@@ -12489,7 +13287,7 @@ class SdSelectV2ListItem {
12489
13287
  if (isDepth1Group) {
12490
13288
  cssVars['--list-item-border-top'] = `${LIST_ITEM_COLORS.depth1.borderWidth}px solid ${LIST_ITEM_COLORS.depth1.border}`;
12491
13289
  }
12492
- return (hAsync("div", { key: 'a7d424f1b7025cd41273a0264cdc1f973ff13061', class: {
13290
+ return (hAsync("div", { key: '8cd297b8d4ff1a7ef5c64bcaefef9cc54b3de357', class: {
12493
13291
  'sd-select-v2-list-item': true,
12494
13292
  'sd-select-v2-list-item--group': isGroup,
12495
13293
  'sd-select-v2-list-item--depth1-group': isDepth1Group,
@@ -12499,7 +13297,7 @@ class SdSelectV2ListItem {
12499
13297
  'sd-select-v2-list-item--focused': this.isFocused,
12500
13298
  'sd-select-v2-list-item--selectable': this.isSelectable && !this.option.disabled,
12501
13299
  'sd-select-v2-list-item--disabled': !!this.option.disabled,
12502
- }, style: cssVars, onClick: this.handleClick }, this.useCheckbox && (hAsync("sd-checkbox", { key: 'bbcd2a4ce4b0a2efdc06647a7b2d6c1f0875667c', value: this.isSelected === null ? null : !!this.isSelected, disabled: this.option.disabled, class: "sd-select-v2-list-item__checkbox", onClick: this.handleCheckboxClick, onSdUpdate: this.handleCheckboxUpdate })), hAsync("span", { key: '6f0df85e664b797547d2f24038f5112767b3fa67', class: "sd-select-v2-list-item__label" }, this.option.label), this.countInfo && (hAsync("span", { key: '04e862cc16406c1fd3e27e716c33f54d72f7d80d', class: "sd-select-v2-list-item__count" }, "(", this.countInfo.selected, "/", this.countInfo.total, ")"))));
13300
+ }, style: cssVars, onClick: this.handleClick }, this.useCheckbox && (hAsync("sd-checkbox", { key: '11597153f05d17fc172920a65d26d74b4b7aa239', value: this.isSelected === null ? null : !!this.isSelected, disabled: this.option.disabled, class: "sd-select-v2-list-item__checkbox", onClick: this.handleCheckboxClick, onSdUpdate: this.handleCheckboxUpdate })), hAsync("span", { key: '1dc78dcbffc3f3826fac7a9a3b8aa300c3754de6', class: "sd-select-v2-list-item__label" }, this.option.label), this.countInfo && (hAsync("span", { key: '5b96136bc54b241359e60849ebd1e792eb749c0d', class: "sd-select-v2-list-item__count" }, "(", this.countInfo.selected, "/", this.countInfo.total, ")"))));
12503
13301
  }
12504
13302
  static get style() { return sdSelectV2ListItemCss(); }
12505
13303
  static get cmpMeta() { return {
@@ -12567,12 +13365,12 @@ class SdSelectV2ListItemSearch {
12567
13365
  clearTimeout(this.debounceTimer);
12568
13366
  }
12569
13367
  render() {
12570
- return (hAsync("div", { key: '87f0a8fc24fe4b80cd29f63ca4f269b242a35f56', class: {
13368
+ return (hAsync("div", { key: '8ccebea10b658edba2c417893f2a939a7361ef1b', class: {
12571
13369
  'sd-select-v2-list-item-search': true,
12572
13370
  'sd-select-v2-list-item-search--scrolled': this.isScrolled,
12573
- } }, hAsync("div", { key: '980ad86deb07ae25373c8802caa46febbdc1d8f6', class: "sd-select-v2-list-item-search__inner" }, hAsync("sd-icon", { key: '9e9fc2104743c1ec7790cffffb955135908b36e7', name: "search", size: 16, color: "grey_70", class: "sd-select-v2-list-item-search__icon" }), hAsync("input", { key: '601668bfaffcba5285375e845d0b2ef59238f1a8', ref: el => {
13371
+ } }, hAsync("div", { key: '4007afb556220e746c2379f643afb38445345853', class: "sd-select-v2-list-item-search__inner" }, hAsync("sd-icon", { key: '1afc1ef8aa6f3d26ee1001212ac9ea7d0bf3d1e4', name: "search", size: 16, color: "grey_70", class: "sd-select-v2-list-item-search__icon" }), hAsync("input", { key: 'a32ddcc18a401217f1a624e544c56bd499b0f47e', ref: el => {
12574
13372
  this.inputEl = el;
12575
- }, type: "text", class: "sd-select-v2-list-item-search__input", placeholder: "\uAC80\uC0C9\uC5B4 \uC785\uB825", value: this.searchText, onInput: this.handleInput, onFocus: () => this.searchFocus.emit() }), this.searchText && (hAsync("button", { key: '56973c7d365f9734b2135aa406651edd372f9789', type: "button", class: "sd-select-v2-list-item-search__clear", onClick: this.handleClear }, hAsync("sd-icon", { key: '84161963570776fe9ecfb519d654fe00aa4e7c6a', name: "close", size: 12, color: "#888888" }))))));
13373
+ }, type: "text", class: "sd-select-v2-list-item-search__input", placeholder: "\uAC80\uC0C9\uC5B4 \uC785\uB825", value: this.searchText, onInput: this.handleInput, onFocus: () => this.searchFocus.emit() }), this.searchText && (hAsync("button", { key: '150d5aca71d6ac6277917177ed4e4e157e4ba33f', type: "button", class: "sd-select-v2-list-item-search__clear", onClick: this.handleClear }, hAsync("sd-icon", { key: 'f0397c023e5dd5972eb6dfd20f9fb1ac1027fb2f', name: "close", size: 12, color: "#888888" }))))));
12576
13374
  }
12577
13375
  static get style() { return sdSelectV2ListItemSearchCss(); }
12578
13376
  static get cmpMeta() { return {
@@ -12589,7 +13387,7 @@ class SdSelectV2ListItemSearch {
12589
13387
  }; }
12590
13388
  }
12591
13389
 
12592
- const sdSelectV2ListboxCss = () => `sd-select-v2-listbox{display:block}sd-select-v2-listbox .sd-select-v2-listbox{display:flex;flex-direction:column;min-width:var(--listbox-trigger-width);max-width:var(--listbox-max-width);max-height:var(--listbox-max-height);width:fit-content;border-radius:var(--listbox-radius);background:white;box-shadow:2px 2px 12px 2px rgba(0, 0, 0, 0.1);overflow:hidden;outline:none}sd-select-v2-listbox .sd-select-v2-listbox__list{flex:1;min-height:0;overflow-y:auto;padding-bottom:var(--listbox-padding-bottom)}sd-select-v2-listbox .sd-select-v2-listbox__empty{padding:12px;text-align:center;font-size:12px;line-height:20px;color:#888888}`;
13390
+ const sdSelectV2ListboxCss = () => `sd-select-v2-listbox{display:block}sd-select-v2-listbox .sd-select-v2-listbox{display:flex;flex-direction:column;min-width:var(--listbox-trigger-width);max-width:var(--listbox-max-width);max-height:var(--listbox-max-height);width:fit-content;border-radius:var(--listbox-radius);background:white;box-shadow:2px 2px 12px 2px rgba(0, 0, 0, 0.1);overflow:hidden;outline:none}sd-select-v2-listbox .sd-select-v2-listbox__list{flex:1;min-height:0;overflow-y:auto;padding-bottom:0}sd-select-v2-listbox .sd-select-v2-listbox__empty{padding:12px;text-align:center;font-size:12px;line-height:20px;color:#888888}`;
12593
13391
 
12594
13392
  class SdSelectV2Listbox {
12595
13393
  constructor(hostRef) {
@@ -12876,9 +13674,8 @@ class SdSelectV2Listbox {
12876
13674
  '--listbox-max-width': this.maxWidth,
12877
13675
  '--listbox-max-height': this.maxHeight,
12878
13676
  '--listbox-radius': `${LIST_BOX_LAYOUT.radius}px`,
12879
- '--listbox-padding-bottom': `${LIST_BOX_LAYOUT.paddingBottom}px`,
12880
13677
  };
12881
- return (hAsync("div", { key: 'c04974ad387df3d23efbf27afdb6cc92f24a744e', class: "sd-select-v2-listbox", style: cssVars }, this.showSearch && (hAsync("sd-select-v2-list-item-search", { key: 'b8ef69dc0a35cc2110665095feea58d4132a6bad', isScrolled: this.isScrolled, onSdSearchFilter: this.handleSearchFilter })), hAsync("div", { key: 'd8a2f04f1dbbd8fde39203ac52a1bd220097495d', class: "sd-select-v2-listbox__list", onScroll: this.handleScroll, ref: el => {
13678
+ return (hAsync("div", { key: '92289973077789bd6f9657bb5b2e5567845bdc19', class: "sd-select-v2-listbox", style: cssVars }, this.showSearch && (hAsync("sd-select-v2-list-item-search", { key: 'a26b9ba36f42165ab80347ea4f0194b98746a9a6', isScrolled: this.isScrolled, onSdSearchFilter: this.handleSearchFilter })), hAsync("div", { key: 'd563a179278ec5c6eaa0b4c71d18cc5055bbebb5', class: "sd-select-v2-listbox__list", onScroll: this.handleScroll, ref: el => {
12882
13679
  this.listEl = el;
12883
13680
  } }, this.isEmpty ? (hAsync("div", { class: "sd-select-v2-listbox__empty" }, EMPTY_MESSAGE)) : this.isDepth ? (this.renderOptions(this.filteredOptions)) : (this.filteredOptions.map(option => (hAsync("sd-select-v2-list-item", { option: option, depth: 1, isSelected: this.isOptionSelected(option), isFocused: this.isOptionFocused(option), useCheckbox: this.isMulti, onSdListItemClick: this.handleOptionClick, onMouseEnter: () => this.handleOptionHover(option) })))))));
12884
13681
  }
@@ -12943,11 +13740,11 @@ class SdSelectV2Trigger {
12943
13740
  ? SELECT_COLORS.icon.disabled
12944
13741
  : SELECT_COLORS.icon.default,
12945
13742
  };
12946
- return (hAsync("div", { key: '9bbda5c8b8b359f6df1079f9f5b1b170472ba7d3', class: {
13743
+ return (hAsync("div", { key: '02e382b2a1867fa8816c11e2d07bb042a15027fb', class: {
12947
13744
  'sd-select-v2-trigger': true,
12948
13745
  'sd-select-v2-trigger--open': this.isOpen,
12949
13746
  'sd-select-v2-trigger--disabled': this.disabled,
12950
- }, style: cssVars, onClick: this.handleClick }, hAsync("div", { key: 'b129a7bcbdae8b6873f0b9f97cf37f69829de36a', class: "sd-select-v2-trigger__content" }, hAsync("span", { key: 'fff9c48504e54ea4bedd1494c3d321197f9b0e8d', class: "sd-select-v2-trigger__text" }, hasValue ? this.displayText : this.placeholder), hAsync("sd-icon", { key: 'd3e88a0de9fc773a3f5e3c173159ba2feff1ba67', name: "chevronDown", size: 12, color: "var(--trigger-icon-color)", class: {
13747
+ }, style: cssVars, onClick: this.handleClick }, hAsync("div", { key: 'e08360c05f765ccc0c9dbefe8e402a66edd1c242', class: "sd-select-v2-trigger__content" }, hAsync("span", { key: 'dc00441e24e17b9bb28a36892ff3564d4bb40a42', class: "sd-select-v2-trigger__text" }, hasValue ? this.displayText : this.placeholder), hAsync("sd-icon", { key: '3d78221139a6df71aa349277ed0f8d73fbba23ba', name: "chevronDown", size: 12, color: "var(--trigger-icon-color)", class: {
12951
13748
  'sd-select-v2-trigger__icon': true,
12952
13749
  'sd-select-v2-trigger__icon--open': this.isOpen,
12953
13750
  } }))));
@@ -13736,16 +14533,16 @@ class SdTable {
13736
14533
  return (hAsync("td", { key: `virtual-${position}-spacer-${rowIdx}`, class: "sd-table__virtual-spacer", style: this.getSpacerCellStyle(spacerWidth), "aria-hidden": "true" }, hAsync("div", { class: "sd-table__skeleton-cell" })));
13737
14534
  }
13738
14535
  render() {
13739
- return (hAsync(Fragment, { key: 'f3e4930d36d080fd546dddc1e80190b831e93012' }, hAsync("div", { key: 'ad2f798951631319190d93f83e25b87f871e58de', class: "sd-table__wrapper", style: {
14536
+ return (hAsync(Fragment, { key: 'cc7236bc2511f0b7c6bd31610e005c558e4dda81' }, hAsync("div", { key: 'c78feb1d4ba89c8340660405598c8892d660078d', class: "sd-table__wrapper", style: {
13740
14537
  '--table-width': this.width,
13741
14538
  '--table-height': this.height,
13742
- } }, hAsync("div", { key: 'c4b6d4080f1416d1c88ab1413c66848bdafe9019', class: "sd-table__container", style: {
14539
+ } }, hAsync("div", { key: 'e127e5e51cfa1b930a79d031ff4fbffac3cf8b69', class: "sd-table__container", style: {
13743
14540
  '--table-container-height': `calc(${this.height} - ${this.pagination && this.innerRows.length > 0 ? 48 : 0}px)`,
13744
- } }, hAsync("div", { key: '3aacc27970b0c6d8b700063c0af7c57175e2cb22', class: {
14541
+ } }, hAsync("div", { key: 'ea47affe622b7f7c98b9c044db73f275a9c7b8ba', class: {
13745
14542
  'sd-table__middle': true,
13746
14543
  'sd-table__middle--scrollable': this.paginatedRows.length > 0,
13747
14544
  'sd-table__middle--loading': this.isLoading,
13748
- } }, this.isLoading && (hAsync("div", { key: '25fca304a4e8ebf43aeeff20de3e3446d25e1ffb', class: "sd-table__middle--loading__spinner" }, hAsync("sd-loading-spinner", { key: '48b0adad60cf422b884557b53097c28a4f0b8879' }))), hAsync("table", { key: 'ec4328a1f43c865de642cc5814fbdef6a374b7e3', part: "table", class: this.sdTableClasses }, this.renderHead(), this.renderBody())), !this.paginatedRows.length && (hAsync("div", { key: 'ba362ecb9fb8134a15ff3d0a3b8e6a523e94166a', class: "sd-table__bottom" }, hAsync("div", { key: 'ca5c2e0b19a1e301ac159588436ef24eecfb6365', class: "sd-table__no-data" }, hAsync("slot", { key: '68564a60a05833ba87743212d7189eef6e179fb4', name: "no-data" }, this.noDataLabel))))), this.pagination && this.innerRows.length > 0 && (hAsync("div", { key: '88c3c7362234c20a60f6437ecd79d4c75b2caa6e', class: "sd-table__pagination" }, hAsync("sd-pagination", { key: 'c3c8c435fcb752f2b1139981bb764cf4dfb153ab', currentPage: !this.useInternalPagination ? this.pagination.page : this.currentPage, lastPage: !this.useInternalPagination ? this.pagination.lastPage : this.lastPageNumber, onSdPageChange: (e) => this.changePage(e.detail) }), this.useRowsPerPageSelect && (hAsync("sd-select", { key: '03801039397a31321e5af96c2bd2d2900151240e', value: this.pagination.rowsPerPage, options: this.rowsPerPageOption, width: "128px", onSdUpdate: (e) => this.changeRowsPerPage(e.detail.value) })))))));
14545
+ } }, this.isLoading && (hAsync("div", { key: '52c9d3a0b83bf786980cb6561b39234d3f1697ad', class: "sd-table__middle--loading__spinner" }, hAsync("sd-loading-spinner", { key: '60d8f10a4f35e509969190ab23713057f9fb1efb' }))), hAsync("table", { key: 'fd25840b4aeddd456d97c7397541da58c8d0aed9', part: "table", class: this.sdTableClasses }, this.renderHead(), this.renderBody())), !this.paginatedRows.length && (hAsync("div", { key: '5d1ed19126eb328a78ff50e701392b0d18208030', class: "sd-table__bottom" }, hAsync("div", { key: 'e3cc512088e0bf7f6ec9699c1ce948910d621e45', class: "sd-table__no-data" }, hAsync("slot", { key: 'a5285e5d607a66a6e9f7993c6a82dc9bd6d53a08', name: "no-data" }, this.noDataLabel))))), this.pagination && this.innerRows.length > 0 && (hAsync("div", { key: '1a57bf7960624ebfd80005cd320d0d29ed7b6123', class: "sd-table__pagination" }, hAsync("sd-pagination", { key: 'dbc457c10036556928c3503ef84b8bfc29849342', currentPage: !this.useInternalPagination ? this.pagination.page : this.currentPage, lastPage: !this.useInternalPagination ? this.pagination.lastPage : this.lastPageNumber, onSdPageChange: (e) => this.changePage(e.detail) }), this.useRowsPerPageSelect && (hAsync("sd-select", { key: '6a0bdf472ed0dfca4c57725635c50bf1a375f11c', value: this.pagination.rowsPerPage, options: this.rowsPerPageOption, width: "128px", onSdUpdate: (e) => this.changeRowsPerPage(e.detail.value) })))))));
13749
14546
  }
13750
14547
  static get watchers() { return {
13751
14548
  "columns": [{
@@ -13863,10 +14660,10 @@ class SdTabs {
13863
14660
  }
13864
14661
  getBadgeName(tab) {
13865
14662
  const color = this.isTabSelected(tab) ? 'blue' : 'grey';
13866
- return `square_${this.size}_${color}`;
14663
+ return `square_xs_${color}`;
13867
14664
  }
13868
14665
  render() {
13869
- return (hAsync("div", { key: '74a25ee4311c84e79f4918b884385f27d6af6313', class: this.getContainerClasses() }, this.tabs.map((tab, index) => {
14666
+ return (hAsync("div", { key: '4fee168f0120b757d480e2dfa66fdbec3d9fd45d', class: this.getContainerClasses() }, this.tabs.map((tab, index) => {
13870
14667
  const badgeName = this.getBadgeName(tab);
13871
14668
  return (hAsync("div", { key: `tab-${index}`, class: this.getTabClasses(tab), "aria-label": tab.label || 'tab', onClick: () => this.handleTabClick(tab.value) }, hAsync("span", { "data-label": tab.label, class: "sd-tabs__label" }, tab.label), tab.badge && hAsync("sd-tag", { name: badgeName, label: tab.badge.toString() })));
13872
14669
  })));
@@ -14061,7 +14858,7 @@ class SdTag {
14061
14858
  render() {
14062
14859
  const config = this.resolvedConfig;
14063
14860
  const iconNode = this.renderIcon(config.icon, config.iconSize);
14064
- return (hAsync("span", { key: '0a1fe7d5e6a3fcdf3a392e1e8d16032139116c7e', class: "sd-tag", style: {
14861
+ return (hAsync("span", { key: 'acfc91bdd46c2f0fc53b066d6c6b9de94068c492', class: "sd-tag", style: {
14065
14862
  '--sd-tag-background': config.background,
14066
14863
  '--sd-tag-content': config.content,
14067
14864
  '--sd-tag-height': config.height,
@@ -14071,7 +14868,7 @@ class SdTag {
14071
14868
  '--sd-tag-font-weight': config.fontWeight,
14072
14869
  '--sd-tag-line-height': config.lineHeight,
14073
14870
  '--sd-tag-radius': config.radius,
14074
- }, "aria-label": this.label || 'tag' }, this.icon && this.isLeft && iconNode, hAsync("span", { key: '405deaf8fa66c9ea703035211ff2274d2dc78884', class: "sd-tag__label" }, this.label), this.icon && !this.isLeft && iconNode));
14871
+ }, "aria-label": this.label || 'tag' }, this.icon && this.isLeft && iconNode, hAsync("span", { key: '8d7f7f40c4eb55687f2c7ebe66fba04c3846c0e2', class: "sd-tag__label" }, this.label), this.icon && !this.isLeft && iconNode));
14075
14872
  }
14076
14873
  static get style() { return sdTagCss(); }
14077
14874
  static get cmpMeta() { return {
@@ -14162,16 +14959,16 @@ class SdTextLink {
14162
14959
  '--sd-text-link-text-decoration': typo.textDecoration,
14163
14960
  // '--sd-text-link-color': contentColor,
14164
14961
  };
14165
- return (hAsync("span", { key: 'bd6850cf5749760dd3ff021d7cf902313d684f66', class: {
14962
+ return (hAsync("span", { key: 'b20b183974df13a11812d3f3c16abd2456dd0eb5', class: {
14166
14963
  'sd-text-link': true,
14167
14964
  'sd-text-link--disabled': this.disabled,
14168
- }, style: cssVars, onClick: this.handleClick }, this.icon && (hAsync("sd-icon", { key: '9ec2424e482f2dc8e528c72c5bcdcaf17cc9cee0', name: this.icon, size: TEXT_LINK_LAYOUT.iconSize, color: iconColor, class: "sd-text-link__icon" })), hAsync("span", { key: 'babc8b94040286764a005393b807bf0abded0181', class: labelClassName }, this.label), this.useArrow && (hAsync("span", { key: '4b219e46326e3900316321a619c620132c5434a6', class: "sd-text-link__arrow", style: {
14965
+ }, style: cssVars, onClick: this.handleClick }, this.icon && (hAsync("sd-icon", { key: '581390418ffdd23767838b6f4777fa36cac3ec89', name: this.icon, size: TEXT_LINK_LAYOUT.iconSize, color: iconColor, class: "sd-text-link__icon" })), hAsync("span", { key: 'a733650304df4c66bb1a0f54cc0554538263830d', class: labelClassName }, this.label), this.useArrow && (hAsync("span", { key: '1437e31870f22bcb13146cc8f2652f3b8d7fa57a', class: "sd-text-link__arrow", style: {
14169
14966
  width: `${TEXT_LINK_LAYOUT.arrowFrame}px`,
14170
14967
  height: `${TEXT_LINK_LAYOUT.arrowFrame}px`,
14171
14968
  display: 'inline-flex',
14172
14969
  alignItems: 'center',
14173
14970
  justifyContent: 'center',
14174
- } }, hAsync("sd-icon", { key: '7c06ce3757b35b01bc3c70f1a078fd8c0ea6df83', name: "chevronRight", size: TEXT_LINK_LAYOUT.arrowIconSize, color: arrowColor })))));
14971
+ } }, hAsync("sd-icon", { key: '17a886109c8e5f72daf5f1f8baa4e185161c934d', name: "chevronRight", size: TEXT_LINK_LAYOUT.arrowIconSize, color: arrowColor })))));
14175
14972
  }
14176
14973
  static get style() { return sdTextLinkCss(); }
14177
14974
  static get cmpMeta() { return {
@@ -14193,17 +14990,17 @@ class SdTextLink {
14193
14990
  }
14194
14991
 
14195
14992
  const TEXTAREA_TOKENS = {
14196
- paddingX: inputTokens.input.sm.paddingX,
14197
- paddingY: inputTokens.input.sm.paddingY,
14198
- radius: inputTokens.input.sm.radius,
14199
- fontSize: inputTokens.input.sm.typography.fontSize,
14200
- lineHeight: inputTokens.input.sm.typography.lineHeight,
14201
- fontWeight: inputTokens.input.sm.typography.fontWeight};
14993
+ paddingX: inputTokens.textinput.sm.paddingX,
14994
+ paddingY: inputTokens.textinput.sm.paddingY,
14995
+ radius: inputTokens.textinput.sm.radius,
14996
+ fontSize: inputTokens.textinput.sm.typography.fontSize,
14997
+ lineHeight: inputTokens.textinput.sm.typography.lineHeight,
14998
+ fontWeight: inputTokens.textinput.sm.typography.fontWeight};
14202
14999
  const TEXTAREA_COLORS = {
14203
- text: inputTokens.input.text,
14204
- bg: inputTokens.input.bg,
14205
- border: inputTokens.input.border,
14206
- resizer: inputTokens.input.resizer,
15000
+ text: inputTokens.textinput.text,
15001
+ bg: inputTokens.textinput.bg,
15002
+ border: inputTokens.textinput.border,
15003
+ resizer: inputTokens.textinput.resizer,
14207
15004
  };
14208
15005
 
14209
15006
  const sdTextareaCss = () => `sd-textarea{display:inline-flex}sd-textarea .sd-textarea__content{width:100%;display:flex}sd-textarea .sd-textarea__content .sd-textarea__native{width:100%;min-height:100px;border:none;outline:none;background:transparent;padding:var(--sd-textarea-padding-y) var(--sd-textarea-padding-x);font-family:inherit;font-size:var(--sd-textarea-font-size);line-height:var(--sd-textarea-line-height);font-weight:var(--sd-textarea-font-weight);color:var(--sd-textarea-text-color);resize:vertical}sd-textarea .sd-textarea__content .sd-textarea__native::placeholder{color:var(--sd-textarea-placeholder-color)}sd-textarea .sd-textarea__content .sd-textarea__native:disabled{cursor:not-allowed;color:var(--sd-textarea-disabled-color)}`;
@@ -14316,7 +15113,7 @@ class SdTextarea {
14316
15113
  '--sd-system-size-field-sm-height': 'auto',
14317
15114
  '--sd-system-radius-field-sm': `${TEXTAREA_TOKENS.radius}px`,
14318
15115
  };
14319
- return (hAsync("sd-field", { key: '390028112d84c22766c6e00fa3625312b8096629', name: this.name, label: this.label, addonLabel: this.addonLabel, hint: this.hint, errorMessage: this.errorMessage, width: this.width, rules: this.rules, error: this.error, disabled: this.disabled, focused: this.focused, hovered: this.hovered, status: this.status, icon: this.icon, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el), onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false), style: cssVars }, hAsync("div", { key: '026ec0293049da167e7dbab5d3a28593d5e6b291', class: "sd-textarea__content" }, hAsync("textarea", { key: 'd30b5e1bc61535c1c350f09bf2ea289f0b09001b', 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 }))));
15116
+ return (hAsync("sd-field", { key: 'ea611c76e2550f996cfe8848aa880d070325f133', name: this.name, label: this.label, addonLabel: this.addonLabel, hint: this.hint, errorMessage: this.errorMessage, width: this.width, rules: this.rules, error: this.error, disabled: this.disabled, focused: this.focused, hovered: this.hovered, status: this.status, icon: this.icon, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el), onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false), style: cssVars }, hAsync("div", { key: '90dbe39c0dd4eb8e6dfbf15afb8d04925d1c767b', class: "sd-textarea__content" }, hAsync("textarea", { key: '9026a4837b4b7bba8bc8237ad3c1f516b9dda267', 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 }))));
14320
15117
  }
14321
15118
  static get watchers() { return {
14322
15119
  "value": [{
@@ -14422,10 +15219,10 @@ class SdToast {
14422
15219
  render() {
14423
15220
  const typeConfig = TOAST_TYPE_CONFIG[this.type] ?? TOAST_TYPE_CONFIG.default;
14424
15221
  const iconSize = Number(TOAST_LAYOUT.iconSize);
14425
- return (hAsync("div", { key: 'cb42937774233de10872edb8414db88f03868eb3', style: {
15222
+ return (hAsync("div", { key: '2a054f05ab63f450e7b0dc1d3816dc9cfca149d0', style: {
14426
15223
  '--sd-toast-bg': typeConfig.bg,
14427
15224
  '--sd-toast-text': typeConfig.content,
14428
- } }, hAsync("div", { key: 'e58b3335c4d7c450ef3686c53138636502c4e0f3', class: "sd-toast", role: "status", "aria-live": "polite", "aria-atomic": "true" }, this.icon && (hAsync("div", { key: '62e42c814ab2f15d563b3f75c4e9dd3e559318a0', class: "sd-toast__icon" }, hAsync("sd-icon", { key: '3e346baecd3207ee817ba843427ed2076fd7cc7c', name: this.icon, size: iconSize, color: typeConfig.content }))), hAsync("div", { key: '700c7127a1d59409103b5ceb917e584020078736', class: "sd-toast__content" }, hAsync("span", { key: 'd4165f0e324048edcb2492f3050795d26ce1fc86', class: "sd-toast__message" }, this.message)), this.link && (hAsync("a", { key: 'f87089865b4e4fd5b488185478c453641920ac92', href: this.link, class: "sd-toast__link", target: "_blank", rel: "noopener noreferrer" }, this.linkLabel || this.link)), this.useClose && (hAsync("sd-ghost-button", { key: '33de3a35d1532cd15215751996827a462a7b8cad', class: "sd-toast__close", icon: "close", ariaLabel: "close", size: "xs", onClick: () => this.close.emit() })))));
15225
+ } }, hAsync("div", { key: 'e9ebafe293282a8df041b343e83ccbcca0f15919', class: "sd-toast", role: "status", "aria-live": "polite", "aria-atomic": "true" }, this.icon && (hAsync("div", { key: 'ebd56ba5d1aea16453a8e90be0ab1d7be8ccd579', class: "sd-toast__icon" }, hAsync("sd-icon", { key: 'd01746c69004c6697209f76a88baba467bf290db', name: this.icon, size: iconSize, color: typeConfig.content }))), hAsync("div", { key: '962d70832f11496be43a60415aa435a9094c3fef', class: "sd-toast__content" }, hAsync("span", { key: 'fd868607134f556980c67f22c2e55d9819fbfb99', class: "sd-toast__message" }, this.message)), this.link && (hAsync("a", { key: '72feff87a7e2f0a7726ed293e14203ae1c82d80f', href: this.link, class: "sd-toast__link", target: "_blank", rel: "noopener noreferrer" }, this.linkLabel || this.link)), this.useClose && (hAsync("sd-ghost-button", { key: 'f98218ceb7d1a339065219a35bef7db4125ea30b', class: "sd-toast__close", icon: "close", intent: this.type === 'caution' ? 'default' : 'inverse', ariaLabel: "close", size: "xs", onClick: () => this.close.emit() })))));
14429
15226
  }
14430
15227
  static get style() { return sdToastCss(); }
14431
15228
  static get cmpMeta() { return {
@@ -14677,7 +15474,7 @@ class SdToastContainer {
14677
15474
  const activeToasts = toasts.filter(t => t.state !== 'exiting').reverse();
14678
15475
  const indexMap = new Map();
14679
15476
  activeToasts.forEach((t, i) => indexMap.set(t.id, i));
14680
- return (hAsync("div", { key: '7d2c4a095a0762710024c4c102ce49c7c7163368', class: "sd-toast-container", style: this.getContainerStyles(), onMouseEnter: () => {
15477
+ return (hAsync("div", { key: '18ef06077ee49165d6237dbd4fff06e8c1997bcb', class: "sd-toast-container", style: this.getContainerStyles(), onMouseEnter: () => {
14681
15478
  this.expanded = true;
14682
15479
  this.pauseTimers();
14683
15480
  }, onMouseLeave: () => {
@@ -14752,7 +15549,7 @@ class SdToggle {
14752
15549
  this.change.emit(newValue);
14753
15550
  };
14754
15551
  render() {
14755
- return (hAsync("label", { key: '9f4cf71a2aab588deb68d8e6908f0988ddbacb90', "aria-label": this.label || 'toggle', class: this.toggleClasses }, hAsync("input", { key: '6d1279761ea384a233bff234c549030709fd4ea3', type: "checkbox", checked: this.value, disabled: this.disabled, onInput: this.handleChange }), this.label && hAsync("span", { key: '7ecd96f5e2c48fda17ed0086ab3cc8bc1caab458', class: "sd-toggle__label" }, this.label), hAsync("div", { key: '26f4d468e4ff0c4473e2ce00b7e69a855a249a96', class: "sd-toggle__track" }, hAsync("div", { key: '3a7f4019197cfa23dc268ee95308e60d7159ba28', class: "sd-toggle__thumb" }))));
15552
+ return (hAsync("label", { key: 'ca08050cdbbb4e5e7e615f72411be5bff93955d8', "aria-label": this.label || 'toggle', class: this.toggleClasses }, hAsync("input", { key: 'abdae5d4dc59fc121ded9cc0800f68d3996d4e50', type: "checkbox", checked: this.value, disabled: this.disabled, onInput: this.handleChange }), this.label && hAsync("span", { key: '37d23f59f877100c53deace3c6c70b441df5748c', class: "sd-toggle__label" }, this.label), hAsync("div", { key: '545f76c3c1e63198f6dc80bdf6bf44f6840082b2', class: "sd-toggle__track" }, hAsync("div", { key: '4142b2e46b93cf1d5f86cb1b5a4490c0e6a03a05', class: "sd-toggle__thumb" }))));
14756
15553
  }
14757
15554
  static get style() { return sdToggleCss(); }
14758
15555
  static get cmpMeta() { return {
@@ -14808,7 +15605,7 @@ class SdToggleButton {
14808
15605
  this.change.emit(newValue);
14809
15606
  };
14810
15607
  render() {
14811
- return (hAsync("label", { key: '9d98201d5ab361d0d2d5c8c61ce1e5b129f4d588', class: this.buttonClasses, "aria-label": this.label || 'toggle button' }, this.label, hAsync("input", { key: 'a745715a752bf99a94ab01d8c07c87d0f507a8ef', style: { display: 'none' }, type: "checkbox", onInput: this.handleChange })));
15608
+ return (hAsync("label", { key: '0e933c52b633eec101beec8aa6ec888dc6bc3448', class: this.buttonClasses, "aria-label": this.label || 'toggle button' }, this.label, hAsync("input", { key: '833e7c26895e310cb6322b7231345f76f0a409dc', style: { display: 'none' }, type: "checkbox", onInput: this.handleChange })));
14812
15609
  }
14813
15610
  static get style() { return sdToggleButtonCss(); }
14814
15611
  static get cmpMeta() { return {
@@ -14936,14 +15733,14 @@ class SdTooltip {
14936
15733
  const toggleTooltip = () => (this.showTooltip = !this.showTooltip);
14937
15734
  const divTrigger = trigger === 'hover' ? hoverTrigger : this.label ? {} : { onClick: toggleTooltip };
14938
15735
  const buttonClickTrigger = trigger === 'click' && this.label ? { onSdClick: toggleTooltip } : {};
14939
- return (hAsync(Fragment, { key: '2e854c5a056af93e65460500da199ddd763de777' }, hAsync("div", { key: 'aa5e250e4d371c4a54401d367fdf647cefb6aecc', class: `sd-tooltip-trigger ${this.sdClass || ''}`, ...divTrigger }, this.label ? (hAsync("sd-button", { ref: el => (this.buttonEl = el), label: this.label, icon: icon, size: this.buttonSize ?? 'sm', color: color, variant: this.buttonVariant ?? 'primary', class: "sd-tooltip", ...buttonClickTrigger })) : (hAsync("sd-icon", { ref: el => (this.buttonEl = el), name: icon, size: this.iconSize ?? 12, color: color, class: "sd-tooltip" }))), this.showTooltip && (hAsync("sd-floating-portal", { key: 'f94aa0d5730b7f585f943b60bf39e4248d0b695e', parentRef: this.buttonEl, onSdClose: this.handleClose.bind(this), placement: placement, offset: this.tooltipOffset }, hAsync("div", { key: '76ece6c53c4daad54a13950b616bb7edd0827f81', ref: el => (this.menuEl = el), class: {
15736
+ return (hAsync(Fragment, { key: '26a3cf140fdbc66fe79d9258f99082cdf0c79c60' }, hAsync("div", { key: 'a47fb4ca41deecc63db4bc8d8e93419da8867e22', class: `sd-tooltip-trigger ${this.sdClass || ''}`, ...divTrigger }, this.label ? (hAsync("sd-button", { ref: el => (this.buttonEl = el), label: this.label, icon: icon, size: this.buttonSize ?? 'sm', color: color, variant: this.buttonVariant ?? 'primary', class: "sd-tooltip", ...buttonClickTrigger })) : (hAsync("sd-icon", { ref: el => (this.buttonEl = el), name: icon, size: this.iconSize ?? 12, color: color, class: "sd-tooltip" }))), this.showTooltip && (hAsync("sd-floating-portal", { key: 'a728edde03eee82a0b4c72ea77a9cb918b27f709', parentRef: this.buttonEl, onSdClose: this.handleClose.bind(this), placement: placement, offset: this.tooltipOffset }, hAsync("div", { key: '7afcb975b1045126fd19d2f6186a43d744de5922', ref: el => (this.menuEl = el), class: {
14940
15737
  'sd-floating-menu': true,
14941
15738
  [`sd-floating-menu--${tooltipType}`]: true,
14942
15739
  [`sd-floating-menu--${placement}`]: true,
14943
15740
  }, style: {
14944
15741
  '--sd-floating-bg': typeConfig.bg,
14945
15742
  '--sd-floating-content': typeConfig.content,
14946
- }, onMouseEnter: () => this.show(), onMouseLeave: () => this.startHideTimer() }, hAsync("i", { key: '4beed6bf9afbccd072c2c8ab9885d7a8bde99284', class: `sd-floating-menu__arrow sd-floating-menu__arrow--${placement}` }, hAsync(TooltipArrow, { key: 'e73b4c9085c57f40410ecc0a7ec758019418899e' })), hAsync("div", { key: '8dcd58077836c846fafb948dbf0c77e149987818', class: "sd-floating-menu__content", innerHTML: this.slotContentHTML }))))));
15743
+ }, onMouseEnter: () => this.show(), onMouseLeave: () => this.startHideTimer() }, hAsync("i", { key: '5c650247061d57b01adf3e53ddaa6d92c35a5e53', class: `sd-floating-menu__arrow sd-floating-menu__arrow--${placement}` }, hAsync(TooltipArrow, { key: '2bd40b24cd9c6015f1a3c5548b619c48b10df758' })), hAsync("div", { key: 'cce2db4ea12874ab11ac0bd04fb4080b2778c9b3', class: "sd-floating-menu__content", innerHTML: this.slotContentHTML }))))));
14947
15744
  }
14948
15745
  static get style() { return sdTooltipCss(); }
14949
15746
  static get cmpMeta() { return {
@@ -14982,7 +15779,10 @@ registerComponents([
14982
15779
  SdConfirmModal,
14983
15780
  SdDateBox,
14984
15781
  SdDatePicker,
15782
+ SdDatePickerCalendar,
15783
+ SdDatePickerTrigger,
14985
15784
  SdDateRangePicker,
15785
+ SdDateRangePickerCalendar,
14986
15786
  SdDropdownButton,
14987
15787
  SdField,
14988
15788
  SdFilePicker,