@solid-design-system/components 4.0.0-next.8 → 4.0.0-next.9

Sign up to get free protection for your applications and to get access to all the features.
Files changed (241) hide show
  1. package/cdn/chunks/chunk.GT3LHFGJ.js +1 -0
  2. package/cdn/components/badge/badge.d.ts +1 -1
  3. package/cdn/components/badge/badge.js +1 -1
  4. package/cdn/custom-elements.json +5 -5
  5. package/cdn/solid-components.bundle.js +1 -1
  6. package/cdn/solid-components.iife.js +1 -1
  7. package/cdn/solid-components.js +1 -1
  8. package/cdn/vscode.html-custom-data.json +1 -5
  9. package/cdn/web-types.json +4 -4
  10. package/cdn-versioned/_components/menu/menu.js +1 -1
  11. package/cdn-versioned/_components/menu/menu.styles.js +1 -1
  12. package/cdn-versioned/_components/menu-item/menu-item.js +2 -2
  13. package/cdn-versioned/chunks/chunk.24SF73MY.js +1 -1
  14. package/cdn-versioned/chunks/chunk.2IZXJHH7.js +1 -1
  15. package/cdn-versioned/chunks/chunk.36Z2VDHI.js +1 -1
  16. package/cdn-versioned/chunks/chunk.3ATYVOO4.js +1 -1
  17. package/cdn-versioned/chunks/chunk.4HIKTDIM.js +3 -3
  18. package/cdn-versioned/chunks/chunk.4W3WLVGR.js +1 -1
  19. package/cdn-versioned/chunks/chunk.5FM4F3Y4.js +1 -1
  20. package/cdn-versioned/chunks/chunk.5ZDWEJDB.js +1 -1
  21. package/cdn-versioned/chunks/chunk.65NSSTJE.js +1 -1
  22. package/cdn-versioned/chunks/chunk.6JBTCFHE.js +2 -2
  23. package/cdn-versioned/chunks/chunk.7RJ3O2FV.js +1 -1
  24. package/cdn-versioned/chunks/chunk.AA7WA27A.js +4 -4
  25. package/cdn-versioned/chunks/chunk.APMDRZQD.js +1 -1
  26. package/cdn-versioned/chunks/chunk.C2PA7CKF.js +1 -1
  27. package/cdn-versioned/chunks/chunk.CEVVDV52.js +1 -1
  28. package/cdn-versioned/chunks/chunk.DMLGBWCL.js +1 -1
  29. package/cdn-versioned/chunks/chunk.DVHKKAVM.js +1 -1
  30. package/cdn-versioned/chunks/chunk.EWWGLHC5.js +1 -1
  31. package/cdn-versioned/chunks/chunk.F7J6HN76.js +1 -1
  32. package/cdn-versioned/chunks/chunk.FD54463O.js +1 -1
  33. package/cdn-versioned/chunks/chunk.FFNTXFC3.js +1 -1
  34. package/cdn-versioned/chunks/chunk.FX3ED655.js +1 -1
  35. package/cdn-versioned/chunks/chunk.GOVNZSCO.js +1 -1
  36. package/cdn-versioned/chunks/chunk.GQSLHWQC.js +1 -1
  37. package/cdn-versioned/chunks/chunk.GT3LHFGJ.js +1 -0
  38. package/cdn-versioned/chunks/chunk.ISEQUO4U.js +1 -1
  39. package/cdn-versioned/chunks/chunk.ITRQVXFY.js +1 -1
  40. package/cdn-versioned/chunks/chunk.IZKUI5WK.js +1 -1
  41. package/cdn-versioned/chunks/chunk.KMLMMBY4.js +1 -1
  42. package/cdn-versioned/chunks/chunk.LLXTYJXF.js +1 -1
  43. package/cdn-versioned/chunks/chunk.LZEFLOSA.js +1 -1
  44. package/cdn-versioned/chunks/chunk.MPP7HYX7.js +1 -1
  45. package/cdn-versioned/chunks/chunk.MX22EZXK.js +1 -1
  46. package/cdn-versioned/chunks/chunk.ND7BT52X.js +1 -1
  47. package/cdn-versioned/chunks/chunk.NUB5WHGD.js +1 -1
  48. package/cdn-versioned/chunks/chunk.O4UXOQEI.js +1 -1
  49. package/cdn-versioned/chunks/chunk.OVV7TNT2.js +1 -1
  50. package/cdn-versioned/chunks/chunk.OVVNTNS7.js +4 -4
  51. package/cdn-versioned/chunks/chunk.PBPFKJKV.js +1 -1
  52. package/cdn-versioned/chunks/chunk.QFNCQQ6S.js +1 -1
  53. package/cdn-versioned/chunks/chunk.QNZWJACC.js +2 -2
  54. package/cdn-versioned/chunks/chunk.R354E6ZD.js +1 -1
  55. package/cdn-versioned/chunks/chunk.TA7CZCP3.js +1 -1
  56. package/cdn-versioned/chunks/chunk.U443X4TI.js +1 -1
  57. package/cdn-versioned/chunks/chunk.UBFU6D5B.js +1 -1
  58. package/cdn-versioned/chunks/chunk.URB2K7JQ.js +1 -1
  59. package/cdn-versioned/chunks/chunk.VNKUGTKM.js +1 -1
  60. package/cdn-versioned/chunks/chunk.W7A3TU2Z.js +1 -1
  61. package/cdn-versioned/chunks/chunk.WENTMXB2.js +1 -1
  62. package/cdn-versioned/chunks/chunk.WQAPHFVM.js +1 -1
  63. package/cdn-versioned/chunks/chunk.YF5WEC4R.js +2 -2
  64. package/cdn-versioned/chunks/chunk.ZFA2VPUT.js +1 -1
  65. package/cdn-versioned/chunks/chunk.ZRIABVVM.js +1 -1
  66. package/cdn-versioned/components/accordion/accordion.d.ts +1 -1
  67. package/cdn-versioned/components/accordion-group/accordion-group.d.ts +1 -1
  68. package/cdn-versioned/components/animation/animation.d.ts +1 -1
  69. package/cdn-versioned/components/audio/audio.d.ts +1 -1
  70. package/cdn-versioned/components/badge/badge.d.ts +2 -2
  71. package/cdn-versioned/components/badge/badge.js +1 -1
  72. package/cdn-versioned/components/brandshape/brandshape.d.ts +1 -1
  73. package/cdn-versioned/components/button/button.d.ts +1 -1
  74. package/cdn-versioned/components/button-group/button-group.d.ts +1 -1
  75. package/cdn-versioned/components/carousel/carousel.d.ts +1 -1
  76. package/cdn-versioned/components/carousel-item/carousel-item.d.ts +1 -1
  77. package/cdn-versioned/components/checkbox/checkbox.d.ts +1 -1
  78. package/cdn-versioned/components/checkbox-group/checkbox-group.d.ts +1 -1
  79. package/cdn-versioned/components/combobox/combobox.d.ts +4 -4
  80. package/cdn-versioned/components/dialog/dialog.d.ts +1 -1
  81. package/cdn-versioned/components/divider/divider.d.ts +1 -1
  82. package/cdn-versioned/components/drawer/drawer.d.ts +1 -1
  83. package/cdn-versioned/components/dropdown/dropdown.d.ts +1 -1
  84. package/cdn-versioned/components/expandable/expandable.d.ts +1 -1
  85. package/cdn-versioned/components/flipcard/flipcard.d.ts +1 -1
  86. package/cdn-versioned/components/header/header.d.ts +1 -1
  87. package/cdn-versioned/components/icon/icon.d.ts +1 -1
  88. package/cdn-versioned/components/include/include.d.ts +1 -1
  89. package/cdn-versioned/components/input/input.d.ts +1 -1
  90. package/cdn-versioned/components/link/link.d.ts +1 -1
  91. package/cdn-versioned/components/map-marker/map-marker.d.ts +1 -1
  92. package/cdn-versioned/components/navigation-item/navigation-item.d.ts +1 -1
  93. package/cdn-versioned/components/notification/notification.d.ts +1 -1
  94. package/cdn-versioned/components/optgroup/optgroup.d.ts +2 -2
  95. package/cdn-versioned/components/option/option.d.ts +1 -1
  96. package/cdn-versioned/components/popup/popup.d.ts +1 -1
  97. package/cdn-versioned/components/quickfact/quickfact.d.ts +1 -1
  98. package/cdn-versioned/components/radio/radio.d.ts +1 -1
  99. package/cdn-versioned/components/radio-button/radio-button.d.ts +1 -1
  100. package/cdn-versioned/components/radio-group/radio-group.d.ts +2 -2
  101. package/cdn-versioned/components/scrollable/scrollable.d.ts +1 -1
  102. package/cdn-versioned/components/select/select.d.ts +4 -4
  103. package/cdn-versioned/components/spinner/spinner.d.ts +1 -1
  104. package/cdn-versioned/components/step/step.d.ts +1 -1
  105. package/cdn-versioned/components/step-group/step-group.d.ts +1 -1
  106. package/cdn-versioned/components/switch/switch.d.ts +1 -1
  107. package/cdn-versioned/components/tab/tab.d.ts +1 -1
  108. package/cdn-versioned/components/tab-group/tab-group.d.ts +1 -1
  109. package/cdn-versioned/components/tab-panel/tab-panel.d.ts +1 -1
  110. package/cdn-versioned/components/tag/tag.d.ts +1 -1
  111. package/cdn-versioned/components/textarea/textarea.d.ts +1 -1
  112. package/cdn-versioned/components/tooltip/tooltip.d.ts +1 -1
  113. package/cdn-versioned/components/video/video.d.ts +1 -1
  114. package/cdn-versioned/custom-elements.json +206 -206
  115. package/cdn-versioned/internal/form.js +3 -3
  116. package/cdn-versioned/solid-components.bundle.js +17 -17
  117. package/cdn-versioned/solid-components.css +2 -2
  118. package/cdn-versioned/solid-components.iife.js +17 -17
  119. package/cdn-versioned/solid-components.js +1 -1
  120. package/cdn-versioned/vscode.html-custom-data.json +81 -85
  121. package/cdn-versioned/web-types.json +140 -140
  122. package/dist/chunks/{chunk.RZRTIYXA.js → chunk.RIKFGIMH.js} +4 -4
  123. package/dist/components/badge/badge.d.ts +1 -1
  124. package/dist/components/badge/badge.js +1 -1
  125. package/dist/custom-elements.json +5 -5
  126. package/dist/solid-components.js +1 -1
  127. package/dist/vscode.html-custom-data.json +1 -5
  128. package/dist/web-types.json +4 -4
  129. package/dist-versioned/_components/menu/menu.js +1 -1
  130. package/dist-versioned/_components/menu/menu.styles.js +1 -1
  131. package/dist-versioned/_components/menu-item/menu-item.js +2 -2
  132. package/dist-versioned/chunks/chunk.2IBVAXOX.js +1 -1
  133. package/dist-versioned/chunks/chunk.3IT4HBTI.js +1 -1
  134. package/dist-versioned/chunks/chunk.3LGDUVS4.js +2 -2
  135. package/dist-versioned/chunks/chunk.4JZQQD4L.js +3 -3
  136. package/dist-versioned/chunks/chunk.4QKRGAOL.js +4 -4
  137. package/dist-versioned/chunks/chunk.4RGGPCD5.js +2 -2
  138. package/dist-versioned/chunks/chunk.4XDHTC3C.js +26 -26
  139. package/dist-versioned/chunks/chunk.65BWRJEA.js +5 -5
  140. package/dist-versioned/chunks/chunk.6CUAQSFA.js +2 -2
  141. package/dist-versioned/chunks/chunk.6DKXZWRN.js +4 -4
  142. package/dist-versioned/chunks/chunk.727ERQ4F.js +2 -2
  143. package/dist-versioned/chunks/chunk.743FPQRN.js +2 -2
  144. package/dist-versioned/chunks/chunk.76ZNNLGN.js +1 -1
  145. package/dist-versioned/chunks/chunk.7OHSCBBX.js +1 -1
  146. package/dist-versioned/chunks/chunk.BG3M5FUP.js +13 -13
  147. package/dist-versioned/chunks/chunk.BVC5FY4L.js +13 -13
  148. package/dist-versioned/chunks/chunk.BXB5WF23.js +5 -5
  149. package/dist-versioned/chunks/chunk.D6JZ4IKM.js +1 -1
  150. package/dist-versioned/chunks/chunk.DQPVSTUQ.js +3 -3
  151. package/dist-versioned/chunks/chunk.EKFRFDTB.js +5 -5
  152. package/dist-versioned/chunks/chunk.H655M7FD.js +1 -1
  153. package/dist-versioned/chunks/chunk.HPR3PWAE.js +3 -3
  154. package/dist-versioned/chunks/chunk.IN3GJ5QL.js +3 -3
  155. package/dist-versioned/chunks/chunk.J2XBUIBC.js +2 -2
  156. package/dist-versioned/chunks/chunk.J7MMF6WJ.js +2 -2
  157. package/dist-versioned/chunks/chunk.KTJRTRDJ.js +5 -5
  158. package/dist-versioned/chunks/chunk.KVKRZJS7.js +3 -3
  159. package/dist-versioned/chunks/chunk.MTSAWJLV.js +2 -2
  160. package/dist-versioned/chunks/chunk.NM6QP6RJ.js +2 -2
  161. package/dist-versioned/chunks/chunk.O3ZFWYJW.js +29 -29
  162. package/dist-versioned/chunks/chunk.PDRECIYA.js +1 -1
  163. package/dist-versioned/chunks/chunk.PGZ5AWZ2.js +9 -9
  164. package/dist-versioned/chunks/chunk.PIR4YJUS.js +2 -2
  165. package/dist-versioned/chunks/chunk.QAZYUCBK.js +6 -6
  166. package/dist-versioned/chunks/chunk.QCICV36Z.js +6 -6
  167. package/dist-versioned/chunks/chunk.QP3SM2LZ.js +3 -3
  168. package/dist-versioned/chunks/chunk.R4BETATX.js +1 -1
  169. package/dist-versioned/chunks/{chunk.RZRTIYXA.js → chunk.RIKFGIMH.js} +5 -5
  170. package/dist-versioned/chunks/chunk.RNSJAVQE.js +1 -1
  171. package/dist-versioned/chunks/chunk.SPBPHTSS.js +2 -2
  172. package/dist-versioned/chunks/chunk.SSH6ATRK.js +2 -2
  173. package/dist-versioned/chunks/chunk.TWXYFPBS.js +2 -2
  174. package/dist-versioned/chunks/chunk.U5NFPAOX.js +2 -2
  175. package/dist-versioned/chunks/chunk.U6RY25TF.js +2 -2
  176. package/dist-versioned/chunks/chunk.UC5E3AEF.js +1 -1
  177. package/dist-versioned/chunks/chunk.UDZYWRPT.js +1 -1
  178. package/dist-versioned/chunks/chunk.UIQBHPD3.js +2 -2
  179. package/dist-versioned/chunks/chunk.V7TQ6VJU.js +1 -1
  180. package/dist-versioned/chunks/chunk.VHGHICFG.js +2 -2
  181. package/dist-versioned/chunks/chunk.XVFJS7VS.js +5 -5
  182. package/dist-versioned/chunks/chunk.Z2UY62T2.js +1 -1
  183. package/dist-versioned/chunks/chunk.ZGPGFEVP.js +5 -5
  184. package/dist-versioned/chunks/chunk.ZWJI7SLE.js +11 -11
  185. package/dist-versioned/components/accordion/accordion.d.ts +1 -1
  186. package/dist-versioned/components/accordion-group/accordion-group.d.ts +1 -1
  187. package/dist-versioned/components/animation/animation.d.ts +1 -1
  188. package/dist-versioned/components/audio/audio.d.ts +1 -1
  189. package/dist-versioned/components/badge/badge.d.ts +2 -2
  190. package/dist-versioned/components/badge/badge.js +1 -1
  191. package/dist-versioned/components/brandshape/brandshape.d.ts +1 -1
  192. package/dist-versioned/components/button/button.d.ts +1 -1
  193. package/dist-versioned/components/button-group/button-group.d.ts +1 -1
  194. package/dist-versioned/components/carousel/carousel.d.ts +1 -1
  195. package/dist-versioned/components/carousel-item/carousel-item.d.ts +1 -1
  196. package/dist-versioned/components/checkbox/checkbox.d.ts +1 -1
  197. package/dist-versioned/components/checkbox-group/checkbox-group.d.ts +1 -1
  198. package/dist-versioned/components/combobox/combobox.d.ts +4 -4
  199. package/dist-versioned/components/dialog/dialog.d.ts +1 -1
  200. package/dist-versioned/components/divider/divider.d.ts +1 -1
  201. package/dist-versioned/components/drawer/drawer.d.ts +1 -1
  202. package/dist-versioned/components/dropdown/dropdown.d.ts +1 -1
  203. package/dist-versioned/components/expandable/expandable.d.ts +1 -1
  204. package/dist-versioned/components/flipcard/flipcard.d.ts +1 -1
  205. package/dist-versioned/components/header/header.d.ts +1 -1
  206. package/dist-versioned/components/icon/icon.d.ts +1 -1
  207. package/dist-versioned/components/include/include.d.ts +1 -1
  208. package/dist-versioned/components/input/input.d.ts +1 -1
  209. package/dist-versioned/components/link/link.d.ts +1 -1
  210. package/dist-versioned/components/map-marker/map-marker.d.ts +1 -1
  211. package/dist-versioned/components/navigation-item/navigation-item.d.ts +1 -1
  212. package/dist-versioned/components/notification/notification.d.ts +1 -1
  213. package/dist-versioned/components/optgroup/optgroup.d.ts +2 -2
  214. package/dist-versioned/components/option/option.d.ts +1 -1
  215. package/dist-versioned/components/popup/popup.d.ts +1 -1
  216. package/dist-versioned/components/quickfact/quickfact.d.ts +1 -1
  217. package/dist-versioned/components/radio/radio.d.ts +1 -1
  218. package/dist-versioned/components/radio-button/radio-button.d.ts +1 -1
  219. package/dist-versioned/components/radio-group/radio-group.d.ts +2 -2
  220. package/dist-versioned/components/scrollable/scrollable.d.ts +1 -1
  221. package/dist-versioned/components/select/select.d.ts +4 -4
  222. package/dist-versioned/components/spinner/spinner.d.ts +1 -1
  223. package/dist-versioned/components/step/step.d.ts +1 -1
  224. package/dist-versioned/components/step-group/step-group.d.ts +1 -1
  225. package/dist-versioned/components/switch/switch.d.ts +1 -1
  226. package/dist-versioned/components/tab/tab.d.ts +1 -1
  227. package/dist-versioned/components/tab-group/tab-group.d.ts +1 -1
  228. package/dist-versioned/components/tab-panel/tab-panel.d.ts +1 -1
  229. package/dist-versioned/components/tag/tag.d.ts +1 -1
  230. package/dist-versioned/components/textarea/textarea.d.ts +1 -1
  231. package/dist-versioned/components/tooltip/tooltip.d.ts +1 -1
  232. package/dist-versioned/components/video/video.d.ts +1 -1
  233. package/dist-versioned/custom-elements.json +206 -206
  234. package/dist-versioned/internal/form.js +3 -3
  235. package/dist-versioned/solid-components.css +2 -2
  236. package/dist-versioned/solid-components.js +1 -1
  237. package/dist-versioned/vscode.html-custom-data.json +81 -85
  238. package/dist-versioned/web-types.json +140 -140
  239. package/package.json +1 -1
  240. package/cdn/chunks/chunk.7M7VCE7R.js +0 -1
  241. package/cdn-versioned/chunks/chunk.7M7VCE7R.js +0 -1
