@solid-design-system/components 4.0.0-next.6 → 4.0.0-next.7

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 (251) hide show
  1. package/cdn/chunks/chunk.BUUMCPDC.js +11 -0
  2. package/cdn/chunks/chunk.WHEYQDOD.js +11 -0
  3. package/cdn/components/combobox/combobox.d.ts +1 -0
  4. package/cdn/components/combobox/combobox.js +1 -1
  5. package/cdn/components/select/select.d.ts +1 -0
  6. package/cdn/components/select/select.js +1 -1
  7. package/cdn/custom-elements.json +29 -1
  8. package/cdn/solid-components.bundle.js +8 -8
  9. package/cdn/solid-components.iife.js +9 -9
  10. package/cdn/solid-components.js +1 -1
  11. package/cdn/vscode.html-custom-data.json +58 -48
  12. package/cdn/web-types.json +162 -144
  13. package/cdn-versioned/_components/menu/menu.js +1 -1
  14. package/cdn-versioned/_components/menu/menu.styles.js +1 -1
  15. package/cdn-versioned/_components/menu-item/menu-item.js +2 -2
  16. package/cdn-versioned/chunks/chunk.24SF73MY.js +1 -1
  17. package/cdn-versioned/chunks/chunk.2IZXJHH7.js +1 -1
  18. package/cdn-versioned/chunks/chunk.36Z2VDHI.js +1 -1
  19. package/cdn-versioned/chunks/chunk.3ATYVOO4.js +1 -1
  20. package/cdn-versioned/chunks/chunk.4HIKTDIM.js +3 -3
  21. package/cdn-versioned/chunks/chunk.4W3WLVGR.js +1 -1
  22. package/cdn-versioned/chunks/chunk.5FM4F3Y4.js +1 -1
  23. package/cdn-versioned/chunks/chunk.5ZDWEJDB.js +1 -1
  24. package/cdn-versioned/chunks/chunk.65NSSTJE.js +1 -1
  25. package/cdn-versioned/chunks/chunk.6JBTCFHE.js +2 -2
  26. package/cdn-versioned/chunks/chunk.7M7VCE7R.js +1 -1
  27. package/cdn-versioned/chunks/chunk.7RJ3O2FV.js +1 -1
  28. package/cdn-versioned/chunks/chunk.APMDRZQD.js +1 -1
  29. package/cdn-versioned/chunks/chunk.BUUMCPDC.js +11 -0
  30. package/cdn-versioned/chunks/chunk.C2PA7CKF.js +1 -1
  31. package/cdn-versioned/chunks/chunk.CEVVDV52.js +1 -1
  32. package/cdn-versioned/chunks/chunk.DMLGBWCL.js +1 -1
  33. package/cdn-versioned/chunks/chunk.DVHKKAVM.js +1 -1
  34. package/cdn-versioned/chunks/chunk.EWWGLHC5.js +1 -1
  35. package/cdn-versioned/chunks/chunk.F7J6HN76.js +1 -1
  36. package/cdn-versioned/chunks/chunk.FD54463O.js +1 -1
  37. package/cdn-versioned/chunks/chunk.FFNTXFC3.js +1 -1
  38. package/cdn-versioned/chunks/chunk.FX3ED655.js +1 -1
  39. package/cdn-versioned/chunks/chunk.GOVNZSCO.js +1 -1
  40. package/cdn-versioned/chunks/chunk.GQSLHWQC.js +1 -1
  41. package/cdn-versioned/chunks/chunk.ISEQUO4U.js +1 -1
  42. package/cdn-versioned/chunks/chunk.ITRQVXFY.js +1 -1
  43. package/cdn-versioned/chunks/chunk.IZKUI5WK.js +1 -1
  44. package/cdn-versioned/chunks/chunk.KMLMMBY4.js +1 -1
  45. package/cdn-versioned/chunks/chunk.LLXTYJXF.js +1 -1
  46. package/cdn-versioned/chunks/chunk.LZEFLOSA.js +1 -1
  47. package/cdn-versioned/chunks/chunk.MPP7HYX7.js +1 -1
  48. package/cdn-versioned/chunks/chunk.MX22EZXK.js +1 -1
  49. package/cdn-versioned/chunks/chunk.ND7BT52X.js +1 -1
  50. package/cdn-versioned/chunks/chunk.NUB5WHGD.js +1 -1
  51. package/cdn-versioned/chunks/chunk.O4UXOQEI.js +1 -1
  52. package/cdn-versioned/chunks/chunk.OVV7TNT2.js +1 -1
  53. package/cdn-versioned/chunks/chunk.PBPFKJKV.js +1 -1
  54. package/cdn-versioned/chunks/chunk.QFNCQQ6S.js +1 -1
  55. package/cdn-versioned/chunks/chunk.QNZWJACC.js +2 -2
  56. package/cdn-versioned/chunks/chunk.R354E6ZD.js +1 -1
  57. package/cdn-versioned/chunks/chunk.TA7CZCP3.js +1 -1
  58. package/cdn-versioned/chunks/chunk.U443X4TI.js +1 -1
  59. package/cdn-versioned/chunks/chunk.UBFU6D5B.js +1 -1
  60. package/cdn-versioned/chunks/chunk.URB2K7JQ.js +1 -1
  61. package/cdn-versioned/chunks/chunk.VNKUGTKM.js +1 -1
  62. package/cdn-versioned/chunks/chunk.W7A3TU2Z.js +1 -1
  63. package/cdn-versioned/chunks/chunk.WENTMXB2.js +1 -1
  64. package/cdn-versioned/chunks/chunk.WHEYQDOD.js +11 -0
  65. package/cdn-versioned/chunks/chunk.WQAPHFVM.js +1 -1
  66. package/cdn-versioned/chunks/chunk.YF5WEC4R.js +2 -2
  67. package/cdn-versioned/chunks/chunk.ZFA2VPUT.js +1 -1
  68. package/cdn-versioned/chunks/chunk.ZRIABVVM.js +1 -1
  69. package/cdn-versioned/components/accordion/accordion.d.ts +1 -1
  70. package/cdn-versioned/components/accordion-group/accordion-group.d.ts +1 -1
  71. package/cdn-versioned/components/animation/animation.d.ts +1 -1
  72. package/cdn-versioned/components/audio/audio.d.ts +1 -1
  73. package/cdn-versioned/components/badge/badge.d.ts +1 -1
  74. package/cdn-versioned/components/brandshape/brandshape.d.ts +1 -1
  75. package/cdn-versioned/components/button/button.d.ts +1 -1
  76. package/cdn-versioned/components/button-group/button-group.d.ts +1 -1
  77. package/cdn-versioned/components/carousel/carousel.d.ts +1 -1
  78. package/cdn-versioned/components/carousel-item/carousel-item.d.ts +1 -1
  79. package/cdn-versioned/components/checkbox/checkbox.d.ts +1 -1
  80. package/cdn-versioned/components/checkbox-group/checkbox-group.d.ts +1 -1
  81. package/cdn-versioned/components/combobox/combobox.d.ts +5 -4
  82. package/cdn-versioned/components/combobox/combobox.js +1 -1
  83. package/cdn-versioned/components/dialog/dialog.d.ts +1 -1
  84. package/cdn-versioned/components/divider/divider.d.ts +1 -1
  85. package/cdn-versioned/components/drawer/drawer.d.ts +1 -1
  86. package/cdn-versioned/components/dropdown/dropdown.d.ts +1 -1
  87. package/cdn-versioned/components/expandable/expandable.d.ts +1 -1
  88. package/cdn-versioned/components/flipcard/flipcard.d.ts +1 -1
  89. package/cdn-versioned/components/header/header.d.ts +1 -1
  90. package/cdn-versioned/components/icon/icon.d.ts +1 -1
  91. package/cdn-versioned/components/include/include.d.ts +1 -1
  92. package/cdn-versioned/components/input/input.d.ts +1 -1
  93. package/cdn-versioned/components/link/link.d.ts +1 -1
  94. package/cdn-versioned/components/map-marker/map-marker.d.ts +1 -1
  95. package/cdn-versioned/components/navigation-item/navigation-item.d.ts +1 -1
  96. package/cdn-versioned/components/notification/notification.d.ts +1 -1
  97. package/cdn-versioned/components/optgroup/optgroup.d.ts +2 -2
  98. package/cdn-versioned/components/option/option.d.ts +1 -1
  99. package/cdn-versioned/components/popup/popup.d.ts +1 -1
  100. package/cdn-versioned/components/quickfact/quickfact.d.ts +1 -1
  101. package/cdn-versioned/components/radio/radio.d.ts +1 -1
  102. package/cdn-versioned/components/radio-button/radio-button.d.ts +1 -1
  103. package/cdn-versioned/components/radio-group/radio-group.d.ts +2 -2
  104. package/cdn-versioned/components/scrollable/scrollable.d.ts +1 -1
  105. package/cdn-versioned/components/select/select.d.ts +5 -4
  106. package/cdn-versioned/components/select/select.js +1 -1
  107. package/cdn-versioned/components/spinner/spinner.d.ts +1 -1
  108. package/cdn-versioned/components/step/step.d.ts +1 -1
  109. package/cdn-versioned/components/step-group/step-group.d.ts +1 -1
  110. package/cdn-versioned/components/switch/switch.d.ts +1 -1
  111. package/cdn-versioned/components/tab/tab.d.ts +1 -1
  112. package/cdn-versioned/components/tab-group/tab-group.d.ts +1 -1
  113. package/cdn-versioned/components/tab-panel/tab-panel.d.ts +1 -1
  114. package/cdn-versioned/components/tag/tag.d.ts +1 -1
  115. package/cdn-versioned/components/textarea/textarea.d.ts +1 -1
  116. package/cdn-versioned/components/tooltip/tooltip.d.ts +1 -1
  117. package/cdn-versioned/components/video/video.d.ts +1 -1
  118. package/cdn-versioned/custom-elements.json +230 -202
  119. package/cdn-versioned/internal/form.js +3 -3
  120. package/cdn-versioned/solid-components.bundle.js +17 -17
  121. package/cdn-versioned/solid-components.css +2 -2
  122. package/cdn-versioned/solid-components.iife.js +18 -18
  123. package/cdn-versioned/solid-components.js +1 -1
  124. package/cdn-versioned/vscode.html-custom-data.json +135 -125
  125. package/cdn-versioned/web-types.json +292 -274
  126. package/dist/chunks/{chunk.I3PY3VYP.js → chunk.B44AE4VW.js} +14 -4
  127. package/dist/chunks/{chunk.EFEBQQHC.js → chunk.PPBZXQVJ.js} +28 -17
  128. package/dist/components/combobox/combobox.d.ts +1 -0
  129. package/dist/components/combobox/combobox.js +1 -1
  130. package/dist/components/select/select.d.ts +1 -0
  131. package/dist/components/select/select.js +1 -1
  132. package/dist/custom-elements.json +29 -1
  133. package/dist/solid-components.js +2 -2
  134. package/dist/vscode.html-custom-data.json +58 -48
  135. package/dist/web-types.json +162 -144
  136. package/dist-versioned/_components/menu/menu.js +1 -1
  137. package/dist-versioned/_components/menu/menu.styles.js +1 -1
  138. package/dist-versioned/_components/menu-item/menu-item.js +2 -2
  139. package/dist-versioned/chunks/chunk.2IBVAXOX.js +1 -1
  140. package/dist-versioned/chunks/chunk.3IT4HBTI.js +1 -1
  141. package/dist-versioned/chunks/chunk.3LGDUVS4.js +2 -2
  142. package/dist-versioned/chunks/chunk.4JZQQD4L.js +3 -3
  143. package/dist-versioned/chunks/chunk.4QKRGAOL.js +4 -4
  144. package/dist-versioned/chunks/chunk.4RGGPCD5.js +2 -2
  145. package/dist-versioned/chunks/chunk.65BWRJEA.js +5 -5
  146. package/dist-versioned/chunks/chunk.6CUAQSFA.js +2 -2
  147. package/dist-versioned/chunks/chunk.6DKXZWRN.js +4 -4
  148. package/dist-versioned/chunks/chunk.727ERQ4F.js +2 -2
  149. package/dist-versioned/chunks/chunk.743FPQRN.js +2 -2
  150. package/dist-versioned/chunks/chunk.76ZNNLGN.js +1 -1
  151. package/dist-versioned/chunks/chunk.7OHSCBBX.js +1 -1
  152. package/dist-versioned/chunks/{chunk.I3PY3VYP.js → chunk.B44AE4VW.js} +40 -30
  153. package/dist-versioned/chunks/chunk.BG3M5FUP.js +13 -13
  154. package/dist-versioned/chunks/chunk.BVC5FY4L.js +13 -13
  155. package/dist-versioned/chunks/chunk.BXB5WF23.js +5 -5
  156. package/dist-versioned/chunks/chunk.D6JZ4IKM.js +1 -1
  157. package/dist-versioned/chunks/chunk.DQPVSTUQ.js +3 -3
  158. package/dist-versioned/chunks/chunk.EKFRFDTB.js +5 -5
  159. package/dist-versioned/chunks/chunk.H655M7FD.js +1 -1
  160. package/dist-versioned/chunks/chunk.HPR3PWAE.js +3 -3
  161. package/dist-versioned/chunks/chunk.IN3GJ5QL.js +3 -3
  162. package/dist-versioned/chunks/chunk.J2XBUIBC.js +2 -2
  163. package/dist-versioned/chunks/chunk.J7MMF6WJ.js +2 -2
  164. package/dist-versioned/chunks/chunk.KTJRTRDJ.js +5 -5
  165. package/dist-versioned/chunks/chunk.KVKRZJS7.js +3 -3
  166. package/dist-versioned/chunks/chunk.MTSAWJLV.js +2 -2
  167. package/dist-versioned/chunks/chunk.NM6QP6RJ.js +2 -2
  168. package/dist-versioned/chunks/chunk.PDRECIYA.js +1 -1
  169. package/dist-versioned/chunks/chunk.PGZ5AWZ2.js +9 -9
  170. package/dist-versioned/chunks/chunk.PIR4YJUS.js +2 -2
  171. package/dist-versioned/chunks/{chunk.EFEBQQHC.js → chunk.PPBZXQVJ.js} +52 -41
  172. package/dist-versioned/chunks/chunk.QAZYUCBK.js +6 -6
  173. package/dist-versioned/chunks/chunk.QCICV36Z.js +6 -6
  174. package/dist-versioned/chunks/chunk.QP3SM2LZ.js +3 -3
  175. package/dist-versioned/chunks/chunk.R4BETATX.js +1 -1
  176. package/dist-versioned/chunks/chunk.RNSJAVQE.js +1 -1
  177. package/dist-versioned/chunks/chunk.RZRTIYXA.js +1 -1
  178. package/dist-versioned/chunks/chunk.SPBPHTSS.js +2 -2
  179. package/dist-versioned/chunks/chunk.SSH6ATRK.js +2 -2
  180. package/dist-versioned/chunks/chunk.TWXYFPBS.js +2 -2
  181. package/dist-versioned/chunks/chunk.U5NFPAOX.js +2 -2
  182. package/dist-versioned/chunks/chunk.U6RY25TF.js +2 -2
  183. package/dist-versioned/chunks/chunk.UC5E3AEF.js +1 -1
  184. package/dist-versioned/chunks/chunk.UDZYWRPT.js +1 -1
  185. package/dist-versioned/chunks/chunk.UIQBHPD3.js +2 -2
  186. package/dist-versioned/chunks/chunk.V7TQ6VJU.js +1 -1
  187. package/dist-versioned/chunks/chunk.VHGHICFG.js +2 -2
  188. package/dist-versioned/chunks/chunk.XVFJS7VS.js +5 -5
  189. package/dist-versioned/chunks/chunk.Z2UY62T2.js +1 -1
  190. package/dist-versioned/chunks/chunk.ZGPGFEVP.js +5 -5
  191. package/dist-versioned/chunks/chunk.ZWJI7SLE.js +11 -11
  192. package/dist-versioned/components/accordion/accordion.d.ts +1 -1
  193. package/dist-versioned/components/accordion-group/accordion-group.d.ts +1 -1
  194. package/dist-versioned/components/animation/animation.d.ts +1 -1
  195. package/dist-versioned/components/audio/audio.d.ts +1 -1
  196. package/dist-versioned/components/badge/badge.d.ts +1 -1
  197. package/dist-versioned/components/brandshape/brandshape.d.ts +1 -1
  198. package/dist-versioned/components/button/button.d.ts +1 -1
  199. package/dist-versioned/components/button-group/button-group.d.ts +1 -1
  200. package/dist-versioned/components/carousel/carousel.d.ts +1 -1
  201. package/dist-versioned/components/carousel-item/carousel-item.d.ts +1 -1
  202. package/dist-versioned/components/checkbox/checkbox.d.ts +1 -1
  203. package/dist-versioned/components/checkbox-group/checkbox-group.d.ts +1 -1
  204. package/dist-versioned/components/combobox/combobox.d.ts +5 -4
  205. package/dist-versioned/components/combobox/combobox.js +1 -1
  206. package/dist-versioned/components/dialog/dialog.d.ts +1 -1
  207. package/dist-versioned/components/divider/divider.d.ts +1 -1
  208. package/dist-versioned/components/drawer/drawer.d.ts +1 -1
  209. package/dist-versioned/components/dropdown/dropdown.d.ts +1 -1
  210. package/dist-versioned/components/expandable/expandable.d.ts +1 -1
  211. package/dist-versioned/components/flipcard/flipcard.d.ts +1 -1
  212. package/dist-versioned/components/header/header.d.ts +1 -1
  213. package/dist-versioned/components/icon/icon.d.ts +1 -1
  214. package/dist-versioned/components/include/include.d.ts +1 -1
  215. package/dist-versioned/components/input/input.d.ts +1 -1
  216. package/dist-versioned/components/link/link.d.ts +1 -1
  217. package/dist-versioned/components/map-marker/map-marker.d.ts +1 -1
  218. package/dist-versioned/components/navigation-item/navigation-item.d.ts +1 -1
  219. package/dist-versioned/components/notification/notification.d.ts +1 -1
  220. package/dist-versioned/components/optgroup/optgroup.d.ts +2 -2
  221. package/dist-versioned/components/option/option.d.ts +1 -1
  222. package/dist-versioned/components/popup/popup.d.ts +1 -1
  223. package/dist-versioned/components/quickfact/quickfact.d.ts +1 -1
  224. package/dist-versioned/components/radio/radio.d.ts +1 -1
  225. package/dist-versioned/components/radio-button/radio-button.d.ts +1 -1
  226. package/dist-versioned/components/radio-group/radio-group.d.ts +2 -2
  227. package/dist-versioned/components/scrollable/scrollable.d.ts +1 -1
  228. package/dist-versioned/components/select/select.d.ts +5 -4
  229. package/dist-versioned/components/select/select.js +1 -1
  230. package/dist-versioned/components/spinner/spinner.d.ts +1 -1
  231. package/dist-versioned/components/step/step.d.ts +1 -1
  232. package/dist-versioned/components/step-group/step-group.d.ts +1 -1
  233. package/dist-versioned/components/switch/switch.d.ts +1 -1
  234. package/dist-versioned/components/tab/tab.d.ts +1 -1
  235. package/dist-versioned/components/tab-group/tab-group.d.ts +1 -1
  236. package/dist-versioned/components/tab-panel/tab-panel.d.ts +1 -1
  237. package/dist-versioned/components/tag/tag.d.ts +1 -1
  238. package/dist-versioned/components/textarea/textarea.d.ts +1 -1
  239. package/dist-versioned/components/tooltip/tooltip.d.ts +1 -1
  240. package/dist-versioned/components/video/video.d.ts +1 -1
  241. package/dist-versioned/custom-elements.json +230 -202
  242. package/dist-versioned/internal/form.js +3 -3
  243. package/dist-versioned/solid-components.css +2 -2
  244. package/dist-versioned/solid-components.js +2 -2
  245. package/dist-versioned/vscode.html-custom-data.json +135 -125
  246. package/dist-versioned/web-types.json +292 -274
  247. package/package.json +2 -2
  248. package/cdn/chunks/chunk.DEX5VJGX.js +0 -11
  249. package/cdn/chunks/chunk.ROBLMI7Q.js +0 -11
  250. package/cdn-versioned/chunks/chunk.DEX5VJGX.js +0 -11
  251. package/cdn-versioned/chunks/chunk.ROBLMI7Q.js +0 -11
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "$schema": "https://raw.githubusercontent.com/JetBrains/web-types/master/schema/web-types.json",
3
3
  "name": "@solid-design-system/components",
