@sellmate/design-system 1.0.25 → 1.0.27

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 (217) hide show
  1. package/dist/cjs/{component.button-C6xBMwHf.js → component.button-ASC_hRm6.js} +0 -7
  2. package/dist/cjs/design-system.cjs.js +1 -1
  3. package/dist/cjs/loader.cjs.js +1 -1
  4. package/dist/cjs/sd-badge.cjs.entry.js +29 -6
  5. package/dist/cjs/sd-button-v2.cjs.entry.js +5 -6
  6. package/dist/cjs/{sd-button-v2.config-BK45EPK_.js → sd-button-v2.config-DGJDtL6W.js} +1 -27
  7. package/dist/cjs/sd-button_21.cjs.entry.js +77 -50
  8. package/dist/cjs/sd-card.cjs.entry.js +1 -1
  9. package/dist/cjs/sd-date-picker.cjs.entry.js +1 -1
  10. package/dist/cjs/sd-dropdown-button.cjs.entry.js +7 -22
  11. package/dist/cjs/sd-file-picker.cjs.entry.js +3 -3
  12. package/dist/cjs/sd-form.cjs.entry.js +1 -1
  13. package/dist/cjs/sd-guide.cjs.entry.js +2 -2
  14. package/dist/cjs/sd-popover.cjs.entry.js +15 -2
  15. package/dist/cjs/sd-progress.cjs.entry.js +2 -2
  16. package/dist/cjs/sd-radio-button-group.cjs.entry.js +1 -1
  17. package/dist/cjs/sd-radio-group.cjs.entry.js +1 -1
  18. package/dist/cjs/sd-select-multiple-group.cjs.entry.js +1 -1
  19. package/dist/cjs/sd-select-multiple.cjs.entry.js +1 -1
  20. package/dist/cjs/sd-select-option-group.cjs.entry.js +3 -3
  21. package/dist/cjs/sd-tabs.cjs.entry.js +1 -1
  22. package/dist/cjs/sd-tag.cjs.entry.js +104 -35
  23. package/dist/cjs/sd-toast.cjs.entry.js +3 -3
  24. package/dist/cjs/sd-toggle-button.cjs.entry.js +1 -1
  25. package/dist/cjs/sd-toggle.cjs.entry.js +1 -1
  26. package/dist/collection/collection-manifest.json +2 -2
  27. package/dist/collection/components/sd-badge/sd-badge.config.js +12 -0
  28. package/dist/collection/components/sd-badge/sd-badge.css +5 -14
  29. package/dist/collection/components/sd-badge/sd-badge.js +15 -29
  30. package/dist/collection/components/sd-button-v2/sd-button-v2.config.js +0 -24
  31. package/dist/collection/components/sd-button-v2/sd-button-v2.css +6 -5
  32. package/dist/collection/components/sd-button-v2/sd-button-v2.js +4 -5
  33. package/dist/collection/components/sd-card/sd-card.js +1 -1
  34. package/dist/collection/components/sd-date-picker/sd-date-picker.js +1 -1
  35. package/dist/collection/components/sd-date-range-picker/sd-date-range-picker.js +2 -2
  36. package/dist/collection/components/sd-dropdown-button/sd-dropdown-button.config.js +1 -10
  37. package/dist/collection/components/sd-dropdown-button/sd-dropdown-button.css +9 -5
  38. package/dist/collection/components/sd-dropdown-button/sd-dropdown-button.js +3 -9
  39. package/dist/collection/components/sd-field/sd-field.js +5 -5
  40. package/dist/collection/components/sd-file-picker/sd-file-picker.js +3 -3
  41. package/dist/collection/components/sd-floating-portal/sd-floating-portal.css +52 -28
  42. package/dist/collection/components/sd-floating-portal/sd-floating-portal.js +1 -1
  43. package/dist/collection/components/sd-form/sd-form.js +1 -1
  44. package/dist/collection/components/sd-guide/sd-guide.js +2 -2
  45. package/dist/collection/components/sd-icon/sd-icon.js +1 -1
  46. package/dist/collection/components/sd-input/sd-input.js +3 -3
  47. package/dist/collection/components/sd-loading-spinner/sd-loading-spinner.js +1 -1
  48. package/dist/collection/components/sd-modal-card/sd-modal-card.js +1 -1
  49. package/dist/collection/components/sd-number-input/sd-number-input.js +4 -4
  50. package/dist/collection/components/sd-pagination/sd-pagination.js +2 -2
  51. package/dist/collection/components/sd-popover/sd-popover.js +6 -2
  52. package/dist/collection/components/sd-portal/sd-portal.js +11 -10
  53. package/dist/collection/components/sd-progress/sd-progress.js +2 -2
  54. package/dist/collection/components/sd-radio/sd-radio.js +1 -1
  55. package/dist/collection/components/sd-radio-button-group/sd-radio-button-group.js +1 -1
  56. package/dist/collection/components/sd-radio-group/sd-radio-group.js +1 -1
  57. package/dist/collection/components/sd-select/sd-select-dropdown/sd-select-dropdown.js +2 -2
  58. package/dist/collection/components/sd-select/sd-select-option/sd-select-option.js +1 -1
  59. package/dist/collection/components/sd-select/sd-select-search-input/sd-select-search-input.js +3 -3
  60. package/dist/collection/components/sd-select/sd-select.js +3 -3
  61. package/dist/collection/components/sd-select-multiple/sd-select-multiple.js +1 -1
  62. package/dist/collection/components/sd-select-multiple-group/sd-select-multiple-group.js +3 -3
  63. package/dist/collection/components/sd-select-multiple-group/sd-select-option-group/sd-select-option-group.js +3 -3
  64. package/dist/collection/components/sd-table/sd-table.js +4 -4
  65. package/dist/collection/components/sd-tabs/sd-tabs.js +1 -1
  66. package/dist/collection/components/sd-tag/sd-tag.config.js +35 -31
  67. package/dist/collection/components/sd-tag/sd-tag.css +1 -1
  68. package/dist/collection/components/sd-tag/sd-tag.js +6 -5
  69. package/dist/collection/components/sd-textarea/sd-textarea.js +2 -2
  70. package/dist/collection/components/sd-toast/sd-toast.js +2 -2
  71. package/dist/collection/components/sd-toggle/sd-toggle.js +1 -1
  72. package/dist/collection/components/sd-toggle-button/sd-toggle-button.js +1 -1
  73. package/dist/collection/components/sd-tooltip/sd-tooltip.config.js +7 -0
  74. package/dist/collection/components/sd-tooltip/sd-tooltip.js +21 -32
  75. package/dist/components/{p-Dc4UTGgQ.js → p-2CurSZ9q.js} +1 -1
  76. package/dist/components/{p-CAZeEBeS.js → p-BDPJKxrr.js} +1 -1
  77. package/dist/components/{p-D9mJxIjm.js → p-BFVe-fGw.js} +1 -1
  78. package/dist/components/{p-DYoNy5I7.js → p-BVIzG0vO.js} +1 -1
  79. package/dist/components/p-BZt0PSLv.js +1 -0
  80. package/dist/components/{p-2FdkYfts.js → p-CGgmrFwF.js} +1 -1
  81. package/dist/components/p-COsw7PE1.js +1 -0
  82. package/dist/components/{p-CdCMe4bN.js → p-CS4tniB3.js} +1 -1
  83. package/dist/components/{p-CwM24aVj.js → p-CZLePSDf.js} +1 -1
  84. package/dist/components/{p-B1o7vc2v.js → p-CgilbV-B.js} +1 -1
  85. package/dist/components/{p-DUqcOPNn.js → p-CquSJNHV.js} +1 -1
  86. package/dist/components/{p-CzHa12Ax.js → p-D4eRE9J1.js} +1 -1
  87. package/dist/components/{p-BxXKe48B.js → p-DNQE5SAA.js} +1 -1
  88. package/dist/components/{p-G4t0nGLP.js → p-DfhTm5zs.js} +1 -1
  89. package/dist/components/p-DghTuouQ.js +1 -0
  90. package/dist/components/{p-Czq-8oT7.js → p-DtNd46kD.js} +1 -1
  91. package/dist/components/p-DuzMehmA.js +1 -0
  92. package/dist/components/p-fvvA-prd.js +1 -0
  93. package/dist/components/{p-BKTfQGcR.js → p-kyuN077y.js} +1 -1
  94. package/dist/components/p-wt_xdZCl.js +1 -0
  95. package/dist/components/sd-badge.js +1 -1
  96. package/dist/components/sd-button-v2.js +1 -1
  97. package/dist/components/sd-button.js +1 -1
  98. package/dist/components/sd-card.js +1 -1
  99. package/dist/components/sd-checkbox.js +1 -1
  100. package/dist/components/sd-date-picker.js +1 -1
  101. package/dist/components/sd-date-range-picker.js +1 -1
  102. package/dist/components/sd-dropdown-button.js +1 -1
  103. package/dist/components/sd-field.js +1 -1
  104. package/dist/components/sd-file-picker.js +1 -1
  105. package/dist/components/sd-floating-portal.js +1 -1
  106. package/dist/components/sd-form.js +1 -1
  107. package/dist/components/sd-guide.js +1 -1
  108. package/dist/components/sd-icon.js +1 -1
  109. package/dist/components/sd-input.js +1 -1
  110. package/dist/components/sd-loading-spinner.js +1 -1
  111. package/dist/components/sd-modal-card.js +1 -1
  112. package/dist/components/sd-number-input.js +1 -1
  113. package/dist/components/sd-pagination.js +1 -1
  114. package/dist/components/sd-popover.js +1 -1
  115. package/dist/components/sd-portal.js +1 -1
  116. package/dist/components/sd-progress.js +1 -1
  117. package/dist/components/sd-radio-button-group.js +1 -1
  118. package/dist/components/sd-radio-group.js +1 -1
  119. package/dist/components/sd-radio.js +1 -1
  120. package/dist/components/sd-select-dropdown.js +1 -1
  121. package/dist/components/sd-select-multiple-group.js +1 -1
  122. package/dist/components/sd-select-multiple.js +1 -1
  123. package/dist/components/sd-select-option-group.js +1 -1
  124. package/dist/components/sd-select-option.js +1 -1
  125. package/dist/components/sd-select-search-input.js +1 -1
  126. package/dist/components/sd-select.js +1 -1
  127. package/dist/components/sd-table.js +1 -1
  128. package/dist/components/sd-tabs.js +1 -1
  129. package/dist/components/sd-tag.js +1 -1
  130. package/dist/components/sd-textarea.js +1 -1
  131. package/dist/components/sd-toast.js +1 -1
  132. package/dist/components/sd-toggle-button.js +1 -1
  133. package/dist/components/sd-toggle.js +1 -1
  134. package/dist/components/sd-tooltip.js +1 -1
  135. package/dist/design-system/design-system.css +1 -1
  136. package/dist/design-system/design-system.esm.js +1 -1
  137. package/dist/design-system/{p-c0655cd1.entry.js → p-141f5a74.entry.js} +1 -1
  138. package/dist/design-system/{p-e6d84ecf.entry.js → p-19805249.entry.js} +1 -1
  139. package/dist/design-system/{p-Dc4UTGgQ.js → p-2CurSZ9q.js} +1 -1
  140. package/dist/design-system/p-37e9e161.entry.js +1 -0
  141. package/dist/design-system/{p-1b80635f.entry.js → p-3d91bd65.entry.js} +1 -1
  142. package/dist/design-system/{p-5094848f.entry.js → p-58e3bd95.entry.js} +1 -1
  143. package/dist/design-system/{p-02c5ab69.entry.js → p-5ef7ff34.entry.js} +1 -1
  144. package/dist/design-system/{p-83f320e6.entry.js → p-680c5afb.entry.js} +1 -1
  145. package/dist/design-system/p-73362d34.entry.js +1 -0
  146. package/dist/design-system/p-73d29523.entry.js +1 -0
  147. package/dist/design-system/{p-3565f871.entry.js → p-7801d0bb.entry.js} +1 -1
  148. package/dist/design-system/p-8be27d6e.entry.js +1 -0
  149. package/dist/design-system/p-995f2846.entry.js +1 -0
  150. package/dist/design-system/{p-DUqcOPNn.js → p-CquSJNHV.js} +1 -1
  151. package/dist/design-system/p-DuzMehmA.js +1 -0
  152. package/dist/design-system/{p-ea26b8e9.entry.js → p-a493d89a.entry.js} +1 -1
  153. package/dist/design-system/{p-8b013328.entry.js → p-a7815753.entry.js} +1 -1
  154. package/dist/design-system/{p-712c1ef1.entry.js → p-b9f3d804.entry.js} +1 -1
  155. package/dist/design-system/p-c32943cf.entry.js +1 -0
  156. package/dist/design-system/p-ce410fca.entry.js +1 -0
  157. package/dist/design-system/p-d8b04e91.entry.js +1 -0
  158. package/dist/design-system/{p-df3d3a2a.entry.js → p-e711ab13.entry.js} +1 -1
  159. package/dist/design-system/{p-5032c700.entry.js → p-e9040a63.entry.js} +1 -1
  160. package/dist/design-system/{p-f1b31194.entry.js → p-e9bd0893.entry.js} +1 -1
  161. package/dist/esm/{component.button-Dc4UTGgQ.js → component.button-2CurSZ9q.js} +0 -7
  162. package/dist/esm/design-system.js +1 -1
  163. package/dist/esm/loader.js +1 -1
  164. package/dist/esm/sd-badge.entry.js +29 -6
  165. package/dist/esm/{sd-button-v2.config-BWmcscrt.js → sd-button-v2.config-FpT7FqlI.js} +2 -27
  166. package/dist/esm/sd-button-v2.entry.js +5 -6
  167. package/dist/esm/sd-button_21.entry.js +77 -50
  168. package/dist/esm/sd-card.entry.js +1 -1
  169. package/dist/esm/sd-date-picker.entry.js +1 -1
  170. package/dist/esm/sd-dropdown-button.entry.js +7 -22
  171. package/dist/esm/sd-file-picker.entry.js +3 -3
  172. package/dist/esm/sd-form.entry.js +1 -1
  173. package/dist/esm/sd-guide.entry.js +2 -2
  174. package/dist/esm/sd-popover.entry.js +15 -2
  175. package/dist/esm/sd-progress.entry.js +2 -2
  176. package/dist/esm/sd-radio-button-group.entry.js +1 -1
  177. package/dist/esm/sd-radio-group.entry.js +1 -1
  178. package/dist/esm/sd-select-multiple-group.entry.js +1 -1
  179. package/dist/esm/sd-select-multiple.entry.js +1 -1
  180. package/dist/esm/sd-select-option-group.entry.js +3 -3
  181. package/dist/esm/sd-tabs.entry.js +1 -1
  182. package/dist/esm/sd-tag.entry.js +104 -35
  183. package/dist/esm/sd-toast.entry.js +3 -3
  184. package/dist/esm/sd-toggle-button.entry.js +1 -1
  185. package/dist/esm/sd-toggle.entry.js +1 -1
  186. package/dist/types/components/sd-badge/sd-badge.config.d.ts +3 -0
  187. package/dist/types/components/sd-badge/sd-badge.d.ts +2 -2
  188. package/dist/types/components/sd-button-v2/sd-button-v2.config.d.ts +0 -23
  189. package/dist/types/components/sd-dropdown-button/sd-dropdown-button.config.d.ts +1 -4
  190. package/dist/types/components/sd-field/sd-field.d.ts +1 -1
  191. package/dist/types/components/sd-input/sd-input.d.ts +1 -1
  192. package/dist/types/components/sd-select/sd-select.d.ts +1 -1
  193. package/dist/types/components/sd-select-multiple-group/sd-select-multiple-group.d.ts +1 -1
  194. package/dist/types/components/sd-tag/sd-tag.config.d.ts +2 -1
  195. package/dist/types/components/sd-tooltip/sd-tooltip.config.d.ts +18 -0
  196. package/dist/types/components/sd-tooltip/sd-tooltip.d.ts +2 -15
  197. package/dist/types/components.d.ts +18 -34
  198. package/hydrate/index.js +384 -301
  199. package/hydrate/index.mjs +384 -301
  200. package/package.json +1 -1
  201. package/dist/components/p-BFO8hHjW.js +0 -1
  202. package/dist/components/p-CDzGasXW.js +0 -1
  203. package/dist/components/p-CVvYLd5J.js +0 -1
  204. package/dist/components/p-Dun2lZmi.js +0 -1
  205. package/dist/components/p-NAapFxTw.js +0 -1
  206. package/dist/components/p-VKF2AWs1.js +0 -1
  207. package/dist/design-system/p-285cc646.entry.js +0 -1
  208. package/dist/design-system/p-59a52297.entry.js +0 -1
  209. package/dist/design-system/p-9563ffe1.entry.js +0 -1
  210. package/dist/design-system/p-VKF2AWs1.js +0 -1
  211. package/dist/design-system/p-b1e45f3f.entry.js +0 -1
  212. package/dist/design-system/p-d8a141e7.entry.js +0 -1
  213. package/dist/design-system/p-e7d7ceb4.entry.js +0 -1
  214. package/dist/design-system/p-efd52bd3.entry.js +0 -1
  215. package/dist/design-system/p-f81d3798.entry.js +0 -1
  216. package/dist/cjs/{resolveColor-4RlaGD62.js → resolveColor-Di1RNekE.js} +2 -2
  217. package/dist/esm/{resolveColor-DUqcOPNn.js → resolveColor-CquSJNHV.js} +2 -2