@@ -64,7 +64,7 @@ __decorateClass([
64
64
  query('[part="base"]')
65
65
  ], SdTeaserMedia.prototype, "teaserMedia", 2);
66
66
  SdTeaserMedia = __decorateClass([
67
- customElement("sd-4-0-0-next-8-teaser-media")
67
+ customElement("sd-4-0-0-next-9-teaser-media")
68
68
  ], SdTeaserMedia);
69
69
 
70
70
  export {
@@ -29,8 +29,8 @@ var SdTabGroup = class extends SolidElement {
29
29
  }
30
30
  connectedCallback() {
31
31
  const whenAllDefined = Promise.all([
32
- customElements.whenDefined("sd-4-0-0-next-8-tab"),
33
- customElements.whenDefined("sd-4-0-0-next-8-tab-panel")
32
+ customElements.whenDefined("sd-4-0-0-next-9-tab"),
33
+ customElements.whenDefined("sd-4-0-0-next-9-tab-panel")
34
34
  ]);
35
35
  super.connectedCallback();
36
36
  this.resizeObserver = new ResizeObserver(() => {
@@ -71,19 +71,19 @@ var SdTabGroup = class extends SolidElement {
71
71
  getAllTabs(options = { includeDisabled: true }) {
72
72
  const slot = this.shadowRoot.querySelector('slot[name="nav"]');
73
73
  return [...slot.assignedElements()].filter((el) => {
74
- return options.includeDisabled ? el.tagName.toLowerCase() === "sd-4-0-0-next-8-tab" : el.tagName.toLowerCase() === "sd-4-0-0-next-8-tab" && !el.disabled;
74
+ return options.includeDisabled ? el.tagName.toLowerCase() === "sd-4-0-0-next-9-tab" : el.tagName.toLowerCase() === "sd-4-0-0-next-9-tab" && !el.disabled;
75
75
  });
76
76
  }
77
77
  getAllPanels() {
78
- return [...this.body.assignedElements()].filter((el) => el.tagName.toLowerCase() === "sd-4-0-0-next-8-tab-panel");
78
+ return [...this.body.assignedElements()].filter((el) => el.tagName.toLowerCase() === "sd-4-0-0-next-9-tab-panel");
79
79
  }
80
80
  getActiveTab() {
81
81
  return this.tabs.find((t) => t.matches(":focus"));
82
82
  }
83
83
  handleClick(event) {
84
84
  const target = event.target;
85
- const tab = target.closest("sd-4-0-0-next-8-tab");
86
- const tabGroup = tab == null ? void 0 : tab.closest("sd-4-0-0-next-8-tab-group");
85
+ const tab = target.closest("sd-4-0-0-next-9-tab");
86
+ const tabGroup = tab == null ? void 0 : tab.closest("sd-4-0-0-next-9-tab-group");
87
87
  if (tabGroup !== this) {
88
88
  return;
89
89
  }
@@ -93,8 +93,8 @@ var SdTabGroup = class extends SolidElement {
93
93
  }
94
94
  handleKeyDown(event) {
95
95
  const target = event.target;
96
- const tab = target.closest("sd-4-0-0-next-8-tab");
97
- const tabGroup = tab == null ? void 0 : tab.closest("sd-4-0-0-next-8-tab-group");
96
+ const tab = target.closest("sd-4-0-0-next-9-tab");
97
+ const tabGroup = tab == null ? void 0 : tab.closest("sd-4-0-0-next-9-tab-group");
98
98
  if (tabGroup !== this) {
99
99
  return;
100
100
  }
@@ -119,7 +119,7 @@ var SdTabGroup = class extends SolidElement {
119
119
  if (["ArrowLeft", "ArrowRight", "ArrowUp", "ArrowDown", "Home", "End"].includes(event.key)) {
120
120
  const activeEl = this.tabs.find((t) => t.matches(":focus"));
121
121
  const isRtl = this.localize.dir() === "rtl";
122
- if ((activeEl == null ? void 0 : activeEl.tagName.toLowerCase()) === "sd-4-0-0-next-8-tab") {
122
+ if ((activeEl == null ? void 0 : activeEl.tagName.toLowerCase()) === "sd-4-0-0-next-9-tab") {
123
123
  let index = this.tabs.indexOf(activeEl);
124
124
  if (event.key === "Home") {
125
125
  index = 0;
@@ -215,15 +215,15 @@ var SdTabGroup = class extends SolidElement {
215
215
  return html`<div part="base" class="${cx("flex flex-col rounded-none")}" @click="${this.handleClick}" @keydown="${this.handleKeyDown}"><div part="nav" class="${cx(this.hasScrollControls && "relative py-0 px-12")}">${this.hasScrollControls ? html`<button part="scroll-button--start" exportparts="base:scroll-button__base" tabindex="-1" aria-hidden="true" class="${cx(
216
216
  "sd-interactive flex items-center justify-center absolute top-0 bottom-0 left-0 !outline-offset-0 border-b border-neutral-400 z-10",
217
217
  this.localize.dir() === "rtl" && "left-auto right-0"
218
- )}" @click="${this.handleScrollToStart}"><sd-4-0-0-next-8-icon library="system" name="${isRtl ? "chevron-up" : "chevron-down"}" label="previous" class="${cx("h-6 w-12 rotate-90 grid place-items-center")}"></sd-4-0-0-next-8-icon></button>` : ""}<div part="scroll-container" class="flex overflow-x-auto focus-visible:focus-outline !outline-offset-0"><div part="tabs" class="${cx("flex flex-auto relative flex-row")}" role="tablist"><div part="separation" class="w-full border-[0.25px] border-neutral-400 absolute bottom-0"></div><slot name="nav" @slotchange="${this.syncTabsAndPanels}"></slot></div></div>${this.hasScrollControls ? html`<button part="scroll-button--end" exportparts="base:scroll-button__base" tabindex="-1" aria-hidden="true" class="${cx(
218
+ )}" @click="${this.handleScrollToStart}"><sd-4-0-0-next-9-icon library="system" name="${isRtl ? "chevron-up" : "chevron-down"}" label="previous" class="${cx("h-6 w-12 rotate-90 grid place-items-center")}"></sd-4-0-0-next-9-icon></button>` : ""}<div part="scroll-container" class="flex overflow-x-auto focus-visible:focus-outline !outline-offset-0"><div part="tabs" class="${cx("flex flex-auto relative flex-row")}" role="tablist"><div part="separation" class="w-full border-[0.25px] border-neutral-400 absolute bottom-0"></div><slot name="nav" @slotchange="${this.syncTabsAndPanels}"></slot></div></div>${this.hasScrollControls ? html`<button part="scroll-button--end" exportparts="base:scroll-button__base" tabindex="-1" aria-hidden="true" class="${cx(
219
219
  "sd-interactive flex items-center justify-center absolute top-0 bottom-0 right-0 !outline-offset-0 border-b border-neutral-400 z-10",
220
220
  this.localize.dir() === "rtl" && "right-auto left-0"
221
- )}" @click="${this.handleScrollToEnd}"><sd-4-0-0-next-8-icon library="system" name="${isRtl ? "chevron-down" : "chevron-up"}" label="next" class="${cx("h-6 w-12 rotate-90 grid place-items-center")}"></sd-4-0-0-next-8-icon></button>` : ""}</div><slot part="body" class="${cx("block auto py-8 px-6", this.variant === "container" && "border border-neutral-400 border-t-0")}" @slotchange="${this.syncTabsAndPanels}"></slot></div>`;
221
+ )}" @click="${this.handleScrollToEnd}"><sd-4-0-0-next-9-icon library="system" name="${isRtl ? "chevron-down" : "chevron-up"}" label="next" class="${cx("h-6 w-12 rotate-90 grid place-items-center")}"></sd-4-0-0-next-9-icon></button>` : ""}</div><slot part="body" class="${cx("block auto py-8 px-6", this.variant === "container" && "border border-neutral-400 border-t-0")}" @slotchange="${this.syncTabsAndPanels}"></slot></div>`;
222
222
  }
223
223
  };
224
224
  SdTabGroup.styles = [
225
225
  ...SolidElement.styles,
226
- css`:host{box-sizing:border-box;display:block}[part=scroll-container]{scrollbar-width:none}[part=scroll-container]::-webkit-scrollbar{height:var(--sd-spacing-0,0);width:var(--sd-spacing-0,0)}:focus-within::slotted(sd-4-0-0-next-8-tab-panel){outline-color:rgb(var(--sd-color-primary,0 53 142)/1);outline-offset:2px;outline-style:solid;outline-width:2px}::slotted(sd-4-0-0-next-8-tab-panel){--padding:1rem 0}`
226
+ css`:host{box-sizing:border-box;display:block}[part=scroll-container]{scrollbar-width:none}[part=scroll-container]::-webkit-scrollbar{height:var(--sd-spacing-0,0);width:var(--sd-spacing-0,0)}:focus-within::slotted(sd-4-0-0-next-9-tab-panel){outline-color:rgb(var(--sd-color-primary,0 53 142)/1);outline-offset:2px;outline-style:solid;outline-width:2px}::slotted(sd-4-0-0-next-9-tab-panel){--padding:1rem 0}`
227
227
  ];
228
228
  __decorateClass([
229
229
  query("[part=base]")
@@ -244,7 +244,7 @@ __decorateClass([
244
244
  property()
245
245
  ], SdTabGroup.prototype, "activation", 2);
246
246
  SdTabGroup = __decorateClass([
247
- customElement("sd-4-0-0-next-8-tab-group")
247
+ customElement("sd-4-0-0-next-9-tab-group")
248
248
  ], SdTabGroup);
249
249
 
250
250
  export {
@@ -76,10 +76,10 @@ var SdRadioGroup = class extends SolidElement {
76
76
  this.formControlController.updateValidity();
77
77
  }
78
78
  getAllRadios() {
79
- return [...this.querySelectorAll("sd-4-0-0-next-8-radio, sd-4-0-0-next-8-radio-button")];
79
+ return [...this.querySelectorAll("sd-4-0-0-next-9-radio, sd-4-0-0-next-9-radio-button")];
80
80
  }
81
81
  handleRadioClick(event) {
82
- const target = event.target.closest("sd-4-0-0-next-8-radio, sd-4-0-0-next-8-radio-button");
82
+ const target = event.target.closest("sd-4-0-0-next-9-radio, sd-4-0-0-next-9-radio-button");
83
83
  const radios = this.getAllRadios();
84
84
  const oldValue = this.value;
85
85
  if (target.disabled) {
@@ -156,7 +156,7 @@ var SdRadioGroup = class extends SolidElement {
156
156
  }
157
157
  })
158
158
  );
159
- this.hasButtonGroup = radios.some((radio) => radio.tagName.toLowerCase() === "sd-4-0-0-next-8-radio-button");
159
+ this.hasButtonGroup = radios.some((radio) => radio.tagName.toLowerCase() === "sd-4-0-0-next-9-radio-button");
160
160
  if (!radios.some((radio) => radio.checked)) {
161
161
  if (this.hasButtonGroup) {
162
162
  const buttonRadio = (_a = radios[0].shadowRoot) == null ? void 0 : _a.querySelector("button");
@@ -168,26 +168,26 @@ var SdRadioGroup = class extends SolidElement {
168
168
  }
169
169
  }
170
170
  if (this.hasButtonGroup) {
171
- const buttonGroup = (_b = this.shadowRoot) == null ? void 0 : _b.querySelector("sd-4-0-0-next-8-button-group");
171
+ const buttonGroup = (_b = this.shadowRoot) == null ? void 0 : _b.querySelector("sd-4-0-0-next-9-button-group");
172
172
  if (buttonGroup) {
173
173
  buttonGroup.disableRole = true;
174
174
  }
175
175
  }
176
176
  }
177
177
  syncRadios() {
178
- if (customElements.get("sd-4-0-0-next-8-radio") && customElements.get("sd-4-0-0-next-8-radio-button")) {
178
+ if (customElements.get("sd-4-0-0-next-9-radio") && customElements.get("sd-4-0-0-next-9-radio-button")) {
179
179
  this.syncRadioElements();
180
180
  return;
181
181
  }
182
- if (customElements.get("sd-4-0-0-next-8-radio")) {
182
+ if (customElements.get("sd-4-0-0-next-9-radio")) {
183
183
  this.syncRadioElements();
184
184
  } else {
185
- customElements.whenDefined("sd-4-0-0-next-8-radio").then(() => this.syncRadios());
185
+ customElements.whenDefined("sd-4-0-0-next-9-radio").then(() => this.syncRadios());
186
186
  }
187
- if (customElements.get("sd-4-0-0-next-8-radio-button")) {
187
+ if (customElements.get("sd-4-0-0-next-9-radio-button")) {
188
188
  this.syncRadioElements();
189
189
  } else {
190
- customElements.whenDefined("sd-4-0-0-next-8-radio-button").then(() => this.syncRadios());
190
+ customElements.whenDefined("sd-4-0-0-next-9-radio-button").then(() => this.syncRadios());
191
191
  }
192
192
  }
193
193
  updateCheckedRadio() {
@@ -259,16 +259,16 @@ var SdRadioGroup = class extends SolidElement {
259
259
  vertical: "flex-col",
260
260
  horizontal: "flex-row"
261
261
  }[this.orientation]
262
- )}"><div class="sr-only"><label><input id="validation-input" type="text" ?required="${this.required}" tabindex="-1" hidden @invalid="${this.handleInvalid}"></label></div>${this.hasButtonGroup ? html`<sd-4-0-0-next-8-button-group part="button-group" exportparts="base:button-group__base" role="presentation">${defaultSlot}</sd-4-0-0-next-8-button-group>` : defaultSlot}</div></fieldset>${this.formControlController.renderInvalidMessage()}`;
262
+ )}"><div class="sr-only"><label><input id="validation-input" type="text" ?required="${this.required}" tabindex="-1" hidden @invalid="${this.handleInvalid}"></label></div>${this.hasButtonGroup ? html`<sd-4-0-0-next-9-button-group part="button-group" exportparts="base:button-group__base" role="presentation">${defaultSlot}</sd-4-0-0-next-9-button-group>` : defaultSlot}</div></fieldset>${this.formControlController.renderInvalidMessage()}`;
263
263
  }
264
264
  };
265
- SdRadioGroup.dependencies = { "sd-4-0-0-next-8-button-group": SdButtonGroup };
265
+ SdRadioGroup.dependencies = { "sd-4-0-0-next-9-button-group": SdButtonGroup };
266
266
  /**
267
267
  * Inherits Tailwind classes and includes additional styling.
268
268
  */
269
269
  SdRadioGroup.styles = [
270
270
  ...SolidElement.styles,
271
- css`:host{display:block}:host([orientation=vertical]) ::slotted(sd-4-0-0-next-8-radio){display:flex;margin-bottom:var(--sd-spacing-2,.5rem)}:host([orientation=vertical]) ::slotted(sd-4-0-0-next-8-radio:last-of-type){margin-bottom:var(--sd-spacing-0,0)}:host([orientation=horizontal]) ::slotted(sd-4-0-0-next-8-radio){margin-right:var(--sd-spacing-6,1.5rem)}:host([orientation=horizontal]) ::slotted(sd-4-0-0-next-8-radio:last-of-type){margin-right:var(--sd-spacing-0,0)}:host([orientation=horizontal]):host([size=sm]) ::slotted(sd-4-0-0-next-8-radio){margin-right:var(--sd-spacing-4,1rem)}:host([orientation=horizontal]):host([size=sm]) ::slotted(sd-4-0-0-next-8-radio:last-of-type){margin-right:var(--sd-spacing-0,0)}:host([required]) #label:after{content:" *"}`
271
+ css`:host{display:block}:host([orientation=vertical]) ::slotted(sd-4-0-0-next-9-radio){display:flex;margin-bottom:var(--sd-spacing-2,.5rem)}:host([orientation=vertical]) ::slotted(sd-4-0-0-next-9-radio:last-of-type){margin-bottom:var(--sd-spacing-0,0)}:host([orientation=horizontal]) ::slotted(sd-4-0-0-next-9-radio){margin-right:var(--sd-spacing-6,1.5rem)}:host([orientation=horizontal]) ::slotted(sd-4-0-0-next-9-radio:last-of-type){margin-right:var(--sd-spacing-0,0)}:host([orientation=horizontal]):host([size=sm]) ::slotted(sd-4-0-0-next-9-radio){margin-right:var(--sd-spacing-4,1rem)}:host([orientation=horizontal]):host([size=sm]) ::slotted(sd-4-0-0-next-9-radio:last-of-type){margin-right:var(--sd-spacing-0,0)}:host([required]) #label:after{content:" *"}`
272
272
  ];
273
273
  __decorateClass([
274
274
  query("slot:not([name])")
@@ -322,7 +322,7 @@ __decorateClass([
322
322
  watch("value")
323
323
  ], SdRadioGroup.prototype, "handleValueChange", 1);
324
324
  SdRadioGroup = __decorateClass([
325
- customElement("sd-4-0-0-next-8-radio-group")
325
+ customElement("sd-4-0-0-next-9-radio-group")
326
326
  ], SdRadioGroup);
327
327
 
328
328
  export {
@@ -112,16 +112,16 @@ var SdNavigationItem = class extends SolidElement {
112
112
  isAccordion ? "grow" : "w-full",
113
113
  slots["description"] || this.separated ? "pb-1" : horizontalPaddingBottom,
114
114
  this.calculatePaddingX
115
- )}">${this.divider && this.vertical ? html`<sd-4-0-0-next-8-divider part="divider" class="${cx("w-full transition-all absolute -top-0.25 left-0", this.calculatePaddingX)}"></sd-4-0-0-next-8-divider>` : ""} <span part="content-container" class="inline-flex items-center flex-auto">${this.separated ? html`<a class="${cx(
115
+ )}">${this.divider && this.vertical ? html`<sd-4-0-0-next-9-divider part="divider" class="${cx("w-full transition-all absolute -top-0.25 left-0", this.calculatePaddingX)}"></sd-4-0-0-next-9-divider>` : ""} <span part="content-container" class="inline-flex items-center flex-auto">${this.separated ? html`<a class="${cx(
116
116
  "mr-4 w-full inline-flex items-center pl-4 cursor-pointer relative focus-visible:focus-outline hover:bg-neutral-200 group transition-all min-h-[48px]",
117
117
  !slots["description"] && "py-4"
118
- )}" href="${ifDefined(isLink ? this.href : void 0)}" target="${ifDefined(isLink ? this.target : void 0)}" download="${ifDefined(isLink ? this.download : void 0)}"><slot part="content" class="inline"></slot></a>` : html`<slot part="content" class="inline"></slot>`} </span>${(this.chevron || slots["children"]) && this.vertical ? this.separated ? html`<button type="button" title="toggle-details" class="sd-interactive sd-interactive--reset" @click="${this.handleClickSummary}"><sd-4-0-0-next-8-icon name="chevron-down" part="chevron" library="system" color="currentColor" class="${cx(
118
+ )}" href="${ifDefined(isLink ? this.href : void 0)}" target="${ifDefined(isLink ? this.target : void 0)}" download="${ifDefined(isLink ? this.download : void 0)}"><slot part="content" class="inline"></slot></a>` : html`<slot part="content" class="inline"></slot>`} </span>${(this.chevron || slots["children"]) && this.vertical ? this.separated ? html`<button type="button" title="toggle-details" class="sd-interactive sd-interactive--reset" @click="${this.handleClickSummary}"><sd-4-0-0-next-9-icon name="chevron-down" part="chevron" library="system" color="currentColor" class="${cx(
119
119
  "mr-4 h-6 w-6 transition-all",
120
120
  isAccordion || this.separated ? this.open ? "rotate-180" : "rotate-0" : "rotate-[270deg]"
121
- )}"></sd-4-0-0-next-8-icon></button>` : html`<sd-4-0-0-next-8-icon name="chevron-down" part="chevron" library="system" color="currentColor" class="${cx(
121
+ )}"></sd-4-0-0-next-9-icon></button>` : html`<sd-4-0-0-next-9-icon name="chevron-down" part="chevron" library="system" color="currentColor" class="${cx(
122
122
  "h-6 w-6 ml-2 transition-all",
123
123
  isAccordion ? this.open ? "rotate-180" : "rotate-0" : "rotate-[270deg]"
124
- )}"></sd-4-0-0-next-8-icon>` : ""} </span>${slots["description"] && this.vertical ? html`<slot name="description" part="description" class="${cx(
124
+ )}"></sd-4-0-0-next-9-icon>` : ""} </span>${slots["description"] && this.vertical ? html`<slot name="description" part="description" class="${cx(
125
125
  "inline-block text-sm text-left text-black",
126
126
  isAccordion || this.separated ? "grow" : "w-full",
127
127
  this.separated ? "px-4" : this.calculatePaddingX,
@@ -186,7 +186,7 @@ __decorateClass([
186
186
  property({ type: Boolean, reflect: true })
187
187
  ], SdNavigationItem.prototype, "separated", 2);
188
188
  SdNavigationItem = __decorateClass([
189
- customElement("sd-4-0-0-next-8-navigation-item")
189
+ customElement("sd-4-0-0-next-9-navigation-item")
190
190
  ], SdNavigationItem);
191
191
 
192
192
  export {
@@ -41,7 +41,7 @@ __decorateClass([
41
41
  property({ reflect: true })
42
42
  ], SdSpinner.prototype, "color", 2);
43
43
  SdSpinner = __decorateClass([
44
- customElement("sd-4-0-0-next-8-spinner")
44
+ customElement("sd-4-0-0-next-9-spinner")
45
45
  ], SdSpinner);
46
46
 
47
47
  export {
@@ -131,12 +131,12 @@ var SdScrollable = class extends SolidElement {
131
131
  this.orientation === "auto" && "scroll-auto overflow-auto",
132
132
  this.scrollbars ? "show-scrollbars" : "hide-scrollbars",
133
133
  this.inset ? "p-4" : ""
134
- )}" @scroll="${this.updateScrollIndicatorVisibility}" tabindex="0"><div part="scroll-content" class="flex-1"><slot></slot></div></div>${this.buttons ? html`${this.isScrollHorizontalEnabled ? html`${this.canScroll.left ? html`<div part="button-left" class="absolute z-10 flex items-center justify-center top-0 left-0 h-full w-8"><button part="button-start" class="${cx(scrollButtonClasses)}" @click="${(e) => this.handleScroll("left", e)}"><slot name="icon-start"><sd-4-0-0-next-8-icon library="system" name="chevron-up" class="rotate-[-90deg]" label="${this.localize.term("scrollToStart")}"></sd-4-0-0-next-8-icon></slot></button></div>` : null} ${this.canScroll.right ? html`<div part="button-right" class="absolute z-10 flex items-center justify-center top-0 right-0 h-full w-8"><button part="button-end" class="${cx(scrollButtonClasses)}" @click="${(e) => this.handleScroll("right", e)}"><slot name="icon-end"><sd-4-0-0-next-8-icon library="system" name="chevron-down" class="rotate-[-90deg]" label="${this.localize.term("scrollToEnd")}"></sd-4-0-0-next-8-icon></slot></button></div>` : null}` : null} ${this.isScrollVerticalEnabled ? html`${this.canScroll.up ? html`<div part="button-top" class="absolute z-10 flex items-center justify-center top-0 left-0 w-full h-8"><button part="button-start" class="${cx(scrollButtonClasses)}" @click="${(e) => this.handleScroll("up", e)}"><slot name="icon-start"><sd-4-0-0-next-8-icon library="system" name="chevron-up" label="${this.localize.term("scrollToStart")}"></sd-4-0-0-next-8-icon></slot></button></div>` : null} ${this.canScroll.down ? html`<div part="button-bottom" class="absolute z-10 flex items-center justify-center bottom-0 left-0 w-full h-8"><button part="button-end" class="${cx(scrollButtonClasses)}" @click="${(e) => this.handleScroll("down", e)}"><slot name="icon-end"><sd-4-0-0-next-8-icon library="system" name="chevron-down" label="${this.localize.term("scrollToEnd")}"></sd-4-0-0-next-8-icon></slot></button></div>` : null}` : null}` : null} ${this.shadows ? html`${this.isScrollHorizontalEnabled ? html`${this.canScroll.left ? html`<div part="shadow-left" class="${scrollShadowClasses} left top-0 left-0 w-[6px] h-full"></div>` : null} ${this.canScroll.right ? html`<div part="shadow-right" class="${scrollShadowClasses} right top-0 right-0 w-[6px] h-full"></div>` : null}` : null} ${this.isScrollVerticalEnabled ? html`${this.canScroll.up ? html`<div part="shadow-top" class="${scrollShadowClasses} top top-0 left-0 w-full h-[6px]"></div>` : null} ${this.canScroll.down ? html`<div part="shadow-bottom" class="${scrollShadowClasses} bottom bottom-0 left-0 w-full h-[6px]"></div>` : null}` : null}` : null}`;
134
+ )}" @scroll="${this.updateScrollIndicatorVisibility}" tabindex="0"><div part="scroll-content" class="flex-1"><slot></slot></div></div>${this.buttons ? html`${this.isScrollHorizontalEnabled ? html`${this.canScroll.left ? html`<div part="button-left" class="absolute z-10 flex items-center justify-center top-0 left-0 h-full w-8"><button part="button-start" class="${cx(scrollButtonClasses)}" @click="${(e) => this.handleScroll("left", e)}"><slot name="icon-start"><sd-4-0-0-next-9-icon library="system" name="chevron-up" class="rotate-[-90deg]" label="${this.localize.term("scrollToStart")}"></sd-4-0-0-next-9-icon></slot></button></div>` : null} ${this.canScroll.right ? html`<div part="button-right" class="absolute z-10 flex items-center justify-center top-0 right-0 h-full w-8"><button part="button-end" class="${cx(scrollButtonClasses)}" @click="${(e) => this.handleScroll("right", e)}"><slot name="icon-end"><sd-4-0-0-next-9-icon library="system" name="chevron-down" class="rotate-[-90deg]" label="${this.localize.term("scrollToEnd")}"></sd-4-0-0-next-9-icon></slot></button></div>` : null}` : null} ${this.isScrollVerticalEnabled ? html`${this.canScroll.up ? html`<div part="button-top" class="absolute z-10 flex items-center justify-center top-0 left-0 w-full h-8"><button part="button-start" class="${cx(scrollButtonClasses)}" @click="${(e) => this.handleScroll("up", e)}"><slot name="icon-start"><sd-4-0-0-next-9-icon library="system" name="chevron-up" label="${this.localize.term("scrollToStart")}"></sd-4-0-0-next-9-icon></slot></button></div>` : null} ${this.canScroll.down ? html`<div part="button-bottom" class="absolute z-10 flex items-center justify-center bottom-0 left-0 w-full h-8"><button part="button-end" class="${cx(scrollButtonClasses)}" @click="${(e) => this.handleScroll("down", e)}"><slot name="icon-end"><sd-4-0-0-next-9-icon library="system" name="chevron-down" label="${this.localize.term("scrollToEnd")}"></sd-4-0-0-next-9-icon></slot></button></div>` : null}` : null}` : null} ${this.shadows ? html`${this.isScrollHorizontalEnabled ? html`${this.canScroll.left ? html`<div part="shadow-left" class="${scrollShadowClasses} left top-0 left-0 w-[6px] h-full"></div>` : null} ${this.canScroll.right ? html`<div part="shadow-right" class="${scrollShadowClasses} right top-0 right-0 w-[6px] h-full"></div>` : null}` : null} ${this.isScrollVerticalEnabled ? html`${this.canScroll.up ? html`<div part="shadow-top" class="${scrollShadowClasses} top top-0 left-0 w-full h-[6px]"></div>` : null} ${this.canScroll.down ? html`<div part="shadow-bottom" class="${scrollShadowClasses} bottom bottom-0 left-0 w-full h-[6px]"></div>` : null}` : null}` : null}`;
135
135
  }
136
136
  };
137
137
  SdScrollable.styles = [
138
138
  ...SolidElement.styles,
139
- css`:host{--gradient-color:hsla(0,0%,100%,0);--gradient:var(--gradient-color) 0%,#fff 80%,#fff 100%;display:flex;overflow:hidden;position:relative}.hide-scrollbars{scrollbar-width:none;-ms-overflow-style:none}.hide-scrollbars::-webkit-scrollbar{display:none}.scroll-container::-webkit-scrollbar-thumb{background-color:transparent}.scroll-container:hover::-webkit-scrollbar-thumb{background:var(--background-neutral-400,#c3c3c3);border-radius:var(--sd-border-radius-sm,.125rem)}.scroll-container::-webkit-scrollbar{height:var(--sd-spacing-1,.25rem);width:var(--sd-spacing-1,.25rem)}.scroll-auto{overflow:auto}[part=button-left]{background:linear-gradient(270deg,var(--gradient))}[part=button-right]{background:linear-gradient(90deg,var(--gradient))}[part=button-top]{background:linear-gradient(0deg,var(--gradient))}[part=button-bottom]{background:linear-gradient(180deg,var(--gradient))}[part=shadow-left]{background:linear-gradient(270deg,hsla(0,0%,9%,0) 50%,hsla(0,0%,9%,.4))}[part=shadow-right]{background:linear-gradient(90deg,hsla(0,0%,9%,0) 50%,hsla(0,0%,9%,.4))}[part=shadow-top]{background:linear-gradient(0deg,hsla(0,0%,9%,0) 50%,hsla(0,0%,9%,.4))}[part=shadow-bottom]{background:linear-gradient(180deg,hsla(0,0%,9%,0) 50%,hsla(0,0%,9%,.4))}.sd-4-0-0-next-8-icon--top{align-self:flex-start}.sd-4-0-0-next-8-icon--down{align-self:flex-end}`
139
+ css`:host{--gradient-color:hsla(0,0%,100%,0);--gradient:var(--gradient-color) 0%,#fff 80%,#fff 100%;display:flex;overflow:hidden;position:relative}.hide-scrollbars{scrollbar-width:none;-ms-overflow-style:none}.hide-scrollbars::-webkit-scrollbar{display:none}.scroll-container::-webkit-scrollbar-thumb{background-color:transparent}.scroll-container:hover::-webkit-scrollbar-thumb{background:var(--background-neutral-400,#c3c3c3);border-radius:var(--sd-border-radius-sm,.125rem)}.scroll-container::-webkit-scrollbar{height:var(--sd-spacing-1,.25rem);width:var(--sd-spacing-1,.25rem)}.scroll-auto{overflow:auto}[part=button-left]{background:linear-gradient(270deg,var(--gradient))}[part=button-right]{background:linear-gradient(90deg,var(--gradient))}[part=button-top]{background:linear-gradient(0deg,var(--gradient))}[part=button-bottom]{background:linear-gradient(180deg,var(--gradient))}[part=shadow-left]{background:linear-gradient(270deg,hsla(0,0%,9%,0) 50%,hsla(0,0%,9%,.4))}[part=shadow-right]{background:linear-gradient(90deg,hsla(0,0%,9%,0) 50%,hsla(0,0%,9%,.4))}[part=shadow-top]{background:linear-gradient(0deg,hsla(0,0%,9%,0) 50%,hsla(0,0%,9%,.4))}[part=shadow-bottom]{background:linear-gradient(180deg,hsla(0,0%,9%,0) 50%,hsla(0,0%,9%,.4))}.sd-4-0-0-next-9-icon--top{align-self:flex-start}.sd-4-0-0-next-9-icon--down{align-self:flex-end}`
140
140
  ];
141
141
  __decorateClass([
142
142
  property({ type: String, reflect: true })
@@ -169,7 +169,7 @@ __decorateClass([
169
169
  state()
170
170
  ], SdScrollable.prototype, "isKeyboardNavigation", 2);
171
171
  SdScrollable = __decorateClass([
172
- customElement("sd-4-0-0-next-8-scrollable")
172
+ customElement("sd-4-0-0-next-9-scrollable")
173
173
  ], SdScrollable);
174
174
 
175
175
  export {
@@ -24,11 +24,11 @@ var SdOptgroup = class extends SolidElement {
24
24
  this.label = "";
25
25
  }
26
26
  /**
27
- * Syncs the disabled prop for all slotted sd-4-0-0-next-8-options when it is triggered
27
+ * Syncs the disabled prop for all slotted sd-4-0-0-next-9-options when it is triggered
28
28
  */
29
29
  handleDisableOptions() {
30
30
  const { disabled } = this;
31
- this.defaultSlot.assignedElements().filter((opt) => opt.tagName.toLowerCase() === "sd-4-0-0-next-8-option").forEach((opt) => {
31
+ this.defaultSlot.assignedElements().filter((opt) => opt.tagName.toLowerCase() === "sd-4-0-0-next-9-option").forEach((opt) => {
32
32
  opt.disabled = disabled;
33
33
  });
34
34
  }
@@ -37,11 +37,11 @@ var SdOptgroup = class extends SolidElement {
37
37
  }
38
38
  render() {
39
39
  const { disabled } = this;
40
- return html`<div role="${disabled ? "presentation" : "group"}" class="${cx(this.disabled ? "text-neutral-500" : "")}" part="base" aria-labelledby="group-label"><sd-4-0-0-next-8-divider id="divider" class="pt-2 pb-4" part="divider"></sd-4-0-0-next-8-divider><div part="label-container" class="${cx(this.disabled ? "text-neutral-500" : "text-black")} px-4 font-bold text-left" role="presentation" id="group-label"><slot name="label"><span>${this.label}</span></slot></div><div role="group" part="options"><slot @slotchange="${this.handleDisableOptions}"></slot></div></div>`;
40
+ return html`<div role="${disabled ? "presentation" : "group"}" class="${cx(this.disabled ? "text-neutral-500" : "")}" part="base" aria-labelledby="group-label"><sd-4-0-0-next-9-divider id="divider" class="pt-2 pb-4" part="divider"></sd-4-0-0-next-9-divider><div part="label-container" class="${cx(this.disabled ? "text-neutral-500" : "text-black")} px-4 font-bold text-left" role="presentation" id="group-label"><slot name="label"><span>${this.label}</span></slot></div><div role="group" part="options"><slot @slotchange="${this.handleDisableOptions}"></slot></div></div>`;
41
41
  }
42
42
  };
43
43
  SdOptgroup.dependencies = {
44
- "sd-4-0-0-next-8-divider": SdDivider
44
+ "sd-4-0-0-next-9-divider": SdDivider
45
45
  };
46
46
  SdOptgroup.styles = [
47
47
  ...SolidElement.styles,
@@ -60,7 +60,7 @@ __decorateClass([
60
60
  watch("disabled", { waitUntilFirstUpdate: true })
61
61
  ], SdOptgroup.prototype, "handleDisabledChange", 1);
62
62
  SdOptgroup = __decorateClass([
63
- customElement("sd-4-0-0-next-8-optgroup")
63
+ customElement("sd-4-0-0-next-9-optgroup")
64
64
  ], SdOptgroup);
65
65
 
66
66
  export {
@@ -137,7 +137,7 @@ __decorateClass([
137
137
  state()
138
138
  ], SdBrandshape.prototype, "componentBreakpoint", 2);
139
139
  SdBrandshape = __decorateClass([
140
- customElement("sd-4-0-0-next-8-brandshape")
140
+ customElement("sd-4-0-0-next-9-brandshape")
141
141
  ], SdBrandshape);
142
142
 
143
143
  export {
@@ -111,7 +111,7 @@ var SdCheckbox = class extends SolidElement {
111
111
  render() {
112
112
  const checkboxState = this.disabled && this.indeterminate ? "disabledIndeterminate" : this.disabled && this.checked ? "disabledChecked" : this.disabled ? "disabled" : this.showInvalidStyle && this.indeterminate ? "invalidIndeterminate" : this.showInvalidStyle ? "invalid" : this.checked || this.indeterminate ? "filled" : "default";
113
113
  return html`<label part="base" class="${cx(
114
- "sd-4-0-0-next-8-checkbox group flex items-start text-base leading-normal text-black cursor-pointer",
114
+ "sd-4-0-0-next-9-checkbox group flex items-start text-base leading-normal text-black cursor-pointer",
115
115
  this.disabled && "hover:cursor-not-allowed",
116
116
  {
117
117
  /* sizes, fonts */
@@ -137,7 +137,7 @@ var SdCheckbox = class extends SolidElement {
137
137
  filled: "border-accent hover:border-accent-550 group-hover:border-accent-550 bg-accent group-hover:bg-accent-550",
138
138
  default: "border-neutral-800 hover:bg-neutral-200 group-hover:bg-neutral-200 bg-white"
139
139
  }[checkboxState]
140
- )}">${this.checked ? html`<sd-4-0-0-next-8-icon part="checked-icon" class="text-white w-3 h-3" library="system" name="status-check"></sd-4-0-0-next-8-icon>` : ""} ${!this.checked && this.indeterminate ? html`<sd-4-0-0-next-8-icon part="indeterminate-icon" class="text-white w-3 h-3" library="system" name="status-minus"></sd-4-0-0-next-8-icon>` : ""} </span><span part="label" id="label" class="${cx(
140
+ )}">${this.checked ? html`<sd-4-0-0-next-9-icon part="checked-icon" class="text-white w-3 h-3" library="system" name="status-check"></sd-4-0-0-next-9-icon>` : ""} ${!this.checked && this.indeterminate ? html`<sd-4-0-0-next-9-icon part="indeterminate-icon" class="text-white w-3 h-3" library="system" name="status-minus"></sd-4-0-0-next-9-icon>` : ""} </span><span part="label" id="label" class="${cx(
141
141
  "select-none inline-block ml-2",
142
142
  this.disabled ? "text-neutral-500" : this.showInvalidStyle ? "text-error" : "text-black"
143
143
  )}"><slot></slot></span></label> ${this.formControlController.renderInvalidMessage()}`;
@@ -196,7 +196,7 @@ __decorateClass([
196
196
  watch(["checked", "indeterminate"], { waitUntilFirstUpdate: true })
197
197
  ], SdCheckbox.prototype, "handleStateChange", 1);
198
198
  SdCheckbox = __decorateClass([
199
- customElement("sd-4-0-0-next-8-checkbox")
199
+ customElement("sd-4-0-0-next-9-checkbox")
200
200
  ], SdCheckbox);
201
201
 
202
202
  export {
@@ -41,16 +41,16 @@ var SdAccordionGroup = class extends SolidElement {
41
41
  };
42
42
  SdAccordionGroup.styles = [
43
43
  ...SolidElement.styles,
44
- css`:host{display:block}::slotted(sd-4-0-0-next-8-accordion:not(:first-of-type)){margin-top:-1px}`
44
+ css`:host{display:block}::slotted(sd-4-0-0-next-9-accordion:not(:first-of-type)){margin-top:-1px}`
45
45
  ];
46
46
  __decorateClass([
47
- queryAssignedElements({ selector: "sd-4-0-0-next-8-accordion" })
47
+ queryAssignedElements({ selector: "sd-4-0-0-next-9-accordion" })
48
48
  ], SdAccordionGroup.prototype, "_accordionsInDefaultSlot", 2);
49
49
  __decorateClass([
50
50
  property({ attribute: "close-others", type: Boolean })
51
51
  ], SdAccordionGroup.prototype, "closeOthers", 2);
52
52
  SdAccordionGroup = __decorateClass([
53
- customElement("sd-4-0-0-next-8-accordion-group")
53
+ customElement("sd-4-0-0-next-9-accordion-group")
54
54
  ], SdAccordionGroup);
55
55
 
56
56
  export {
@@ -71,7 +71,7 @@ var SdExpandable = class extends SolidElement {
71
71
  "sd-interactive sd-interactive--reset !h-full !justify-center !w-full !text-base !flex !items-center !underline !underline-offset-2 !toggle",
72
72
  this.inverted && "sd-interactive--inverted",
73
73
  !this.inverted ? "!focus-visible:focus-outline" : "!focus-visible:focus-outline-inverted"
74
- )}" @click="${this.onToggleClick}">${this.open ? html`<slot name="toggle-open"><sd-4-0-0-next-8-icon class="mr-2 text-xl" library="system" name="chevron-up"></sd-4-0-0-next-8-icon>${this.localize.term("showLess")}</slot>` : html`<slot name="toggle-closed"><sd-4-0-0-next-8-icon class="mr-2 text-xl" library="system" name="chevron-down"></sd-4-0-0-next-8-icon>${this.localize.term("showMore")}</slot>`}</button>`;
74
+ )}" @click="${this.onToggleClick}">${this.open ? html`<slot name="toggle-open"><sd-4-0-0-next-9-icon class="mr-2 text-xl" library="system" name="chevron-up"></sd-4-0-0-next-9-icon>${this.localize.term("showLess")}</slot>` : html`<slot name="toggle-closed"><sd-4-0-0-next-9-icon class="mr-2 text-xl" library="system" name="chevron-down"></sd-4-0-0-next-9-icon>${this.localize.term("showMore")}</slot>`}</button>`;
75
75
  }
76
76
  firstUpdated() {
77
77
  this.cloneContentToLightDOM();
@@ -108,7 +108,7 @@ __decorateClass([
108
108
  watch("open", { waitUntilFirstUpdate: true })
109
109
  ], SdExpandable.prototype, "onOpenChange", 1);
110
110
  SdExpandable = __decorateClass([
111
- customElement("sd-4-0-0-next-8-expandable")
111
+ customElement("sd-4-0-0-next-9-expandable")
112
112
  ], SdExpandable);
113
113
 
114
114
  export {
@@ -70,7 +70,7 @@ var SdRadio = class extends SolidElement {
70
70
  }
71
71
  render() {
72
72
  return html`<span part="base" class="${cx(
73
- "sd-4-0-0-next-8-radio group inline-flex items-start items-center text-base leading-normal text-black cursor-pointer align-middle",
73
+ "sd-4-0-0-next-9-radio group inline-flex items-start items-center text-base leading-normal text-black cursor-pointer align-middle",
74
74
  this.disabled && "hover:cursor-not-allowed",
75
75
  {
76
76
  /* sizes, fonts */
@@ -122,7 +122,7 @@ __decorateClass([
122
122
  watch("disabled", { waitUntilFirstUpdate: true })
123
123
  ], SdRadio.prototype, "handleDisabledChange", 1);
124
124
  SdRadio = __decorateClass([
125
- customElement("sd-4-0-0-next-8-radio")
125
+ customElement("sd-4-0-0-next-9-radio")
126
126
  ], SdRadio);
127
127
 
128
128
  export {
@@ -85,7 +85,7 @@ var SdFlipcard = class extends SolidElement {
85
85
  "gradient-light": this.placement === "top" ? "bg-gradient-to-b from-white/60 to-40% mb-auto" : "bg-gradient-to-t from-white/60 to-40% mt-auto",
86
86
  "gradient-dark": this.placement === "bottom" ? "bg-gradient-to-t from-primary-800/60 to-40% mt-auto" : "bg-gradient-to-b from-primary-800/60 to-40% mb-auto"
87
87
  }[this.frontVariant]
88
- )}"></div><sd-4-0-0-next-8-button part="front-button" size="md" variant="${{
88
+ )}"></div><sd-4-0-0-next-9-button part="front-button" size="md" variant="${{
89
89
  primary: "tertiary",
90
90
  "primary-100": "tertiary",
91
91
  "gradient-light": "primary",
@@ -95,7 +95,7 @@ var SdFlipcard = class extends SolidElement {
95
95
  "primary-100": false,
96
96
  "gradient-light": true,
97
97
  "gradient-dark": true
98
- }[this.frontVariant]}" class="${cx("absolute right-0 p-2 flex-shrink-0", this.placement === "top" ? "bottom-0" : "top-0")}" @click="${this.flipFront}" @keydown="${this.handleFrontKeydown}"><sd-4-0-0-next-8-icon library="system" name="reload" label="Flip to Back"></sd-4-0-0-next-8-icon></sd-4-0-0-next-8-button></div><div part="back" tabindex="0" aria-hidden="${this.activeSide === "front"}" inert="${ifDefined(this.activeSide === "front" || void 0)}" class="${cx(
98
+ }[this.frontVariant]}" class="${cx("absolute right-0 p-2 flex-shrink-0", this.placement === "top" ? "bottom-0" : "top-0")}" @click="${this.flipFront}" @keydown="${this.handleFrontKeydown}"><sd-4-0-0-next-9-icon library="system" name="reload" label="Flip to Back"></sd-4-0-0-next-9-icon></sd-4-0-0-next-9-button></div><div part="back" tabindex="0" aria-hidden="${this.activeSide === "front"}" inert="${ifDefined(this.activeSide === "front" || void 0)}" class="${cx(
99
99
  "flip-card__side flip-card__side--back overflow-hidden transition-transform duration-1000 ease-in-out",
100
100
  "flex focus-visible:focus-outline",
101
101
  "absolute top-0 left-0 w-full h-full justify-end text-left",
@@ -128,7 +128,7 @@ var SdFlipcard = class extends SolidElement {
128
128
  "gradient-light": this.placement === "top" ? "bg-gradient-to-b from-white/60 to-40% mb-auto" : "bg-gradient-to-t from-white/60 to-40% mt-auto",
129
129
  "gradient-dark": this.placement === "bottom" ? "bg-gradient-to-t from-primary-800/60 to-40% mt-auto" : "bg-gradient-to-b from-primary-800/60 to-40% mb-auto"
130
130
  }[this.backVariant]
131
- )}"></div><sd-4-0-0-next-8-button size="md" part="back-button" variant="${{
131
+ )}"></div><sd-4-0-0-next-9-button size="md" part="back-button" variant="${{
132
132
  primary: "tertiary",
133
133
  "primary-100": "tertiary",
134
134
  "gradient-light": "primary",
@@ -138,7 +138,7 @@ var SdFlipcard = class extends SolidElement {
138
138
  "primary-100": false,
139
139
  "gradient-light": true,
140
140
  "gradient-dark": true
141
- }[this.backVariant]}" class="${cx("absolute right-0 p-2 flex-shrink-0", this.placement === "top" ? "bottom-0" : "top-0")}" @click="${this.flipBack}" @keydown="${this.handleBackKeydown}"><sd-4-0-0-next-8-icon library="system" name="reload" label="Flip to Front"></sd-4-0-0-next-8-icon></sd-4-0-0-next-8-button></div></div>`;
141
+ }[this.backVariant]}" class="${cx("absolute right-0 p-2 flex-shrink-0", this.placement === "top" ? "bottom-0" : "top-0")}" @click="${this.flipBack}" @keydown="${this.handleBackKeydown}"><sd-4-0-0-next-9-icon library="system" name="reload" label="Flip to Front"></sd-4-0-0-next-9-icon></sd-4-0-0-next-9-button></div></div>`;
142
142
  }
143
143
  };
144
144
  /**
@@ -170,7 +170,7 @@ __decorateClass([
170
170
  state()
171
171
  ], SdFlipcard.prototype, "activeSide", 2);
172
172
  SdFlipcard = __decorateClass([
173
- customElement("sd-4-0-0-next-8-flipcard")
173
+ customElement("sd-4-0-0-next-9-flipcard")
174
174
  ], SdFlipcard);
175
175
 
176
176
  export {
@@ -15,7 +15,7 @@ var FormControlController = class {
15
15
  const disabled = this.options.disabled(this.host);
16
16
  const name = this.options.name(this.host);
17
17
  const value = this.options.value(this.host);
18
- const isButton = this.host.tagName.toLowerCase() === "sd-4-0-0-next-8-button";
18
+ const isButton = this.host.tagName.toLowerCase() === "sd-4-0-0-next-9-button";
19
19
  if (!disabled && !isButton && typeof name === "string" && name.length > 0 && typeof value !== "undefined") {
20
20
  if (Array.isArray(value)) {
21
21
  value.forEach((val) => {
@@ -40,7 +40,7 @@ var FormControlController = class {
40
40
  event.stopImmediatePropagation();
41
41
  const invalidElements = (_b = this.form) == null ? void 0 : _b.querySelectorAll("[data-invalid]");
42
42
  const sdRadioGroups = Array.from(invalidElements).filter(
43
- (element) => element.tagName.toLowerCase() === "sd-4-0-0-next-8-radio-group"
43
+ (element) => element.tagName.toLowerCase() === "sd-4-0-0-next-9-radio-group"
44
44
  );
45
45
  sdRadioGroups.forEach((radioGroup) => {
46
46
  var _a2, _b2;
@@ -88,7 +88,7 @@ var FormControlController = class {
88
88
  },
89
89
  reportValidity: (input) => typeof input.reportValidity === "function" ? input.reportValidity() : true,
90
90
  setValue: (input, value) => input.value = value,
91
- assumeInteractionOn: ["sd-4-0-0-next-8-input"]
91
+ assumeInteractionOn: ["sd-4-0-0-next-9-input"]
92
92
  }, options);
93
93
  }
94
94
  hostConnected() {
@@ -82,7 +82,7 @@ var SdRadioButton = class extends SolidElement {
82
82
  };
83
83
  SdRadioButton.styles = [
84
84
  ...SolidElement.styles,
85
- css`:host{display:block;width:-moz-min-content;width:min-content}.hidden-input{all:unset;inset:var(--sd-spacing-0,0);opacity:var(--sd-opacity-0,0);outline-color:rgb(var(--sd-color-error,204 25 55)/1);outline-style:dotted;outline-width:1px;position:absolute;z-index:-10}.lg-label,.lg-no-label{height:var(--sd-spacing-12,3rem)}.lg-no-label{width:var(--sd-spacing-12,3rem)}.md-label,.md-no-label{height:var(--sd-spacing-10,2.5rem)}.md-no-label{width:var(--sd-spacing-10,2.5rem)}.sm-label,.sm-no-label{height:var(--sd-spacing-8,2rem)}.sm-no-label{width:var(--sd-spacing-8,2rem)}:host(.sd-4-0-0-next-8-button-group__button--first:not(.sd-4-0-0-next-8-button-group__button--last)) button{border-bottom-right-radius:var(--sd-border-radius-none,0);border-top-right-radius:var(--sd-border-radius-none,0)}:host(.sd-4-0-0-next-8-button-group__button--inner) button{border-radius:var(--sd-border-radius-none,0)}:host(.sd-4-0-0-next-8-button-group__button--last:not(.sd-4-0-0-next-8-button-group__button--first)) button{border-bottom-left-radius:var(--sd-border-radius-none,0);border-top-left-radius:var(--sd-border-radius-none,0)}:host(.sd-4-0-0-next-8-button-group__button:not(.sd-4-0-0-next-8-button-group__button--first)){margin-inline-start:-1px}:host(.sd-4-0-0-next-8-button-group__button--hover){z-index:10}:host(.sd-4-0-0-next-8-button-group__button--focus),:host(.sd-4-0-0-next-8-button-group__button[checked]){z-index:20}`
85
+ css`:host{display:block;width:-moz-min-content;width:min-content}.hidden-input{all:unset;inset:var(--sd-spacing-0,0);opacity:var(--sd-opacity-0,0);outline-color:rgb(var(--sd-color-error,204 25 55)/1);outline-style:dotted;outline-width:1px;position:absolute;z-index:-10}.lg-label,.lg-no-label{height:var(--sd-spacing-12,3rem)}.lg-no-label{width:var(--sd-spacing-12,3rem)}.md-label,.md-no-label{height:var(--sd-spacing-10,2.5rem)}.md-no-label{width:var(--sd-spacing-10,2.5rem)}.sm-label,.sm-no-label{height:var(--sd-spacing-8,2rem)}.sm-no-label{width:var(--sd-spacing-8,2rem)}:host(.sd-4-0-0-next-9-button-group__button--first:not(.sd-4-0-0-next-9-button-group__button--last)) button{border-bottom-right-radius:var(--sd-border-radius-none,0);border-top-right-radius:var(--sd-border-radius-none,0)}:host(.sd-4-0-0-next-9-button-group__button--inner) button{border-radius:var(--sd-border-radius-none,0)}:host(.sd-4-0-0-next-9-button-group__button--last:not(.sd-4-0-0-next-9-button-group__button--first)) button{border-bottom-left-radius:var(--sd-border-radius-none,0);border-top-left-radius:var(--sd-border-radius-none,0)}:host(.sd-4-0-0-next-9-button-group__button:not(.sd-4-0-0-next-9-button-group__button--first)){margin-inline-start:-1px}:host(.sd-4-0-0-next-9-button-group__button--hover){z-index:10}:host(.sd-4-0-0-next-9-button-group__button--focus),:host(.sd-4-0-0-next-9-button-group__button[checked]){z-index:20}`
86
86
  ];
87
87
  __decorateClass([
88
88
  query(".button")
@@ -109,7 +109,7 @@ __decorateClass([
109
109
  watch("disabled", { waitUntilFirstUpdate: true })
110
110
  ], SdRadioButton.prototype, "handleDisabledChange", 1);
111
111
  SdRadioButton = __decorateClass([
112
- customElement("sd-4-0-0-next-8-radio-button")
112
+ customElement("sd-4-0-0-next-9-radio-button")
113
113
  ], SdRadioButton);
114
114
 
115
115
  export {
@@ -71,7 +71,7 @@ var SdTag = class extends SolidElement {
71
71
  lg: "text-base",
72
72
  sm: "text-[12px]"
73
73
  }[this.size]
74
- )}"><sd-4-0-0-next-8-icon library="system" name="close" label="remove"></sd-4-0-0-next-8-icon></slot>` : ""}</${tag}>`;
74
+ )}"><sd-4-0-0-next-9-icon library="system" name="close" label="remove"></sd-4-0-0-next-9-icon></slot>` : ""}</${tag}>`;
75
75
  }
76
76
  };
77
77
  SdTag.styles = [
@@ -106,7 +106,7 @@ __decorateClass([
106
106
  property()
107
107
  ], SdTag.prototype, "download", 2);
108
108
  SdTag = __decorateClass([
109
- customElement("sd-4-0-0-next-8-tag")
109
+ customElement("sd-4-0-0-next-9-tag")
110
110
  ], SdTag);
111
111
 
112
112
  export {