4
- "version": "4.0.0-next.6",
4
+ "version": "4.0.0-next.7",
5
5
  "description-markup": "markdown",
6
6
  "contributions": {
7
7
  "html": {
@@ -1368,6 +1368,11 @@
1368
1368
  "description": "Placeholder text to show as a hint when the combobox is empty.",
1369
1369
  "value": { "type": "string" }
1370
1370
  },
1371
+ {
1372
+ "name": "max-options-tag-label",
1373
+ "description": "Label text shown on tag if max-options-visible is reached.",
1374
+ "value": { "type": "string" }
1375
+ },
1371
1376
  {
1372
1377
  "name": "disabled",
1373
1378
  "description": "Disables the combobox control.",
@@ -1581,6 +1586,10 @@
1581
1586
  "name": "placeholder",
1582
1587
  "description": "Placeholder text to show as a hint when the combobox is empty."
1583
1588
  },
1589
+ {
1590
+ "name": "maxOptionsTagLabel",
1591
+ "description": "Label text shown on tag if max-options-visible is reached."
1592
+ },
1584
1593
  {
1585
1594
  "name": "disabled",
1586
1595
  "description": "Disables the combobox control.",
@@ -1911,61 +1920,33 @@
1911
1920
  }
1912
1921
  },
1913
1922
  {
1914
- "name": "sd-dropdown",
1915
- "description": "Dropdowns expose additional content that \"drops down\" in a panel.\n---\n\n\n### **Events:**\n - **sd-show** - Emitted when the dropdown opens.\n- **sd-after-show** - Emitted after the dropdown opens and all animations are complete.\n- **sd-hide** - Emitted when the dropdown closes.\n- **sd-after-hide** - Emitted after the dropdown closes and all animations are complete.\n\n### **Methods:**\n - **getAccessibleTrigger(): _HTMLElement | null_** - Slotted triggers can be arbitrary content. The accessible trigger is the tabbable element\nwithin the slotted trigger. This could be the slotted element itself, a child of the slotted element,\nor an element within the slotted elements shadow root.\n\ne.g. the accessible trigger of an <sd-button> is a <button> located inside its shadow root.\n\nTo determine this, we assume the first tabbable element in the trigger slot is the \"accessible trigger.\"\n- **show()** - Shows the dropdown panel.\n- **hide()** - Hides the dropdown panel\n- **reposition()** - Instructs the dropdown menu to reposition. Useful when the position or size of the trigger changes when the menu\nis activated.\n- **emit(name: _string_, options: _CustomEventInit_)** - Emits a custom event with more convenient defaults.\n\n### **Slots:**\n - _default_ - The dropdown's main content.\n- **trigger** - The dropdown's trigger, usually a `<sd-button>` element.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **trigger** - The container that wraps the trigger.\n- **panel** - The panel that gets shown when the dropdown is open.",
1923
+ "name": "sd-drawer",
1924
+ "description": "Drawers slide in from a container to expose additional options and information.\n---\n\n\n### **Events:**\n - **sd-show** - Emitted when the drawer opens.\n- **sd-after-show** - Emitted after the drawer opens and all animations are complete.\n- **sd-hide** - Emitted when the drawer closes.\n- **sd-after-hide** - Emitted after the drawer closes and all animations are complete.\n- **sd-initial-focus** - Emitted when the drawer opens and is ready to receive focus. Calling `event.preventDefault()` will prevent focusing and allow you to set it on a different element, such as an input.\n- **sd-request-close** - Emitted when the user attempts to close the drawer by clicking the close button, clicking the overlay, or pressing escape. Calling `event.preventDefault()` will keep the drawer open. Avoid using this unless closing the drawer will result in destructive behavior such as data loss.\n\n### **Methods:**\n - **show()** - Shows the drawer.\n- **hide()** - Hides the drawer\n- **emit(name: _string_, options: _CustomEventInit_)** - Emits a custom event with more convenient defaults.\n\n### **Slots:**\n - _default_ - The drawer's main content.\n- **header** - The drawer's header, usually a title.\n- **footer** - The drawer's footer, usually one or more buttons representing various options.\n\n### **CSS Properties:**\n - **--width** - The preferred width of the drawer. depending on its `placement`. Note that the drawer will shrink to accommodate smaller screens. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **overlay** - The overlay that covers the screen behind the drawer.\n- **panel** - The drawer's panel (where the drawer and its content are rendered).\n- **header** - The drawer's header. This element wraps the title and the close-button.\n- **title** - The drawer's title.\n- **close-button** - The close button, an `<sd-button>`.\n- **body** - The drawer's body.\n- **footer** - The drawer's footer.",
1916
1925
  "doc-url": "",
1917
1926
  "attributes": [
1918
1927
  {
1919
1928
  "name": "open",
1920
- "description": "Indicates whether or not the dropdown is open. You can toggle this attribute to show and hide the dropdown, or you\ncan use the `show()` and `hide()` methods and this attribute will reflect the dropdown's open state.",
1929
+ "description": "Indicates whether or not the drawer is open. You can toggle this attribute to show and hide the drawer, or you can\nuse the `show()` and `hide()` methods and this attribute will reflect the drawer's open state.",
1921
1930
  "value": { "type": "boolean", "default": "false" }
1922
1931
  },
1923
1932
  {
1924
- "name": "rounded",
1925
- "description": "Indicates whether or not the dropdown should be styled with rounded corners.",
1926
- "value": { "type": "boolean", "default": "false" }
1933
+ "name": "label",
1934
+ "description": "You should always include a relevant label even when using\n`no-header`, as it is required for proper accessibility.",
1935
+ "value": { "type": "string", "default": "''" }
1927
1936
  },
1928
1937
  {
1929
1938
  "name": "placement",
1930
- "description": "The preferred placement of the dropdown panel. Note that the actual placement may vary as needed to keep the panel\ninside of the viewport.",
1931
- "value": {
1932
- "type": "| 'top'\n | 'top-start'\n | 'top-end'\n | 'bottom'\n | 'bottom-start'\n | 'bottom-end'\n | 'right'\n | 'right-start'\n | 'right-end'\n | 'left'\n | 'left-start'\n | 'left-end'",
1933
- "default": "'bottom-start'"
1934
- }
1935
- },
1936
- {
1937
- "name": "disabled",
1938
- "description": "Disables the dropdown so the panel will not open.",
1939
- "value": { "type": "boolean", "default": "false" }
1940
- },
1941
- {
1942
- "name": "stay-open-on-select",
1943
- "description": "By default, the dropdown is closed when an item is selected. This attribute will keep it open instead. Useful for\ndropdowns that allow for multiple interactions.",
1944
- "value": { "type": "boolean", "default": "false" }
1945
- },
1946
- {
1947
- "name": "distance",
1948
- "description": "The distance in pixels from which to offset the panel away from its trigger. This defaults to `0` for `rounded=false` and to a minimum of `1` for `rounded=true`.",
1949
- "value": { "type": "number", "default": "0" }
1950
- },
1951
- {
1952
- "name": "skidding",
1953
- "description": "The distance in pixels from which to offset the panel along its trigger.",
1954
- "value": { "type": "number", "default": "0" }
1955
- },
1956
- {
1957
- "name": "no-auto-size",
1958
- "description": "Indicates whether or not the dropdown should automatically resize its content's width/height regarding the available space on screen.",
1959
- "value": { "type": "boolean", "default": "false" }
1939
+ "description": "The direction from which the drawer will open.",
1940
+ "value": { "type": "'end' | 'start'", "default": "'end'" }
1960
1941
  },
1961
1942
  {
1962
- "name": "no-flip",
1963
- "description": "When set to true, the placement of the dropdown will not flip to the opposite site to keep it in view.",
1943
+ "name": "contained",
1944
+ "description": "By default, the drawer slides out of its containing block (the viewport). Contained is a hidden feature used only for testing purposes. Please do not use it in production as it will likely change.",
1964
1945
  "value": { "type": "boolean", "default": "false" }
1965
1946
  },
1966
1947
  {
1967
- "name": "hoist",
1968
- "description": "Enable this option to prevent the panel from being clipped when the component is placed inside a container with\n`overflow: auto|scroll`. Hoisting uses a fixed positioning strategy that works in many, but not all, scenarios.",
1948
+ "name": "no-header",
1949
+ "description": "Removes the header. This will also remove the default close button, so please ensure you provide an easy, accessible way for users to dismiss the drawer.",
1969
1950
  "value": { "type": "boolean", "default": "false" }
1970
1951
  },
1971
1952
  {
@@ -1980,82 +1961,69 @@
1980
1961
  }
1981
1962
  ],
1982
1963
  "slots": [
1983
- { "name": "", "description": "The dropdown's main content." },
1964
+ { "name": "", "description": "The drawer's main content." },
1984
1965
  {
1985
- "name": "trigger",
1986
- "description": "The dropdown's trigger, usually a `<sd-button>` element."
1966
+ "name": "header",
1967
+ "description": "The drawer's header, usually a title."
1968
+ },
1969
+ {
1970
+ "name": "footer",
1971
+ "description": "The drawer's footer, usually one or more buttons representing various options."
1987
1972
  }
1988
1973
  ],
1989
1974
  "events": [
1990
1975
  {
1991
1976
  "name": "sd-show",
1992
- "description": "Emitted when the dropdown opens."
1977
+ "description": "Emitted when the drawer opens."
1993
1978
  },
1994
1979
  {
1995
1980
  "name": "sd-after-show",
1996
- "description": "Emitted after the dropdown opens and all animations are complete."
1981
+ "description": "Emitted after the drawer opens and all animations are complete."
1997
1982
  },
1998
1983
  {
1999
1984
  "name": "sd-hide",
2000
- "description": "Emitted when the dropdown closes."
1985
+ "description": "Emitted when the drawer closes."
2001
1986
  },
2002
1987
  {
2003
1988
  "name": "sd-after-hide",
2004
- "description": "Emitted after the dropdown closes and all animations are complete."
1989
+ "description": "Emitted after the drawer closes and all animations are complete."
1990
+ },
1991
+ {
1992
+ "name": "sd-initial-focus",
1993
+ "description": "Emitted when the drawer opens and is ready to receive focus. Calling `event.preventDefault()` will prevent focusing and allow you to set it on a different element, such as an input."
1994
+ },
1995
+ {
1996
+ "name": "sd-request-close",
1997
+ "type": "{ source: 'close-button' | 'keyboard' | 'overlay' }",
1998
+ "description": "Emitted when the user attempts to close the drawer by clicking the close button, clicking the overlay, or pressing escape. Calling `event.preventDefault()` will keep the drawer open. Avoid using this unless closing the drawer will result in destructive behavior such as data loss."
2005
1999
  }
2006
2000
  ],
2007
2001
  "js": {
2008
2002
  "properties": [
2009
- { "name": "popup", "type": "SdPopup" },
2010
2003
  { "name": "localize" },
2011
2004
  {
2012
2005
  "name": "open",
2013
- "description": "Indicates whether or not the dropdown is open. You can toggle this attribute to show and hide the dropdown, or you\ncan use the `show()` and `hide()` methods and this attribute will reflect the dropdown's open state.",
2006
+ "description": "Indicates whether or not the drawer is open. You can toggle this attribute to show and hide the drawer, or you can\nuse the `show()` and `hide()` methods and this attribute will reflect the drawer's open state.",
2014
2007
  "type": "boolean"
2015
2008
  },
2016
2009
  {
2017
- "name": "rounded",
2018
- "description": "Indicates whether or not the dropdown should be styled with rounded corners.",
2019
- "type": "boolean"
2010
+ "name": "label",
2011
+ "description": "You should always include a relevant label even when using\n`no-header`, as it is required for proper accessibility.",
2012
+ "type": "string"
2020
2013
  },
2021
2014
  {
2022
2015
  "name": "placement",
2023
- "description": "The preferred placement of the dropdown panel. Note that the actual placement may vary as needed to keep the panel\ninside of the viewport.",
2024
- "type": "| 'top'\n | 'top-start'\n | 'top-end'\n | 'bottom'\n | 'bottom-start'\n | 'bottom-end'\n | 'right'\n | 'right-start'\n | 'right-end'\n | 'left'\n | 'left-start'\n | 'left-end'"
2025
- },
2026
- {
2027
- "name": "disabled",
2028
- "description": "Disables the dropdown so the panel will not open.",
2029
- "type": "boolean"
2030
- },
2031
- {
2032
- "name": "stayOpenOnSelect",
2033
- "description": "By default, the dropdown is closed when an item is selected. This attribute will keep it open instead. Useful for\ndropdowns that allow for multiple interactions.",
2034
- "type": "boolean"
2035
- },
2036
- {
2037
- "name": "distance",
2038
- "description": "The distance in pixels from which to offset the panel away from its trigger. This defaults to `0` for `rounded=false` and to a minimum of `1` for `rounded=true`.",
2039
- "type": "number"
2040
- },
2041
- {
2042
- "name": "skidding",
2043
- "description": "The distance in pixels from which to offset the panel along its trigger.",
2044
- "type": "number"
2045
- },
2046
- {
2047
- "name": "noAutoSize",
2048
- "description": "Indicates whether or not the dropdown should automatically resize its content's width/height regarding the available space on screen.",
2049
- "type": "boolean"
2016
+ "description": "The direction from which the drawer will open.",
2017
+ "type": "'end' | 'start'"
2050
2018
  },
2051
2019
  {
2052
- "name": "noFlip",
2053
- "description": "When set to true, the placement of the dropdown will not flip to the opposite site to keep it in view.",
2020
+ "name": "contained",
2021
+ "description": "By default, the drawer slides out of its containing block (the viewport). Contained is a hidden feature used only for testing purposes. Please do not use it in production as it will likely change.",
2054
2022
  "type": "boolean"
2055
2023
  },
2056
2024
  {
2057
- "name": "hoist",
2058
- "description": "Enable this option to prevent the panel from being clipped when the component is placed inside a container with\n`overflow: auto|scroll`. Hoisting uses a fixed positioning strategy that works in many, but not all, scenarios.",
2025
+ "name": "noHeader",
2026
+ "description": "Removes the header. This will also remove the default close button, so please ensure you provide an easy, accessible way for users to dismiss the drawer.",
2059
2027
  "type": "boolean"
2060
2028
  },
2061
2029
  {
@@ -2072,51 +2040,88 @@
2072
2040
  "events": [
2073
2041
  {
2074
2042
  "name": "sd-show",
2075
- "description": "Emitted when the dropdown opens."
2043
+ "description": "Emitted when the drawer opens."
2076
2044
  },
2077
2045
  {
2078
2046
  "name": "sd-after-show",
2079
- "description": "Emitted after the dropdown opens and all animations are complete."
2047
+ "description": "Emitted after the drawer opens and all animations are complete."
2080
2048
  },
2081
2049
  {
2082
2050
  "name": "sd-hide",
2083
- "description": "Emitted when the dropdown closes."
2051
+ "description": "Emitted when the drawer closes."
2084
2052
  },
2085
2053
  {
2086
2054
  "name": "sd-after-hide",
2087
- "description": "Emitted after the dropdown closes and all animations are complete."
2055
+ "description": "Emitted after the drawer closes and all animations are complete."
2056
+ },
2057
+ {
2058
+ "name": "sd-initial-focus",
2059
+ "description": "Emitted when the drawer opens and is ready to receive focus. Calling `event.preventDefault()` will prevent focusing and allow you to set it on a different element, such as an input."
2060
+ },
2061
+ {
2062
+ "name": "sd-request-close",
2063
+ "type": "{ source: 'close-button' | 'keyboard' | 'overlay' }",
2064
+ "description": "Emitted when the user attempts to close the drawer by clicking the close button, clicking the overlay, or pressing escape. Calling `event.preventDefault()` will keep the drawer open. Avoid using this unless closing the drawer will result in destructive behavior such as data loss."
2088
2065
  }
2089
2066
  ]
2090
2067
  }
2091
2068
  },
2092
2069
  {
2093
- "name": "sd-drawer",
2094
- "description": "Drawers slide in from a container to expose additional options and information.\n---\n\n\n### **Events:**\n - **sd-show** - Emitted when the drawer opens.\n- **sd-after-show** - Emitted after the drawer opens and all animations are complete.\n- **sd-hide** - Emitted when the drawer closes.\n- **sd-after-hide** - Emitted after the drawer closes and all animations are complete.\n- **sd-initial-focus** - Emitted when the drawer opens and is ready to receive focus. Calling `event.preventDefault()` will prevent focusing and allow you to set it on a different element, such as an input.\n- **sd-request-close** - Emitted when the user attempts to close the drawer by clicking the close button, clicking the overlay, or pressing escape. Calling `event.preventDefault()` will keep the drawer open. Avoid using this unless closing the drawer will result in destructive behavior such as data loss.\n\n### **Methods:**\n - **show()** - Shows the drawer.\n- **hide()** - Hides the drawer\n- **emit(name: _string_, options: _CustomEventInit_)** - Emits a custom event with more convenient defaults.\n\n### **Slots:**\n - _default_ - The drawer's main content.\n- **header** - The drawer's header, usually a title.\n- **footer** - The drawer's footer, usually one or more buttons representing various options.\n\n### **CSS Properties:**\n - **--width** - The preferred width of the drawer. depending on its `placement`. Note that the drawer will shrink to accommodate smaller screens. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **overlay** - The overlay that covers the screen behind the drawer.\n- **panel** - The drawer's panel (where the drawer and its content are rendered).\n- **header** - The drawer's header. This element wraps the title and the close-button.\n- **title** - The drawer's title.\n- **close-button** - The close button, an `<sd-button>`.\n- **body** - The drawer's body.\n- **footer** - The drawer's footer.",
2070
+ "name": "sd-dropdown",
2071
+ "description": "Dropdowns expose additional content that \"drops down\" in a panel.\n---\n\n\n### **Events:**\n - **sd-show** - Emitted when the dropdown opens.\n- **sd-after-show** - Emitted after the dropdown opens and all animations are complete.\n- **sd-hide** - Emitted when the dropdown closes.\n- **sd-after-hide** - Emitted after the dropdown closes and all animations are complete.\n\n### **Methods:**\n - **getAccessibleTrigger(): _HTMLElement | null_** - Slotted triggers can be arbitrary content. The accessible trigger is the tabbable element\nwithin the slotted trigger. This could be the slotted element itself, a child of the slotted element,\nor an element within the slotted elements shadow root.\n\ne.g. the accessible trigger of an <sd-button> is a <button> located inside its shadow root.\n\nTo determine this, we assume the first tabbable element in the trigger slot is the \"accessible trigger.\"\n- **show()** - Shows the dropdown panel.\n- **hide()** - Hides the dropdown panel\n- **reposition()** - Instructs the dropdown menu to reposition. Useful when the position or size of the trigger changes when the menu\nis activated.\n- **emit(name: _string_, options: _CustomEventInit_)** - Emits a custom event with more convenient defaults.\n\n### **Slots:**\n - _default_ - The dropdown's main content.\n- **trigger** - The dropdown's trigger, usually a `<sd-button>` element.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **trigger** - The container that wraps the trigger.\n- **panel** - The panel that gets shown when the dropdown is open.",
2095
2072
  "doc-url": "",
2096
2073
  "attributes": [
2097
2074
  {
2098
2075
  "name": "open",
2099
- "description": "Indicates whether or not the drawer is open. You can toggle this attribute to show and hide the drawer, or you can\nuse the `show()` and `hide()` methods and this attribute will reflect the drawer's open state.",
2076
+ "description": "Indicates whether or not the dropdown is open. You can toggle this attribute to show and hide the dropdown, or you\ncan use the `show()` and `hide()` methods and this attribute will reflect the dropdown's open state.",
2100
2077
  "value": { "type": "boolean", "default": "false" }
2101
2078
  },
2102
2079
  {
2103
- "name": "label",
2104
- "description": "You should always include a relevant label even when using\n`no-header`, as it is required for proper accessibility.",
2105
- "value": { "type": "string", "default": "''" }
2080
+ "name": "rounded",
2081
+ "description": "Indicates whether or not the dropdown should be styled with rounded corners.",
2082
+ "value": { "type": "boolean", "default": "false" }
2106
2083
  },
2107
2084
  {
2108
2085
  "name": "placement",
2109
- "description": "The direction from which the drawer will open.",
2110
- "value": { "type": "'end' | 'start'", "default": "'end'" }
2086
+ "description": "The preferred placement of the dropdown panel. Note that the actual placement may vary as needed to keep the panel\ninside of the viewport.",
2087
+ "value": {
2088
+ "type": "| 'top'\n | 'top-start'\n | 'top-end'\n | 'bottom'\n | 'bottom-start'\n | 'bottom-end'\n | 'right'\n | 'right-start'\n | 'right-end'\n | 'left'\n | 'left-start'\n | 'left-end'",
2089
+ "default": "'bottom-start'"
2090
+ }
2111
2091
  },
2112
2092
  {
2113
- "name": "contained",
2114
- "description": "By default, the drawer slides out of its containing block (the viewport). Contained is a hidden feature used only for testing purposes. Please do not use it in production as it will likely change.",
2093
+ "name": "disabled",
2094
+ "description": "Disables the dropdown so the panel will not open.",
2115
2095
  "value": { "type": "boolean", "default": "false" }
2116
2096
  },
2117
2097
  {
2118
- "name": "no-header",
2119
- "description": "Removes the header. This will also remove the default close button, so please ensure you provide an easy, accessible way for users to dismiss the drawer.",
2098
+ "name": "stay-open-on-select",
2099
+ "description": "By default, the dropdown is closed when an item is selected. This attribute will keep it open instead. Useful for\ndropdowns that allow for multiple interactions.",
2100
+ "value": { "type": "boolean", "default": "false" }
2101
+ },
2102
+ {
2103
+ "name": "distance",
2104
+ "description": "The distance in pixels from which to offset the panel away from its trigger. This defaults to `0` for `rounded=false` and to a minimum of `1` for `rounded=true`.",
2105
+ "value": { "type": "number", "default": "0" }
2106
+ },
2107
+ {
2108
+ "name": "skidding",
2109
+ "description": "The distance in pixels from which to offset the panel along its trigger.",
2110
+ "value": { "type": "number", "default": "0" }
2111
+ },
2112
+ {
2113
+ "name": "no-auto-size",
2114
+ "description": "Indicates whether or not the dropdown should automatically resize its content's width/height regarding the available space on screen.",
2115
+ "value": { "type": "boolean", "default": "false" }
2116
+ },
2117
+ {
2118
+ "name": "no-flip",
2119
+ "description": "When set to true, the placement of the dropdown will not flip to the opposite site to keep it in view.",
2120
+ "value": { "type": "boolean", "default": "false" }
2121
+ },
2122
+ {
2123
+ "name": "hoist",
2124
+ "description": "Enable this option to prevent the panel from being clipped when the component is placed inside a container with\n`overflow: auto|scroll`. Hoisting uses a fixed positioning strategy that works in many, but not all, scenarios.",
2120
2125
  "value": { "type": "boolean", "default": "false" }
2121
2126
  },
2122
2127
  {
@@ -2131,69 +2136,82 @@
2131
2136
  }
2132
2137
  ],
2133
2138
  "slots": [
2134
- { "name": "", "description": "The drawer's main content." },
2135
- {
2136
- "name": "header",
2137
- "description": "The drawer's header, usually a title."
2138
- },
2139
+ { "name": "", "description": "The dropdown's main content." },
2139
2140
  {
2140
- "name": "footer",
2141
- "description": "The drawer's footer, usually one or more buttons representing various options."
2141
+ "name": "trigger",
2142
+ "description": "The dropdown's trigger, usually a `<sd-button>` element."
2142
2143
  }
2143
2144
  ],
2144
2145
  "events": [
2145
2146
  {
2146
2147
  "name": "sd-show",
2147
- "description": "Emitted when the drawer opens."
2148
+ "description": "Emitted when the dropdown opens."
2148
2149
  },
2149
2150
  {
2150
2151
  "name": "sd-after-show",
2151
- "description": "Emitted after the drawer opens and all animations are complete."
2152
+ "description": "Emitted after the dropdown opens and all animations are complete."
2152
2153
  },
2153
2154
  {
2154
2155
  "name": "sd-hide",
2155
- "description": "Emitted when the drawer closes."
2156
+ "description": "Emitted when the dropdown closes."
2156
2157
  },
2157
2158
  {
2158
2159
  "name": "sd-after-hide",
2159
- "description": "Emitted after the drawer closes and all animations are complete."
2160
- },
2161
- {
2162
- "name": "sd-initial-focus",
2163
- "description": "Emitted when the drawer opens and is ready to receive focus. Calling `event.preventDefault()` will prevent focusing and allow you to set it on a different element, such as an input."
2164
- },
2165
- {
2166
- "name": "sd-request-close",
2167
- "type": "{ source: 'close-button' | 'keyboard' | 'overlay' }",
2168
- "description": "Emitted when the user attempts to close the drawer by clicking the close button, clicking the overlay, or pressing escape. Calling `event.preventDefault()` will keep the drawer open. Avoid using this unless closing the drawer will result in destructive behavior such as data loss."
2160
+ "description": "Emitted after the dropdown closes and all animations are complete."
2169
2161
  }
2170
2162
  ],
2171
2163
  "js": {
2172
2164
  "properties": [
2165
+ { "name": "popup", "type": "SdPopup" },
2173
2166
  { "name": "localize" },
2174
2167
  {
2175
2168
  "name": "open",
2176
- "description": "Indicates whether or not the drawer is open. You can toggle this attribute to show and hide the drawer, or you can\nuse the `show()` and `hide()` methods and this attribute will reflect the drawer's open state.",
2169
+ "description": "Indicates whether or not the dropdown is open. You can toggle this attribute to show and hide the dropdown, or you\ncan use the `show()` and `hide()` methods and this attribute will reflect the dropdown's open state.",
2177
2170
  "type": "boolean"
2178
2171
  },
2179
2172
  {
2180
- "name": "label",
2181
- "description": "You should always include a relevant label even when using\n`no-header`, as it is required for proper accessibility.",
2182
- "type": "string"
2173
+ "name": "rounded",
2174
+ "description": "Indicates whether or not the dropdown should be styled with rounded corners.",
2175
+ "type": "boolean"
2183
2176
  },
2184
2177
  {
2185
2178
  "name": "placement",
2186
- "description": "The direction from which the drawer will open.",
2187
- "type": "'end' | 'start'"
2179
+ "description": "The preferred placement of the dropdown panel. Note that the actual placement may vary as needed to keep the panel\ninside of the viewport.",
2180
+ "type": "| 'top'\n | 'top-start'\n | 'top-end'\n | 'bottom'\n | 'bottom-start'\n | 'bottom-end'\n | 'right'\n | 'right-start'\n | 'right-end'\n | 'left'\n | 'left-start'\n | 'left-end'"
2188
2181
  },
2189
2182
  {
2190
- "name": "contained",
2191
- "description": "By default, the drawer slides out of its containing block (the viewport). Contained is a hidden feature used only for testing purposes. Please do not use it in production as it will likely change.",
2183
+ "name": "disabled",
2184
+ "description": "Disables the dropdown so the panel will not open.",
2192
2185
  "type": "boolean"
2193
2186
  },
2194
2187
  {
2195
- "name": "noHeader",
2196
- "description": "Removes the header. This will also remove the default close button, so please ensure you provide an easy, accessible way for users to dismiss the drawer.",
2188
+ "name": "stayOpenOnSelect",
2189
+ "description": "By default, the dropdown is closed when an item is selected. This attribute will keep it open instead. Useful for\ndropdowns that allow for multiple interactions.",
2190
+ "type": "boolean"
2191
+ },
2192
+ {
2193
+ "name": "distance",
2194
+ "description": "The distance in pixels from which to offset the panel away from its trigger. This defaults to `0` for `rounded=false` and to a minimum of `1` for `rounded=true`.",
2195
+ "type": "number"
2196
+ },
2197
+ {
2198
+ "name": "skidding",
2199
+ "description": "The distance in pixels from which to offset the panel along its trigger.",
2200
+ "type": "number"
2201
+ },
2202
+ {
2203
+ "name": "noAutoSize",
2204
+ "description": "Indicates whether or not the dropdown should automatically resize its content's width/height regarding the available space on screen.",
2205
+ "type": "boolean"
2206
+ },
2207
+ {
2208
+ "name": "noFlip",
2209
+ "description": "When set to true, the placement of the dropdown will not flip to the opposite site to keep it in view.",
2210
+ "type": "boolean"
2211
+ },
2212
+ {
2213
+ "name": "hoist",
2214
+ "description": "Enable this option to prevent the panel from being clipped when the component is placed inside a container with\n`overflow: auto|scroll`. Hoisting uses a fixed positioning strategy that works in many, but not all, scenarios.",
2197
2215
  "type": "boolean"
2198
2216
  },
2199
2217
  {
@@ -2210,28 +2228,19 @@
2210
2228
  "events": [
2211
2229
  {
2212
2230
  "name": "sd-show",
2213
- "description": "Emitted when the drawer opens."
2231
+ "description": "Emitted when the dropdown opens."
2214
2232
  },
2215
2233
  {
2216
2234
  "name": "sd-after-show",
2217
- "description": "Emitted after the drawer opens and all animations are complete."
2235
+ "description": "Emitted after the dropdown opens and all animations are complete."
2218
2236
  },
2219
2237
  {
2220
2238
  "name": "sd-hide",
2221
- "description": "Emitted when the drawer closes."
2239
+ "description": "Emitted when the dropdown closes."
2222
2240
  },
2223
2241
  {
2224
2242
  "name": "sd-after-hide",
2225
- "description": "Emitted after the drawer closes and all animations are complete."
2226
- },
2227
- {
2228
- "name": "sd-initial-focus",
2229
- "description": "Emitted when the drawer opens and is ready to receive focus. Calling `event.preventDefault()` will prevent focusing and allow you to set it on a different element, such as an input."
2230
- },
2231
- {
2232
- "name": "sd-request-close",
2233
- "type": "{ source: 'close-button' | 'keyboard' | 'overlay' }",
2234
- "description": "Emitted when the user attempts to close the drawer by clicking the close button, clicking the overlay, or pressing escape. Calling `event.preventDefault()` will keep the drawer open. Avoid using this unless closing the drawer will result in destructive behavior such as data loss."
2243
+ "description": "Emitted after the dropdown closes and all animations are complete."
2235
2244
  }
2236
2245
  ]
2237
2246
  }
@@ -4742,7 +4751,7 @@
4742
4751
  },
4743
4752
  {
4744
4753
  "name": "sd-select",
4745
- "description": "Selects allow you to choose items from a menu of predefined options.\n---\n\n\n### **Events:**\n - **sd-change** - Emitted when the control's value changes.\n- **sd-clear** - Emitted when the control's value is cleared.\n- **sd-input** - Emitted when the control receives input.\n- **sd-focus** - Emitted when the control gains focus.\n- **sd-blur** - Emitted when the control loses focus.\n- **sd-show** - Emitted when the select's menu opens.\n- **sd-after-show** - Emitted after the select's menu opens and all animations are complete.\n- **sd-hide** - Emitted when the select's menu closes.\n- **sd-after-hide** - Emitted after the select's menu closes and all animations are complete.\n- **sd-invalid** - Emitted when the form control has been checked for validity and its constraints aren't satisfied.\n\n### **Methods:**\n - **show()** - Shows the listbox.\n- **hide()** - Hides the listbox.\n- **checkValidity()** - Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid.\n- **getForm(): _HTMLFormElement | null_** - Gets the associated form, if one exists.\n- **reportValidity()** - Checks for validity and shows the browser's validation message if the control is invalid.\n- **setCustomValidity(message: _string_)** - Sets a custom validation message. Pass an empty string to restore validity.\n- **focus(options: _FocusOptions_)** - Sets focus on the control.\n- **blur()** - Removes focus from the control.\n- **emit(name: _string_, options: _CustomEventInit_)** - Emits a custom event with more convenient defaults.\n\n### **Slots:**\n - _default_ - The listbox options. Must be `<sd-option>` elements. You can use `<sd-divider>` to group items visually.\n- **label** - The input's label. Alternatively, you can use the `label` attribute.\n- **help-text** - Text that describes how to use the input. Alternatively, you can use the `help-text` attribute.\n- **clear-icon** - An icon to use in lieu of the default clear icon.\n- **expand-icon** - The icon to show when the control is expanded and collapsed. Rotates on open and close.\n- **tooltip** - An optional tooltip that helps describe the input. Use this slot with the `sd-tooltip` component.\n\n### **CSS Parts:**\n - **form-control** - The form control that wraps the label, input, and help text.\n- **form-control-label** - The label's wrapper.\n- **form-control-input** - The select's wrapper.\n- **form-control-help-text** - The help text's wrapper.\n- **combobox** - The container the wraps the combobox, clear icon, and expand button.\n- **display-input** - The element that displays the selected option's label, an `<input>` element.\n- **listbox** - The listbox container where options are slotted.\n- **tags** - The container that houses option tags when `multiselect` is used.\n- **tag** - The individual tags that represent each multiselect option.\n- **tag__base** - The tag's base part.\n- **tag__content** - The tag's content part.\n- **tag__removable-indicator** - The tag's remove button.\n- **clear-button** - The clear button.\n- **expand-icon** - The container that wraps the expand icon.",
4754
+ "description": "Selects allow you to choose items from a menu of predefined options.\n---\n\n\n### **Events:**\n - **sd-change** - Emitted when the control's value changes.\n- **sd-clear** - Emitted when the control's value is cleared.\n- **sd-input** - Emitted when the control receives input.\n- **sd-focus** - Emitted when the control gains focus.\n- **sd-blur** - Emitted when the control loses focus.\n- **sd-show** - Emitted when the select's menu opens.\n- **sd-after-show** - Emitted after the select's menu opens and all animations are complete.\n- **sd-hide** - Emitted when the select's menu closes.\n- **sd-after-hide** - Emitted after the select's menu closes and all animations are complete.\n- **sd-invalid** - Emitted when the form control has been checked for validity and its constraints aren't satisfied.\n\n### **Methods:**\n - **show()** - Shows the listbox.\n- **hide()** - Hides the listbox.\n- **checkValidity()** - Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid.\n- **getForm(): _HTMLFormElement | null_** - Gets the associated form, if one exists.\n- **reportValidity()** - Checks for validity and shows the browser's validation message if the control is invalid.\n- **setCustomValidity(message: _string_)** - Sets a custom validation message. Pass an empty string to restore validity.\n- **focus(options: _FocusOptions_)** - Sets focus on the control.\n- **blur()** - Removes focus from the control.\n- **emit(name: _string_, options: _CustomEventInit_)** - Emits a custom event with more convenient defaults.\n\n### **Slots:**\n - _default_ - The listbox options. Must be `<sd-option>` elements. You can use `<sd-divider>` to group items visually.\n- **label** - The input's label. Alternatively, you can use the `label` attribute.\n- **help-text** - Text that describes how to use the input. Alternatively, you can use the `help-text` attribute.\n- **clear-icon** - An icon to use in lieu of the default clear icon.\n- **expand-icon** - The icon to show when the control is expanded and collapsed. Rotates on open and close.\n- **tooltip** - An optional tooltip that helps describe the input. Use this slot with the `sd-tooltip` component.\n\n### **CSS Properties:**\n - **--tag-max-width** - Set the maximum width of the tags and to show an ellipsis. Defaults to \"15ch\" _(default: undefined)_\n\n### **CSS Parts:**\n - **form-control** - The form control that wraps the label, input, and help text.\n- **form-control-label** - The label's wrapper.\n- **form-control-input** - The select's wrapper.\n- **form-control-help-text** - The help text's wrapper.\n- **combobox** - The container the wraps the combobox, clear icon, and expand button.\n- **display-input** - The element that displays the selected option's label, an `<input>` element.\n- **listbox** - The listbox container where options are slotted.\n- **tags** - The container that houses option tags when `multiselect` is used.\n- **tag** - The individual tags that represent each multiselect option.\n- **tag__base** - The tag's base part.\n- **tag__content** - The tag's content part.\n- **tag__removable-indicator** - The tag's remove button.\n- **clear-button** - The clear button.\n- **expand-icon** - The container that wraps the expand icon.",
4746
4755
  "doc-url": "",
4747
4756
  "attributes": [
4748
4757
  {
@@ -4770,6 +4779,11 @@
4770
4779
  "description": "Placeholder text to show as a hint when the select is empty.",
4771
4780
  "value": { "type": "string" }
4772
4781
  },
4782
+ {
4783
+ "name": "max-options-tag-label",
4784
+ "description": "Label text shown on tag if max-options-visible is reached.",
4785
+ "value": { "type": "string" }
4786
+ },
4773
4787
  {
4774
4788
  "name": "disabled",
4775
4789
  "description": "Disables the select control.",
@@ -4950,6 +4964,10 @@
4950
4964
  "name": "placeholder",
4951
4965
  "description": "Placeholder text to show as a hint when the select is empty."
4952
4966
  },
4967
+ {
4968
+ "name": "maxOptionsTagLabel",
4969
+ "description": "Label text shown on tag if max-options-visible is reached."
4970
+ },
4953
4971
  {
4954
4972
  "name": "disabled",
4955
4973
  "description": "Disables the select control.",
@@ -32,7 +32,7 @@ let SdMenu = class SdMenu extends SolidElement {
32
32
  if (item.type === 'checkbox') {
33
33
  item.checked = !item.checked;
34
34
  }
35
- this.emit('sd-4-0-0-next-6-select', { detail: { item } });
35
+ this.emit('sd-4-0-0-next-7-select', { detail: { item } });
36
36
  }
37
37
  handleKeyDown(event) {
38
38
  if (event.key === 'Enter') {
@@ -11,7 +11,7 @@ export default css `
11
11
  overscroll-behavior: none;
12
12
  }
13
13
 
14
- ::slotted(sd-4-0-0-next-6-divider) {
14
+ ::slotted(sd-4-0-0-next-7-divider) {
15
15
  --spacing: var(--sd-spacing-x-small);
16
16
  }
17
17
  `;
@@ -74,7 +74,7 @@ let SdMenuItem = class SdMenuItem extends SolidElement {
74
74
  })}
75
75
  >
76
76
  <span part="checked-icon" class="menu-item__check">
77
- <sd-4-0-0-next-6-icon name="check" library="system" aria-hidden="true"></sd-4-0-0-next-6-icon>
77
+ <sd-4-0-0-next-7-icon name="check" library="system" aria-hidden="true"></sd-4-0-0-next-7-icon>
78
78
  </span>
79
79
 
80
80
  <slot name="prefix" part="prefix" class="menu-item__prefix"></slot>
@@ -84,7 +84,7 @@ let SdMenuItem = class SdMenuItem extends SolidElement {
84
84
  <slot name="suffix" part="suffix" class="menu-item__suffix"></slot>
85
85
 
86
86
  <span class="menu-item__chevron">
87
- <sd-4-0-0-next-6-icon name="chevron-right" library="system" aria-hidden="true"></sd-4-0-0-next-6-icon>
87
+ <sd-4-0-0-next-7-icon name="chevron-right" library="system" aria-hidden="true"></sd-4-0-0-next-7-icon>
88
88
  </span>
89
89
  </div>
90
90
  `;
@@ -168,7 +168,7 @@ __decorateClass([
168
168
  watch(["checked"], { waitUntilFirstUpdate: true })
169
169
  ], SdSwitch.prototype, "handleStateChange", 1);
170
170
  SdSwitch = __decorateClass([
171
- customElement("sd-4-0-0-next-6-switch")
171
+ customElement("sd-4-0-0-next-7-switch")
172
172
  ], SdSwitch);
173
173
 
174
174
  export {
@@ -126,7 +126,7 @@ __decorateClass([
126
126
  watch(["name", "src", "library"])
127
127
  ], SdIcon.prototype, "setIcon", 1);
128
128
  SdIcon = __decorateClass([
129
- customElement("sd-4-0-0-next-6-icon")
129
+ customElement("sd-4-0-0-next-7-icon")
130
130
  ], SdIcon);
131
131
 
132
132
  export {