package/hydrate/index.js CHANGED
@@ -134,7 +134,7 @@ function hydrateFactory($stencilWindow, $stencilHydrateOpts, $stencilHydrateResu
134
134
  const NAMESPACE = 'design-system';
135
135
  const BUILD = /* design-system */ { hotModuleReplacement: false, hydratedSelectorName: "hydrated", shadowDom: false, slotRelocation: true, state: true, updatable: true};
136
136
 
137
- const globalStyles = ":root{--color-primary:#051D36;--sd-primary:#051D36;--color-secondary:#555555;--sd-secondary:#555555;--color-accent:#9C27B0;--sd-accent:#9C27B0;--color-positive:#0075FF;--sd-positive:#0075FF;--color-negative:#E30000;--sd-negative:#E30000;--color-info:#00CD52;--sd-info:#00CD52;--color-warning:#F2C037;--sd-warning:#F2C037;--color-caution_bg:#FEF1F1;--sd-caution_bg:#FEF1F1;--color-caution_icon:#FD9595;--sd-caution_icon:#FD9595;--color-header_alert:#FF7A00;--sd-header_alert:#FF7A00;--color-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-white:#FFFFFF;--sd-white:#FFFFFF;--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_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-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-control-sm-font-size:12px;--sd-system-typography-control-sm-font-weight:500;--sd-system-typography-control-sm-text-decoration:none;--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-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-size-control-xs-height:24px;--sd-system-size-control-sm-height:28px;--sd-system-size-control-md-height:34px;--sd-system-size-control-lg-height:62px;--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-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-radius-control-default:4px;--sd-system-border-width-control-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-danger-default:#E30000;--sd-system-color-bg-danger-light:#FCEFEF;--sd-system-color-bg-warning:#FF6B00;--sd-system-color-bg-progress:#0075FF;--sd-system-color-bg-success-default:#00973C;--sd-system-color-bg-success-light:#12B553;--sd-system-color-text-primary:#222222;--sd-system-color-text-secondary:#333333;--sd-system-color-text-tertiary:#555555;--sd-system-color-text-quaternary:#888888;--sd-system-color-text-brand:#005CC9;--sd-system-color-text-subtle:#066D9B;--sd-system-color-text-accent:#0075FF;--sd-system-color-text-danger-default:#E30000;--sd-system-color-text-danger-light:#FB4444;--sd-system-color-text-warning:#FF6B00;--sd-system-color-text-inverse:#FFFFFF;--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-success:#00973C;--sd-system-color-icon-inverse:#FFFFFF;--sd-system-color-control-bg-disabled:#E1E1E1;--sd-system-color-control-border-disabled:#CCCCCC;--sd-system-color-control-content-disabled:#888888;--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-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-md-height:34px;--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-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-size-xs-icon:12px;--sd-button-size-sm-icon:16px;--sd-button-size-md-icon:20px;--sd-button-size-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:60px;--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:34px;--sd-button-icon-only-lg-width:62px;--sd-button-bg-disabled:#E1E1E1;--sd-button-content-disabled:#888888;--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-subtle-bg-default:#FFFFFF;--sd-button-neutral-subtle-bg-hover:#EEEEEE;--sd-button-neutral-subtle-content:#333333;--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:#333333;--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}.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}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}";
137
+ const globalStyles = ":root{--color-primary:#051D36;--sd-primary:#051D36;--color-secondary:#555555;--sd-secondary:#555555;--color-accent:#9C27B0;--sd-accent:#9C27B0;--color-positive:#0075FF;--sd-positive:#0075FF;--color-negative:#E30000;--sd-negative:#E30000;--color-info:#00CD52;--sd-info:#00CD52;--color-warning:#F2C037;--sd-warning:#F2C037;--color-caution_bg:#FEF1F1;--sd-caution_bg:#FEF1F1;--color-caution_icon:#FD9595;--sd-caution_icon:#FD9595;--color-header_alert:#FF7A00;--sd-header_alert:#FF7A00;--color-white:#FFFFFF;--sd-white:#FFFFFF;--color-black:#000000;--sd-black:#000000;--color-grey_10:#F6F6F6;--sd-grey_10:#F6F6F6;--color-grey_20:#EEEEEE;--sd-grey_20:#EEEEEE;--color-grey_25:#E5E5E5;--sd-grey_25:#E5E5E5;--color-grey_30:#E1E1E1;--sd-grey_30:#E1E1E1;--color-grey_35:#D8D8D8;--sd-grey_35:#D8D8D8;--color-grey_45:#CCCCCC;--sd-grey_45:#CCCCCC;--color-grey_50:#BBBBBB;--sd-grey_50:#BBBBBB;--color-grey_55:#AAAAAA;--sd-grey_55:#AAAAAA;--color-grey_60:#999999;--sd-grey_60:#999999;--color-grey_65:#888888;--sd-grey_65:#888888;--color-grey_70:#737373;--sd-grey_70:#737373;--color-grey_80:#555555;--sd-grey_80:#555555;--color-grey_85:#444444;--sd-grey_85:#444444;--color-grey_90:#333333;--sd-grey_90:#333333;--color-grey_95:#222222;--sd-grey_95:#222222;--color-grey_05:#F9F9F9;--sd-grey_05:#F9F9F9;--color-red_15:#FCEFEF;--sd-red_15:#FCEFEF;--color-red_20:#FCE6E6;--sd-red_20:#FCE6E6;--color-red_30:#FFD3D3;--sd-red_30:#FFD3D3;--color-red_45:#FFB5B5;--sd-red_45:#FFB5B5;--color-red_60:#FF7C7C;--sd-red_60:#FF7C7C;--color-red_70:#FB4444;--sd-red_70:#FB4444;--color-red_75:#E30000;--sd-red_75:#E30000;--color-red_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-font-family:Pretendard Variable, Pretendard, -apple-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-font-size:12px;--sd-system-typography-control-sm-font-weight:500;--sd-system-typography-control-sm-text-decoration:none;--sd-system-typography-control-sm-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-guideline-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-guideline-xs-font-size:11px;--sd-system-typography-guideline-xs-font-weight:500;--sd-system-typography-guideline-xs-line-height:18px;--sd-system-typography-guideline-xs-text-decoration:none;--sd-system-typography-guideline-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-guideline-sm-bold-font-size:12px;--sd-system-typography-guideline-sm-bold-font-weight:700;--sd-system-typography-guideline-sm-bold-line-height:20px;--sd-system-typography-guideline-sm-bold-text-decoration:none;--sd-system-typography-guideline-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-guideline-sm-medium-font-size:12px;--sd-system-typography-guideline-sm-medium-font-weight:500;--sd-system-typography-guideline-sm-medium-line-height:20px;--sd-system-typography-guideline-sm-medium-text-decoration:none;--sd-system-typography-guideline-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-guideline-sm-underline-font-size:12px;--sd-system-typography-guideline-sm-underline-font-weight:500;--sd-system-typography-guideline-sm-underline-line-height:20px;--sd-system-typography-guideline-sm-underline-text-decoration:underline;--sd-system-typography-guideline-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-guideline-md-font-size:14px;--sd-system-typography-guideline-md-font-weight:700;--sd-system-typography-guideline-md-line-height:24px;--sd-system-typography-guideline-md-text-decoration:none;--sd-system-size-control-xs-height:24px;--sd-system-size-control-sm-height:28px;--sd-system-size-control-md-height:34px;--sd-system-size-control-lg-height:62px;--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-guideline-arrow-width:16px;--sd-system-size-guideline-arrow-height:12px;--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-guideline-xs-padding-x:6px;--sd-system-space-guideline-xs-gap:4px;--sd-system-space-guideline-sm-padding-x:8px;--sd-system-space-guideline-sm-gap:6px;--sd-system-space-guideline-md-padding-x:12px;--sd-system-space-guideline-md-gap:8px;--sd-system-space-stack-gap-tight:2px;--sd-system-space-stack-gap-normal:4px;--sd-system-radius-control-default:4px;--sd-system-radius-guideline-xs-square:6px;--sd-system-radius-guideline-sm-square:8px;--sd-system-radius-guideline-pill:9999px;--sd-system-border-width-control-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-warning:#FF6B00;--sd-system-color-bg-progress:#0075FF;--sd-system-color-bg-success-default:#00973C;--sd-system-color-bg-success-light:#12B553;--sd-system-color-text-primary:#222222;--sd-system-color-text-secondary:#333333;--sd-system-color-text-tertiary:#555555;--sd-system-color-text-quaternary:#888888;--sd-system-color-text-brand:#005CC9;--sd-system-color-text-subtle:#066D9B;--sd-system-color-text-accent:#0075FF;--sd-system-color-text-danger-default:#E30000;--sd-system-color-text-danger-light:#FB4444;--sd-system-color-text-warning:#FF6B00;--sd-system-color-text-inverse:#FFFFFF;--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-success:#00973C;--sd-system-color-icon-inverse:#FFFFFF;--sd-system-color-control-bg-disabled:#E1E1E1;--sd-system-color-control-border-disabled:#CCCCCC;--sd-system-color-control-content-disabled:#888888;--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-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-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:22px;--sd-button-md-height:34px;--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-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-size-xs-icon:12px;--sd-button-size-sm-icon:16px;--sd-button-size-md-icon:20px;--sd-button-size-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:34px;--sd-button-icon-only-lg-width:62px;--sd-button-bg-disabled:#E1E1E1;--sd-button-content-disabled:#888888;--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:#333333;--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-tag-tag-xs-height:null;--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-sm-height:null;--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-md-height:null;--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-red-bg:#FB4444;--sd-tag-tag-red-content:#FCEFEF;--sd-tag-tag-orange-bg:#FF6B00;--sd-tag-tag-orange-content:#FEF1EA;--sd-tag-tag-yellow-bg:#916C0D;--sd-tag-tag-yellow-content:#FFF7DD;--sd-tag-tag-green-bg:#00973C;--sd-tag-tag-green-content:#E8F9EF;--sd-tag-tag-blue-bg:#0075FF;--sd-tag-tag-blue-content:#E6F1FF;--sd-tag-tag-darkblue-bg:#006AC1;--sd-tag-tag-darkblue-content:#EAF5FE;--sd-tag-tag-indigo-bg:#004290;--sd-tag-tag-indigo-content:#EFF6FF;--sd-tag-tag-grey-bg:#737373;--sd-tag-tag-grey-content:#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}.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}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}";
138
138
 
139
139
  /*
140
140
  Stencil Hydrate Platform v4.43.2 | MIT Licensed | https://stenciljs.com
@@ -4734,6 +4734,162 @@ var registerHost = (elm, cmpMeta) => {
4734
4734
  };
4735
4735
  var styles = /* @__PURE__ */ new Map();
4736
4736
 
4737
+ const badge = {
4738
+ red: "#FB4444",
4739
+ orange: "#FF6B00",
4740
+ yellow: "#FFC700",
4741
+ green: "#00973C",
4742
+ blue: "#0075FF",
4743
+ darkblue: "#006AC1",
4744
+ indigo: "#004290",
4745
+ grey: "#737373"
4746
+ };
4747
+ var badgeTokens = {
4748
+ badge: badge
4749
+ };
4750
+
4751
+ const BADGE_COLOR_MAP = {
4752
+ red: badgeTokens.badge.red,
4753
+ orange: badgeTokens.badge.orange,
4754
+ yellow: badgeTokens.badge.yellow,
4755
+ green: badgeTokens.badge.green,
4756
+ blue: badgeTokens.badge.blue,
4757
+ darkblue: badgeTokens.badge.darkblue,
4758
+ indigo: badgeTokens.badge.indigo,
4759
+ grey: badgeTokens.badge.grey,
4760
+ };
4761
+
4762
+ const sdBadgeCss = () => `sd-badge{display:inline-flex}sd-badge .sd-badge{display:flex;align-items:center;justify-content:center}sd-badge .sd-badge .sd-badge__dot{width:6px;height:6px;min-width:6px;min-height:6px;border-radius:9999px;background:var(--sd-badge-color, #0075FF)}sd-badge .sd-badge .sd-badge__label{margin-left:8px;font-size:12px;font-weight:500;line-height:20px;color:#333333}`;
4763
+
4764
+ class SdBadge {
4765
+ constructor(hostRef) {
4766
+ registerInstance(this, hostRef);
4767
+ }
4768
+ color = 'blue';
4769
+ label = '';
4770
+ render() {
4771
+ const resolvedColor = BADGE_COLOR_MAP[this.color] ?? BADGE_COLOR_MAP.blue;
4772
+ return (hAsync("div", { key: '2326b8dc9bf6da9ab601dced34113bc62e99c4de', class: "sd-badge", style: { '--sd-badge-color': resolvedColor } }, hAsync("div", { key: '40366f078c74d07515a456ae3dcd9bdb02fe5f7b', class: "sd-badge__dot" }), hAsync("div", { key: 'b2e03701635521a46d5a0dda4b489800f6f92cf9', class: "sd-badge__label" }, this.label)));
4773
+ }
4774
+ static get style() { return sdBadgeCss(); }
4775
+ static get cmpMeta() { return {
4776
+ "$flags$": 512,
4777
+ "$tagName$": "sd-badge",
4778
+ "$members$": {
4779
+ "color": [1],
4780
+ "label": [1]
4781
+ },
4782
+ "$listeners$": undefined,
4783
+ "$lazyBundleId$": "-",
4784
+ "$attrsToReflect$": []
4785
+ }; }
4786
+ }
4787
+
4788
+ const size = {
4789
+ xs: {
4790
+ icon: "12"
4791
+ },
4792
+ sm: {
4793
+ icon: "16"
4794
+ },
4795
+ md: {
4796
+ icon: "20"
4797
+ },
4798
+ lg: {
4799
+ icon: "24"
4800
+ }
4801
+ };
4802
+ const border = {
4803
+ disabled: "#CCCCCC"
4804
+ };
4805
+ const dropdown = {
4806
+ xs: {
4807
+ minWidth: "60"
4808
+ },
4809
+ sm: {
4810
+ minWidth: "76"
4811
+ },
4812
+ md: {
4813
+ minWidth: "106"
4814
+ }
4815
+ };
4816
+ const bg = {
4817
+ disabled: "#E1E1E1"
4818
+ };
4819
+ const content = {
4820
+ disabled: "#888888"
4821
+ };
4822
+ const brand = {
4823
+ strong: {
4824
+ bg: {
4825
+ "default": "#025497",
4826
+ hover: "#004177"
4827
+ },
4828
+ content: "#FFFFFF",
4829
+ dropdown: {
4830
+ divider: "#006AC1"
4831
+ }
4832
+ },
4833
+ subtle: {
4834
+ bg: {
4835
+ "default": "#1F8AE1",
4836
+ hover: "#006AC1"
4837
+ },
4838
+ content: "#FFFFFF",
4839
+ dropdown: {
4840
+ divider: "#5CB0F3"
4841
+ }
4842
+ },
4843
+ outline: {
4844
+ bg: {
4845
+ "default": "#FFFFFF",
4846
+ hover: "#EAF5FE"
4847
+ },
4848
+ border: "#025497",
4849
+ content: "#025497"
4850
+ }
4851
+ };
4852
+ const neutral = {
4853
+ outline: {
4854
+ bg: {
4855
+ "default": "#FFFFFF",
4856
+ hover: "#EEEEEE"
4857
+ },
4858
+ border: "#888888",
4859
+ content: "#333333"
4860
+ }
4861
+ };
4862
+ const danger = {
4863
+ strong: {
4864
+ bg: {
4865
+ "default": "#E30000",
4866
+ hover: "#AD0000"
4867
+ },
4868
+ content: "#FFFFFF",
4869
+ dropdown: {
4870
+ divider: "#FF7C7C"
4871
+ }
4872
+ },
4873
+ outline: {
4874
+ bg: {
4875
+ "default": "#FFFFFF",
4876
+ hover: "#FCEFEF"
4877
+ },
4878
+ border: "#E30000",
4879
+ content: "#E30000"
4880
+ }
4881
+ };
4882
+ var buttonTokens = {
4883
+ size: size,
4884
+ border: border,
4885
+ dropdown: dropdown,
4886
+ bg: bg,
4887
+ content: content,
4888
+ brand: brand,
4889
+ neutral: neutral,
4890
+ danger: danger
4891
+ };
4892
+
4737
4893
  const primary = "#051D36";
4738
4894
  const secondary = "#555555";
4739
4895
  const accent = "#9C27B0";
@@ -4744,6 +4900,7 @@ const warning = "#F2C037";
4744
4900
  const caution_bg = "#FEF1F1";
4745
4901
  const caution_icon = "#FD9595";
4746
4902
  const header_alert = "#FF7A00";
4903
+ const white = "#FFFFFF";
4747
4904
  const black = "#000000";
4748
4905
  const grey_10 = "#F6F6F6";
4749
4906
  const grey_20 = "#EEEEEE";
@@ -4761,7 +4918,6 @@ const grey_85 = "#444444";
4761
4918
  const grey_90 = "#333333";
4762
4919
  const grey_95 = "#222222";
4763
4920
  const grey_05 = "#F9F9F9";
4764
- const white = "#FFFFFF";
4765
4921
  const red_15 = "#FCEFEF";
4766
4922
  const red_20 = "#FCE6E6";
4767
4923
  const red_30 = "#FFD3D3";
@@ -4871,6 +5027,7 @@ var rawColors = {
4871
5027
  caution_bg: caution_bg,
4872
5028
  caution_icon: caution_icon,
4873
5029
  header_alert: header_alert,
5030
+ white: white,
4874
5031
  black: black,
4875
5032
  grey_10: grey_10,
4876
5033
  grey_20: grey_20,
@@ -4888,7 +5045,6 @@ var rawColors = {
4888
5045
  grey_90: grey_90,
4889
5046
  grey_95: grey_95,
4890
5047
  grey_05: grey_05,
4891
- white: white,
4892
5048
  red_15: red_15,
4893
5049
  red_20: red_20,
4894
5050
  red_30: red_30,
@@ -4999,146 +5155,6 @@ function resolveColor(input, fallback = '#025497') {
4999
5155
  return mapped || input;
5000
5156
  }
5001
5157
 
5002
- const sdBadgeCss = () => `sd-badge{display:inline-flex}sd-badge .sd-badge{display:flex;align-items:center;justify-content:center}sd-badge .sd-badge .sd-badge__dot{background:var(--sd-badge-color, #0075FF)}sd-badge .sd-badge .sd-badge__label{margin-left:8px;font-size:12px;font-weight:500;line-height:20px;color:#333333}sd-badge .sd-badge--sm .sd-badge__dot{width:4px;height:4px;min-width:4px;min-height:4px;border-radius:2px}sd-badge .sd-badge--md .sd-badge__dot{width:8px;height:8px;min-width:8px;min-height:8px;border-radius:4px}`;
5003
-
5004
- class SdBadge {
5005
- constructor(hostRef) {
5006
- registerInstance(this, hostRef);
5007
- }
5008
- size = 'md';
5009
- color = 'brilliantblue_75';
5010
- label = '';
5011
- render() {
5012
- const resolvedColor = resolveColor(this.color);
5013
- return (hAsync("div", { key: 'a83ffeb7171c32bafc3312d95c9fed576d676a0d', class: `sd-badge sd-badge--${this.size}`, style: { '--sd-badge-color': resolvedColor } }, hAsync("div", { key: 'b6d84b2391d0e03edcab957b4edf73c765c04c35', class: "sd-badge__dot" }), hAsync("div", { key: 'f06b5639135d87d7346b46c90a28ddeb40b05c9f', class: "sd-badge__label" }, this.label)));
5014
- }
5015
- static get style() { return sdBadgeCss(); }
5016
- static get cmpMeta() { return {
5017
- "$flags$": 512,
5018
- "$tagName$": "sd-badge",
5019
- "$members$": {
5020
- "size": [1],
5021
- "color": [1],
5022
- "label": [1]
5023
- },
5024
- "$listeners$": undefined,
5025
- "$lazyBundleId$": "-",
5026
- "$attrsToReflect$": []
5027
- }; }
5028
- }
5029
-
5030
- const size = {
5031
- xs: {
5032
- icon: "12"
5033
- },
5034
- sm: {
5035
- icon: "16"
5036
- },
5037
- md: {
5038
- icon: "20"
5039
- },
5040
- lg: {
5041
- icon: "24"
5042
- }
5043
- };
5044
- const border = {
5045
- disabled: "#CCCCCC"
5046
- };
5047
- const dropdown = {
5048
- xs: {
5049
- minWidth: "60"
5050
- },
5051
- sm: {
5052
- minWidth: "76"
5053
- },
5054
- md: {
5055
- minWidth: "106"
5056
- }
5057
- };
5058
- const bg = {
5059
- disabled: "#E1E1E1"
5060
- };
5061
- const content = {
5062
- disabled: "#888888"
5063
- };
5064
- const brand = {
5065
- strong: {
5066
- bg: {
5067
- "default": "#025497",
5068
- hover: "#004177"
5069
- },
5070
- content: "#FFFFFF",
5071
- dropdown: {
5072
- divider: "#006AC1"
5073
- }
5074
- },
5075
- subtle: {
5076
- bg: {
5077
- "default": "#1F8AE1",
5078
- hover: "#006AC1"
5079
- },
5080
- content: "#FFFFFF",
5081
- dropdown: {
5082
- divider: "#5CB0F3"
5083
- }
5084
- },
5085
- outline: {
5086
- bg: {
5087
- "default": "#FFFFFF",
5088
- hover: "#EAF5FE"
5089
- },
5090
- border: "#025497",
5091
- content: "#025497"
5092
- }
5093
- };
5094
- const neutral = {
5095
- subtle: {
5096
- bg: {
5097
- "default": "#FFFFFF",
5098
- hover: "#EEEEEE"
5099
- },
5100
- content: "#333333"
5101
- },
5102
- outline: {
5103
- bg: {
5104
- "default": "#FFFFFF",
5105
- hover: "#EEEEEE"
5106
- },
5107
- border: "#888888",
5108
- content: "#333333"
5109
- }
5110
- };
5111
- const danger = {
5112
- strong: {
5113
- bg: {
5114
- "default": "#E30000",
5115
- hover: "#AD0000"
5116
- },
5117
- content: "#FFFFFF",
5118
- dropdown: {
5119
- divider: "#FF7C7C"
5120
- }
5121
- },
5122
- outline: {
5123
- bg: {
5124
- "default": "#FFFFFF",
5125
- hover: "#FCEFEF"
5126
- },
5127
- border: "#E30000",
5128
- content: "#E30000"
5129
- }
5130
- };
5131
- var buttonTokens = {
5132
- size: size,
5133
- border: border,
5134
- dropdown: dropdown,
5135
- bg: bg,
5136
- content: content,
5137
- brand: brand,
5138
- neutral: neutral,
5139
- danger: danger
5140
- };
5141
-
5142
5158
  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}`;
5143
5159
 
5144
5160
  const ICON_SIZES = {
@@ -5226,7 +5242,6 @@ const PRESET_DEFAULT_COLORS = {
5226
5242
  primary: buttonTokens.brand.strong.bg.default,
5227
5243
  secondary: buttonTokens.brand.subtle.bg.default,
5228
5244
  primary_outline: buttonTokens.brand.outline.bg.default,
5229
- neutral: buttonTokens.neutral.subtle.bg.default,
5230
5245
  neutral_outline: buttonTokens.neutral.outline.bg.default,
5231
5246
  danger: buttonTokens.danger.strong.bg.default,
5232
5247
  danger_outline: buttonTokens.danger.outline.bg.default,
@@ -5247,11 +5262,6 @@ const BUTTON_CONFIG = {
5247
5262
  size: 'xs',
5248
5263
  color: PRESET_DEFAULT_COLORS.primary_outline,
5249
5264
  },
5250
- neutral_xs: {
5251
- variant: 'primary',
5252
- size: 'xs',
5253
- color: PRESET_DEFAULT_COLORS.neutral,
5254
- },
5255
5265
  neutral_outline_xs: {
5256
5266
  variant: 'outline',
5257
5267
  size: 'xs',
@@ -5282,11 +5292,6 @@ const BUTTON_CONFIG = {
5282
5292
  size: 'sm',
5283
5293
  color: PRESET_DEFAULT_COLORS.primary_outline,
5284
5294
  },
5285
- neutral_sm: {
5286
- variant: 'primary',
5287
- size: 'sm',
5288
- color: PRESET_DEFAULT_COLORS.neutral,
5289
- },
5290
5295
  neutral_outline_sm: {
5291
5296
  variant: 'outline',
5292
5297
  size: 'sm',
@@ -5317,11 +5322,6 @@ const BUTTON_CONFIG = {
5317
5322
  size: 'md',
5318
5323
  color: PRESET_DEFAULT_COLORS.primary_outline,
5319
5324
  },
5320
- neutral_md: {
5321
- variant: 'primary',
5322
- size: 'md',
5323
- color: PRESET_DEFAULT_COLORS.neutral,
5324
- },
5325
5325
  neutral_outline_md: {
5326
5326
  variant: 'outline',
5327
5327
  size: 'md',
@@ -5352,11 +5352,6 @@ const BUTTON_CONFIG = {
5352
5352
  size: 'lg',
5353
5353
  color: PRESET_DEFAULT_COLORS.primary_outline,
5354
5354
  },
5355
- neutral_lg: {
5356
- variant: 'primary',
5357
- size: 'lg',
5358
- color: PRESET_DEFAULT_COLORS.neutral,
5359
- },
5360
5355
  neutral_outline_lg: {
5361
5356
  variant: 'outline',
5362
5357
  size: 'lg',
@@ -5383,7 +5378,6 @@ const PRESET_HOVER_BACKGROUNDS$1 = {
5383
5378
  primary: buttonTokens.brand.strong.bg.hover,
5384
5379
  secondary: buttonTokens.brand.subtle.bg.hover,
5385
5380
  primary_outline: buttonTokens.brand.outline.bg.hover,
5386
- neutral: buttonTokens.neutral.subtle.bg.hover,
5387
5381
  neutral_outline: buttonTokens.neutral.outline.bg.hover,
5388
5382
  danger: buttonTokens.danger.strong.bg.hover,
5389
5383
  danger_outline: buttonTokens.danger.outline.bg.hover,
@@ -5392,7 +5386,6 @@ const PRESET_CONTENT_COLORS$1 = {
5392
5386
  primary: buttonTokens.brand.strong.content,
5393
5387
  secondary: buttonTokens.brand.subtle.content,
5394
5388
  primary_outline: buttonTokens.brand.outline.content,
5395
- neutral: buttonTokens.neutral.subtle.content,
5396
5389
  neutral_outline: buttonTokens.neutral.outline.content,
5397
5390
  danger: buttonTokens.danger.strong.content,
5398
5391
  danger_outline: buttonTokens.danger.outline.content,
@@ -5401,17 +5394,15 @@ const PRESET_BORDER_COLORS$1 = {
5401
5394
  primary: 'transparent',
5402
5395
  secondary: 'transparent',
5403
5396
  primary_outline: buttonTokens.brand.outline.border,
5404
- neutral: 'transparent',
5405
5397
  neutral_outline: buttonTokens.neutral.outline.border,
5406
5398
  danger: 'transparent',
5407
5399
  danger_outline: buttonTokens.danger.outline.border,
5408
5400
  };
5409
- const DISABLED_CONTENT = buttonTokens.content.disabled;
5410
5401
  const SIZE_SUFFIX_PATTERN = /_(xs|sm|md|lg)$/;
5411
5402
  const isButtonV2Name = (value) => value in BUTTON_CONFIG;
5412
5403
  const getPresetName = (value) => value.replace(SIZE_SUFFIX_PATTERN, '');
5413
5404
 
5414
- 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:#025497;--sd-button-v2-bg-hover:#004177;--sd-button-v2-border:transparent;--sd-button-v2-content:#ffffff;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-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);color:var(--sd-button-content-disabled, #888888);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}`;
5405
+ 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);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-content-disabled, $grey_65);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}`;
5415
5406
 
5416
5407
  class SdButtonV2 {
5417
5408
  constructor(hostRef) {
@@ -5478,14 +5469,13 @@ class SdButtonV2 {
5478
5469
  const hasLabel = Boolean(this.label);
5479
5470
  const iconOnly = !this.label && Boolean(this.icon);
5480
5471
  const accessibleName = iconOnly && this.ariaLabel.trim() ? this.ariaLabel : undefined;
5481
- const iconColor = this.disabled ? DISABLED_CONTENT : PRESET_CONTENT_COLORS$1[preset];
5482
- return (hAsync("button", { key: '9adec3868e5337822463a5a37a741ef146a081be', class: this.getButtonClasses(preset, config.size, hasLabel, iconOnly), type: this.type, disabled: this.disabled, "aria-label": accessibleName, style: {
5472
+ return (hAsync("button", { key: '248e85751b7f7f1cdb770e4f4c1466fa8736f024', class: this.getButtonClasses(preset, config.size, hasLabel, iconOnly), type: this.type, disabled: this.disabled, "aria-label": accessibleName, style: {
5483
5473
  '--sd-button-v2-bg': config.variant === 'primary' ? config.color : '#FFFFFF',
5484
5474
  '--sd-button-v2-bg-hover': PRESET_HOVER_BACKGROUNDS$1[preset],
5485
5475
  '--sd-button-v2-border': PRESET_BORDER_COLORS$1[preset],
5486
5476
  '--sd-button-v2-content': PRESET_CONTENT_COLORS$1[preset],
5487
5477
  '--sd-button-v2-accent': BUTTON_FOCUS_RING_COLOR,
5488
- }, onClick: this.handleClick }, hAsync("span", { key: '849c90886e77e792e4e34ef064352361a29664f0', class: "sd-button-v2__content" }, this.icon && (hAsync("sd-icon", { key: '5c5bc61ab43aa17124337a7107a3e6ab82f566ae', class: "sd-button-v2__icon", name: this.icon, size: BUTTON_ICON_SIZES[config.size], color: iconColor })), this.label && hAsync("span", { key: 'e2d1a5ce465f07310a4d03966609baaf7e968b0e', class: "sd-button-v2__label" }, this.label))));
5478
+ }, onClick: this.handleClick }, hAsync("span", { key: '0b68fdf9711cd26d6f143fec848d3e16e32c81e2', class: "sd-button-v2__content" }, this.icon && (hAsync("sd-icon", { key: '26bffa7135658f790e65a8b0aa32af055ea269f2', class: "sd-button-v2__icon", name: this.icon, size: BUTTON_ICON_SIZES[config.size], color: "var(--sd-button-v2-current-content)" })), this.label && hAsync("span", { key: '5016092b05b4f068f823ae8dbd6a47ea23763086', class: "sd-button-v2__label" }, this.label))));
5489
5479
  }
5490
5480
  static get style() { return sdButtonV2Css(); }
5491
5481
  static get cmpMeta() { return {
@@ -5514,7 +5504,7 @@ class SdCard {
5514
5504
  bordered = false;
5515
5505
  sdClass = '';
5516
5506
  render() {
5517
- return (hAsync(Fragment, { key: '3999f64f54054b3a1662fac4aacf9f6898acb957' }, hAsync("div", { key: '666b8e849b92a5e75d259ff079237911fd591cdd', class: `sd-card ${this.bordered ? 'sd-card--bordered' : ''} ${this.sdClass}` }, hAsync("slot", { key: 'dc8f4ae80e9aca7a0aecaed81f45d40e7df2c067' }))));
5507
+ return (hAsync(Fragment, { key: '01df653d1718aab046ee74275f13c926fbf05573' }, hAsync("div", { key: '82dcf247f0f718328fa4f1c3548becff1c1d6fd3', class: `sd-card ${this.bordered ? 'sd-card--bordered' : ''} ${this.sdClass}` }, hAsync("slot", { key: '33b518500426f3abd40ee4a5719c8f784bfeb65a' }))));
5518
5508
  }
5519
5509
  static get style() { return sdCardCss(); }
5520
5510
  static get cmpMeta() { return {
@@ -5830,7 +5820,7 @@ class SdDatePicker {
5830
5820
  this.isOpen = false;
5831
5821
  };
5832
5822
  render() {
5833
- return (hAsync("div", { key: 'cd2f9c240e1e67806d1d9334937a905330d29a1f', class: { 'sd-date-picker': true, 'sd-date-picker--disabled': this.disabled } }, hAsync("sd-input", { key: '1d77404494bd1fadf15d82dfabecbf61b73e5da8', ref: el => (this.inputEl = el), value: this.value, label: this.label, "inside-label": true, readonly: true, disabled: this.disabled, placeholder: this.placeholder, inputClass: "sd-date-picker__input", onClick: () => this.openMenu() }, hAsync("sd-icon", { key: '627b76b7d276cff34224a130bb2596ca6f2ff49e', 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: '9dd006a9051c22dd8084ae9cb72e82c9c0b9be2b', open: this.isOpen, parentRef: this.inputEl, onSdClose: this.handleClose }, hAsync("div", { key: '5090eb945c7241f3224b3d2c7a5a96221cc46c04', class: "sd-date-picker__menu" }, hAsync("div", { key: 'fa127745062937dfe4f04773b7d6afa74d13bd7a', class: "sd-date-picker__header" }, hAsync("div", { key: '7c59917872614d1351a3dfe3783017bd6bc6b75c', class: "year-nav" }, hAsync("button", { key: '9e27d2d76ca72820d57c2d9ebc40fa842129da22', type: "button", name: "prev-year", title: "Previous Year", onClick: () => this.setCurrentYear(this.currentYear - 1) }, hAsync("sd-icon", { key: '17c8f872b7cfb2825d4c9528b5838487b97529f0', name: "arrowLeft", size: "12", color: "#CCCCCC" })), hAsync("span", { key: '41999c78367c90bc4d1d9bfdeb6e3d29d44df2c2', class: "year-nav__current" }, this.currentYear), hAsync("button", { key: '52953ec66118afd480e7ce6207a551f18b61ac6d', type: "button", name: "next-year", title: "Next Year", onClick: () => this.setCurrentYear(this.currentYear + 1) }, hAsync("sd-icon", { key: 'e740bcc2a23f4df850b4e2579ce0cae14419313c', name: "arrowRight", size: "12", color: "#CCCCCC" }))), hAsync("div", { key: '7fac86c6405a3936a1f0bdb51e5ca61463ef463a', class: "month-nav" }, hAsync("button", { key: '62e22a2063c7ea972bf74ea08af0d519a5250b3f', type: "button", name: "prev-month", title: "Previous ", onClick: () => this.handleUpdateMonth('prev') }, hAsync("sd-icon", { key: 'fa53cbb5f2e61a3b1f0807639ce2c81516a1ca57', name: "arrowLeft", size: "12", color: "#CCCCCC" })), hAsync("span", { key: '57eb7eaf1e3a11ba69cf4ef4af9852541abd7902', class: "month-nav__current" }, this.currentMonth, "\uC6D4"), hAsync("button", { key: '08a783b73efd7a5df2638df7c8bcac5411b2e642', type: "button", name: "next-month", title: "Next Month", onClick: () => this.handleUpdateMonth('next') }, hAsync("sd-icon", { key: '4a5bb4f4e6f3105fc9fda008eb51a47efe606b81', name: "arrowRight", size: "12", color: "#CCCCCC" })))), hAsync("div", { key: '8dd540a7188716446b2e9bcda707d7458a2ea817', class: "sd-date-picker__days" }, ['일', '월', '화', '수', '목', '금', '토'].map(day => (hAsync("div", { key: day, class: "day" }, day)))), hAsync("div", { key: 'f2da8d2325cb2fb9cb89d9c93d850cefc62235bf', class: "sd-date-picker__body" }, [
5823
+ return (hAsync("div", { key: '3cef7a7c9eeb6008003a70c863817330f1f9327d', class: { 'sd-date-picker': true, 'sd-date-picker--disabled': this.disabled } }, hAsync("sd-input", { key: '410d7911e51728fa60553f3fc3c50c144b55714c', ref: el => (this.inputEl = el), value: this.value, label: this.label, "inside-label": true, readonly: true, disabled: this.disabled, placeholder: this.placeholder, inputClass: "sd-date-picker__input", onClick: () => this.openMenu() }, hAsync("sd-icon", { key: '8f8911ccb8ce048d14550db0d693248d697dbd21', 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: '41cbcd7a67305abf795e49f2faad0cfb01dd0e92', open: this.isOpen, parentRef: this.inputEl, onSdClose: this.handleClose }, hAsync("div", { key: 'b307cd035a8c99eeb2c0a5353f5131c218d800f9', class: "sd-date-picker__menu" }, hAsync("div", { key: '7448c069921dad201e0b6701a260eb1fd4bfb217', class: "sd-date-picker__header" }, hAsync("div", { key: 'ed1f0a9f59d528dd743f71c72106b8d7c0be07a4', class: "year-nav" }, hAsync("button", { key: '364346026bfd1650b9ccb38fd9d996eea7486989', type: "button", name: "prev-year", title: "Previous Year", onClick: () => this.setCurrentYear(this.currentYear - 1) }, hAsync("sd-icon", { key: 'a256a1adc87cdb5f7876cb76183825d82d87de19', name: "arrowLeft", size: "12", color: "#CCCCCC" })), hAsync("span", { key: '60110caede0ed656cfa58ae1200b08de7631abca', class: "year-nav__current" }, this.currentYear), hAsync("button", { key: '07f8040d822605f4461fd80dd3910ebd973060b7', type: "button", name: "next-year", title: "Next Year", onClick: () => this.setCurrentYear(this.currentYear + 1) }, hAsync("sd-icon", { key: '820cd76287e851cb2a25db93183a0d90e71dfd9d', name: "arrowRight", size: "12", color: "#CCCCCC" }))), hAsync("div", { key: '979262f63bb16e954a661b80e6cef155f329b651', class: "month-nav" }, hAsync("button", { key: 'f9e93031b0b8e07067d1ff562bbb2f3d41a2a761', type: "button", name: "prev-month", title: "Previous ", onClick: () => this.handleUpdateMonth('prev') }, hAsync("sd-icon", { key: '1202cfb15fb886fc31c495c1f6fd37eb990ba3a3', name: "arrowLeft", size: "12", color: "#CCCCCC" })), hAsync("span", { key: 'b29c00421943e45fed684e63dfebf895686f6d45', class: "month-nav__current" }, this.currentMonth, "\uC6D4"), hAsync("button", { key: '13eda140f8dbe92cb75ae288942f1e2fda3b2891', type: "button", name: "next-month", title: "Next Month", onClick: () => this.handleUpdateMonth('next') }, hAsync("sd-icon", { key: '4ee850a4c9ae4a92e42df78d214ae5380c572dc4', name: "arrowRight", size: "12", color: "#CCCCCC" })))), hAsync("div", { key: '13887a76bdea27522798fde506ad04851bb701aa', class: "sd-date-picker__days" }, ['일', '월', '화', '수', '목', '금', '토'].map(day => (hAsync("div", { key: day, class: "day" }, day)))), hAsync("div", { key: 'a887e352065fe18797104b2271920f98a8392775', class: "sd-date-picker__body" }, [
5834
5824
  ...this.calendar.prevMonthDays,
5835
5825
  ...this.calendar.days,
5836
5826
  ...this.calendar.afterMonthDays,
@@ -6022,10 +6012,10 @@ class SdDateRangePicker {
6022
6012
  this.setHoverDate(hoverDate);
6023
6013
  }
6024
6014
  render() {
6025
- return (hAsync("div", { key: '1862958ea2e972700ea83ed61f0285f09cf52c02', class: {
6015
+ return (hAsync("div", { key: '80ba555e36642dabe58a34a344ec751684307eb6', class: {
6026
6016
  'sd-date-range-picker': true,
6027
6017
  'sd-date-range-picker--disabled': this.disabled,
6028
- } }, hAsync("sd-input", { key: '808670f22b59401c0125dd1191a6180cc6f72799', ref: el => (this.inputEl = el), value: !!this.dateRange[0] ? `${this.dateRange[0]} ~ ${this.dateRange[1]}` : '', label: this.label, "inside-label": true, readonly: true, disabled: this.disabled, placeholder: this.placeholder, inputClass: "sd-date-range-picker__input", onClick: () => this.openMenu() }, hAsync("sd-icon", { key: '123e8beb77c3fceaaa3a8d994f8a8539fe35d317', 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: '448c174030598565f910df316002d78bdfec3f89', open: this.isOpen, parentRef: this.inputEl, onSdClose: this.closeMenu }, hAsync("div", { key: 'b5cf493587c7831e59a6156df87cb56be6bd585b', class: "sd-date-range-picker__menu" }, hAsync("div", { key: 'c044d5377d0d88affecaa61eec2a2239b87158d8', class: "sd-date-range-picker__header mb-16pxr flex flex-nowrap items-center justify-center" }, hAsync("button", { key: 'c497891fe1d06b8f6c1a79000edc0e4f4fd79735', type: "button", name: "prev", title: "Previous", onClick: () => this.setPrevYear(this.prevYear - 1) }, hAsync("sd-icon", { key: 'ad899e9daec0752b744bc73e9cbd99c6a731b7db', name: "arrowLeft", size: "12", color: "#CCCCCC" })), hAsync("div", { key: '595ac699adc90e8b15775ce47a2cda8bbc2f5c25', class: "header-label" }, this.prevYear), hAsync("button", { key: '684ce75f14b08cd57ce6f019a1dfb3ab384b0c11', type: "button", name: "next", title: "Next", onClick: () => this.setPrevYear(this.prevYear + 1) }, hAsync("sd-icon", { key: '31dde7526d0ee3e7abf965eea6f825d557e7c745', name: "arrowRight", size: "12", color: "#CCCCCC" }))), hAsync("div", { key: '3e70334c95d29f302f2dc6d1cb7fbb3603c74a48', 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
6018
+ } }, hAsync("sd-input", { key: '12c5dca1cfad0dafee1531c62be818d4cd8f12c2', ref: el => (this.inputEl = el), value: !!this.dateRange[0] ? `${this.dateRange[0]} ~ ${this.dateRange[1]}` : '', label: this.label, "inside-label": true, readonly: true, disabled: this.disabled, placeholder: this.placeholder, inputClass: "sd-date-range-picker__input", onClick: () => this.openMenu() }, hAsync("sd-icon", { key: 'a62fa8ce117ff983062d5d39b927692c8088781d', 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: 'e79962823af4c29121c18236d886199268a03eb3', open: this.isOpen, parentRef: this.inputEl, onSdClose: this.closeMenu }, hAsync("div", { key: '7c5fe668dabda4cf5219bcfd062997a8f5337cfa', class: "sd-date-range-picker__menu" }, hAsync("div", { key: '33b5d471d9db5f703b6f846442e27dd5425775bb', class: "sd-date-range-picker__header mb-16pxr flex flex-nowrap items-center justify-center" }, hAsync("button", { key: 'd54d8f953be79447ee708404329178d9e1ad3a23', type: "button", name: "prev", title: "Previous", onClick: () => this.setPrevYear(this.prevYear - 1) }, hAsync("sd-icon", { key: '64444f120884efa30f9b58944cd9bc8918648aaf', name: "arrowLeft", size: "12", color: "#CCCCCC" })), hAsync("div", { key: '0ae2129755ba9a30bb41522893bd1d27905e6666', class: "header-label" }, this.prevYear), hAsync("button", { key: '7d8f3627e72869fd35e964e0c555680d47744f5c', type: "button", name: "next", title: "Next", onClick: () => this.setPrevYear(this.prevYear + 1) }, hAsync("sd-icon", { key: 'caeb87d6cac5b5c89bc65c97d60f5b45b55becb1', name: "arrowRight", size: "12", color: "#CCCCCC" }))), hAsync("div", { key: '958cd5ed27b2f1a72214c4e2426dc60349e65c50', 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
6029
6019
  ? `${this.prevYear}.${String(this.prevMonth).padStart(2, '0')}`
6030
6020
  : `${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)) }))))))))))))));
6031
6021
  }
@@ -6157,12 +6147,7 @@ var systemTokens = {
6157
6147
  color: color
6158
6148
  };
6159
6149
 
6160
- const UNSUPPORTED_DROPDOWN_BUTTON_NAMES = new Set([
6161
- 'neutral_xs',
6162
- 'neutral_sm',
6163
- 'neutral_md',
6164
- ]);
6165
- const DROPDOWN_BUTTON_NAMES = Object.keys(BUTTON_CONFIG).filter((name) => !name.endsWith('_lg') && !UNSUPPORTED_DROPDOWN_BUTTON_NAMES.has(name));
6150
+ const DROPDOWN_BUTTON_NAMES = Object.keys(BUTTON_CONFIG).filter((name) => !name.endsWith('_lg'));
6166
6151
  const DROPDOWN_BUTTON_CONFIG = Object.fromEntries(DROPDOWN_BUTTON_NAMES.map(name => [name, BUTTON_CONFIG[name]]));
6167
6152
  const DROPDOWN_BUTTON_MIN_WIDTHS = {
6168
6153
  xs: buttonTokens.dropdown.xs.minWidth,
@@ -6176,7 +6161,6 @@ const PRESET_DIVIDER_COLORS = {
6176
6161
  primary: buttonTokens.brand.strong.dropdown.divider,
6177
6162
  secondary: buttonTokens.brand.subtle.dropdown.divider,
6178
6163
  primary_outline: PRESET_BORDER_COLORS.primary_outline,
6179
- neutral: buttonTokens.neutral.outline.border,
6180
6164
  neutral_outline: PRESET_BORDER_COLORS.neutral_outline,
6181
6165
  danger: buttonTokens.danger.strong.dropdown.divider,
6182
6166
  danger_outline: PRESET_BORDER_COLORS.danger_outline,
@@ -6188,7 +6172,6 @@ const PRESET_MENU_ITEM_COLORS = {
6188
6172
  primary: MENU_ITEM_COLOR,
6189
6173
  secondary: MENU_ITEM_COLOR,
6190
6174
  primary_outline: MENU_ITEM_COLOR,
6191
- neutral: MENU_ITEM_COLOR,
6192
6175
  neutral_outline: MENU_ITEM_COLOR,
6193
6176
  danger: MENU_ITEM_COLOR,
6194
6177
  danger_outline: MENU_ITEM_COLOR,
@@ -6197,7 +6180,6 @@ const PRESET_MENU_ITEM_ACTIVE_BACKGROUNDS = {
6197
6180
  primary: MENU_ITEM_ACTIVE_BACKGROUND,
6198
6181
  secondary: MENU_ITEM_ACTIVE_BACKGROUND,
6199
6182
  primary_outline: MENU_ITEM_ACTIVE_BACKGROUND,
6200
- neutral: MENU_ITEM_ACTIVE_BACKGROUND,
6201
6183
  neutral_outline: MENU_ITEM_ACTIVE_BACKGROUND,
6202
6184
  danger: MENU_ITEM_ACTIVE_BACKGROUND,
6203
6185
  danger_outline: MENU_ITEM_ACTIVE_BACKGROUND,
@@ -6206,7 +6188,6 @@ const PRESET_MENU_ITEM_ACTIVE_COLORS = {
6206
6188
  primary: MENU_ITEM_ACTIVE_COLOR,
6207
6189
  secondary: MENU_ITEM_ACTIVE_COLOR,
6208
6190
  primary_outline: MENU_ITEM_ACTIVE_COLOR,
6209
- neutral: MENU_ITEM_ACTIVE_COLOR,
6210
6191
  neutral_outline: MENU_ITEM_ACTIVE_COLOR,
6211
6192
  danger: MENU_ITEM_ACTIVE_COLOR,
6212
6193
  danger_outline: MENU_ITEM_ACTIVE_COLOR,
@@ -6217,7 +6198,7 @@ const DROPDOWN_DISABLED_BORDER = buttonTokens.border.disabled;
6217
6198
  const isDropdownButtonName = (value) => value in DROPDOWN_BUTTON_CONFIG;
6218
6199
  const getDropdownButtonPreset = (value) => getPresetName(value);
6219
6200
 
6220
- 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-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-content-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-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);color: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)}.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{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-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);color:var(--sd-dropdown-button-menu-item-active-color)}.sd-dropdown-button__menu-item--disabled{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}`;
6201
+ 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-content-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)}.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}`;
6221
6202
 
6222
6203
  class SdDropdownButton extends BaseDropdownEvent {
6223
6204
  constructor(hostRef) {
@@ -6376,22 +6357,16 @@ class SdDropdownButton extends BaseDropdownEvent {
6376
6357
  : PRESET_BORDER_COLORS[preset],
6377
6358
  } }, this.items.map((item, index) => {
6378
6359
  const isActive = this.itemIndex === index && !item.disabled;
6379
- const iconColor = item.disabled
6380
- ? DROPDOWN_DISABLED_CONTENT
6381
- : isActive
6382
- ? PRESET_MENU_ITEM_ACTIVE_COLORS[preset]
6383
- : PRESET_MENU_ITEM_COLORS[preset];
6384
6360
  return (hAsync("button", { type: "button", role: "menuitem", class: this.getMenuItemClasses(isActive, Boolean(item.disabled)), disabled: item.disabled, onClick: event => this.selectItem(item, event), onMouseEnter: () => {
6385
6361
  if (!item.disabled) {
6386
6362
  this.itemIndex = index;
6387
6363
  }
6388
- } }, item.icon && (hAsync("sd-icon", { class: "sd-dropdown-button__menu-item-icon", name: item.icon, size: 12, color: iconColor })), hAsync("span", { class: "sd-dropdown-button__menu-item-label", innerHTML: item.label })));
6364
+ } }, item.icon && (hAsync("sd-icon", { class: "sd-dropdown-button__menu-item-icon", name: item.icon, size: 12, color: "var(--sd-dropdown-button-menu-item-current-color)" })), hAsync("span", { class: "sd-dropdown-button__menu-item-label", innerHTML: item.label })));
6389
6365
  })))));
6390
6366
  }
6391
6367
  render() {
6392
6368
  const { config, preset } = this.resolvedConfig;
6393
- const chevronColor = this.disabled ? DROPDOWN_DISABLED_CONTENT : PRESET_CONTENT_COLORS[preset];
6394
- return (hAsync("div", { key: '23f01551d932b3840efc4554d9bf2520a4bd8f81', class: "sd-dropdown-button" }, hAsync("button", { key: 'd8d736e5b6abe0e8870c01e05c55b03beb333be5', 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: {
6369
+ return (hAsync("div", { key: '091dab31c2e64a5f8e715da99fca713b6a7efa5e', class: "sd-dropdown-button" }, hAsync("button", { key: '1dd24c6691144a71937a5a3cfbed5705debbebb1', 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: {
6395
6370
  '--sd-dropdown-button-min-width': `${DROPDOWN_BUTTON_MIN_WIDTHS[config.size]}px`,
6396
6371
  '--sd-dropdown-button-bg': config.color,
6397
6372
  '--sd-dropdown-button-bg-hover': PRESET_HOVER_BACKGROUNDS[preset],
@@ -6402,7 +6377,7 @@ class SdDropdownButton extends BaseDropdownEvent {
6402
6377
  '--sd-dropdown-button-disabled-bg': DROPDOWN_DISABLED_BACKGROUND,
6403
6378
  '--sd-dropdown-button-disabled-content': DROPDOWN_DISABLED_CONTENT,
6404
6379
  '--sd-dropdown-button-disabled-border': DROPDOWN_DISABLED_BORDER,
6405
- } }, hAsync("span", { key: '7c453f8d427a35553c60372dcef10b7b8561bad5', class: "sd-dropdown-button__trigger-label" }, this.label), hAsync("span", { key: '689127d4360e17cecdd8b6233d09113ac22a5e7d', class: "sd-dropdown-button__trigger-divider", "aria-hidden": "true" }), hAsync("span", { key: '9a61c4e2d8622462d065fd61002a503965eaec6b', class: "sd-dropdown-button__trigger-icon", "aria-hidden": "true" }, hAsync("sd-icon", { key: 'df084b6ed0b0824fb62e9cfe5e8cf07e74509205', name: this.isOpen ? 'arrowUp' : 'arrowDown', size: 12, color: chevronColor }))), this.renderDropdown(preset)));
6380
+ } }, hAsync("span", { key: '6d9354f962f0960bb6cbb25e73daf8d40db3d66f', class: "sd-dropdown-button__trigger-label" }, this.label), hAsync("span", { key: '9499523b4316d6be8b33c69cf4a4087cd3bb0744', class: "sd-dropdown-button__trigger-divider", "aria-hidden": "true" }), hAsync("span", { key: '40bb145b42616178c79f1749b45e8d2d707db856', class: "sd-dropdown-button__trigger-icon", "aria-hidden": "true" }, hAsync("sd-icon", { key: '2d6a4663aadcae9d051125207fb42914ae3cc362', name: this.isOpen ? 'arrowUp' : 'arrowDown', size: 12, color: "var(--sd-dropdown-button-current-content)" }))), this.renderDropdown(preset)));
6406
6381
  }
6407
6382
  static get watchers() { return {
6408
6383
  "isOpen": [{
@@ -6549,15 +6524,15 @@ class SdField {
6549
6524
  }
6550
6525
  }
6551
6526
  render() {
6552
- return (hAsync("div", { key: '9ed0e615761d5c76dff1e95318b131bde22cd376', class: {
6527
+ return (hAsync("div", { key: 'd92c9080fdf4c060dcded1c17af36bec35d3b6ce', class: {
6553
6528
  'sd-field': true,
6554
6529
  'sd-field--has-label': !!this.label,
6555
6530
  'sd-field--has-label-inside': !!this.label && this.insideLabel,
6556
6531
  [this.fieldStatus]: !!this.fieldStatus,
6557
- } }, hAsync("div", { key: '6d051479c9874f3c765d50096db80c73c4fc461b', class: "sd-field__wrapper" }, this.renderLabel(this.label), hAsync("div", { key: '64ea18d481f0ad689ed984cd40837717fb37a751', class: {
6532
+ } }, hAsync("div", { key: '2c07af0bdc9490177d030b670e67a128563af488', class: "sd-field__wrapper" }, this.renderLabel(this.label), hAsync("div", { key: '5fa2079b2123688c0eab63780b55e70fe9f4a77b', class: {
6558
6533
  'sd-field__control': true,
6559
6534
  'sd-field__control--label-inside ': !!this.label && this.insideLabel,
6560
- } }, hAsync("slot", { key: '8e043b3e476e0d574612c892f6c8c0bca28c117f' }))), this.errorMsg && hAsync("div", { key: '22d42bacdbdfe85dbe08395d21e59a06946986f5', class: "sd-field__error-message" }, this.errorMsg)));
6535
+ } }, hAsync("slot", { key: '2b0b3240afe20e1759853928fcd2846d1321262b' }))), this.errorMsg && hAsync("div", { key: 'f932da0af97a7d1e2253bdc5a64a8269fa55625d', class: "sd-field__error-message" }, this.errorMsg)));
6561
6536
  }
6562
6537
  renderLabel(label) {
6563
6538
  if (!label)
@@ -6691,15 +6666,15 @@ class SdFilePicker {
6691
6666
  render() {
6692
6667
  const hasFiles = this.hasFiles();
6693
6668
  const displayText = this.getDisplayText();
6694
- return (hAsync("div", { key: '8d0b3002090064a062df3bc21e54fb8011a520ed', class: {
6669
+ return (hAsync("div", { key: 'a41d17071dc1c54af38a25c143f7df3a2f8d8f83', class: {
6695
6670
  'sd-file-picker': true,
6696
6671
  [this.getStatusClass()]: true,
6697
6672
  'sd-file-picker--inline': this.inline,
6698
- }, onClick: this.handleClick, onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false) }, hAsync("input", { key: 'e58b89fa203a86286d088a7ec7b1be0f740b948a', ref: el => (this.fileInputRef = el), type: "file", class: "sd-file-picker__input", disabled: this.disabled, multiple: this.multiple, accept: this.accept, onInput: this.handleFileChange, "aria-label": this.placeholder }), hAsync("sd-icon", { key: '42440a854a85aeed63f887b25fa13d9609202974', name: "attachFile", size: 16, color: this.getIconColor(), class: "sd-file-picker__icon" }), hAsync("div", { key: '25bd48b058fcff917aa1ee13c9cd991c49ef4aa1', ref: el => (this.fileNamesRef = el), class: {
6673
+ }, onClick: this.handleClick, onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false) }, hAsync("input", { key: '31bd3ccd4fc132037b67d189478af6dcb5bf9c4a', ref: el => (this.fileInputRef = el), type: "file", class: "sd-file-picker__input", disabled: this.disabled, multiple: this.multiple, accept: this.accept, onInput: this.handleFileChange, "aria-label": this.placeholder }), hAsync("sd-icon", { key: 'a422d6902ec05313365d2832f1f77e7100dcf9c7', name: "attachFile", size: 16, color: this.getIconColor(), class: "sd-file-picker__icon" }), hAsync("div", { key: 'c0ef65e1d2f5e2eea86d4047b990932d711e68bb', ref: el => (this.fileNamesRef = el), class: {
6699
6674
  'sd-file-picker__text': true,
6700
6675
  'sd-file-picker__text--placeholder': !hasFiles,
6701
6676
  'sd-file-picker__text--active': hasFiles,
6702
- } }, displayText), !this.disabled && hasFiles && (hAsync("sd-icon", { key: '9d82107ff69909519d1a3051054c42370e6b181c', name: "close", size: 12, color: "#888888", class: "sd-file-picker__clear-icon", onClick: this.handleClear })), this.showTooltip && hasFiles && this.hovered && (hAsync("div", { key: '8c8dfeb9a82c4ca69e6ae88aa8f129c72d884b14', class: "sd-file-picker__tooltip" }, displayText))));
6677
+ } }, displayText), !this.disabled && hasFiles && (hAsync("sd-icon", { key: 'b57318271a1282655a6c7f90247f6e6a1813bceb', name: "close", size: 12, color: "#888888", class: "sd-file-picker__clear-icon", onClick: this.handleClear })), this.showTooltip && hasFiles && this.hovered && (hAsync("div", { key: 'cc913b203d72fb0240ea22d7d266953c5ef31476', class: "sd-file-picker__tooltip" }, displayText))));
6703
6678
  }
6704
6679
  static get watchers() { return {
6705
6680
  "value": [{
@@ -6727,7 +6702,7 @@ class SdFilePicker {
6727
6702
  }; }
6728
6703
  }
6729
6704
 
6730
- const sdFloatingPortalCss = () => `.sd-floating-menu{width:fit-content;padding:12px 20px;border-radius:4px;font-size:12px;position:relative;box-sizing:border-box;background:#07284A;color:#FFFFFF}.sd-floating-menu .sd-floating-menu__arrow{color:#07284A}.sd-floating-menu--default{background:#07284A;color:#FFFFFF}.sd-floating-menu--default .sd-floating-menu__arrow{color:#07284A}.sd-floating-menu--caution{background:#FCE6E6;color:#FB4444}.sd-floating-menu--caution .sd-floating-menu__arrow{color:#FCE6E6}.sd-floating-menu--notice{background:#FEF1EA;color:#FF6B00}.sd-floating-menu--notice .sd-floating-menu__arrow{color:#FEF1EA}.sd-floating-menu--accent{background:#E6F1FF;color:#0075FF}.sd-floating-menu--accent .sd-floating-menu__arrow{color:#E6F1FF}.sd-floating-menu__arrow{position:absolute;display:flex;width:9.6px;height:7.2px}.sd-floating-menu__arrow svg{width:100%;height:100%}.sd-floating-menu__arrow--top{bottom:-7.2px;left:50%;transform:translateX(-50%)}.sd-floating-menu__arrow--bottom{top:-7.2px;left:50%;transform:translateX(-50%) rotate(180deg)}.sd-floating-menu__arrow--left{right:-7.2px;top:50%;transform:translateY(-50%) rotate(-90deg)}.sd-floating-menu__arrow--right{left:-7.2px;top:50%;transform:translateY(-50%) rotate(90deg)}.sd-floating-menu__content{font-size:12px;line-height:20px}.sd-floating-menu__content .sd-floating-menu__title{font-weight:700;margin-bottom:4px}.sd-floating-menu__content .sd-floating-menu__messages{font-weight:500}.sd-floating-menu__content .sd-floating-menu__buttons{margin-top:12px;display:flex;gap:8px;align-items:center}.sd-floating-menu__content .sd-floating-menu__buttons--1{justify-content:flex-end}.sd-floating-menu__content .sd-floating-menu__buttons--2{justify-content:space-between}.sd-floating-menu__close-button{position:absolute;top:16px;right:12px;padding:0;background:none;border:none;cursor:pointer}`;
6705
+ const sdFloatingPortalCss = () => `.sd-floating-menu{width:fit-content;padding:12px 16px;border-radius:6px;font-size:12px;font-weight:500;line-height:20px;position:relative;box-sizing:border-box;background:var(--sd-floating-bg, #07284A);color:var(--sd-floating-content, #FFFFFF)}.sd-floating-menu .sd-floating-menu__arrow{color:var(--sd-floating-bg, #07284A)}.sd-floating-menu--default{background:var(--sd-floating-bg, #07284A);color:var(--sd-floating-content, #FFFFFF);font-weight:500}.sd-floating-menu--default .sd-floating-menu__arrow{color:var(--sd-floating-bg, #07284A)}.sd-floating-menu--danger{background:var(--sd-floating-bg, #FCE6E6);color:var(--sd-floating-content, #FB4444);font-weight:700}.sd-floating-menu--danger .sd-floating-menu__arrow{color:var(--sd-floating-bg, #FCE6E6)}.sd-floating-menu--warning{background:var(--sd-floating-bg, #FEF1EA);color:var(--sd-floating-content, #FF6B00);font-weight:700}.sd-floating-menu--warning .sd-floating-menu__arrow{color:var(--sd-floating-bg, #FEF1EA)}.sd-floating-menu--accent{background:var(--sd-floating-bg, #E6F1FF);color:var(--sd-floating-content, #0075FF);font-weight:700}.sd-floating-menu--accent .sd-floating-menu__arrow{color:var(--sd-floating-bg, #E6F1FF)}.sd-floating-menu__arrow{position:absolute;display:flex;width:16px;height:12px}.sd-floating-menu__arrow svg{width:100%;height:100%}.sd-floating-menu__arrow--top{bottom:-12px;left:50%;transform:translateX(-50%)}.sd-floating-menu__arrow--bottom{top:-12px;left:50%;transform:translateX(-50%) rotate(180deg)}.sd-floating-menu__arrow--left{right:-12px;top:50%;transform:translateY(-50%) rotate(-90deg)}.sd-floating-menu__arrow--right{left:-12px;top:50%;transform:translateY(-50%) rotate(90deg)}.sd-floating-menu__content{font-size:12px;line-height:20px}.sd-floating-menu__content .sd-floating-menu__title{font-size:14px;font-weight:700;line-height:24px;margin-bottom:4px}.sd-floating-menu__content .sd-floating-menu__messages{font-weight:500}.sd-floating-menu__content .sd-floating-menu__buttons{margin-top:12px;display:flex;gap:8px;align-items:center}.sd-floating-menu__content .sd-floating-menu__buttons--1{justify-content:flex-end}.sd-floating-menu__content .sd-floating-menu__buttons--2{justify-content:space-between}.sd-floating-menu--popover{padding:16px 20px}.sd-floating-menu--popover .sd-floating-menu__content{gap:4px}.sd-floating-menu--popover .sd-floating-menu__title{font-size:14px;font-weight:700;line-height:24px}.sd-floating-menu--popover .sd-floating-menu__messages{font-size:12px;font-weight:500;line-height:20px}.sd-floating-menu__close-button{position:absolute;top:12px;right:12px;padding:0;background:none;border:none;cursor:pointer}`;
6731
6706
 
6732
6707
  class SdFloatingPopover {
6733
6708
  constructor(hostRef) {
@@ -6878,7 +6853,7 @@ class SdFloatingPopover {
6878
6853
  this.close.emit();
6879
6854
  }
6880
6855
  render() {
6881
- return hAsync("slot", { key: 'fe02da5ce55072c8fa313e467967f2a1c18f86bb' });
6856
+ return hAsync("slot", { key: '770ec3be9d1e2b830eaebfde37a664feafc3da3b' });
6882
6857
  }
6883
6858
  static get style() { return sdFloatingPortalCss(); }
6884
6859
  static get cmpMeta() { return {
@@ -6963,7 +6938,7 @@ class SdForm {
6963
6938
  this.submitSuccess.emit();
6964
6939
  }
6965
6940
  render() {
6966
- return (hAsync("form", { key: '3349166129fd2acb388221b61e1bd347a2dad6e0', onSubmit: e => this.onSubmit(e), class: this.formClass }, hAsync("slot", { key: '5866b2d6764578dbf07a31c5d3dc6fa6a249f023' })));
6941
+ return (hAsync("form", { key: 'e25fc019fc77ec3cbd3968d1fbf0a8fdd3f47d68', onSubmit: e => this.onSubmit(e), class: this.formClass }, hAsync("slot", { key: 'ffbba01d9883b0c4582ab62c6669a20fa093cb8c' })));
6967
6942
  }
6968
6943
  static get cmpMeta() { return {
6969
6944
  "$flags$": 772,
@@ -7035,9 +7010,9 @@ class SdGuide {
7035
7010
  };
7036
7011
  render() {
7037
7012
  const { name: iconName, size: iconSize, color: iconColor } = GUIDE_ICON[this.type];
7038
- return (hAsync("div", { key: '69dc81c8fe0c5843e86709e72f0cdf3ecaf8c52a', class: "sd-guide", style: {
7013
+ return (hAsync("div", { key: 'b62d9fc6f84c65c42b946ac0ea118e0f760f872a', class: "sd-guide", style: {
7039
7014
  '--sd-guide-color': GUIDE_ICON[this.type].color,
7040
- } }, hAsync("sd-button", { key: '254e03a9d2e4d36ca26a23158acc960dcfb90578', 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: '701a049ebcabd0b29fa74fac246cecdedace2022', open: this.popupShow, parentRef: this.guideRef, onSdClose: this.closeDropdown, offset: [0, 4] }, hAsync("div", { key: 'e8f8efcbcbe29d51a29a8ca3803ed0a754a42531', style: { position: 'absolute', width: '0px', height: '0px' } }, hAsync("div", { key: '5f54893503560535d6adedea41d81182c72b04e5', class: "sd-guide__popup", style: { width: this.popupWidth ? this.popupWidth + 'px' : '426px' } }, hAsync("sd-button", { key: '9747683a1123307a9e4214e0f4be63fd09af1fec', class: "sd-guide__popup__close", icon: "close", color: "grey_65", size: "md", variant: "ghost", noHover: true, onSdClick: this.closeDropdown }), hAsync("div", { key: '9fb06eaeae5fc0a805855b78b8d67583183f7a8c', class: "sd-guide__popup__header" }, hAsync("sd-icon", { key: 'ad4b7e1e5740bbd32877efc0a5614b4e657aca8a', name: "helpOutline", size: 24, color: "green_65" }), hAsync("h3", { key: '5cdf73e175a51b13ee2c5408014de27a9650ac20', class: "sd-guide__popup__title" }, this.popupTitle || GUIDE_LABEL[this.type])), hAsync("ul", { key: 'f02a8cf5ffe831d2a466e4357f7721c5622d7bee', class: "sd-guide__popup__list" }, this.renderListItem(this.message))))))));
7015
+ } }, hAsync("sd-button", { key: 'dc4b53179c77564bba799fd58d2b50a114251891', 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: 'dce687813be45faa25e40c42ccef556a7b2b542b', open: this.popupShow, parentRef: this.guideRef, onSdClose: this.closeDropdown, offset: [0, 4] }, hAsync("div", { key: 'ae4fcc94f70a90cbab678ff726b2b23462cd5581', style: { position: 'absolute', width: '0px', height: '0px' } }, hAsync("div", { key: '0a032605306affcc44645577a7f552c0fe9811df', class: "sd-guide__popup", style: { width: this.popupWidth ? this.popupWidth + 'px' : '426px' } }, hAsync("sd-button", { key: '137a92b36771d20b3594fe164e28a2be14bf423a', class: "sd-guide__popup__close", icon: "close", color: "grey_65", size: "md", variant: "ghost", noHover: true, onSdClick: this.closeDropdown }), hAsync("div", { key: '25378aa790783504b82187328fef2cf955227d6a', class: "sd-guide__popup__header" }, hAsync("sd-icon", { key: '5e133c603bb7ae7b041fd3196266890dafe9270f', name: "helpOutline", size: 24, color: "green_65" }), hAsync("h3", { key: 'c6f86b1b2f848cda6fba5c9ffd4b8c87e947fbf7', class: "sd-guide__popup__title" }, this.popupTitle || GUIDE_LABEL[this.type])), hAsync("ul", { key: 'b719cfbc9dfd61b7c03ed977e7ed72feb3d4e98b', class: "sd-guide__popup__list" }, this.renderListItem(this.message))))))));
7041
7016
  }
7042
7017
  // 현재 2depth까지만 스타일 적용
7043
7018
  renderListItem(message, depth = 0) {
@@ -9082,7 +9057,7 @@ class SdIcon {
9082
9057
  }
9083
9058
  render() {
9084
9059
  const IconComponent = Icons[this.name]?.[this.size];
9085
- return (hAsync("i", { key: '69b8654e2fd745282c1878306a5c464ba0995468', class: this.getIconClasses(), style: this.iconStyle }, hAsync(IconComponent, { key: '64b00309d5ad7787c4fbf2c200719fd74062ccbd', color: this.resolvedColor })));
9060
+ return (hAsync("i", { key: '1c418bee61e2b1e7286c15cb489953cd6969639c', class: this.getIconClasses(), style: this.iconStyle }, hAsync(IconComponent, { key: 'cf93af4d1a911a6da2bef0cdfea104cb74627ec8', color: this.resolvedColor })));
9086
9061
  }
9087
9062
  static get style() { return sdIconCss(); }
9088
9063
  static get cmpMeta() { return {
@@ -9207,7 +9182,7 @@ class SdInput {
9207
9182
  }
9208
9183
  };
9209
9184
  render() {
9210
- return (hAsync("sd-field", { key: '7f32214220ee8dc3e830597b84f846096b48b305', name: this.name, label: this.label, insideLabel: this.insideLabel, rules: this.rules, error: this.error, disabled: this.disabled, focused: this.focused, hovered: this.hovered, status: this.status, useLabelRequired: this.useLabelRequired, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el), onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false) }, hAsync("label", { key: '71b1f7ce70d475e28f1d9f29c9a49b3f2f548f53', class: "sd-input__content", style: { width: '100%' } }, hAsync("slot", { key: 'c0c92d686b4cee0930716a47a701459c3afc41ff', name: "prefix" }), hAsync("input", { key: '1cdacf0a76d118c0711bae5b1263650c195db838', name: this.name, ref: el => (this.nativeEl = el), class: `sd-input__native ${this.inputClass}`, type: this.type, 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: '7786756fca59c02dfb159f10e2925f73b64f0366', name: "suffix" }), this.clearable && this.internalValue && (hAsync("sd-icon", { key: '82b24cae340687d7412ec5210548ad92e33be744', name: "close", color: "grey_65", size: "16", class: "sd-input__clear-icon", onClick: async () => {
9185
+ return (hAsync("sd-field", { key: '3db7e60bfcf01accd87d3cab199bdc4f9cd6314b', name: this.name, label: this.label, insideLabel: this.insideLabel, rules: this.rules, error: this.error, disabled: this.disabled, focused: this.focused, hovered: this.hovered, status: this.status, useLabelRequired: this.useLabelRequired, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el), onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false) }, hAsync("label", { key: 'ed629d14db71ca2e5e129dbbe6c960d1c4bafc31', class: "sd-input__content", style: { width: '100%' } }, hAsync("slot", { key: '7504feda5598a7d784a83fb8cf5d0991bd3999bc', name: "prefix" }), hAsync("input", { key: '06aef31e033ddf688f03c4752302f83b4ca54f77', name: this.name, ref: el => (this.nativeEl = el), class: `sd-input__native ${this.inputClass}`, type: this.type, 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: '3f933f1f844596b78bd5946833aa334840b65a01', name: "suffix" }), this.clearable && this.internalValue && (hAsync("sd-icon", { key: '972e64c5369057cf4a409e5456a0f1e92b578477', name: "close", color: "grey_65", size: "16", class: "sd-input__clear-icon", onClick: async () => {
9211
9186
  this.internalValue = '';
9212
9187
  await this.formField?.sdValidate();
9213
9188
  } })))));
@@ -9270,7 +9245,7 @@ class SdLoadingSpinner {
9270
9245
  return resolveColor(this.color);
9271
9246
  }
9272
9247
  render() {
9273
- return (hAsync(Fragment, { key: '2b60d18fe2f1dc23d90c5552202cdea60a91b2c0' }, hAsync("svg", { key: 'd8e8716433c206019384899897b052d28d486f92', class: "sd-loading-spinner", width: "72px", height: "72px", viewBox: "25 25 50 50", style: { color: this.resolvedColor } }, hAsync("circle", { key: 'c9aaffe398dd40ccea3a2d8a89cb880e3eeb5a6d', class: "path", cx: "50", cy: "50", r: "20", fill: "none", stroke: "currentColor", "stroke-width": "5", "stroke-miterlimit": "10" }))));
9248
+ return (hAsync(Fragment, { key: '5783716d94ef4a1dea295a4190660d98248c2ec4' }, hAsync("svg", { key: '574752fdf4c55f4a77dcefac163e1e6651864963', class: "sd-loading-spinner", width: "72px", height: "72px", viewBox: "25 25 50 50", style: { color: this.resolvedColor } }, hAsync("circle", { key: '2591fabc88f588079a9ea98f91126f20737827df', class: "path", cx: "50", cy: "50", r: "20", fill: "none", stroke: "currentColor", "stroke-width": "5", "stroke-miterlimit": "10" }))));
9274
9249
  }
9275
9250
  static get style() { return sdLoadingSpinnerCss(); }
9276
9251
  static get cmpMeta() { return {
@@ -9322,7 +9297,7 @@ class SdModalCard {
9322
9297
  return modalClass;
9323
9298
  }
9324
9299
  render() {
9325
- return (hAsync("div", { key: '0390932a29db512f09a47fbb030b1140410b6a73', class: this.getModalClass, style: { '--point-color': this.pointColor } }, this.useCloseButton && (hAsync("sd-icon", { key: '338844b48a075507352a72a6f8784d912e1f51a0', class: "sd-modal-card__close-button", name: "close", size: "20", color: "grey_65", onClick: () => this.close.emit() })), this.type !== 'normal' && (hAsync("sd-icon", { key: '5209a86ad65c6f255a37691897940d50b15d59e8', class: "sd-modal-card__icon", name: this.type === 'info' ? 'notificationOutline' : 'warningOutline', size: "32", color: this.type === 'info' ? 'brilliantblue_75' : 'red_75' })), hAsync("h2", { key: '5586e88dd9882f89ccd3aff047435c7dc821cebc', class: "sd-modal-card__title" }, this.modalTitle), hAsync("slot", { key: '0f12630ca6434885e4efc0810ae552dc0f0433b5' }, hAsync("div", { key: '04af07e88d2b65274a3ca28b3975d496917f1139', class: `sd-modal-card__message-container` }, this.message.map(msg => (hAsync("p", { class: "sd-modal-card__message" }, msg))))), hAsync("div", { key: 'b81e9fae8781fe8e57c54c0b51adc141c13c7ba8', class: `sd-modal-card__button-container flex-${this.buttonFlexDirection}` }, this.buttonProps?.map(button => (hAsync("sd-button", { sdClass: `sd-modal-card__button ${button.class || ''}`, variant: button.variant ? button.variant : 'outline', label: button.label, color: button.color, size: button.size, onSdClick: () => !button.type || button.type === 'confirm' ? this.confirm.emit() : this.close.emit() }))))));
9300
+ return (hAsync("div", { key: 'f0adc3cc3df163622ebfb4ecf24f871c89f4b676', class: this.getModalClass, style: { '--point-color': this.pointColor } }, this.useCloseButton && (hAsync("sd-icon", { key: 'e281e73d5a31e3f3c688f7fa67cc6dab49e9105b', class: "sd-modal-card__close-button", name: "close", size: "20", color: "grey_65", onClick: () => this.close.emit() })), this.type !== 'normal' && (hAsync("sd-icon", { key: 'a8d93fa991ad43d4f602662de048f2677e6f15f6', class: "sd-modal-card__icon", name: this.type === 'info' ? 'notificationOutline' : 'warningOutline', size: "32", color: this.type === 'info' ? 'brilliantblue_75' : 'red_75' })), hAsync("h2", { key: '1462056d43620a2f7db1f3e6b26a9a10576cceb8', class: "sd-modal-card__title" }, this.modalTitle), hAsync("slot", { key: '9c3b4860e7c4940356aa17353c437e711163434b' }, hAsync("div", { key: 'db17a4b60ddaab999b0ed8fca546c336b6f4b597', class: `sd-modal-card__message-container` }, this.message.map(msg => (hAsync("p", { class: "sd-modal-card__message" }, msg))))), hAsync("div", { key: 'ada9c87b3cec0de87e795ed5de34d9b37acddd59', class: `sd-modal-card__button-container flex-${this.buttonFlexDirection}` }, this.buttonProps?.map(button => (hAsync("sd-button", { sdClass: `sd-modal-card__button ${button.class || ''}`, variant: button.variant ? button.variant : 'outline', label: button.label, color: button.color, size: button.size, onSdClick: () => !button.type || button.type === 'confirm' ? this.confirm.emit() : this.close.emit() }))))));
9326
9301
  }
9327
9302
  static get style() { return sdModalCardCss(); }
9328
9303
  static get cmpMeta() { return {
@@ -9592,17 +9567,17 @@ class SdNumberInput {
9592
9567
  const inputStyles = {
9593
9568
  textAlign: this.useButton ? 'center' : 'right',
9594
9569
  };
9595
- return (hAsync("sd-field", { key: 'e72a01e264aa4d680aa740f5098e3be9bb7ac8ac', name: this.name, label: this.label, insideLabel: this.insideLabel, rules: this.rules, error: this.error, disabled: this.disabled, focused: this.focused, hovered: this.hovered, status: this.status, ref: el => (this.formField = el), style: inputWidth }, hAsync("label", { key: '3006df4eaf22ecf7e9ad330270623ba7cbbf9c9a', class: {
9570
+ return (hAsync("sd-field", { key: '0e9e4da15a63aa6a3375b43757d607fcd087d55b', name: this.name, label: this.label, insideLabel: this.insideLabel, rules: this.rules, error: this.error, disabled: this.disabled, focused: this.focused, hovered: this.hovered, status: this.status, ref: el => (this.formField = el), style: inputWidth }, hAsync("label", { key: 'ed02f94f0d5f14161dbe951f72b66e7dc1603c47', class: {
9596
9571
  'sd-number-input': true,
9597
9572
  [this.getInputStatus()]: true,
9598
9573
  'sd-number-input--with-buttons': this.useButton,
9599
- }, onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false), style: this.inputStyle }, hAsync("input", { key: 'e52177d9c7266a1630d9287fdc155f12a5dc7cca', name: this.name, ref: el => (this.nativeEl = el), class: `sd-number-input__input ${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, style: inputStyles, onFocus: this.handleFocus, onBlur: this.handleBlur }), this.useButton && (hAsync("div", { key: '18f45963c22ee6a1cdd52e45b41191c3726328ce', class: "sd-number-input__buttons" }, hAsync("button", { key: '73658fecb2300094b1880cae4595975b777b802a', type: "button", class: {
9574
+ }, onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false), style: this.inputStyle }, hAsync("input", { key: '5e80258cf2146431deecf23919de347eb5c29fb2', name: this.name, ref: el => (this.nativeEl = el), class: `sd-number-input__input ${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, style: inputStyles, onFocus: this.handleFocus, onBlur: this.handleBlur }), this.useButton && (hAsync("div", { key: 'd8293f93d5bb0f9bc88e9702df590526238820ac', class: "sd-number-input__buttons" }, hAsync("button", { key: '8c945155ccc8faaf3737fd8fc1bdeb7e3e5694ec', type: "button", class: {
9600
9575
  'sd-number-input__button': true,
9601
9576
  'sd-number-input__button--decrement': true,
9602
- }, disabled: this.isDecrementDisabled(), onClick: this.handleDecrement, tabindex: -1 }, hAsync("sd-icon", { key: 'd2b4d8eb6b7f5dd30ba704c7d7b35051a5b0df7b', name: "minus", size: 12, color: this.isDecrementDisabled() ? 'grey_45' : 'brilliantblue_70' })), hAsync("button", { key: 'ddcd2255b7870657afbb6549cdc185a804aa3dbf', type: "button", class: {
9577
+ }, disabled: this.isDecrementDisabled(), onClick: this.handleDecrement, tabindex: -1 }, hAsync("sd-icon", { key: '91d31a14ff787c6dbe35f40ff5eb9eff3d7b4e02', name: "minus", size: 12, color: this.isDecrementDisabled() ? 'grey_45' : 'brilliantblue_70' })), hAsync("button", { key: '0d54618d34e3fd06b7b89496e8f825137f9dd7a2', type: "button", class: {
9603
9578
  'sd-number-input__button': true,
9604
9579
  'sd-number-input__button--increment': true,
9605
- }, disabled: this.isIncrementDisabled(), onClick: this.handleIncrement, tabindex: -1 }, hAsync("sd-icon", { key: '971098976698154e8e644a93265dc746177c2ce0', name: "add", size: 12, color: this.isIncrementDisabled() ? 'grey_45' : 'brilliantblue_70' })))))));
9580
+ }, disabled: this.isIncrementDisabled(), onClick: this.handleIncrement, tabindex: -1 }, hAsync("sd-icon", { key: '44c1021a4f5588ff473f9dc7cc696ec4526d4abd', name: "add", size: 12, color: this.isIncrementDisabled() ? 'grey_45' : 'brilliantblue_70' })))))));
9606
9581
  }
9607
9582
  static get watchers() { return {
9608
9583
  "value": [{
@@ -9726,12 +9701,12 @@ class SdPagination {
9726
9701
  }
9727
9702
  }
9728
9703
  render() {
9729
- return (hAsync("div", { key: '8ab0a0f2dfb17154eaba138aa0688606500be296', class: this.paginationClasses }, hAsync("div", { key: '04b985f2d3e06ef35b18d6d375021499f36952f1', 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: {
9704
+ return (hAsync("div", { key: '3113faf5d75fa4a13e267653cae820035270e652', class: this.paginationClasses }, hAsync("div", { key: 'a770afe37da389511bbfda99324e7794ffa299f5', 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: {
9730
9705
  'pagination-btn': true,
9731
9706
  'pagination-btn--selected': this.currentPage === n,
9732
9707
  }, disabled: this.currentPage === n, style: {
9733
9708
  '--pagination-btn-width': `${this.buttonWidth}px`,
9734
- }, onClick: () => this.handlePageChange(n) }, n)))), hAsync("div", { key: 'c2ef87605487622bed06cac8d13d180f4af23e76', class: "append-btns" }, this.renderNextButtons())));
9709
+ }, onClick: () => this.handlePageChange(n) }, n)))), hAsync("div", { key: '7e3842b531373d6485ae8912addea1aa531ca891', class: "append-btns" }, this.renderNextButtons())));
9735
9710
  }
9736
9711
  static get style() { return sdPaginationCss(); }
9737
9712
  static get cmpMeta() { return {
@@ -9750,6 +9725,16 @@ class SdPagination {
9750
9725
 
9751
9726
  const TooltipArrow = (props) => (hAsync("svg", { width: "16", height: "12", viewBox: "0 0 16 12", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, hAsync("path", { d: "M8.83205 10.7519C8.43623 11.3457 7.56377 11.3457 7.16795 10.7519L1.04907e-06 -1.39876e-06L16 0L8.83205 10.7519Z", fill: "currentColor" })));
9752
9727
 
9728
+ const popover = {
9729
+ close: {
9730
+ icon: "12",
9731
+ color: "#888888"
9732
+ },
9733
+ bg: "#07284A"};
9734
+ var popoverTokens = {
9735
+ popover: popover
9736
+ };
9737
+
9753
9738
  const sdPopoverCss = () => `sd-popover{position:relative;cursor:pointer;display:inline-flex}`;
9754
9739
 
9755
9740
  class SdPopover {
@@ -9785,11 +9770,14 @@ class SdPopover {
9785
9770
  this.showPopover = false;
9786
9771
  };
9787
9772
  render() {
9788
- return (hAsync(Fragment, { key: 'fae8880113285544053957bb096c6618dfddc7ec' }, 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: '45323134dcbce4014492dde03c1416deda339ee1', parentRef: this.buttonEl, onSdClose: this.handleClose, placement: this.placement }, hAsync("div", { key: 'c662820224d2c90bb806d2ac010cc95a53308b3a', class: {
9773
+ return (hAsync(Fragment, { key: '4a9b669a48afd220b6f7cca0512704ffca7c853a' }, 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: '3a3a95c0ced8d5cc03c1c00a71455804b4ee2337', parentRef: this.buttonEl, onSdClose: this.handleClose, placement: this.placement }, hAsync("div", { key: '45b78e84b9d6716b16c02868aadc0e03268d0d17', class: {
9789
9774
  'sd-floating-menu': true,
9775
+ 'sd-floating-menu--popover': true,
9790
9776
  [`sd-floating-menu--${this.placement}`]: true,
9791
9777
  [this.menuClass]: !!this.menuClass,
9792
- } }, hAsync("i", { key: '55bc21085df77a027d252d5c3ef6d665207c71f6', class: `sd-floating-menu__arrow sd-floating-menu__arrow--${this.placement}` }, hAsync(TooltipArrow, { key: 'a9bb570b87481c0fe897e65ada655537dd4b8724' })), hAsync("div", { key: '5f28d241157a9f5481fc7fa4e48fd00fac1def5a', class: "sd-floating-menu__content" }, this.menuTitle && hAsync("div", { key: 'cc1dcbe2703dca70004159aa9fe8b18b122d8dbc', class: "sd-floating-menu__title" }, this.menuTitle), this.messages.length > 0 && (hAsync("div", { key: 'f7b72df569c2dce9e6c85bcd9509e38ac9cbbb80', class: "sd-floating-menu__messages" }, this.messages.map(message => (hAsync("div", null, message))))), this.buttons.length > 0 && (hAsync("div", { key: 'd01d2bc92e79454d747b2fd976bfeb431d4d90fe', class: `sd-floating-menu__buttons sd-floating-menu__buttons--${this.buttons.length}` }, this.buttons.map(button => (hAsync("sd-button", { ...button })))))), this.useClose && (hAsync("button", { key: '9cf8cbd72d5bec64636b778ea0642d56c3229590', title: "close", class: "sd-floating-menu__close-button", onClick: () => this.handleClose() }, hAsync("sd-icon", { key: '6df940385a9472e73b408cc51c647c98c95a9af7', name: "close", size: "12", color: "gery_55" }))))))));
9778
+ }, style: {
9779
+ '--sd-floating-bg': popoverTokens.popover.bg,
9780
+ } }, hAsync("i", { key: 'dc459621c518762345e42fe201e25c18b00f71db', class: `sd-floating-menu__arrow sd-floating-menu__arrow--${this.placement}` }, hAsync(TooltipArrow, { key: '77b20a4f795453eba89230433204e43696d1572e' })), hAsync("div", { key: '645010d9749bf039a15a3edb6ca8bac72b53a152', class: "sd-floating-menu__content" }, this.menuTitle && hAsync("div", { key: '9c84f5ccf7353dca3c6e6978647c845832003361', class: "sd-floating-menu__title" }, this.menuTitle), this.messages.length > 0 && (hAsync("div", { key: 'd081317a32b5e5304d03deef7b3bcb441e4839c9', class: "sd-floating-menu__messages" }, this.messages.map(message => (hAsync("div", null, message))))), this.buttons.length > 0 && (hAsync("div", { key: 'cf09426459cabbe4443608c9e5edda9e45c394f9', class: `sd-floating-menu__buttons sd-floating-menu__buttons--${this.buttons.length}` }, this.buttons.map(button => (hAsync("sd-button", { ...button })))))), this.useClose && (hAsync("button", { key: '0677f61f7faa27e10b39b5cce2e22a3eda15dc87', title: "close", class: "sd-floating-menu__close-button", onClick: () => this.handleClose() }, hAsync("sd-icon", { key: '71e254dbc9b34f98e0bc41c378d33c733ce6b582', name: "close", size: popoverTokens.popover.close.icon, color: popoverTokens.popover.close.color }))))))));
9793
9781
  }
9794
9782
  static get watchers() { return {
9795
9783
  "show": [{
@@ -9874,7 +9862,7 @@ class SdPortal {
9874
9862
  this.wrapper = document.createElement('div');
9875
9863
  Object.assign(this.wrapper.style, {
9876
9864
  position: 'absolute',
9877
- zIndex: this.zIndex.toString(),
9865
+ zIndex: (this.zIndex ?? 9999).toString(),
9878
9866
  transition: 'opacity 0.4s',
9879
9867
  });
9880
9868
  this.container.appendChild(this.wrapper);
@@ -9918,21 +9906,22 @@ class SdPortal {
9918
9906
  width: window.innerWidth,
9919
9907
  height: window.innerHeight,
9920
9908
  };
9921
- let top = parentRect.bottom + window.scrollY + this.offset[1];
9922
- let left = parentRect.left + window.scrollX + this.offset[0];
9909
+ const offset = this.offset ?? [0, 4];
9910
+ let top = parentRect.bottom + window.scrollY + offset[1];
9911
+ let left = parentRect.left + window.scrollX + offset[0];
9923
9912
  // 화면 상하단 넘어갈 시 반전
9924
- if (parentRect.bottom + wrapperRect.height + this.offset[1] > viewport.height) {
9925
- top = parentRect.top + window.scrollY - wrapperRect.height - this.offset[1];
9913
+ if (parentRect.bottom + wrapperRect.height + offset[1] > viewport.height) {
9914
+ top = parentRect.top + window.scrollY - wrapperRect.height - offset[1];
9926
9915
  }
9927
9916
  if (top < window.scrollY) {
9928
- top = parentRect.bottom + window.scrollY + this.offset[1];
9917
+ top = parentRect.bottom + window.scrollY + offset[1];
9929
9918
  }
9930
9919
  // 화면 좌우측 넘어갈 시 반전
9931
- if (parentRect.left + wrapperRect.width + this.offset[0] > viewport.width) {
9932
- left = parentRect.right + window.scrollX - wrapperRect.width - this.offset[0];
9920
+ if (parentRect.left + wrapperRect.width + offset[0] > viewport.width) {
9921
+ left = parentRect.right + window.scrollX - wrapperRect.width - offset[0];
9933
9922
  }
9934
9923
  if (left < 0) {
9935
- left = this.offset[0];
9924
+ left = offset[0];
9936
9925
  }
9937
9926
  this.wrapper.style.top = `${top}px`;
9938
9927
  this.wrapper.style.left = `${left}px`;
@@ -10006,7 +9995,7 @@ class SdPortal {
10006
9995
  this.close.emit();
10007
9996
  }
10008
9997
  render() {
10009
- return hAsync("slot", { key: 'ceaa6bed28e3b1bd1a539091434fd7acee6a0e4b' });
9998
+ return hAsync("slot", { key: '5fe94d224d2a647a1e7cb3fed1a42073b45a2525' });
10010
9999
  }
10011
10000
  static get watchers() { return {
10012
10001
  "open": [{
@@ -10068,10 +10057,10 @@ class SdProgress {
10068
10057
  return this.statusColor[this.progressStatus];
10069
10058
  }
10070
10059
  render() {
10071
- return (hAsync("div", { key: 'a9b7c4a0bb44f7455ea21f632d3ec8edbcc97522', style: {
10060
+ return (hAsync("div", { key: '43da9dac67e760bfe53b8db11c27eef7ef0d8b3b', style: {
10072
10061
  '--progress-color': this.progressColor,
10073
10062
  '--progress-percentage': `${this.progressPercentage}%`,
10074
- } }, this.type === 'bar' ? this.renderBarProgress() : this.renderSpinnerProgress(), this.label && hAsync("div", { key: 'ff0dfde8b43315883d2e4f17aa5e426fb6bf54ee', class: "sd-progress__label" }, this.label)));
10063
+ } }, this.type === 'bar' ? this.renderBarProgress() : this.renderSpinnerProgress(), this.label && hAsync("div", { key: 'af4b1c44f655546fede8ad548bddc6afb7810d2b', class: "sd-progress__label" }, this.label)));
10075
10064
  }
10076
10065
  renderBarProgress() {
10077
10066
  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, "%")));
@@ -10132,7 +10121,7 @@ class SdRadio {
10132
10121
  this.update.emit(this.value);
10133
10122
  }
10134
10123
  render() {
10135
- return (hAsync("div", { key: 'e741533dcd0e3b51ed3ee5db0524f7a53fcb38fb', "aria-label": this.val || 'radio option', "aria-checked": String(this.val) === String(this.value) ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false', class: this.getRadioClasses() }, hAsync("label", { key: `radio-${this.val}` }, hAsync("input", { key: '52156b763ae108d34dea926987aae73c5996f980', type: "radio", name: this.val, value: String(this.val), checked: String(this.val) === String(this.value), disabled: this.disabled, onInput: ({ detail }) => this.handleRadioChange(detail) }), this.val && hAsync("span", { key: '148a63e8861da5639f5655afd6cbf63637348fc5', class: "sd-radio-group__label" }, this.label || this.val))));
10124
+ return (hAsync("div", { key: '4044958bc2fd4812508ffc65b3cc42bc1091470a', "aria-label": this.val || 'radio option', "aria-checked": String(this.val) === String(this.value) ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false', class: this.getRadioClasses() }, hAsync("label", { key: `radio-${this.val}` }, hAsync("input", { key: 'f7ee60381c34f4e9fe22c90c1a982a14d1b87880', type: "radio", name: this.val, value: String(this.val), checked: String(this.val) === String(this.value), disabled: this.disabled, onInput: ({ detail }) => this.handleRadioChange(detail) }), this.val && hAsync("span", { key: '276b647bdc90f33443f0aa98a0a056be5b7eaa5d', class: "sd-radio-group__label" }, this.label || this.val))));
10136
10125
  }
10137
10126
  static get style() { return sdRadioCss(); }
10138
10127
  static get cmpMeta() { return {
@@ -10193,7 +10182,7 @@ class SdRadioButtonGroup {
10193
10182
  }
10194
10183
  groupName = this.name || `sd-radio-button-group-${crypto.randomUUID()}`;
10195
10184
  render() {
10196
- return (hAsync("div", { key: '97d7659b99c889fc9b6788f4cb9558e4c6305365', class: this.getGroupClasses(), role: "radiogroup", "aria-disabled": this.disabled.toString() }, this.radioOptions.map(option => {
10185
+ return (hAsync("div", { key: 'b29629556f8d8922e601feede89bd77bd783ded6', class: this.getGroupClasses(), role: "radiogroup", "aria-disabled": this.disabled.toString() }, this.radioOptions.map(option => {
10197
10186
  const isSelected = this.isOptionSelected(option);
10198
10187
  const isDisabled = this.isOptionDisabled(option);
10199
10188
  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)));
@@ -10243,7 +10232,7 @@ class SdRadioGroup {
10243
10232
  return classes.join(' ');
10244
10233
  }
10245
10234
  render() {
10246
- return (hAsync("div", { key: '80b1a8d67acac65ffc753ababa5e48e80cacdfc2', class: this.getGroupClasses(), role: "radiogroup" }, this.radioOptions.map(option => {
10235
+ return (hAsync("div", { key: '4f24a03003b9e21a7e7da81d70ab95a04551b694', class: this.getGroupClasses(), role: "radiogroup" }, this.radioOptions.map(option => {
10247
10236
  return (hAsync("sd-radio", { key: `radio-${option.value}`, val: String(option.value), value: this.value, label: option.label, disabled: this.disabled || !!option.disabled, onSdUpdate: ({ detail }) => this.handleRadioChange(detail) }));
10248
10237
  })));
10249
10238
  }
@@ -10432,7 +10421,7 @@ class SdSelect extends BaseDropdownEvent {
10432
10421
  }
10433
10422
  };
10434
10423
  render() {
10435
- return (hAsync("sd-field", { key: 'ad737ef5facfd4f2c8dfdbfc2c97010aa82ba39e', label: this.label, name: this.name, rules: this.rules, error: this.error, disabled: this.disabled, useLabelRequired: this.useLabelRequired, insideLabel: this.insideLabel, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el) }, hAsync("div", { key: 'ecff910f0d0d6b02f29c2f21a4264b1a573a9170', class: {
10424
+ return (hAsync("sd-field", { key: '331489106e60e2304ef08ab8bb9e0b92f883c14f', label: this.label, name: this.name, rules: this.rules, error: this.error, disabled: this.disabled, useLabelRequired: this.useLabelRequired, insideLabel: this.insideLabel, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el) }, hAsync("div", { key: '790254f507e924fcb7a32620a2c0ea264f49a9ae', class: {
10436
10425
  'sd-select': true,
10437
10426
  'sd-select--disabled': this.disabled,
10438
10427
  'sd-select--error': !!this.error,
@@ -10650,10 +10639,10 @@ class SdSelectDropdown {
10650
10639
  this.isScrolled = scrollTop > 0;
10651
10640
  };
10652
10641
  render() {
10653
- return (hAsync("div", { key: '5e56cf091a3c3d510bf932933c33a8c3d85e23ef', class: {
10642
+ return (hAsync("div", { key: 'ff55e2e133114accc2641a0025bdcf551eda3511', class: {
10654
10643
  'sd-select-dropdown': true,
10655
10644
  'sd-select-dropdown--ready': this.isDropdownReady,
10656
- }, style: this.dropdownSize, onScroll: this.handleDropdownScroll, ref: el => (this.dropdownRef = el) }, this.searchable && (hAsync("sd-select-search-input", { key: 'd965a2a5f31507fb6dca30968edf6334d42b4160', 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)))));
10645
+ }, style: this.dropdownSize, onScroll: this.handleDropdownScroll, ref: el => (this.dropdownRef = el) }, this.searchable && (hAsync("sd-select-search-input", { key: 'bfcee14aa06a9a259dd8e67013ed1074c1f9c318', 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)))));
10657
10646
  }
10658
10647
  static get watchers() { return {
10659
10648
  "filteredOptions": [{
@@ -10839,7 +10828,7 @@ class SdSelectMultiple extends BaseDropdownEvent {
10839
10828
  this.handleOptionSelection(option);
10840
10829
  };
10841
10830
  render() {
10842
- return (hAsync("sd-field", { key: '9395a273b4205854e6fd7e96f26f93c201e6e959', label: this.label, name: this.name, rules: this.rules, error: this.error, disabled: this.disabled, useLabelRequired: this.useLabelRequired, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el) }, hAsync("div", { key: '451758e8c90b79e7ddb3b35226d28ee4a43a3832', class: {
10831
+ return (hAsync("sd-field", { key: 'e445d2c3f80d78be0e74b1f54371eb27d9c316e8', label: this.label, name: this.name, rules: this.rules, error: this.error, disabled: this.disabled, useLabelRequired: this.useLabelRequired, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el) }, hAsync("div", { key: '9fad0ed744cafb9e1e5f16ee413f36edd8f2c1f3', class: {
10843
10832
  'sd-select-multiple': true,
10844
10833
  'sd-select-multiple--open': this.isOpen,
10845
10834
  'sd-select-multiple--disabled': this.disabled,
@@ -11299,7 +11288,7 @@ class SdSelectMultipleGroup extends BaseDropdownEvent {
11299
11288
  });
11300
11289
  }
11301
11290
  render() {
11302
- return (hAsync("sd-field", { key: 'edcc86b68474b668acce13cd04cf2e75cdc3e5cc', label: this.label, name: this.name, rules: this.rules, error: this.error, disabled: this.disabled, useLabelRequired: this.useLabelRequired, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el), style: { '--field-width': this.width || '200px' } }, hAsync("div", { key: '13b3366af18b65ac30a9e1a9a295c486351f585e', class: {
11291
+ return (hAsync("sd-field", { key: '85f8cf143482bb054d2ce3c15c2028213c877daf', label: this.label, name: this.name, rules: this.rules, error: this.error, disabled: this.disabled, useLabelRequired: this.useLabelRequired, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, ref: el => (this.formField = el), style: { '--field-width': this.width || '200px' } }, hAsync("div", { key: '8c92a916b26f1e4935cefc3772ec655f1cd31083', class: {
11303
11292
  'sd-select-multiple-group': true,
11304
11293
  'sd-select-multiple-group--open': this.isOpen,
11305
11294
  'sd-select-multiple-group--disabled': this.disabled,
@@ -11432,7 +11421,7 @@ class SdSelectOption {
11432
11421
  }
11433
11422
  };
11434
11423
  render() {
11435
- return (hAsync("div", { key: '2f88e7ffe5bce12bc3f352d47d0ebed51a1c69ac', class: {
11424
+ return (hAsync("div", { key: 'a4fcca24b0bdde4f4665585c6cede84bd3b64d59', class: {
11436
11425
  'sd-select__option': true,
11437
11426
  'sd-select__option--selected': this.isSelected,
11438
11427
  'sd-select__option--disabled': !!this.option.disabled,
@@ -11518,7 +11507,7 @@ class SdSelectOptionGroup {
11518
11507
  }
11519
11508
  };
11520
11509
  render() {
11521
- return (hAsync("div", { key: '7581caff61d1257d653b6f58b8d76c21225b3cc5', class: {
11510
+ return (hAsync("div", { key: '8e88aacd2c3122a563fcf78bcbe9731b6a29d8c5', class: {
11522
11511
  'sd-select__option-group': true,
11523
11512
  'sd-select__option-group--selected': !!this.isSelected,
11524
11513
  'sd-select__option-group--disabled': !!this.option.disabled,
@@ -11527,10 +11516,10 @@ class SdSelectOptionGroup {
11527
11516
  'sd-select__option-group--group': this.option.type === 'group',
11528
11517
  'sd-select__option-group--subgroup': this.option.type === 'subgroup',
11529
11518
  'sd-select__option-group--item': this.option.type === 'item',
11530
- }, 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: 'ddb33f6afaa6bc6d6dd3dc494f6ec74b9c023a42', class: "sd-select__option-group__label-wrapper" }, this.useCheckbox && (hAsync("sd-checkbox", { key: '14f2c7fc347718d2909e5006bf2500a9a51b0a66', value: this.isSelected, disabled: this.option.disabled, onClick: e => {
11519
+ }, 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: 'be4bc7f2867ea5c86505bc9284ac3de46f7077f9', class: "sd-select__option-group__label-wrapper" }, this.useCheckbox && (hAsync("sd-checkbox", { key: '00063ab3a6f1d4f44671ac82dd05524968bec668', value: this.isSelected, disabled: this.option.disabled, onClick: e => {
11531
11520
  e.preventDefault();
11532
11521
  this.handleClick(this.option, this.isSelected, e);
11533
- } })), hAsync("span", { key: '99415ed662cc2f8f29d31e3811eb4496f8fcac47', class: "sd-select__option-group-label" }, this.option.label), this.useIndicator && this.option.type !== 'item' && (hAsync("span", { key: 'a3c7dc6455a94ecd4587f8b13b4d1f10e3b58819', class: "sd-select__option-group__count-indicator" }, `(${this.countInfo?.selectedCount}/${this.countInfo?.totalCount})`)))));
11522
+ } })), hAsync("span", { key: '802c908d44bf1c0db5d64bf4c8d4bab4ebe2b87c', class: "sd-select__option-group-label" }, this.option.label), this.useIndicator && this.option.type !== 'item' && (hAsync("span", { key: 'efd26a2d6e4e2662410de3755b70a2a2585ad0c4', class: "sd-select__option-group__count-indicator" }, `(${this.countInfo?.selectedCount}/${this.countInfo?.totalCount})`)))));
11534
11523
  }
11535
11524
  static get style() { return sdSelectOptionGroupCss(); }
11536
11525
  static get cmpMeta() { return {
@@ -11579,17 +11568,17 @@ class SdSelectSearchInput {
11579
11568
  input?.focus({ preventScroll: true });
11580
11569
  }
11581
11570
  render() {
11582
- return (hAsync("div", { key: 'da5faa18fac3c974dcfef4050efe580edcb1bb42', class: {
11571
+ return (hAsync("div", { key: 'b19a029ef82d876c984c1f827d7a0f29bb823f5d', class: {
11583
11572
  'sd-select-search-input': true,
11584
11573
  'sd-select-search-input--scrolled': !!this.isScrolled,
11585
- }, onClick: event => event.stopPropagation() }, hAsync("sd-input", { key: 'c469ef89d7600626b19ecd94416849825736ff9f', ref: el => (this.searchRef = el), value: this.searchText, placeholder: "\uAC80\uC0C9", clearable: true, inputStyle: { 'padding-left': '8px' }, autofocus: true, onSdUpdate: event => {
11574
+ }, onClick: event => event.stopPropagation() }, hAsync("sd-input", { key: '8e27f40e1b507f0c5cb2d4bde48750cd0089a9da', ref: el => (this.searchRef = el), value: this.searchText, placeholder: "\uAC80\uC0C9", clearable: true, inputStyle: { 'padding-left': '8px' }, autofocus: true, onSdUpdate: event => {
11586
11575
  this.searchInput.emit(String(event?.detail));
11587
11576
  }, onSdFocus: () => {
11588
11577
  this.searchFocus.emit();
11589
11578
  }, onKeyDown: event => {
11590
11579
  if (event.code === 'Enter')
11591
11580
  event.stopPropagation();
11592
- } }, hAsync("sd-icon", { key: '478a6adda3b53aabf614028bd57a8f987f93cdb6', name: "search", size: 16, color: "#737373", style: { marginRight: '4px' }, slot: "prefix" }))));
11581
+ } }, hAsync("sd-icon", { key: '2b38a07cbc0bb0d7dd020ece45f18bdff4c262e5', name: "search", size: 16, color: "#737373", style: { marginRight: '4px' }, slot: "prefix" }))));
11593
11582
  }
11594
11583
  static get style() { return sdSelectSearchInputCss(); }
11595
11584
  static get cmpMeta() { return {
@@ -12375,16 +12364,16 @@ class SdTable {
12375
12364
  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" })));
12376
12365
  }
12377
12366
  render() {
12378
- return (hAsync(Fragment, { key: 'd5568bc96a6ec0e973eda494deacceef6ec4bce9' }, hAsync("div", { key: '8ec11dd8a4e0cd9f32a9dccd345711e64d10043a', class: "sd-table__wrapper", style: {
12367
+ return (hAsync(Fragment, { key: '882ded3f26849b023ade24914d2d88b7278a9d4a' }, hAsync("div", { key: 'cdaaaed9dbda39eae701e2cbfa9f22fbcdc86cf1', class: "sd-table__wrapper", style: {
12379
12368
  '--table-width': this.width,
12380
12369
  '--table-height': this.height,
12381
- } }, hAsync("div", { key: 'f96bbc29c77f6aaa46467d375a8a457938a27e13', class: "sd-table__container", style: {
12370
+ } }, hAsync("div", { key: '818b1f6f742861fe8515b2fd8bb826bbe357100f', class: "sd-table__container", style: {
12382
12371
  '--table-container-height': `calc(${this.height} - ${this.pagination && this.innerRows.length > 0 ? 48 : 0}px)`,
12383
- } }, hAsync("div", { key: 'fe66db102a053e90ffe02d26a28ac225e90f1ea3', class: {
12372
+ } }, hAsync("div", { key: 'b9fd1c56e1ab374ee7da80a82e1b96a2f1584eea', class: {
12384
12373
  'sd-table__middle': true,
12385
12374
  'sd-table__middle--scrollable': this.paginatedRows.length > 0,
12386
12375
  'sd-table__middle--loading': this.isLoading,
12387
- } }, this.isLoading && (hAsync("div", { key: '0851750dd88030f05e413bbdb6a7911bbc259d00', class: "sd-table__middle--loading__spinner" }, hAsync("sd-loading-spinner", { key: '557674426413df32198427509c8f50921b268212' }))), hAsync("table", { key: 'f04e1c387e34523c3a77137b82457ace6aeeb74b', part: "table", class: this.sdTableClasses }, this.renderHead(), this.renderBody())), !this.paginatedRows.length && (hAsync("div", { key: 'aca217244defe434eb44cea583e1b2d7b17431ef', class: "sd-table__bottom" }, hAsync("div", { key: '19a1049a467f9aec618324b0268803ddfa52e0d5', class: "sd-table__no-data" }, hAsync("slot", { key: 'a2170c15879dc9124eb41985e902c0119b5e45c1', name: "no-data" }, this.noDataLabel))))), this.pagination && this.innerRows.length > 0 && (hAsync("div", { key: '6a12ce1409f35ff6ec9dd737829b4678b2ce2920', class: "sd-table__pagination" }, hAsync("sd-pagination", { key: 'cec76c2c6f7dc276565e17f25ed42ea2f1578b02', 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: 'f868e4f6fc8f67e00d25914b189a82d342cc767a', value: this.pagination.rowsPerPage, options: this.rowsPerPageOption, width: "128px", onSdUpdate: (e) => this.changeRowsPerPage(e.detail.value) })))))));
12376
+ } }, this.isLoading && (hAsync("div", { key: '30521e8896081a62ea96391bf7bc7f20103fc3ed', class: "sd-table__middle--loading__spinner" }, hAsync("sd-loading-spinner", { key: 'db184565e08194d4f6a35da66aa011f0b7641d8a' }))), hAsync("table", { key: 'c8585073a95c0391c14db74d54242998a648437d', part: "table", class: this.sdTableClasses }, this.renderHead(), this.renderBody())), !this.paginatedRows.length && (hAsync("div", { key: '27d8471253fe0a1e6ee8637ed8aecaf1ce9071c2', class: "sd-table__bottom" }, hAsync("div", { key: 'c35591b39ff87a55d38f9b0cb2b91fbd54081f0b', class: "sd-table__no-data" }, hAsync("slot", { key: '0af141458219896bd93dbc7a195389d4a40cf654', name: "no-data" }, this.noDataLabel))))), this.pagination && this.innerRows.length > 0 && (hAsync("div", { key: '981becdef62a000bd6d338428fa1e20b5205c77e', class: "sd-table__pagination" }, hAsync("sd-pagination", { key: '47f042431c47d7dcdb3acfb2e4687d8c8e66ba6c', 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: '0f9edc63cf7e119c9dc1e343ec043c28b36ee83d', value: this.pagination.rowsPerPage, options: this.rowsPerPageOption, width: "128px", onSdUpdate: (e) => this.changeRowsPerPage(e.detail.value) })))))));
12388
12377
  }
12389
12378
  static get watchers() { return {
12390
12379
  "columns": [{
@@ -12506,7 +12495,7 @@ class SdTabs {
12506
12495
  return `square_${this.size}_${color}`;
12507
12496
  }
12508
12497
  render() {
12509
- return (hAsync("div", { key: 'bc86d4c1775bed6c2d323c9446e2c50631afed7c', class: this.getContainerClasses() }, this.tabs.map((tab, index) => {
12498
+ return (hAsync("div", { key: 'c7e6f8385e395a8adc7605ce4a7ae32c25f83829', class: this.getContainerClasses() }, this.tabs.map((tab, index) => {
12510
12499
  const badgeName = this.getBadgeName(tab);
12511
12500
  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() }))));
12512
12501
  })));
@@ -12532,8 +12521,73 @@ class SdTabs {
12532
12521
  }; }
12533
12522
  }
12534
12523
 
12524
+ const tag = {
12525
+ xs: {
12526
+ paddingX: "6",
12527
+ gap: "4",
12528
+ icon: "12",
12529
+ typography: {
12530
+ fontSize: "11",
12531
+ fontWeight: "500",
12532
+ lineHeight: "18"}
12533
+ },
12534
+ sm: {
12535
+ paddingX: "8",
12536
+ gap: "4",
12537
+ icon: "16",
12538
+ typography: {
12539
+ fontSize: "12",
12540
+ fontWeight: "700",
12541
+ lineHeight: "20"}
12542
+ },
12543
+ md: {
12544
+ paddingX: "12",
12545
+ gap: "6",
12546
+ icon: "16",
12547
+ typography: {
12548
+ fontSize: "14",
12549
+ fontWeight: "700",
12550
+ lineHeight: "24"}
12551
+ },
12552
+ red: {
12553
+ bg: "#FB4444",
12554
+ content: "#FCEFEF"
12555
+ },
12556
+ orange: {
12557
+ bg: "#FF6B00",
12558
+ content: "#FEF1EA"
12559
+ },
12560
+ yellow: {
12561
+ bg: "#916C0D",
12562
+ content: "#FFF7DD"
12563
+ },
12564
+ green: {
12565
+ bg: "#00973C",
12566
+ content: "#E8F9EF"
12567
+ },
12568
+ blue: {
12569
+ bg: "#0075FF",
12570
+ content: "#E6F1FF"
12571
+ },
12572
+ darkblue: {
12573
+ bg: "#006AC1",
12574
+ content: "#EAF5FE"
12575
+ },
12576
+ indigo: {
12577
+ bg: "#004290",
12578
+ content: "#EFF6FF"
12579
+ },
12580
+ grey: {
12581
+ bg: "#737373",
12582
+ content: "#EEEEEE"
12583
+ }
12584
+ };
12585
+ var tagTokens = {
12586
+ tag: tag
12587
+ };
12588
+
12535
12589
  const TAG_SHAPES = ['square', 'pill'];
12536
- const TAG_SIZES = ['sm', 'md', 'lg'];
12590
+ const TAG_SIZES = ['xs', 'sm', 'md'];
12537
12591
  const TAG_COLORS = [
12538
12592
  'grey',
12539
12593
  'red',
@@ -12545,48 +12599,51 @@ const TAG_COLORS = [
12545
12599
  'indigo',
12546
12600
  ];
12547
12601
  const TAG_COLOR_CONFIG = {
12548
- grey: { background: '#EEEEEE', content: '#737373', icon: '#737373' },
12549
- red: { background: '#FCEFEF', content: '#FB4444', icon: '#FB4444' },
12550
- orange: { background: '#FEF1EA', content: '#FF6B00', icon: '#FF6B00' },
12551
- yellow: { background: '#FFF7DD', content: '#916C0D', icon: '#CA9611' },
12552
- green: { background: '#E8F9EF', content: '#00973C', icon: '#12B553' },
12553
- blue: { background: '#E6F1FF', content: '#0075FF', icon: '#0075FF' },
12554
- darkblue: { background: '#EAF5FE', content: '#006AC1', icon: '#006AC1' },
12555
- indigo: { background: '#EFF6FF', content: '#004290', icon: '#004290' },
12602
+ grey: { background: tagTokens.tag.grey.content, content: tagTokens.tag.grey.bg, icon: tagTokens.tag.grey.bg },
12603
+ red: { background: tagTokens.tag.red.content, content: tagTokens.tag.red.bg, icon: tagTokens.tag.red.bg },
12604
+ orange: { background: tagTokens.tag.orange.content, content: tagTokens.tag.orange.bg, icon: tagTokens.tag.orange.bg },
12605
+ yellow: { background: tagTokens.tag.yellow.content, content: tagTokens.tag.yellow.bg, icon: tagTokens.tag.yellow.bg },
12606
+ green: { background: tagTokens.tag.green.content, content: tagTokens.tag.green.bg, icon: tagTokens.tag.green.bg },
12607
+ blue: { background: tagTokens.tag.blue.content, content: tagTokens.tag.blue.bg, icon: tagTokens.tag.blue.bg },
12608
+ darkblue: { background: tagTokens.tag.darkblue.content, content: tagTokens.tag.darkblue.bg, icon: tagTokens.tag.darkblue.bg },
12609
+ indigo: { background: tagTokens.tag.indigo.content, content: tagTokens.tag.indigo.bg, icon: tagTokens.tag.indigo.bg },
12556
12610
  };
12557
12611
  const SQUARE_SIZE_CONFIG = {
12558
- sm: {
12559
- height: '20px',
12560
- paddingX: '6px',
12561
- gap: '4px',
12562
- fontSize: '11px',
12563
- fontWeight: '500',
12564
- iconSize: 12,
12612
+ xs: {
12613
+ height: `${Number(tagTokens.tag.xs.typography.lineHeight) + Number(tagTokens.tag.xs.paddingX) }px`,
12614
+ paddingX: `${tagTokens.tag.xs.paddingX}px`,
12615
+ gap: `${tagTokens.tag.xs.gap}px`,
12616
+ fontSize: `${tagTokens.tag.xs.typography.fontSize}px`,
12617
+ fontWeight: tagTokens.tag.xs.typography.fontWeight,
12618
+ lineHeight: `${tagTokens.tag.xs.typography.lineHeight}px`,
12619
+ iconSize: Number(tagTokens.tag.xs.icon),
12565
12620
  radius: '4px',
12566
12621
  },
12567
- md: {
12568
- height: '24px',
12569
- paddingX: '8px',
12570
- gap: '4px',
12571
- fontSize: '12px',
12572
- fontWeight: '700',
12573
- iconSize: 16,
12622
+ sm: {
12623
+ height: `${Number(tagTokens.tag.sm.typography.lineHeight) + Number(tagTokens.tag.sm.paddingX) }px`,
12624
+ paddingX: `${tagTokens.tag.sm.paddingX}px`,
12625
+ gap: `${tagTokens.tag.sm.gap}px`,
12626
+ fontSize: `${tagTokens.tag.sm.typography.fontSize}px`,
12627
+ fontWeight: tagTokens.tag.sm.typography.fontWeight,
12628
+ lineHeight: `${tagTokens.tag.sm.typography.lineHeight}px`,
12629
+ iconSize: Number(tagTokens.tag.sm.icon),
12574
12630
  radius: '4px',
12575
12631
  },
12576
- lg: {
12577
- height: '28px',
12578
- paddingX: '10px',
12579
- gap: '4px',
12580
- fontSize: '14px',
12581
- fontWeight: '700',
12582
- iconSize: 16,
12632
+ md: {
12633
+ height: `${Number(tagTokens.tag.md.typography.lineHeight) + Number(tagTokens.tag.md.paddingX) }px`,
12634
+ paddingX: `${tagTokens.tag.md.paddingX}px`,
12635
+ gap: `${tagTokens.tag.md.gap}px`,
12636
+ fontSize: `${tagTokens.tag.md.typography.fontSize}px`,
12637
+ fontWeight: tagTokens.tag.md.typography.fontWeight,
12638
+ lineHeight: `${tagTokens.tag.md.typography.lineHeight}px`,
12639
+ iconSize: Number(tagTokens.tag.md.icon),
12583
12640
  radius: '5px',
12584
12641
  },
12585
12642
  };
12586
12643
  const PILL_SIZE_CONFIG = {
12644
+ xs: { ...SQUARE_SIZE_CONFIG.xs, radius: '999px' },
12587
12645
  sm: { ...SQUARE_SIZE_CONFIG.sm, radius: '999px' },
12588
12646
  md: { ...SQUARE_SIZE_CONFIG.md, radius: '999px' },
12589
- lg: { ...SQUARE_SIZE_CONFIG.lg, radius: '999px' },
12590
12647
  };
12591
12648
  const TAG_CONFIG = Object.fromEntries(TAG_SHAPES.flatMap(shape => TAG_SIZES.flatMap(size => TAG_COLORS.map(color => {
12592
12649
  const sizeConfig = shape === 'square' ? SQUARE_SIZE_CONFIG[size] : PILL_SIZE_CONFIG[size];
@@ -12603,13 +12660,13 @@ const TAG_CONFIG = Object.fromEntries(TAG_SHAPES.flatMap(shape => TAG_SIZES.flat
12603
12660
  }))));
12604
12661
  const isTagName = (value) => Object.prototype.hasOwnProperty.call(TAG_CONFIG, value);
12605
12662
 
12606
- const sdTagCss = () => `sd-tag{display:inline-flex;width:fit-content;height:fit-content}.sd-tag{display:inline-flex;align-items:center;justify-content:center;gap:var(--sd-tag-gap, 5px);min-height:var(--sd-tag-height, 24px);padding:0 var(--sd-tag-padding-x, 8px);border-radius:var(--sd-tag-radius, 4px);background:var(--sd-tag-background, #f3f3f3);color:var(--sd-tag-content, #7a7a7a);box-sizing:border-box;white-space:nowrap;-webkit-user-select:none;user-select:none}.sd-tag__icon{display:inline-flex;flex:0 0 auto;align-items:center;justify-content:center}.sd-tag__label{display:inline-flex;align-items:center;justify-content:center;min-width:0;font-size:var(--sd-tag-font-size, 12px);font-weight:var(--sd-tag-font-weight, 700);line-height:1}`;
12663
+ const sdTagCss = () => `sd-tag{display:inline-flex;width:fit-content;height:fit-content}.sd-tag{display:inline-flex;align-items:center;justify-content:center;gap:var(--sd-tag-gap, 5px);min-height:var(--sd-tag-height, 24px);padding:0 var(--sd-tag-padding-x, 8px);border-radius:var(--sd-tag-radius, 4px);background:var(--sd-tag-background, #f3f3f3);color:var(--sd-tag-content, #7a7a7a);box-sizing:border-box;white-space:nowrap;-webkit-user-select:none;user-select:none}.sd-tag__icon{display:inline-flex;flex:0 0 auto;align-items:center;justify-content:center}.sd-tag__label{display:inline-flex;align-items:center;justify-content:center;min-width:0;font-size:var(--sd-tag-font-size, 12px);font-weight:var(--sd-tag-font-weight, 700);line-height:var(--sd-tag-line-height, 20px)}`;
12607
12664
 
12608
12665
  class SdTag {
12609
12666
  constructor(hostRef) {
12610
12667
  registerInstance(this, hostRef);
12611
12668
  }
12612
- name = 'square_md_grey';
12669
+ name = 'square_sm_grey';
12613
12670
  label = '';
12614
12671
  icon;
12615
12672
  isLeft = true;
@@ -12627,7 +12684,7 @@ class SdTag {
12627
12684
  render() {
12628
12685
  const config = this.resolvedConfig;
12629
12686
  const iconNode = this.renderIcon(config.icon, config.iconSize);
12630
- return (hAsync("span", { key: '5f9ee005b146997dd13bb3e6a06680ff8574bd14', class: "sd-tag", style: {
12687
+ return (hAsync("span", { key: 'c1c80bafa32e7c658780a8c214de97b9a7099697', class: "sd-tag", style: {
12631
12688
  '--sd-tag-background': config.background,
12632
12689
  '--sd-tag-content': config.content,
12633
12690
  '--sd-tag-height': config.height,
@@ -12635,8 +12692,9 @@ class SdTag {
12635
12692
  '--sd-tag-gap': config.gap,
12636
12693
  '--sd-tag-font-size': config.fontSize,
12637
12694
  '--sd-tag-font-weight': config.fontWeight,
12695
+ '--sd-tag-line-height': config.lineHeight,
12638
12696
  '--sd-tag-radius': config.radius,
12639
- }, "aria-label": this.label || 'tag' }, this.icon && this.isLeft && iconNode, hAsync("span", { key: 'b123ab6ac015db640e4dc3edc5e2cf90ec5e0ecf', class: "sd-tag__label" }, this.label), this.icon && !this.isLeft && iconNode));
12697
+ }, "aria-label": this.label || 'tag' }, this.icon && this.isLeft && iconNode, hAsync("span", { key: '6a0d9ec74319a7cefd0ceae96ffed32c717000bb', class: "sd-tag__label" }, this.label), this.icon && !this.isLeft && iconNode));
12640
12698
  }
12641
12699
  static get style() { return sdTagCss(); }
12642
12700
  static get cmpMeta() { return {
@@ -12738,10 +12796,10 @@ class SdTextarea {
12738
12796
  }
12739
12797
  render() {
12740
12798
  const maxLengthCounter = this.getMaxLengthCounter();
12741
- return (hAsync("div", { key: '5f087de7fd28e3f5fa3315c37b8974e7f5878149', class: {
12799
+ return (hAsync("div", { key: 'b8d0496866829b85f6678f648ccc944d57b45378', class: {
12742
12800
  'sd-textarea': true,
12743
12801
  [this.getTextareaStatus()]: true,
12744
- }, onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false) }, hAsync("div", { key: 'fb9e5c4e98cadbf1a694bce4f9fed498bdc8e7cd', class: "sd-textarea__content" }, hAsync("textarea", { key: 'b0414813c34a127becd94ec6fc2e516c375d8eea', name: this.name, ref: el => (this.nativeEl = el), class: `sd-textarea__native ${this.textareaClass}`, value: this.internalValue || '', placeholder: this.placeholder, disabled: this.disabled, autofocus: this.autoFocus, maxLength: this.maxLength, onInput: this.handleInput.bind(this), onFocus: event => this.handleFocus('focus', event), onBlur: event => this.handleFocus('blur', event) })), this.hasFooter() && (hAsync("div", { key: 'fe3f278f3a7d438f8fce8ca4043e00ec0220efd6', class: "sd-textarea__footer" }, this.helpText !== undefined && hAsync("span", { key: '16d15de3ff1e49de16b67088d52f7f2848f2e283', class: "sd-textarea__help-text" }, this.helpText), maxLengthCounter !== null && hAsync("span", { key: '84b4adbd09b7af30dbc68b5f3e6473e97fe4c76e', class: "sd-textarea__counter" }, maxLengthCounter)))));
12802
+ }, onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false) }, hAsync("div", { key: 'b43d91b1c7381a2b6c7a0ab1437e43e32396419c', class: "sd-textarea__content" }, hAsync("textarea", { key: '9b77710a8344db09172f57212c55db6a70ec96f2', name: this.name, ref: el => (this.nativeEl = el), class: `sd-textarea__native ${this.textareaClass}`, value: this.internalValue || '', placeholder: this.placeholder, disabled: this.disabled, autofocus: this.autoFocus, maxLength: this.maxLength, onInput: this.handleInput.bind(this), onFocus: event => this.handleFocus('focus', event), onBlur: event => this.handleFocus('blur', event) })), this.hasFooter() && (hAsync("div", { key: '67056ceb0778d11a607cfc1de9de9440c98bd165', class: "sd-textarea__footer" }, this.helpText !== undefined && hAsync("span", { key: 'bcdb6b7991cae0e68a21f04a53299952602e5039', class: "sd-textarea__help-text" }, this.helpText), maxLengthCounter !== null && hAsync("span", { key: '526ff7bcd19688f086ef1f129008b4849a8d3491', class: "sd-textarea__counter" }, maxLengthCounter)))));
12745
12803
  }
12746
12804
  static get watchers() { return {
12747
12805
  "value": [{
@@ -12822,10 +12880,10 @@ class SdToast {
12822
12880
  background: resolveColor(colorTokens.background),
12823
12881
  text: resolveColor(colorTokens.text),
12824
12882
  };
12825
- return (hAsync("div", { key: '16579a21c0eec78e609b0cf82fcf2d040b8b3388', style: {
12883
+ return (hAsync("div", { key: '0e0643ca708f95b8b357a1e146343948366ca727', style: {
12826
12884
  '--sd-toast-bg': colors.background,
12827
12885
  '--sd-toast-text': colors.text,
12828
- } }, hAsync("div", { key: '108e47983e1ad99ed462a4fa00c29aa9e3393b8b', class: this.getContainerClasses(), role: "status", "aria-live": "polite", "aria-atomic": "true" }, this.icon && (hAsync("div", { key: 'd034c9aaafc272d51de96de6ccefe49208aba7e3', class: "sd-toast__icon" }, hAsync("sd-icon", { key: '14b97c4cbe7134f67d919abcf4e10cf673dd909d', name: this.icon, size: 16, color: colors.text }))), hAsync("div", { key: '1cecb89bdb19742a7df04625e8f070cd2c207b5e', class: "sd-toast__content" }, hAsync("span", { key: '1daf2a2bea963b7b68c580b30c4c8fa2f3a26c8f', class: "sd-toast__message" }, this.message)), this.link && (hAsync("a", { key: '8f7961c2c14806aa1323e378f57d74e47614772c', href: this.link, class: "sd-toast__link", target: "_blank", rel: "noopener noreferrer" }, this.linkLabel || this.link)), this.buttonLabel && (hAsync("sd-button", { key: '89cba5e58ff368aea05130b799d903d4cf85b120', class: `sd-toast__button ${this.type === 'basicLight' ? 'text-white' : ''}`, label: this.buttonLabel, variant: "primary", color: this.type === 'basicLight' ? 'oceanblue_75' : 'white', size: "sm", onSdClick: this.handleButtonClick, style: this.type !== 'basicLight' ? { '--button-text-color': resolveColor('grey_95') } : {} })), this.useClose && (hAsync("button", { key: '0e7fc0737824b61166cbff82a410948ca1745842', type: "button", class: "sd-toast__close", onClick: this.handleClose, "aria-label": "Close", title: "Close" }, hAsync("sd-icon", { key: '82d203f6eb584cb04566e8f3b1bd7a86ca50bba4', name: "close", size: 12, color: colors.text }))))));
12886
+ } }, hAsync("div", { key: '366f178360029706f54bc44cc95d2807c374318e', class: this.getContainerClasses(), role: "status", "aria-live": "polite", "aria-atomic": "true" }, this.icon && (hAsync("div", { key: 'c110b274a1929970bc818c8a41040b26656ba27e', class: "sd-toast__icon" }, hAsync("sd-icon", { key: '7e71e2878f18c66d7ac4aa07d1e96eff74bea074', name: this.icon, size: 16, color: colors.text }))), hAsync("div", { key: 'b1a3a86d65724b8bbe1ab131e289379451ea7ec4', class: "sd-toast__content" }, hAsync("span", { key: '56ac68520c8be2541528c7ff3242d634f036aec0', class: "sd-toast__message" }, this.message)), this.link && (hAsync("a", { key: '5e93140dea3082f869a1263d0cb0574690173cc8', href: this.link, class: "sd-toast__link", target: "_blank", rel: "noopener noreferrer" }, this.linkLabel || this.link)), this.buttonLabel && (hAsync("sd-button", { key: '79e472c5f4b31e3df155bcf621a5b83345a62788', class: `sd-toast__button ${this.type === 'basicLight' ? 'text-white' : ''}`, label: this.buttonLabel, variant: "primary", color: this.type === 'basicLight' ? 'oceanblue_75' : 'white', size: "sm", onSdClick: this.handleButtonClick, style: this.type !== 'basicLight' ? { '--button-text-color': resolveColor('grey_95') } : {} })), this.useClose && (hAsync("button", { key: 'fb3f5666b04fedf20b81235bb34c1c2d793aa1fa', type: "button", class: "sd-toast__close", onClick: this.handleClose, "aria-label": "Close", title: "Close" }, hAsync("sd-icon", { key: 'dff68640b8f90dba0e2ee77c743e304bd5b80859', name: "close", size: 12, color: colors.text }))))));
12829
12887
  }
12830
12888
  static get style() { return sdToastCss(); }
12831
12889
  static get cmpMeta() { return {
@@ -12882,7 +12940,7 @@ class SdToggle {
12882
12940
  this.change.emit(newValue);
12883
12941
  };
12884
12942
  render() {
12885
- return (hAsync("label", { key: '9a8a0221e093040e446bc193f682070aa1f95c6c', "aria-label": this.label || 'toggle', class: this.toggleClasses }, hAsync("input", { key: '4a2e3c626bfa4e439676cc40df619bd284d0178a', type: "checkbox", checked: this.value, disabled: this.disabled, onInput: this.handleChange }), this.label && hAsync("span", { key: '1eecfd810c17610604d6cf93c6f664690f17ff6a', class: "sd-toggle__label" }, this.label), hAsync("div", { key: '9f082e2f6036e338f2afb6fb719b4ff8d3a01d99', class: "sd-toggle__track" }, hAsync("div", { key: '1d8b1bd11b05091a368c681ead7e79a0e453d510', class: "sd-toggle__thumb" }))));
12943
+ return (hAsync("label", { key: '1b2a644cdf09cb16d77ecfe38be28b0fdcbf592a', "aria-label": this.label || 'toggle', class: this.toggleClasses }, hAsync("input", { key: '1f1f09c157fe0d8cab0dd5b45caa51b6418cf80f', type: "checkbox", checked: this.value, disabled: this.disabled, onInput: this.handleChange }), this.label && hAsync("span", { key: '0aedb28652224b3a51bd13b912d2d85a4adbaa12', class: "sd-toggle__label" }, this.label), hAsync("div", { key: 'af31fa9a84bae6c4bb97e339f5a26678f1a951e7', class: "sd-toggle__track" }, hAsync("div", { key: 'cade31468c32d0179d4db0473e66c89d8ac4119c', class: "sd-toggle__thumb" }))));
12886
12944
  }
12887
12945
  static get style() { return sdToggleCss(); }
12888
12946
  static get cmpMeta() { return {
@@ -12938,7 +12996,7 @@ class SdToggleButton {
12938
12996
  this.change.emit(newValue);
12939
12997
  };
12940
12998
  render() {
12941
- return (hAsync("label", { key: '174a62904591e559232574d207ff4ad9c0113ad8', class: this.buttonClasses, "aria-label": this.label || 'toggle button' }, this.label, hAsync("input", { key: '7bbd96a0563a8cadcfb7ab9d8e1fb3767508d6bf', style: { display: 'none' }, type: "checkbox", onInput: this.handleChange })));
12999
+ return (hAsync("label", { key: '765e1ec1a8ca7d55a1c8000044168c39032c649d', class: this.buttonClasses, "aria-label": this.label || 'toggle button' }, this.label, hAsync("input", { key: 'f3ea12b098b9bd5d50c626a3b0611457e580387c', style: { display: 'none' }, type: "checkbox", onInput: this.handleChange })));
12942
13000
  }
12943
13001
  static get style() { return sdToggleButtonCss(); }
12944
13002
  static get cmpMeta() { return {
@@ -12956,6 +13014,31 @@ class SdToggleButton {
12956
13014
  }; }
12957
13015
  }
12958
13016
 
13017
+ const tooltip = {
13018
+ "default": {
13019
+ bg: "#07284A",
13020
+ content: "#FFFFFF"},
13021
+ danger: {
13022
+ bg: "#FCEFEF",
13023
+ content: "#FB4444"},
13024
+ warning: {
13025
+ bg: "#FEF1EA",
13026
+ content: "#FF6B00"},
13027
+ accent: {
13028
+ bg: "#E6F1FF",
13029
+ content: "#0075FF"}
13030
+ };
13031
+ var tooltipTokens = {
13032
+ tooltip: tooltip
13033
+ };
13034
+
13035
+ const TOOLTIP_TYPE_CONFIG = {
13036
+ default: { bg: tooltipTokens.tooltip.default.bg, content: tooltipTokens.tooltip.default.content },
13037
+ danger: { bg: tooltipTokens.tooltip.danger.bg, content: tooltipTokens.tooltip.danger.content },
13038
+ warning: { bg: tooltipTokens.tooltip.warning.bg, content: tooltipTokens.tooltip.warning.content },
13039
+ accent: { bg: tooltipTokens.tooltip.accent.bg, content: tooltipTokens.tooltip.accent.content },
13040
+ };
13041
+
12959
13042
  const sdTooltipCss = () => `sd-tooltip{visibility:hidden !important;display:inline-flex}sd-tooltip.visible{visibility:visible !important}sd-tooltip .sd-tooltip{position:relative;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}`;
12960
13043
 
12961
13044
  class SdTooltip {
@@ -12966,14 +13049,13 @@ class SdTooltip {
12966
13049
  trigger = 'hover';
12967
13050
  placement = 'top';
12968
13051
  color = '#01BB4B';
12969
- type = 'default';
13052
+ tooltipType = 'default';
12970
13053
  icon = 'helpOutline';
12971
13054
  iconSize = 12;
12972
13055
  label = '';
12973
13056
  buttonSize = 'sm';
12974
13057
  buttonVariant = 'primary';
12975
13058
  noHover = true;
12976
- useClose = false;
12977
13059
  showTooltip = false;
12978
13060
  slotContentHTML = '';
12979
13061
  buttonEl;
@@ -12983,10 +13065,10 @@ class SdTooltip {
12983
13065
  componentWillLoad() {
12984
13066
  this.slotContentHTML = this.el.innerHTML;
12985
13067
  this.el.replaceChildren();
12986
- // 깜빡이는 현상을 막기 위해 기본으로 <sd-tooltip></sd-tooltip> hidden이 된 elment를 visible로 만들어줌
12987
13068
  this.el.classList.toggle('visible', true);
12988
13069
  }
12989
13070
  render() {
13071
+ const typeConfig = TOOLTIP_TYPE_CONFIG[this.tooltipType] ?? TOOLTIP_TYPE_CONFIG.default;
12990
13072
  const handleTrigger = this.trigger === 'hover'
12991
13073
  ? {
12992
13074
  onMouseEnter: () => (this.showTooltip = true),
@@ -13003,12 +13085,14 @@ class SdTooltip {
13003
13085
  : {
13004
13086
  onSdClick: () => (this.showTooltip = !this.showTooltip),
13005
13087
  };
13006
- return (hAsync(Fragment, { key: '1aefeca1e8e1e5da1ad3394dbc2cd5529c0ce854' }, 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-tooltip", ...buttonTrigger })) : (hAsync("sd-icon", { ref: el => (this.buttonEl = el), name: this.icon, size: this.iconSize, color: this.color, class: "sd-tooltip", ...handleTrigger })), this.showTooltip && (hAsync("sd-floating-portal", { key: '65c83f4f0d03d17345e9c19b462dadb78f7ea83b', parentRef: this.buttonEl, onSdClose: this.handleClose.bind(this), placement: this.placement }, hAsync("div", { key: 'ca2f15d29a5999842f39ef3bb5eefc6f8675e386', class: {
13088
+ return (hAsync(Fragment, { key: '59034499ad4215be8135ec8da7a86d09b2d6b295' }, 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-tooltip", ...buttonTrigger })) : (hAsync("sd-icon", { ref: el => (this.buttonEl = el), name: this.icon, size: this.iconSize, color: this.color, class: "sd-tooltip", ...handleTrigger })), this.showTooltip && (hAsync("sd-floating-portal", { key: '53bae57a86e523feeba3d96246375dd62fa13b80', parentRef: this.buttonEl, onSdClose: this.handleClose.bind(this), placement: this.placement }, hAsync("div", { key: '6d084515f879936e04f7210ae59e008bbe7e8dd6', class: {
13007
13089
  'sd-floating-menu': true,
13008
- [`sd-floating-menu--${this.type}`]: true,
13090
+ [`sd-floating-menu--${this.tooltipType}`]: true,
13009
13091
  [`sd-floating-menu--${this.placement}`]: true,
13010
- 'sd-floating-menu--with-close': this.useClose,
13011
- } }, hAsync("i", { key: 'd118d136589ef1e421e03bae59b0a9d5bfbbb2ba', class: `sd-floating-menu__arrow sd-floating-menu__arrow--${this.placement}` }, hAsync(TooltipArrow, { key: '2a2e0599bcf1cd2261335d0c46297a7650ac30a2' })), hAsync("div", { key: 'fced40f561dae6a81a9e5c9c4be44555db358745', class: "sd-floating-menu__content", innerHTML: this.slotContentHTML }), this.useClose && (hAsync("div", { key: 'dec97887df051d3253f05f03190e145d0515b522', class: "sd-floating-menu__close-button" }, hAsync("button", { key: '66cd01a3228a27abdc9e4d9e974fe90c91c6ad97', type: "button", "aria-label": "Close tooltip", title: "Close tooltip", onClick: this.handleClose.bind(this) }, hAsync("sd-icon", { key: 'bc179a3452f83d96a7a36ca12821c093f7f53527', name: "close", size: "12", color: "#AAAAAA" })))))))));
13092
+ }, style: {
13093
+ '--sd-floating-bg': typeConfig.bg,
13094
+ '--sd-floating-content': typeConfig.content,
13095
+ } }, hAsync("i", { key: '38a80cb95be6bbd79dca41c36a9e48764bc8d3e7', class: `sd-floating-menu__arrow sd-floating-menu__arrow--${this.placement}` }, hAsync(TooltipArrow, { key: 'e501bc5eab4cbe38a7f6c37202e2f10dc7f480c1' })), hAsync("div", { key: '99346441a1cffa893312c98132dd819047500b69', class: "sd-floating-menu__content", innerHTML: this.slotContentHTML }))))));
13012
13096
  }
13013
13097
  static get style() { return sdTooltipCss(); }
13014
13098
  static get cmpMeta() { return {
@@ -13018,14 +13102,13 @@ class SdTooltip {
13018
13102
  "trigger": [1],
13019
13103
  "placement": [1],
13020
13104
  "color": [1],
13021
- "type": [1],
13105
+ "tooltipType": [1, "tooltip-type"],
13022
13106
  "icon": [1],
13023
13107
  "iconSize": [2, "icon-size"],
13024
13108
  "label": [1],
13025
13109
  "buttonSize": [1, "button-size"],
13026
13110
  "buttonVariant": [1, "button-variant"],
13027
13111
  "noHover": [4, "no-hover"],
13028
- "useClose": [4, "use-close"],
13029
13112
  "showTooltip": [32],
13030
13113
  "slotContentHTML": [32]
13031
13114
  },