@fundamental-ngx/ui5-webcomponents 0.58.0-rc.7 → 0.58.0-rc.70

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 (257) hide show
  1. package/README.md +70 -1
  2. package/avatar/index.d.ts +35 -0
  3. package/avatar-group/index.d.ts +39 -0
  4. package/bar/index.d.ts +34 -1
  5. package/breadcrumbs/index.d.ts +25 -0
  6. package/breadcrumbs-item/index.d.ts +25 -0
  7. package/busy-indicator/index.d.ts +23 -0
  8. package/button/index.d.ts +32 -0
  9. package/calendar/index.d.ts +35 -0
  10. package/calendar-legend/index.d.ts +23 -0
  11. package/card/index.d.ts +31 -0
  12. package/card-header/index.d.ts +24 -0
  13. package/carousel/index.d.ts +26 -0
  14. package/color-palette/index.d.ts +23 -0
  15. package/color-palette-popover/index.d.ts +23 -0
  16. package/combo-box/index.d.ts +36 -0
  17. package/combo-box-item-group/index.d.ts +26 -0
  18. package/date-picker/index.d.ts +29 -0
  19. package/date-range-picker/index.d.ts +29 -0
  20. package/date-time-picker/index.d.ts +29 -0
  21. package/dialog/index.d.ts +32 -0
  22. package/dynamic-date-range/index.d.ts +1 -0
  23. package/fesm2022/fundamental-ngx-ui5-webcomponents-avatar-group.mjs +40 -0
  24. package/fesm2022/fundamental-ngx-ui5-webcomponents-avatar-group.mjs.map +1 -1
  25. package/fesm2022/fundamental-ngx-ui5-webcomponents-avatar.mjs +41 -0
  26. package/fesm2022/fundamental-ngx-ui5-webcomponents-avatar.mjs.map +1 -1
  27. package/fesm2022/fundamental-ngx-ui5-webcomponents-bar.mjs +47 -2
  28. package/fesm2022/fundamental-ngx-ui5-webcomponents-bar.mjs.map +1 -1
  29. package/fesm2022/fundamental-ngx-ui5-webcomponents-breadcrumbs-item.mjs +27 -0
  30. package/fesm2022/fundamental-ngx-ui5-webcomponents-breadcrumbs-item.mjs.map +1 -1
  31. package/fesm2022/fundamental-ngx-ui5-webcomponents-breadcrumbs.mjs +27 -0
  32. package/fesm2022/fundamental-ngx-ui5-webcomponents-breadcrumbs.mjs.map +1 -1
  33. package/fesm2022/fundamental-ngx-ui5-webcomponents-busy-indicator.mjs +25 -0
  34. package/fesm2022/fundamental-ngx-ui5-webcomponents-busy-indicator.mjs.map +1 -1
  35. package/fesm2022/fundamental-ngx-ui5-webcomponents-button-badge.mjs.map +1 -1
  36. package/fesm2022/fundamental-ngx-ui5-webcomponents-button.mjs +33 -0
  37. package/fesm2022/fundamental-ngx-ui5-webcomponents-button.mjs.map +1 -1
  38. package/fesm2022/fundamental-ngx-ui5-webcomponents-calendar-date-range.mjs.map +1 -1
  39. package/fesm2022/fundamental-ngx-ui5-webcomponents-calendar-date.mjs.map +1 -1
  40. package/fesm2022/fundamental-ngx-ui5-webcomponents-calendar-legend-item.mjs.map +1 -1
  41. package/fesm2022/fundamental-ngx-ui5-webcomponents-calendar-legend.mjs +25 -0
  42. package/fesm2022/fundamental-ngx-ui5-webcomponents-calendar-legend.mjs.map +1 -1
  43. package/fesm2022/fundamental-ngx-ui5-webcomponents-calendar.mjs +47 -0
  44. package/fesm2022/fundamental-ngx-ui5-webcomponents-calendar.mjs.map +1 -1
  45. package/fesm2022/fundamental-ngx-ui5-webcomponents-card-header.mjs +30 -0
  46. package/fesm2022/fundamental-ngx-ui5-webcomponents-card-header.mjs.map +1 -1
  47. package/fesm2022/fundamental-ngx-ui5-webcomponents-card.mjs +33 -0
  48. package/fesm2022/fundamental-ngx-ui5-webcomponents-card.mjs.map +1 -1
  49. package/fesm2022/fundamental-ngx-ui5-webcomponents-carousel.mjs +28 -0
  50. package/fesm2022/fundamental-ngx-ui5-webcomponents-carousel.mjs.map +1 -1
  51. package/fesm2022/fundamental-ngx-ui5-webcomponents-check-box.mjs.map +1 -1
  52. package/fesm2022/fundamental-ngx-ui5-webcomponents-color-palette-item.mjs.map +1 -1
  53. package/fesm2022/fundamental-ngx-ui5-webcomponents-color-palette-popover.mjs +25 -0
  54. package/fesm2022/fundamental-ngx-ui5-webcomponents-color-palette-popover.mjs.map +1 -1
  55. package/fesm2022/fundamental-ngx-ui5-webcomponents-color-palette.mjs +25 -0
  56. package/fesm2022/fundamental-ngx-ui5-webcomponents-color-palette.mjs.map +1 -1
  57. package/fesm2022/fundamental-ngx-ui5-webcomponents-color-picker.mjs.map +1 -1
  58. package/fesm2022/fundamental-ngx-ui5-webcomponents-combo-box-item-group.mjs +32 -0
  59. package/fesm2022/fundamental-ngx-ui5-webcomponents-combo-box-item-group.mjs.map +1 -1
  60. package/fesm2022/fundamental-ngx-ui5-webcomponents-combo-box-item.mjs.map +1 -1
  61. package/fesm2022/fundamental-ngx-ui5-webcomponents-combo-box.mjs +43 -0
  62. package/fesm2022/fundamental-ngx-ui5-webcomponents-combo-box.mjs.map +1 -1
  63. package/fesm2022/fundamental-ngx-ui5-webcomponents-date-picker.mjs +31 -0
  64. package/fesm2022/fundamental-ngx-ui5-webcomponents-date-picker.mjs.map +1 -1
  65. package/fesm2022/fundamental-ngx-ui5-webcomponents-date-range-picker.mjs +31 -0
  66. package/fesm2022/fundamental-ngx-ui5-webcomponents-date-range-picker.mjs.map +1 -1
  67. package/fesm2022/fundamental-ngx-ui5-webcomponents-date-time-picker.mjs +31 -0
  68. package/fesm2022/fundamental-ngx-ui5-webcomponents-date-time-picker.mjs.map +1 -1
  69. package/fesm2022/fundamental-ngx-ui5-webcomponents-dialog.mjs +42 -0
  70. package/fesm2022/fundamental-ngx-ui5-webcomponents-dialog.mjs.map +1 -1
  71. package/fesm2022/fundamental-ngx-ui5-webcomponents-dynamic-date-range.mjs.map +1 -1
  72. package/fesm2022/fundamental-ngx-ui5-webcomponents-expandable-text.mjs.map +1 -1
  73. package/fesm2022/fundamental-ngx-ui5-webcomponents-file-uploader.mjs +41 -0
  74. package/fesm2022/fundamental-ngx-ui5-webcomponents-file-uploader.mjs.map +1 -1
  75. package/fesm2022/fundamental-ngx-ui5-webcomponents-form-group.mjs +25 -0
  76. package/fesm2022/fundamental-ngx-ui5-webcomponents-form-group.mjs.map +1 -1
  77. package/fesm2022/fundamental-ngx-ui5-webcomponents-form-item.mjs +31 -0
  78. package/fesm2022/fundamental-ngx-ui5-webcomponents-form-item.mjs.map +1 -1
  79. package/fesm2022/fundamental-ngx-ui5-webcomponents-form.mjs +35 -0
  80. package/fesm2022/fundamental-ngx-ui5-webcomponents-form.mjs.map +1 -1
  81. package/fesm2022/fundamental-ngx-ui5-webcomponents-icon.mjs.map +1 -1
  82. package/fesm2022/fundamental-ngx-ui5-webcomponents-input.mjs +50 -0
  83. package/fesm2022/fundamental-ngx-ui5-webcomponents-input.mjs.map +1 -1
  84. package/fesm2022/fundamental-ngx-ui5-webcomponents-label.mjs +27 -0
  85. package/fesm2022/fundamental-ngx-ui5-webcomponents-label.mjs.map +1 -1
  86. package/fesm2022/fundamental-ngx-ui5-webcomponents-link.mjs +27 -0
  87. package/fesm2022/fundamental-ngx-ui5-webcomponents-link.mjs.map +1 -1
  88. package/fesm2022/fundamental-ngx-ui5-webcomponents-list-item-custom.mjs +34 -0
  89. package/fesm2022/fundamental-ngx-ui5-webcomponents-list-item-custom.mjs.map +1 -1
  90. package/fesm2022/fundamental-ngx-ui5-webcomponents-list-item-group.mjs +32 -0
  91. package/fesm2022/fundamental-ngx-ui5-webcomponents-list-item-group.mjs.map +1 -1
  92. package/fesm2022/fundamental-ngx-ui5-webcomponents-list-item-standard.mjs +51 -0
  93. package/fesm2022/fundamental-ngx-ui5-webcomponents-list-item-standard.mjs.map +1 -1
  94. package/fesm2022/fundamental-ngx-ui5-webcomponents-list.mjs +35 -0
  95. package/fesm2022/fundamental-ngx-ui5-webcomponents-list.mjs.map +1 -1
  96. package/fesm2022/fundamental-ngx-ui5-webcomponents-menu-item-group.mjs +26 -0
  97. package/fesm2022/fundamental-ngx-ui5-webcomponents-menu-item-group.mjs.map +1 -1
  98. package/fesm2022/fundamental-ngx-ui5-webcomponents-menu-item.mjs +61 -0
  99. package/fesm2022/fundamental-ngx-ui5-webcomponents-menu-item.mjs.map +1 -1
  100. package/fesm2022/fundamental-ngx-ui5-webcomponents-menu-separator.mjs.map +1 -1
  101. package/fesm2022/fundamental-ngx-ui5-webcomponents-menu.mjs +27 -0
  102. package/fesm2022/fundamental-ngx-ui5-webcomponents-menu.mjs.map +1 -1
  103. package/fesm2022/fundamental-ngx-ui5-webcomponents-message-strip.mjs +37 -0
  104. package/fesm2022/fundamental-ngx-ui5-webcomponents-message-strip.mjs.map +1 -1
  105. package/fesm2022/fundamental-ngx-ui5-webcomponents-multi-combo-box-item-group.mjs +32 -0
  106. package/fesm2022/fundamental-ngx-ui5-webcomponents-multi-combo-box-item-group.mjs.map +1 -1
  107. package/fesm2022/fundamental-ngx-ui5-webcomponents-multi-combo-box-item.mjs.map +1 -1
  108. package/fesm2022/fundamental-ngx-ui5-webcomponents-multi-combo-box.mjs +43 -0
  109. package/fesm2022/fundamental-ngx-ui5-webcomponents-multi-combo-box.mjs.map +1 -1
  110. package/fesm2022/fundamental-ngx-ui5-webcomponents-multi-input.mjs +55 -0
  111. package/fesm2022/fundamental-ngx-ui5-webcomponents-multi-input.mjs.map +1 -1
  112. package/fesm2022/fundamental-ngx-ui5-webcomponents-option-custom.mjs +25 -0
  113. package/fesm2022/fundamental-ngx-ui5-webcomponents-option-custom.mjs.map +1 -1
  114. package/fesm2022/fundamental-ngx-ui5-webcomponents-option.mjs +27 -0
  115. package/fesm2022/fundamental-ngx-ui5-webcomponents-option.mjs.map +1 -1
  116. package/fesm2022/fundamental-ngx-ui5-webcomponents-panel.mjs +32 -0
  117. package/fesm2022/fundamental-ngx-ui5-webcomponents-panel.mjs.map +1 -1
  118. package/fesm2022/fundamental-ngx-ui5-webcomponents-popover.mjs +35 -0
  119. package/fesm2022/fundamental-ngx-ui5-webcomponents-popover.mjs.map +1 -1
  120. package/fesm2022/fundamental-ngx-ui5-webcomponents-progress-indicator.mjs.map +1 -1
  121. package/fesm2022/fundamental-ngx-ui5-webcomponents-radio-button.mjs.map +1 -1
  122. package/fesm2022/fundamental-ngx-ui5-webcomponents-range-slider.mjs.map +1 -1
  123. package/fesm2022/fundamental-ngx-ui5-webcomponents-rating-indicator.mjs.map +1 -1
  124. package/fesm2022/fundamental-ngx-ui5-webcomponents-responsive-popover.mjs +35 -0
  125. package/fesm2022/fundamental-ngx-ui5-webcomponents-responsive-popover.mjs.map +1 -1
  126. package/fesm2022/fundamental-ngx-ui5-webcomponents-segmented-button-item.mjs +27 -0
  127. package/fesm2022/fundamental-ngx-ui5-webcomponents-segmented-button-item.mjs.map +1 -1
  128. package/fesm2022/fundamental-ngx-ui5-webcomponents-segmented-button.mjs +29 -0
  129. package/fesm2022/fundamental-ngx-ui5-webcomponents-segmented-button.mjs.map +1 -1
  130. package/fesm2022/fundamental-ngx-ui5-webcomponents-select.mjs +56 -0
  131. package/fesm2022/fundamental-ngx-ui5-webcomponents-select.mjs.map +1 -1
  132. package/fesm2022/fundamental-ngx-ui5-webcomponents-slider.mjs.map +1 -1
  133. package/fesm2022/fundamental-ngx-ui5-webcomponents-special-calendar-date.mjs.map +1 -1
  134. package/fesm2022/fundamental-ngx-ui5-webcomponents-split-button.mjs +27 -0
  135. package/fesm2022/fundamental-ngx-ui5-webcomponents-split-button.mjs.map +1 -1
  136. package/fesm2022/fundamental-ngx-ui5-webcomponents-step-input.mjs +30 -0
  137. package/fesm2022/fundamental-ngx-ui5-webcomponents-step-input.mjs.map +1 -1
  138. package/fesm2022/fundamental-ngx-ui5-webcomponents-suggestion-item-custom.mjs +25 -0
  139. package/fesm2022/fundamental-ngx-ui5-webcomponents-suggestion-item-custom.mjs.map +1 -1
  140. package/fesm2022/fundamental-ngx-ui5-webcomponents-suggestion-item-group.mjs +32 -0
  141. package/fesm2022/fundamental-ngx-ui5-webcomponents-suggestion-item-group.mjs.map +1 -1
  142. package/fesm2022/fundamental-ngx-ui5-webcomponents-suggestion-item.mjs.map +1 -1
  143. package/fesm2022/fundamental-ngx-ui5-webcomponents-switch.mjs.map +1 -1
  144. package/fesm2022/fundamental-ngx-ui5-webcomponents-tab-container.mjs +41 -0
  145. package/fesm2022/fundamental-ngx-ui5-webcomponents-tab-container.mjs.map +1 -1
  146. package/fesm2022/fundamental-ngx-ui5-webcomponents-tab-separator.mjs.map +1 -1
  147. package/fesm2022/fundamental-ngx-ui5-webcomponents-tab.mjs +32 -0
  148. package/fesm2022/fundamental-ngx-ui5-webcomponents-tab.mjs.map +1 -1
  149. package/fesm2022/fundamental-ngx-ui5-webcomponents-table-cell.mjs +25 -0
  150. package/fesm2022/fundamental-ngx-ui5-webcomponents-table-cell.mjs.map +1 -1
  151. package/fesm2022/fundamental-ngx-ui5-webcomponents-table-growing.mjs.map +1 -1
  152. package/fesm2022/fundamental-ngx-ui5-webcomponents-table-header-cell-action-a-i.mjs.map +1 -1
  153. package/fesm2022/fundamental-ngx-ui5-webcomponents-table-header-cell.mjs +33 -0
  154. package/fesm2022/fundamental-ngx-ui5-webcomponents-table-header-cell.mjs.map +1 -1
  155. package/fesm2022/fundamental-ngx-ui5-webcomponents-table-header-row.mjs +27 -0
  156. package/fesm2022/fundamental-ngx-ui5-webcomponents-table-header-row.mjs.map +1 -1
  157. package/fesm2022/fundamental-ngx-ui5-webcomponents-table-row-action-navigation.mjs.map +1 -1
  158. package/fesm2022/fundamental-ngx-ui5-webcomponents-table-row-action.mjs.map +1 -1
  159. package/fesm2022/fundamental-ngx-ui5-webcomponents-table-row.mjs +35 -0
  160. package/fesm2022/fundamental-ngx-ui5-webcomponents-table-row.mjs.map +1 -1
  161. package/fesm2022/fundamental-ngx-ui5-webcomponents-table-selection-multi.mjs.map +1 -1
  162. package/fesm2022/fundamental-ngx-ui5-webcomponents-table-selection-single.mjs.map +1 -1
  163. package/fesm2022/fundamental-ngx-ui5-webcomponents-table-selection.mjs.map +1 -1
  164. package/fesm2022/fundamental-ngx-ui5-webcomponents-table-virtualizer.mjs.map +1 -1
  165. package/fesm2022/fundamental-ngx-ui5-webcomponents-table.mjs +44 -0
  166. package/fesm2022/fundamental-ngx-ui5-webcomponents-table.mjs.map +1 -1
  167. package/fesm2022/fundamental-ngx-ui5-webcomponents-tag.mjs +32 -0
  168. package/fesm2022/fundamental-ngx-ui5-webcomponents-tag.mjs.map +1 -1
  169. package/fesm2022/fundamental-ngx-ui5-webcomponents-text-area.mjs +32 -0
  170. package/fesm2022/fundamental-ngx-ui5-webcomponents-text-area.mjs.map +1 -1
  171. package/fesm2022/fundamental-ngx-ui5-webcomponents-text.mjs +25 -0
  172. package/fesm2022/fundamental-ngx-ui5-webcomponents-text.mjs.map +1 -1
  173. package/fesm2022/fundamental-ngx-ui5-webcomponents-time-picker.mjs +31 -0
  174. package/fesm2022/fundamental-ngx-ui5-webcomponents-time-picker.mjs.map +1 -1
  175. package/fesm2022/fundamental-ngx-ui5-webcomponents-title.mjs +28 -0
  176. package/fesm2022/fundamental-ngx-ui5-webcomponents-title.mjs.map +1 -1
  177. package/fesm2022/fundamental-ngx-ui5-webcomponents-toast.mjs +27 -0
  178. package/fesm2022/fundamental-ngx-ui5-webcomponents-toast.mjs.map +1 -1
  179. package/fesm2022/fundamental-ngx-ui5-webcomponents-toggle-button.mjs +33 -0
  180. package/fesm2022/fundamental-ngx-ui5-webcomponents-toggle-button.mjs.map +1 -1
  181. package/fesm2022/fundamental-ngx-ui5-webcomponents-token.mjs +27 -0
  182. package/fesm2022/fundamental-ngx-ui5-webcomponents-token.mjs.map +1 -1
  183. package/fesm2022/fundamental-ngx-ui5-webcomponents-tokenizer.mjs +25 -0
  184. package/fesm2022/fundamental-ngx-ui5-webcomponents-tokenizer.mjs.map +1 -1
  185. package/fesm2022/fundamental-ngx-ui5-webcomponents-toolbar-button.mjs +11 -1
  186. package/fesm2022/fundamental-ngx-ui5-webcomponents-toolbar-button.mjs.map +1 -1
  187. package/fesm2022/fundamental-ngx-ui5-webcomponents-toolbar-select-option.mjs +27 -0
  188. package/fesm2022/fundamental-ngx-ui5-webcomponents-toolbar-select-option.mjs.map +1 -1
  189. package/fesm2022/fundamental-ngx-ui5-webcomponents-toolbar-select.mjs +37 -0
  190. package/fesm2022/fundamental-ngx-ui5-webcomponents-toolbar-select.mjs.map +1 -1
  191. package/fesm2022/fundamental-ngx-ui5-webcomponents-toolbar-separator.mjs.map +1 -1
  192. package/fesm2022/fundamental-ngx-ui5-webcomponents-toolbar-spacer.mjs.map +1 -1
  193. package/fesm2022/fundamental-ngx-ui5-webcomponents-toolbar.mjs +27 -0
  194. package/fesm2022/fundamental-ngx-ui5-webcomponents-toolbar.mjs.map +1 -1
  195. package/fesm2022/fundamental-ngx-ui5-webcomponents-tree-item-custom.mjs +51 -0
  196. package/fesm2022/fundamental-ngx-ui5-webcomponents-tree-item-custom.mjs.map +1 -1
  197. package/fesm2022/fundamental-ngx-ui5-webcomponents-tree-item.mjs +46 -0
  198. package/fesm2022/fundamental-ngx-ui5-webcomponents-tree-item.mjs.map +1 -1
  199. package/fesm2022/fundamental-ngx-ui5-webcomponents-tree.mjs +35 -0
  200. package/fesm2022/fundamental-ngx-ui5-webcomponents-tree.mjs.map +1 -1
  201. package/fesm2022/fundamental-ngx-ui5-webcomponents.mjs +2445 -5
  202. package/fesm2022/fundamental-ngx-ui5-webcomponents.mjs.map +1 -1
  203. package/file-uploader/index.d.ts +39 -0
  204. package/form/index.d.ts +29 -0
  205. package/form-group/index.d.ts +23 -0
  206. package/form-item/index.d.ts +25 -0
  207. package/index.d.ts +2129 -2
  208. package/input/index.d.ts +44 -0
  209. package/label/index.d.ts +25 -0
  210. package/link/index.d.ts +26 -0
  211. package/list/index.d.ts +30 -0
  212. package/list-item-custom/index.d.ts +32 -0
  213. package/list-item-group/index.d.ts +26 -0
  214. package/list-item-standard/index.d.ts +44 -0
  215. package/menu/index.d.ts +25 -0
  216. package/menu-item/index.d.ts +55 -0
  217. package/menu-item-group/index.d.ts +24 -0
  218. package/message-strip/index.d.ts +31 -0
  219. package/multi-combo-box/index.d.ts +36 -0
  220. package/multi-combo-box-item-group/index.d.ts +26 -0
  221. package/multi-input/index.d.ts +45 -0
  222. package/option/index.d.ts +25 -0
  223. package/option-custom/index.d.ts +23 -0
  224. package/package.json +8 -8
  225. package/panel/index.d.ts +26 -0
  226. package/popover/index.d.ts +25 -0
  227. package/responsive-popover/index.d.ts +25 -0
  228. package/segmented-button/index.d.ts +28 -0
  229. package/segmented-button-item/index.d.ts +25 -0
  230. package/select/index.d.ts +51 -0
  231. package/split-button/index.d.ts +26 -0
  232. package/step-input/index.d.ts +28 -0
  233. package/suggestion-item-custom/index.d.ts +23 -0
  234. package/suggestion-item-group/index.d.ts +26 -0
  235. package/tab/index.d.ts +26 -0
  236. package/tab-container/index.d.ts +35 -0
  237. package/table/index.d.ts +30 -0
  238. package/table-cell/index.d.ts +23 -0
  239. package/table-header-cell/index.d.ts +31 -0
  240. package/table-header-row/index.d.ts +25 -0
  241. package/table-row/index.d.ts +33 -0
  242. package/tag/index.d.ts +26 -0
  243. package/text/index.d.ts +23 -0
  244. package/text-area/index.d.ts +30 -0
  245. package/time-picker/index.d.ts +29 -0
  246. package/title/index.d.ts +26 -0
  247. package/toast/index.d.ts +25 -0
  248. package/toggle-button/index.d.ts +31 -0
  249. package/token/index.d.ts +25 -0
  250. package/tokenizer/index.d.ts +23 -0
  251. package/toolbar/index.d.ts +25 -0
  252. package/toolbar-button/index.d.ts +11 -1
  253. package/toolbar-select/index.d.ts +35 -0
  254. package/toolbar-select-option/index.d.ts +25 -0
  255. package/tree/index.d.ts +29 -0
  256. package/tree-item/index.d.ts +39 -0
  257. package/tree-item-custom/index.d.ts +40 -0
@@ -365,6 +365,47 @@ class Avatar {
365
365
  property is set to `true`.
366
366
  */
367
367
  this.ui5Click = output();
368
+ /**
369
+ * Available slots for content projection in this component.
370
+ *
371
+ * Slots allow you to insert custom content into predefined areas of the web component.
372
+ * Use the `slot` attribute on child elements to target specific slots.
373
+ *
374
+ * - **(default)**: Receives the desired `<img>` tag
375
+
376
+ **Note:** If you experience flickering of the provided image, you can hide the component until it is defined with the following CSS:<br/>
377
+ `ui5-avatar:not(:defined) {`<br/>
378
+ &nbsp;&nbsp;&nbsp;&nbsp;`visibility: hidden;`<br/>
379
+ `}`
380
+ * - **badge**: Defines the optional badge that will be used for visual affordance.
381
+
382
+ **Note:** While the slot allows for custom badges, to achieve
383
+ the Fiori design, you can use the `ui5-tag` with `ui5-icon`
384
+ in the corresponding `icon` slot, without text nodes.
385
+ *
386
+ * @example
387
+ * ```html
388
+ * <ui5-avatar>
389
+ * <div slot="header">Custom header content</div>
390
+ * <p>Default slot content</p>
391
+ * </ui5-avatar>
392
+ * ```
393
+ *
394
+ * @readonly
395
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
396
+ */
397
+ this.slots = [
398
+ {
399
+ "name": "default",
400
+ "description": "Receives the desired `<img>` tag\n\n**Note:** If you experience flickering of the provided image, you can hide the component until it is defined with the following CSS:<br/>\n`ui5-avatar:not(:defined) {`<br/>\n&nbsp;&nbsp;&nbsp;&nbsp;`visibility: hidden;`<br/>\n`}`",
401
+ "since": "1.0.0-rc.15"
402
+ },
403
+ {
404
+ "name": "badge",
405
+ "description": "Defines the optional badge that will be used for visual affordance.\n\n**Note:** While the slot allows for custom badges, to achieve\nthe Fiori design, you can use the `ui5-tag` with `ui5-icon`\nin the corresponding `icon` slot, without text nodes.",
406
+ "since": "1.7.0"
407
+ }
408
+ ];
368
409
  this.elementRef = inject(ElementRef);
369
410
  this.injector = inject(Injector);
370
411
  }
@@ -467,6 +508,46 @@ class AvatarGroup {
467
508
  component has changed
468
509
  */
469
510
  this.ui5Overflow = output();
511
+ /**
512
+ * Available slots for content projection in this component.
513
+ *
514
+ * Slots allow you to insert custom content into predefined areas of the web component.
515
+ * Use the `slot` attribute on child elements to target specific slots.
516
+ *
517
+ * - **(default)**: Defines the items of the component. Use the `ui5-avatar` component as an item.
518
+
519
+ **Note:** The UX guidelines recommends using avatars with "Circle" shape.
520
+
521
+ Moreover, if you use avatars with "Square" shape, there will be visual inconsistency
522
+ as the built-in overflow action has "Circle" shape.
523
+ * - **overflowButton**: Defines the overflow button of the component.
524
+
525
+ **Note:** We recommend using the `ui5-button` component.
526
+
527
+ **Note:** If this slot is not used, the component will display the built-in overflow button.
528
+ *
529
+ * @example
530
+ * ```html
531
+ * <ui5-avatar-group>
532
+ * <div slot="header">Custom header content</div>
533
+ * <p>Default slot content</p>
534
+ * </ui5-avatar-group>
535
+ * ```
536
+ *
537
+ * @readonly
538
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
539
+ */
540
+ this.slots = [
541
+ {
542
+ "name": "default",
543
+ "description": "Defines the items of the component. Use the `ui5-avatar` component as an item.\n\n**Note:** The UX guidelines recommends using avatars with \"Circle\" shape.\n\nMoreover, if you use avatars with \"Square\" shape, there will be visual inconsistency\nas the built-in overflow action has \"Circle\" shape."
544
+ },
545
+ {
546
+ "name": "overflowButton",
547
+ "description": "Defines the overflow button of the component.\n\n**Note:** We recommend using the `ui5-button` component.\n\n**Note:** If this slot is not used, the component will display the built-in overflow button.",
548
+ "since": "1.0.0-rc.13"
549
+ }
550
+ ];
470
551
  this.elementRef = inject(ElementRef);
471
552
  this.injector = inject(Injector);
472
553
  }
@@ -559,7 +640,50 @@ class Bar {
559
640
 
560
641
  - If there is only one or no active element, it is recommended to avoid using the "toolbar" role, as it implies a grouping of multiple interactive controls.
561
642
  */
562
- this.accessibleRole = input("Toolbar", ...(ngDevMode ? [{ debugName: "accessibleRole" }] : [])); // className is now passed
643
+ this.accessibleRole = input("Toolbar", ...(ngDevMode ? [{ debugName: "accessibleRole" }] : []));
644
+ /**
645
+ * Defines the accessible ARIA name of the component.
646
+ */
647
+ this.accessibleName = input(...(ngDevMode ? [undefined, { debugName: "accessibleName" }] : []));
648
+ /**
649
+ * Receives id(or many ids) of the elements that label the bar.
650
+ */
651
+ this.accessibleNameRef = input(...(ngDevMode ? [undefined, { debugName: "accessibleNameRef" }] : [])); // className is now passed
652
+ /**
653
+ * Available slots for content projection in this component.
654
+ *
655
+ * Slots allow you to insert custom content into predefined areas of the web component.
656
+ * Use the `slot` attribute on child elements to target specific slots.
657
+ *
658
+ * - **startContent**: Defines the content at the start of the bar.
659
+ * - **(default)**: Defines the content in the middle of the bar.
660
+ * - **endContent**: Defines the content at the end of the bar.
661
+ *
662
+ * @example
663
+ * ```html
664
+ * <ui5-bar>
665
+ * <div slot="header">Custom header content</div>
666
+ * <p>Default slot content</p>
667
+ * </ui5-bar>
668
+ * ```
669
+ *
670
+ * @readonly
671
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
672
+ */
673
+ this.slots = [
674
+ {
675
+ "name": "startContent",
676
+ "description": "Defines the content at the start of the bar."
677
+ },
678
+ {
679
+ "name": "default",
680
+ "description": "Defines the content in the middle of the bar."
681
+ },
682
+ {
683
+ "name": "endContent",
684
+ "description": "Defines the content at the end of the bar."
685
+ }
686
+ ];
563
687
  this.elementRef = inject(ElementRef);
564
688
  this.injector = inject(Injector);
565
689
  }
@@ -571,6 +695,8 @@ class Bar {
571
695
  const inputsToSync = [
572
696
  'design',
573
697
  'accessibleRole',
698
+ 'accessibleName',
699
+ 'accessibleNameRef',
574
700
  ];
575
701
  // Synchronize inputs (properties)
576
702
  for (const inputName of inputsToSync) {
@@ -592,7 +718,7 @@ class Bar {
592
718
  }
593
719
  }
594
720
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: Bar, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
595
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.1.4", type: Bar, isStandalone: true, selector: "ui5-bar, [ui5-bar]", inputs: { design: { classPropertyName: "design", publicName: "design", isSignal: true, isRequired: false, transformFunction: null }, accessibleRole: { classPropertyName: "accessibleRole", publicName: "accessibleRole", isSignal: true, isRequired: false, transformFunction: null } }, exportAs: ["ui5Bar"], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
721
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.1.4", type: Bar, isStandalone: true, selector: "ui5-bar, [ui5-bar]", inputs: { design: { classPropertyName: "design", publicName: "design", isSignal: true, isRequired: false, transformFunction: null }, accessibleRole: { classPropertyName: "accessibleRole", publicName: "accessibleRole", isSignal: true, isRequired: false, transformFunction: null }, accessibleName: { classPropertyName: "accessibleName", publicName: "accessibleName", isSignal: true, isRequired: false, transformFunction: null }, accessibleNameRef: { classPropertyName: "accessibleNameRef", publicName: "accessibleNameRef", isSignal: true, isRequired: false, transformFunction: null } }, exportAs: ["ui5Bar"], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
596
722
  }
597
723
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: Bar, decorators: [{
598
724
  type: Component,
@@ -625,6 +751,33 @@ class Breadcrumbs {
625
751
  **Note:** You can prevent browser location change by calling `event.preventDefault()`.
626
752
  */
627
753
  this.ui5ItemClick = output();
754
+ /**
755
+ * Available slots for content projection in this component.
756
+ *
757
+ * Slots allow you to insert custom content into predefined areas of the web component.
758
+ * Use the `slot` attribute on child elements to target specific slots.
759
+ *
760
+ * - **(default)**: Defines the component items.
761
+
762
+ **Note:** Use the `ui5-breadcrumbs-item` component to define the desired items.
763
+ *
764
+ * @example
765
+ * ```html
766
+ * <ui5-breadcrumbs>
767
+ * <div slot="header">Custom header content</div>
768
+ * <p>Default slot content</p>
769
+ * </ui5-breadcrumbs>
770
+ * ```
771
+ *
772
+ * @readonly
773
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
774
+ */
775
+ this.slots = [
776
+ {
777
+ "name": "default",
778
+ "description": "Defines the component items.\n\n**Note:** Use the `ui5-breadcrumbs-item` component to define the desired items."
779
+ }
780
+ ];
628
781
  this.elementRef = inject(ElementRef);
629
782
  this.injector = inject(Injector);
630
783
  }
@@ -711,6 +864,33 @@ class BreadcrumbsItem {
711
864
  * Defines the accessible ARIA name of the item.
712
865
  */
713
866
  this.accessibleName = input(...(ngDevMode ? [undefined, { debugName: "accessibleName" }] : [])); // className is now passed
867
+ /**
868
+ * Available slots for content projection in this component.
869
+ *
870
+ * Slots allow you to insert custom content into predefined areas of the web component.
871
+ * Use the `slot` attribute on child elements to target specific slots.
872
+ *
873
+ * - **(default)**: Defines the text of the component.
874
+
875
+ **Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.
876
+ *
877
+ * @example
878
+ * ```html
879
+ * <ui5-breadcrumbs-item>
880
+ * <div slot="header">Custom header content</div>
881
+ * <p>Default slot content</p>
882
+ * </ui5-breadcrumbs-item>
883
+ * ```
884
+ *
885
+ * @readonly
886
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
887
+ */
888
+ this.slots = [
889
+ {
890
+ "name": "default",
891
+ "description": "Defines the text of the component.\n\n**Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design."
892
+ }
893
+ ];
714
894
  this.elementRef = inject(ElementRef);
715
895
  this.injector = inject(Injector);
716
896
  }
@@ -779,6 +959,31 @@ class BusyIndicator {
779
959
  * Defines the placement of the text.
780
960
  */
781
961
  this.textPlacement = input("Bottom", ...(ngDevMode ? [{ debugName: "textPlacement" }] : [])); // className is now passed
962
+ /**
963
+ * Available slots for content projection in this component.
964
+ *
965
+ * Slots allow you to insert custom content into predefined areas of the web component.
966
+ * Use the `slot` attribute on child elements to target specific slots.
967
+ *
968
+ * - **(default)**: Determines the content over which the component will appear.
969
+ *
970
+ * @example
971
+ * ```html
972
+ * <ui5-busy-indicator>
973
+ * <div slot="header">Custom header content</div>
974
+ * <p>Default slot content</p>
975
+ * </ui5-busy-indicator>
976
+ * ```
977
+ *
978
+ * @readonly
979
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
980
+ */
981
+ this.slots = [
982
+ {
983
+ "name": "default",
984
+ "description": "Determines the content over which the component will appear."
985
+ }
986
+ ];
782
987
  this.elementRef = inject(ElementRef);
783
988
  this.injector = inject(Injector);
784
989
  }
@@ -931,6 +1136,39 @@ class Button {
931
1136
  **Note:** The event will not be fired if the `disabled` property is set to `true`.
932
1137
  */
933
1138
  this.ui5Click = output();
1139
+ /**
1140
+ * Available slots for content projection in this component.
1141
+ *
1142
+ * Slots allow you to insert custom content into predefined areas of the web component.
1143
+ * Use the `slot` attribute on child elements to target specific slots.
1144
+ *
1145
+ * - **(default)**: Defines the text of the component.
1146
+
1147
+ **Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.
1148
+ * - **badge**: Adds a badge to the button.
1149
+ *
1150
+ * @example
1151
+ * ```html
1152
+ * <ui5-button>
1153
+ * <div slot="header">Custom header content</div>
1154
+ * <p>Default slot content</p>
1155
+ * </ui5-button>
1156
+ * ```
1157
+ *
1158
+ * @readonly
1159
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
1160
+ */
1161
+ this.slots = [
1162
+ {
1163
+ "name": "default",
1164
+ "description": "Defines the text of the component.\n\n**Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design."
1165
+ },
1166
+ {
1167
+ "name": "badge",
1168
+ "description": "Adds a badge to the button.",
1169
+ "since": "2.7.0"
1170
+ }
1171
+ ];
934
1172
  this.elementRef = inject(ElementRef);
935
1173
  this.injector = inject(Injector);
936
1174
  }
@@ -1129,6 +1367,53 @@ class Calendar {
1129
1367
  create instances of `ui5-date` for the newly selected dates. In that case you should do this manually.
1130
1368
  */
1131
1369
  this.ui5SelectionChange = output();
1370
+ /**
1371
+ * Available slots for content projection in this component.
1372
+ *
1373
+ * Slots allow you to insert custom content into predefined areas of the web component.
1374
+ * Use the `slot` attribute on child elements to target specific slots.
1375
+ *
1376
+ * - **calendarLegend**: Defines the calendar legend of the component.
1377
+ * - **(default)**: Defines the selected date or dates (depending on the `selectionMode` property)
1378
+ for this calendar as instances of `ui5-date` or `ui5-date-range`.
1379
+ Use `ui5-date` for single or multiple selection, and `ui5-date-range` for range selection.
1380
+ * - **specialDates**: Defines the special dates, visually emphasized in the calendar.
1381
+ * - **disabledDates**: Defines the disabled date ranges that cannot be selected in the calendar.
1382
+ Use `ui5-date-range` elements to specify ranges of disabled dates.
1383
+ Each range can define a start date, an end date, or both.
1384
+ *
1385
+ * @example
1386
+ * ```html
1387
+ * <ui5-calendar>
1388
+ * <div slot="header">Custom header content</div>
1389
+ * <p>Default slot content</p>
1390
+ * </ui5-calendar>
1391
+ * ```
1392
+ *
1393
+ * @readonly
1394
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
1395
+ */
1396
+ this.slots = [
1397
+ {
1398
+ "name": "calendarLegend",
1399
+ "description": "Defines the calendar legend of the component.",
1400
+ "since": "1.23.0"
1401
+ },
1402
+ {
1403
+ "name": "default",
1404
+ "description": "Defines the selected date or dates (depending on the `selectionMode` property)\nfor this calendar as instances of `ui5-date` or `ui5-date-range`.\nUse `ui5-date` for single or multiple selection, and `ui5-date-range` for range selection."
1405
+ },
1406
+ {
1407
+ "name": "specialDates",
1408
+ "description": "Defines the special dates, visually emphasized in the calendar.",
1409
+ "since": "1.23.0"
1410
+ },
1411
+ {
1412
+ "name": "disabledDates",
1413
+ "description": "Defines the disabled date ranges that cannot be selected in the calendar.\nUse `ui5-date-range` elements to specify ranges of disabled dates.\nEach range can define a start date, an end date, or both.",
1414
+ "since": "2.16.0"
1415
+ }
1416
+ ];
1132
1417
  this.elementRef = inject(ElementRef);
1133
1418
  this.injector = inject(Injector);
1134
1419
  }
@@ -1323,6 +1608,31 @@ class CalendarLegend {
1323
1608
  * Hides the Working day item in the legend.
1324
1609
  */
1325
1610
  this.hideWorkingDay = input(false, ...(ngDevMode ? [{ debugName: "hideWorkingDay", transform: booleanAttribute }] : [{ transform: booleanAttribute }])); // className is now passed
1611
+ /**
1612
+ * Available slots for content projection in this component.
1613
+ *
1614
+ * Slots allow you to insert custom content into predefined areas of the web component.
1615
+ * Use the `slot` attribute on child elements to target specific slots.
1616
+ *
1617
+ * - **(default)**: Defines the items of the component.
1618
+ *
1619
+ * @example
1620
+ * ```html
1621
+ * <ui5-calendar-legend>
1622
+ * <div slot="header">Custom header content</div>
1623
+ * <p>Default slot content</p>
1624
+ * </ui5-calendar-legend>
1625
+ * ```
1626
+ *
1627
+ * @readonly
1628
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
1629
+ */
1630
+ this.slots = [
1631
+ {
1632
+ "name": "default",
1633
+ "description": "Defines the items of the component."
1634
+ }
1635
+ ];
1326
1636
  this.elementRef = inject(ElementRef);
1327
1637
  this.injector = inject(Injector);
1328
1638
  }
@@ -1445,6 +1755,39 @@ class Card {
1445
1755
  * Defines the delay in milliseconds, after which the loading indicator will show up for this card.
1446
1756
  */
1447
1757
  this.loadingDelay = input(1000, ...(ngDevMode ? [{ debugName: "loadingDelay" }] : [])); // className is now passed
1758
+ /**
1759
+ * Available slots for content projection in this component.
1760
+ *
1761
+ * Slots allow you to insert custom content into predefined areas of the web component.
1762
+ * Use the `slot` attribute on child elements to target specific slots.
1763
+ *
1764
+ * - **(default)**: Defines the content of the component.
1765
+ * - **header**: Defines the header of the component.
1766
+
1767
+ **Note:** Use `ui5-card-header` for the intended design.
1768
+ *
1769
+ * @example
1770
+ * ```html
1771
+ * <ui5-card>
1772
+ * <div slot="header">Custom header content</div>
1773
+ * <p>Default slot content</p>
1774
+ * </ui5-card>
1775
+ * ```
1776
+ *
1777
+ * @readonly
1778
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
1779
+ */
1780
+ this.slots = [
1781
+ {
1782
+ "name": "default",
1783
+ "description": "Defines the content of the component."
1784
+ },
1785
+ {
1786
+ "name": "header",
1787
+ "description": "Defines the header of the component.\n\n**Note:** Use `ui5-card-header` for the intended design.",
1788
+ "since": "1.0.0-rc.15"
1789
+ }
1790
+ ];
1448
1791
  this.elementRef = inject(ElementRef);
1449
1792
  this.injector = inject(Injector);
1450
1793
  }
@@ -1517,6 +1860,36 @@ class CardHeader {
1517
1860
  **Note:** The event would be fired only if the `interactive` property is set to true.
1518
1861
  */
1519
1862
  this.ui5Click = output();
1863
+ /**
1864
+ * Available slots for content projection in this component.
1865
+ *
1866
+ * Slots allow you to insert custom content into predefined areas of the web component.
1867
+ * Use the `slot` attribute on child elements to target specific slots.
1868
+ *
1869
+ * - **avatar**: Defines an avatar image, displayed in the left most part of the header.
1870
+ * - **action**: Defines an action, displayed in the right most part of the header.
1871
+ *
1872
+ * @example
1873
+ * ```html
1874
+ * <ui5-card-header>
1875
+ * <div slot="header">Custom header content</div>
1876
+ * <p>Default slot content</p>
1877
+ * </ui5-card-header>
1878
+ * ```
1879
+ *
1880
+ * @readonly
1881
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
1882
+ */
1883
+ this.slots = [
1884
+ {
1885
+ "name": "avatar",
1886
+ "description": "Defines an avatar image, displayed in the left most part of the header."
1887
+ },
1888
+ {
1889
+ "name": "action",
1890
+ "description": "Defines an action, displayed in the right most part of the header."
1891
+ }
1892
+ ];
1520
1893
  this.elementRef = inject(ElementRef);
1521
1894
  this.injector = inject(Injector);
1522
1895
  }
@@ -1649,6 +2022,34 @@ class Carousel {
1649
2022
  based on the `items-per-page` property.
1650
2023
  */
1651
2024
  this.ui5Navigate = output();
2025
+ /**
2026
+ * Available slots for content projection in this component.
2027
+ *
2028
+ * Slots allow you to insert custom content into predefined areas of the web component.
2029
+ * Use the `slot` attribute on child elements to target specific slots.
2030
+ *
2031
+ * - **(default)**: Defines the content of the component.
2032
+
2033
+ **Note:** Items with the `hidden` attribute will be automatically excluded from carousel navigation and page calculations.
2034
+ They will not be displayed or accessible via keyboard navigation. See [sample](./#carousel-with-hidden-items).
2035
+ *
2036
+ * @example
2037
+ * ```html
2038
+ * <ui5-carousel>
2039
+ * <div slot="header">Custom header content</div>
2040
+ * <p>Default slot content</p>
2041
+ * </ui5-carousel>
2042
+ * ```
2043
+ *
2044
+ * @readonly
2045
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
2046
+ */
2047
+ this.slots = [
2048
+ {
2049
+ "name": "default",
2050
+ "description": "Defines the content of the component.\n\n**Note:** Items with the `hidden` attribute will be automatically excluded from carousel navigation and page calculations.\nThey will not be displayed or accessible via keyboard navigation. See [sample](./#carousel-with-hidden-items)."
2051
+ }
2052
+ ];
1652
2053
  this.elementRef = inject(ElementRef);
1653
2054
  this.injector = inject(Injector);
1654
2055
  }
@@ -1898,6 +2299,31 @@ class ColorPalette {
1898
2299
  * Fired when the user selects a color.
1899
2300
  */
1900
2301
  this.ui5ItemClick = output();
2302
+ /**
2303
+ * Available slots for content projection in this component.
2304
+ *
2305
+ * Slots allow you to insert custom content into predefined areas of the web component.
2306
+ * Use the `slot` attribute on child elements to target specific slots.
2307
+ *
2308
+ * - **(default)**: Defines the `ui5-color-palette-item` elements.
2309
+ *
2310
+ * @example
2311
+ * ```html
2312
+ * <ui5-color-palette>
2313
+ * <div slot="header">Custom header content</div>
2314
+ * <p>Default slot content</p>
2315
+ * </ui5-color-palette>
2316
+ * ```
2317
+ *
2318
+ * @readonly
2319
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
2320
+ */
2321
+ this.slots = [
2322
+ {
2323
+ "name": "default",
2324
+ "description": "Defines the `ui5-color-palette-item` elements."
2325
+ }
2326
+ ];
1901
2327
  this.elementRef = inject(ElementRef);
1902
2328
  this.injector = inject(Injector);
1903
2329
  }
@@ -2034,6 +2460,31 @@ class ColorPalettePopover {
2034
2460
  * Fired when the `ui5-color-palette-popover` is closed due to user interaction.
2035
2461
  */
2036
2462
  this.ui5Close = output();
2463
+ /**
2464
+ * Available slots for content projection in this component.
2465
+ *
2466
+ * Slots allow you to insert custom content into predefined areas of the web component.
2467
+ * Use the `slot` attribute on child elements to target specific slots.
2468
+ *
2469
+ * - **(default)**: Defines the content of the component.
2470
+ *
2471
+ * @example
2472
+ * ```html
2473
+ * <ui5-color-palette-popover>
2474
+ * <div slot="header">Custom header content</div>
2475
+ * <p>Default slot content</p>
2476
+ * </ui5-color-palette-popover>
2477
+ * ```
2478
+ *
2479
+ * @readonly
2480
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
2481
+ */
2482
+ this.slots = [
2483
+ {
2484
+ "name": "default",
2485
+ "description": "Defines the content of the component."
2486
+ }
2487
+ ];
2037
2488
  this.elementRef = inject(ElementRef);
2038
2489
  this.injector = inject(Injector);
2039
2490
  }
@@ -2270,6 +2721,49 @@ class ComboBox {
2270
2721
  * Fired when selection is changed by user interaction
2271
2722
  */
2272
2723
  this.ui5SelectionChange = output();
2724
+ /**
2725
+ * Available slots for content projection in this component.
2726
+ *
2727
+ * Slots allow you to insert custom content into predefined areas of the web component.
2728
+ * Use the `slot` attribute on child elements to target specific slots.
2729
+ *
2730
+ * - **(default)**: Defines the component items.
2731
+ * - **valueStateMessage**: Defines the value state message that will be displayed as pop up under the component.
2732
+ The value state message slot should contain only one root element.
2733
+
2734
+ **Note:** If not specified, a default text (in the respective language) will be displayed.
2735
+
2736
+ **Note:** The `valueStateMessage` would be displayed,
2737
+ when the `ui5-combobox` is in `Information`, `Critical` or `Negative` value state.
2738
+ * - **icon**: Defines the icon to be displayed in the input field.
2739
+ *
2740
+ * @example
2741
+ * ```html
2742
+ * <ui5-combobox>
2743
+ * <div slot="header">Custom header content</div>
2744
+ * <p>Default slot content</p>
2745
+ * </ui5-combobox>
2746
+ * ```
2747
+ *
2748
+ * @readonly
2749
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
2750
+ */
2751
+ this.slots = [
2752
+ {
2753
+ "name": "default",
2754
+ "description": "Defines the component items."
2755
+ },
2756
+ {
2757
+ "name": "valueStateMessage",
2758
+ "description": "Defines the value state message that will be displayed as pop up under the component.\nThe value state message slot should contain only one root element.\n\n**Note:** If not specified, a default text (in the respective language) will be displayed.\n\n**Note:** The `valueStateMessage` would be displayed,\nwhen the `ui5-combobox` is in `Information`, `Critical` or `Negative` value state.",
2759
+ "since": "1.0.0-rc.9"
2760
+ },
2761
+ {
2762
+ "name": "icon",
2763
+ "description": "Defines the icon to be displayed in the input field.",
2764
+ "since": "1.0.0-rc.9"
2765
+ }
2766
+ ];
2273
2767
  this.elementRef = inject(ElementRef);
2274
2768
  this.injector = inject(Injector);
2275
2769
  }
@@ -2438,6 +2932,38 @@ class ComboBoxItemGroup {
2438
2932
  **Note:** `move` event is fired only if there was a preceding `move-over` with prevented default action.
2439
2933
  */
2440
2934
  this.ui5Move = output();
2935
+ /**
2936
+ * Available slots for content projection in this component.
2937
+ *
2938
+ * Slots allow you to insert custom content into predefined areas of the web component.
2939
+ * Use the `slot` attribute on child elements to target specific slots.
2940
+ *
2941
+ * - **(default)**: Defines the items of the <code>ui5-cb-item-group</code>.
2942
+ * - **header**: Defines the header of the component.
2943
+
2944
+ **Note:** Using this slot, the default header text of group and the value of `headerText` property will be overwritten.
2945
+ *
2946
+ * @example
2947
+ * ```html
2948
+ * <ui5-cb-item-group>
2949
+ * <div slot="header">Custom header content</div>
2950
+ * <p>Default slot content</p>
2951
+ * </ui5-cb-item-group>
2952
+ * ```
2953
+ *
2954
+ * @readonly
2955
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
2956
+ */
2957
+ this.slots = [
2958
+ {
2959
+ "name": "default",
2960
+ "description": "Defines the items of the <code>ui5-cb-item-group</code>."
2961
+ },
2962
+ {
2963
+ "name": "header",
2964
+ "description": "Defines the header of the component.\n\n**Note:** Using this slot, the default header text of group and the value of `headerText` property will be overwritten."
2965
+ }
2966
+ ];
2441
2967
  this.elementRef = inject(ElementRef);
2442
2968
  this.injector = inject(Injector);
2443
2969
  }
@@ -2624,6 +3150,37 @@ class DatePicker {
2624
3150
  * Fired after the component's picker is closed.
2625
3151
  */
2626
3152
  this.ui5Close = output();
3153
+ /**
3154
+ * Available slots for content projection in this component.
3155
+ *
3156
+ * Slots allow you to insert custom content into predefined areas of the web component.
3157
+ * Use the `slot` attribute on child elements to target specific slots.
3158
+ *
3159
+ * - **valueStateMessage**: Defines the value state message that will be displayed as pop up under the component.
3160
+
3161
+ **Note:** If not specified, a default text (in the respective language) will be displayed.
3162
+
3163
+ **Note:** The `valueStateMessage` would be displayed,
3164
+ when the component is in `Information`, `Critical` or `Negative` value state.
3165
+ *
3166
+ * @example
3167
+ * ```html
3168
+ * <ui5-date-picker>
3169
+ * <div slot="header">Custom header content</div>
3170
+ * <p>Default slot content</p>
3171
+ * </ui5-date-picker>
3172
+ * ```
3173
+ *
3174
+ * @readonly
3175
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
3176
+ */
3177
+ this.slots = [
3178
+ {
3179
+ "name": "valueStateMessage",
3180
+ "description": "Defines the value state message that will be displayed as pop up under the component.\n\n**Note:** If not specified, a default text (in the respective language) will be displayed.\n\n**Note:** The `valueStateMessage` would be displayed,\nwhen the component is in `Information`, `Critical` or `Negative` value state.",
3181
+ "since": "1.0.0-rc.7"
3182
+ }
3183
+ ];
2627
3184
  this.elementRef = inject(ElementRef);
2628
3185
  this.injector = inject(Injector);
2629
3186
  }
@@ -2844,6 +3401,37 @@ class DateRangePicker {
2844
3401
  * Fired after the component's picker is closed.
2845
3402
  */
2846
3403
  this.ui5Close = output();
3404
+ /**
3405
+ * Available slots for content projection in this component.
3406
+ *
3407
+ * Slots allow you to insert custom content into predefined areas of the web component.
3408
+ * Use the `slot` attribute on child elements to target specific slots.
3409
+ *
3410
+ * - **valueStateMessage**: Defines the value state message that will be displayed as pop up under the component.
3411
+
3412
+ **Note:** If not specified, a default text (in the respective language) will be displayed.
3413
+
3414
+ **Note:** The `valueStateMessage` would be displayed,
3415
+ when the component is in `Information`, `Critical` or `Negative` value state.
3416
+ *
3417
+ * @example
3418
+ * ```html
3419
+ * <ui5-daterange-picker>
3420
+ * <div slot="header">Custom header content</div>
3421
+ * <p>Default slot content</p>
3422
+ * </ui5-daterange-picker>
3423
+ * ```
3424
+ *
3425
+ * @readonly
3426
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
3427
+ */
3428
+ this.slots = [
3429
+ {
3430
+ "name": "valueStateMessage",
3431
+ "description": "Defines the value state message that will be displayed as pop up under the component.\n\n**Note:** If not specified, a default text (in the respective language) will be displayed.\n\n**Note:** The `valueStateMessage` would be displayed,\nwhen the component is in `Information`, `Critical` or `Negative` value state.",
3432
+ "since": "1.0.0-rc.7"
3433
+ }
3434
+ ];
2847
3435
  this.elementRef = inject(ElementRef);
2848
3436
  this.injector = inject(Injector);
2849
3437
  }
@@ -3081,6 +3669,37 @@ class DateTimePicker {
3081
3669
  * Fired after the component's picker is closed.
3082
3670
  */
3083
3671
  this.ui5Close = output();
3672
+ /**
3673
+ * Available slots for content projection in this component.
3674
+ *
3675
+ * Slots allow you to insert custom content into predefined areas of the web component.
3676
+ * Use the `slot` attribute on child elements to target specific slots.
3677
+ *
3678
+ * - **valueStateMessage**: Defines the value state message that will be displayed as pop up under the component.
3679
+
3680
+ **Note:** If not specified, a default text (in the respective language) will be displayed.
3681
+
3682
+ **Note:** The `valueStateMessage` would be displayed,
3683
+ when the component is in `Information`, `Critical` or `Negative` value state.
3684
+ *
3685
+ * @example
3686
+ * ```html
3687
+ * <ui5-datetime-picker>
3688
+ * <div slot="header">Custom header content</div>
3689
+ * <p>Default slot content</p>
3690
+ * </ui5-datetime-picker>
3691
+ * ```
3692
+ *
3693
+ * @readonly
3694
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
3695
+ */
3696
+ this.slots = [
3697
+ {
3698
+ "name": "valueStateMessage",
3699
+ "description": "Defines the value state message that will be displayed as pop up under the component.\n\n**Note:** If not specified, a default text (in the respective language) will be displayed.\n\n**Note:** The `valueStateMessage` would be displayed,\nwhen the component is in `Information`, `Critical` or `Negative` value state.",
3700
+ "since": "1.0.0-rc.7"
3701
+ }
3702
+ ];
3084
3703
  this.elementRef = inject(ElementRef);
3085
3704
  this.injector = inject(Injector);
3086
3705
  }
@@ -3271,6 +3890,48 @@ class Dialog {
3271
3890
  * Fired after the component is closed.
3272
3891
  */
3273
3892
  this.ui5Close = output();
3893
+ /**
3894
+ * Available slots for content projection in this component.
3895
+ *
3896
+ * Slots allow you to insert custom content into predefined areas of the web component.
3897
+ * Use the `slot` attribute on child elements to target specific slots.
3898
+ *
3899
+ * - **header**: Defines the header HTML Element.
3900
+
3901
+ **Note:** When a `ui5-bar` is used in the header, you should remove the default dialog's paddings.
3902
+
3903
+ **Note:** If `header` slot is provided, the labelling of the dialog is a responsibility of the application developer.
3904
+ `accessibleName` should be used.
3905
+ * - **footer**: Defines the footer HTML Element.
3906
+
3907
+ **Note:** When a `ui5-bar` is used in the footer, you should remove the default dialog's paddings.
3908
+ * - **(default)**: Defines the content of the Popup.
3909
+ *
3910
+ * @example
3911
+ * ```html
3912
+ * <ui5-dialog>
3913
+ * <div slot="header">Custom header content</div>
3914
+ * <p>Default slot content</p>
3915
+ * </ui5-dialog>
3916
+ * ```
3917
+ *
3918
+ * @readonly
3919
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
3920
+ */
3921
+ this.slots = [
3922
+ {
3923
+ "name": "header",
3924
+ "description": "Defines the header HTML Element.\n\n**Note:** When a `ui5-bar` is used in the header, you should remove the default dialog's paddings.\n\n**Note:** If `header` slot is provided, the labelling of the dialog is a responsibility of the application developer.\n`accessibleName` should be used."
3925
+ },
3926
+ {
3927
+ "name": "footer",
3928
+ "description": "Defines the footer HTML Element.\n\n**Note:** When a `ui5-bar` is used in the footer, you should remove the default dialog's paddings."
3929
+ },
3930
+ {
3931
+ "name": "default",
3932
+ "description": "Defines the content of the Popup."
3933
+ }
3934
+ ];
3274
3935
  this.elementRef = inject(ElementRef);
3275
3936
  this.injector = inject(Injector);
3276
3937
  }
@@ -3568,6 +4229,47 @@ class FileUploader {
3568
4229
  * Event is fired when the size of a file is above the `maxFileSize` property value.
3569
4230
  */
3570
4231
  this.ui5FileSizeExceed = output();
4232
+ /**
4233
+ * Available slots for content projection in this component.
4234
+ *
4235
+ * Slots allow you to insert custom content into predefined areas of the web component.
4236
+ * Use the `slot` attribute on child elements to target specific slots.
4237
+ *
4238
+ * - **(default)**: This slot allows you to add custom content to the component, such as a button or any other interactive element to trigger the file selection dialog.
4239
+
4240
+ **Note:** For best accessibility experience, set a `tabindex` of "-1" on your interactive element, or it will be set automatically.
4241
+ This slot is intended for use cases where you want a button-only file uploader.
4242
+ It is recommended to set `hideInput` property to "true" when using this slot.
4243
+ Not setting `hideInput` may negatively impact the screen reader users.
4244
+ * - **valueStateMessage**: Defines the value state message that will be displayed as pop up under the component.
4245
+
4246
+ **Note:** If not specified, a default text (in the respective language) will be displayed.
4247
+
4248
+ **Note:** The `valueStateMessage` would be displayed,
4249
+ when the component is in `Information`, `Critical` or `Negative` value state.
4250
+ *
4251
+ * @example
4252
+ * ```html
4253
+ * <ui5-file-uploader>
4254
+ * <div slot="header">Custom header content</div>
4255
+ * <p>Default slot content</p>
4256
+ * </ui5-file-uploader>
4257
+ * ```
4258
+ *
4259
+ * @readonly
4260
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
4261
+ */
4262
+ this.slots = [
4263
+ {
4264
+ "name": "default",
4265
+ "description": "This slot allows you to add custom content to the component, such as a button or any other interactive element to trigger the file selection dialog.\n\n**Note:** For best accessibility experience, set a `tabindex` of \"-1\" on your interactive element, or it will be set automatically.\nThis slot is intended for use cases where you want a button-only file uploader.\nIt is recommended to set `hideInput` property to \"true\" when using this slot.\nNot setting `hideInput` may negatively impact the screen reader users."
4266
+ },
4267
+ {
4268
+ "name": "valueStateMessage",
4269
+ "description": "Defines the value state message that will be displayed as pop up under the component.\n\n**Note:** If not specified, a default text (in the respective language) will be displayed.\n\n**Note:** The `valueStateMessage` would be displayed,\nwhen the component is in `Information`, `Critical` or `Negative` value state.",
4270
+ "since": "1.0.0-rc.9"
4271
+ }
4272
+ ];
3571
4273
  this.elementRef = inject(ElementRef);
3572
4274
  this.injector = inject(Injector);
3573
4275
  // Internal signal to track files from change events
@@ -3736,6 +4438,41 @@ class Form {
3736
4438
  to avoid "jumping" effect, caused by the hight difference between texts in "display"("non-edit") mode and the input fields in "edit" mode.
3737
4439
  */
3738
4440
  this.itemSpacing = input("Normal", ...(ngDevMode ? [{ debugName: "itemSpacing" }] : [])); // className is now passed
4441
+ /**
4442
+ * Available slots for content projection in this component.
4443
+ *
4444
+ * Slots allow you to insert custom content into predefined areas of the web component.
4445
+ * Use the `slot` attribute on child elements to target specific slots.
4446
+ *
4447
+ * - **header**: Defines the component header area.
4448
+
4449
+ **Note:** When a `header` is provided, the `headerText` property is ignored.
4450
+ * - **(default)**: Defines the component content - FormGroups or FormItems.
4451
+
4452
+ **Note:** Mixing FormGroups and standalone FormItems (not belonging to a group) is not supported.
4453
+ Either use FormGroups and make sure all FormItems are part of a FormGroup, or use just FormItems without any FormGroups.
4454
+ *
4455
+ * @example
4456
+ * ```html
4457
+ * <ui5-form>
4458
+ * <div slot="header">Custom header content</div>
4459
+ * <p>Default slot content</p>
4460
+ * </ui5-form>
4461
+ * ```
4462
+ *
4463
+ * @readonly
4464
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
4465
+ */
4466
+ this.slots = [
4467
+ {
4468
+ "name": "header",
4469
+ "description": "Defines the component header area.\n\n**Note:** When a `header` is provided, the `headerText` property is ignored."
4470
+ },
4471
+ {
4472
+ "name": "default",
4473
+ "description": "Defines the component content - FormGroups or FormItems.\n\n**Note:** Mixing FormGroups and standalone FormItems (not belonging to a group) is not supported.\nEither use FormGroups and make sure all FormItems are part of a FormGroup, or use just FormItems without any FormGroups."
4474
+ }
4475
+ ];
3739
4476
  this.elementRef = inject(ElementRef);
3740
4477
  this.injector = inject(Injector);
3741
4478
  }
@@ -3812,6 +4549,31 @@ class FormGroup {
3812
4549
  * Defines id (or many ids) of the element (or elements) that label the component.
3813
4550
  */
3814
4551
  this.accessibleNameRef = input(...(ngDevMode ? [undefined, { debugName: "accessibleNameRef" }] : [])); // className is now passed
4552
+ /**
4553
+ * Available slots for content projection in this component.
4554
+ *
4555
+ * Slots allow you to insert custom content into predefined areas of the web component.
4556
+ * Use the `slot` attribute on child elements to target specific slots.
4557
+ *
4558
+ * - **(default)**: Defines the items of the component.
4559
+ *
4560
+ * @example
4561
+ * ```html
4562
+ * <ui5-form-group>
4563
+ * <div slot="header">Custom header content</div>
4564
+ * <p>Default slot content</p>
4565
+ * </ui5-form-group>
4566
+ * ```
4567
+ *
4568
+ * @readonly
4569
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
4570
+ */
4571
+ this.slots = [
4572
+ {
4573
+ "name": "default",
4574
+ "description": "Defines the items of the component."
4575
+ }
4576
+ ];
3815
4577
  this.elementRef = inject(ElementRef);
3816
4578
  this.injector = inject(Injector);
3817
4579
  }
@@ -3871,6 +4633,37 @@ class FormItem {
3871
4633
  A number bigger than the available columns won't take effect.
3872
4634
  */
3873
4635
  this.columnSpan = input(...(ngDevMode ? [undefined, { debugName: "columnSpan" }] : [])); // className is now passed
4636
+ /**
4637
+ * Available slots for content projection in this component.
4638
+ *
4639
+ * Slots allow you to insert custom content into predefined areas of the web component.
4640
+ * Use the `slot` attribute on child elements to target specific slots.
4641
+ *
4642
+ * - **labelContent**: Defines the label of the component.
4643
+ * - **(default)**: Defines the content of the component,
4644
+ associated to `labelContent`.
4645
+ *
4646
+ * @example
4647
+ * ```html
4648
+ * <ui5-form-item>
4649
+ * <div slot="header">Custom header content</div>
4650
+ * <p>Default slot content</p>
4651
+ * </ui5-form-item>
4652
+ * ```
4653
+ *
4654
+ * @readonly
4655
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
4656
+ */
4657
+ this.slots = [
4658
+ {
4659
+ "name": "labelContent",
4660
+ "description": "Defines the label of the component."
4661
+ },
4662
+ {
4663
+ "name": "default",
4664
+ "description": "Defines the content of the component,\nassociated to `labelContent`."
4665
+ }
4666
+ ];
3874
4667
  this.elementRef = inject(ElementRef);
3875
4668
  this.injector = inject(Injector);
3876
4669
  }
@@ -4149,6 +4942,56 @@ class Input {
4149
4942
  * Fired when the suggestions picker is closed.
4150
4943
  */
4151
4944
  this.ui5Close = output();
4945
+ /**
4946
+ * Available slots for content projection in this component.
4947
+ *
4948
+ * Slots allow you to insert custom content into predefined areas of the web component.
4949
+ * Use the `slot` attribute on child elements to target specific slots.
4950
+ *
4951
+ * - **(default)**: Defines the suggestion items.
4952
+
4953
+ **Note:** The suggestions would be displayed only if the `showSuggestions`
4954
+ property is set to `true`.
4955
+
4956
+ **Note:** The `<ui5-suggestion-item>`, `<ui5-suggestion-item-group>` and `ui5-suggestion-item-custom` are recommended to be used as suggestion items.
4957
+ * - **icon**: Defines the icon to be displayed in the component.
4958
+ * - **valueStateMessage**: Defines the value state message that will be displayed as pop up under the component.
4959
+ The value state message slot should contain only one root element.
4960
+
4961
+ **Note:** If not specified, a default text (in the respective language) will be displayed.
4962
+
4963
+ **Note:** The `valueStateMessage` would be displayed,
4964
+ when the component is in `Information`, `Critical` or `Negative` value state.
4965
+
4966
+ **Note:** If the component has `suggestionItems`,
4967
+ the `valueStateMessage` would be displayed as part of the same popover, if used on desktop, or dialog - on phone.
4968
+ *
4969
+ * @example
4970
+ * ```html
4971
+ * <ui5-input>
4972
+ * <div slot="header">Custom header content</div>
4973
+ * <p>Default slot content</p>
4974
+ * </ui5-input>
4975
+ * ```
4976
+ *
4977
+ * @readonly
4978
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
4979
+ */
4980
+ this.slots = [
4981
+ {
4982
+ "name": "default",
4983
+ "description": "Defines the suggestion items.\n\n**Note:** The suggestions would be displayed only if the `showSuggestions`\nproperty is set to `true`.\n\n**Note:** The `<ui5-suggestion-item>`, `<ui5-suggestion-item-group>` and `ui5-suggestion-item-custom` are recommended to be used as suggestion items."
4984
+ },
4985
+ {
4986
+ "name": "icon",
4987
+ "description": "Defines the icon to be displayed in the component."
4988
+ },
4989
+ {
4990
+ "name": "valueStateMessage",
4991
+ "description": "Defines the value state message that will be displayed as pop up under the component.\nThe value state message slot should contain only one root element.\n\n**Note:** If not specified, a default text (in the respective language) will be displayed.\n\n**Note:** The `valueStateMessage` would be displayed,\nwhen the component is in `Information`, `Critical` or `Negative` value state.\n\n**Note:** If the component has `suggestionItems`,\nthe `valueStateMessage` would be displayed as part of the same popover, if used on desktop, or dialog - on phone.",
4992
+ "since": "1.0.0-rc.6"
4993
+ }
4994
+ ];
4152
4995
  this.elementRef = inject(ElementRef);
4153
4996
  this.injector = inject(Injector);
4154
4997
  }
@@ -4258,6 +5101,33 @@ class Label {
4258
5101
  **Note:** for option "Normal" the text will wrap and the words will not be broken based on hyphenation.
4259
5102
  */
4260
5103
  this.wrappingType = input("Normal", ...(ngDevMode ? [{ debugName: "wrappingType" }] : [])); // className is now passed
5104
+ /**
5105
+ * Available slots for content projection in this component.
5106
+ *
5107
+ * Slots allow you to insert custom content into predefined areas of the web component.
5108
+ * Use the `slot` attribute on child elements to target specific slots.
5109
+ *
5110
+ * - **(default)**: Defines the text of the component.
5111
+
5112
+ **Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.
5113
+ *
5114
+ * @example
5115
+ * ```html
5116
+ * <ui5-label>
5117
+ * <div slot="header">Custom header content</div>
5118
+ * <p>Default slot content</p>
5119
+ * </ui5-label>
5120
+ * ```
5121
+ *
5122
+ * @readonly
5123
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
5124
+ */
5125
+ this.slots = [
5126
+ {
5127
+ "name": "default",
5128
+ "description": "Defines the text of the component.\n\n**Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design."
5129
+ }
5130
+ ];
4261
5131
  this.elementRef = inject(ElementRef);
4262
5132
  this.injector = inject(Injector);
4263
5133
  }
@@ -4415,6 +5285,33 @@ class Link {
4415
5285
  or by using the Enter key.
4416
5286
  */
4417
5287
  this.ui5Click = output();
5288
+ /**
5289
+ * Available slots for content projection in this component.
5290
+ *
5291
+ * Slots allow you to insert custom content into predefined areas of the web component.
5292
+ * Use the `slot` attribute on child elements to target specific slots.
5293
+ *
5294
+ * - **(default)**: Defines the text of the component.
5295
+
5296
+ **Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.
5297
+ *
5298
+ * @example
5299
+ * ```html
5300
+ * <ui5-link>
5301
+ * <div slot="header">Custom header content</div>
5302
+ * <p>Default slot content</p>
5303
+ * </ui5-link>
5304
+ * ```
5305
+ *
5306
+ * @readonly
5307
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
5308
+ */
5309
+ this.slots = [
5310
+ {
5311
+ "name": "default",
5312
+ "description": "Defines the text of the component.\n\n**Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design."
5313
+ }
5314
+ ];
4418
5315
  this.elementRef = inject(ElementRef);
4419
5316
  this.injector = inject(Injector);
4420
5317
  }
@@ -4628,7 +5525,42 @@ class List {
4628
5525
 
4629
5526
  **Note:** `move` event is fired only if there was a preceding `move-over` with prevented default action.
4630
5527
  */
4631
- this.ui5Move = output();
5528
+ this.ui5Move = output();
5529
+ /**
5530
+ * Available slots for content projection in this component.
5531
+ *
5532
+ * Slots allow you to insert custom content into predefined areas of the web component.
5533
+ * Use the `slot` attribute on child elements to target specific slots.
5534
+ *
5535
+ * - **(default)**: Defines the items of the component.
5536
+
5537
+ **Note:** Use `ui5-li`, `ui5-li-custom`, and `ui5-li-group` for the intended design.
5538
+ * - **header**: Defines the component header.
5539
+
5540
+ **Note:** When `header` is set, the
5541
+ `headerText` property is ignored.
5542
+ *
5543
+ * @example
5544
+ * ```html
5545
+ * <ui5-list>
5546
+ * <div slot="header">Custom header content</div>
5547
+ * <p>Default slot content</p>
5548
+ * </ui5-list>
5549
+ * ```
5550
+ *
5551
+ * @readonly
5552
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
5553
+ */
5554
+ this.slots = [
5555
+ {
5556
+ "name": "default",
5557
+ "description": "Defines the items of the component.\n\n**Note:** Use `ui5-li`, `ui5-li-custom`, and `ui5-li-group` for the intended design."
5558
+ },
5559
+ {
5560
+ "name": "header",
5561
+ "description": "Defines the component header.\n\n**Note:** When `header` is set, the\n`headerText` property is ignored."
5562
+ }
5563
+ ];
4632
5564
  this.elementRef = inject(ElementRef);
4633
5565
  this.injector = inject(Injector);
4634
5566
  }
@@ -4770,6 +5702,40 @@ class ListItemCustom {
4770
5702
  * Fired when the user clicks on the detail button when type is `Detail`.
4771
5703
  */
4772
5704
  this.ui5DetailClick = output();
5705
+ /**
5706
+ * Available slots for content projection in this component.
5707
+ *
5708
+ * Slots allow you to insert custom content into predefined areas of the web component.
5709
+ * Use the `slot` attribute on child elements to target specific slots.
5710
+ *
5711
+ * - **(default)**: Defines the content of the component.
5712
+ * - **deleteButton**: Defines the delete button, displayed in "Delete" mode.
5713
+ **Note:** While the slot allows custom buttons, to match
5714
+ design guidelines, please use the `ui5-button` component.
5715
+ **Note:** When the slot is not present, a built-in delete button will be displayed.
5716
+ *
5717
+ * @example
5718
+ * ```html
5719
+ * <ui5-li-custom>
5720
+ * <div slot="header">Custom header content</div>
5721
+ * <p>Default slot content</p>
5722
+ * </ui5-li-custom>
5723
+ * ```
5724
+ *
5725
+ * @readonly
5726
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
5727
+ */
5728
+ this.slots = [
5729
+ {
5730
+ "name": "default",
5731
+ "description": "Defines the content of the component."
5732
+ },
5733
+ {
5734
+ "name": "deleteButton",
5735
+ "description": "Defines the delete button, displayed in \"Delete\" mode.\n**Note:** While the slot allows custom buttons, to match\ndesign guidelines, please use the `ui5-button` component.\n**Note:** When the slot is not present, a built-in delete button will be displayed.",
5736
+ "since": "1.9.0"
5737
+ }
5738
+ ];
4773
5739
  this.elementRef = inject(ElementRef);
4774
5740
  this.injector = inject(Injector);
4775
5741
  }
@@ -4872,6 +5838,38 @@ class ListItemGroup {
4872
5838
  **Note:** `move` event is fired only if there was a preceding `move-over` with prevented default action.
4873
5839
  */
4874
5840
  this.ui5Move = output();
5841
+ /**
5842
+ * Available slots for content projection in this component.
5843
+ *
5844
+ * Slots allow you to insert custom content into predefined areas of the web component.
5845
+ * Use the `slot` attribute on child elements to target specific slots.
5846
+ *
5847
+ * - **(default)**: Defines the items of the <code>ui5-li-group</code>.
5848
+ * - **header**: Defines the header of the component.
5849
+
5850
+ **Note:** Using this slot, the default header text of group and the value of `headerText` property will be overwritten.
5851
+ *
5852
+ * @example
5853
+ * ```html
5854
+ * <ui5-li-group>
5855
+ * <div slot="header">Custom header content</div>
5856
+ * <p>Default slot content</p>
5857
+ * </ui5-li-group>
5858
+ * ```
5859
+ *
5860
+ * @readonly
5861
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
5862
+ */
5863
+ this.slots = [
5864
+ {
5865
+ "name": "default",
5866
+ "description": "Defines the items of the <code>ui5-li-group</code>."
5867
+ },
5868
+ {
5869
+ "name": "header",
5870
+ "description": "Defines the header of the component.\n\n**Note:** Using this slot, the default header text of group and the value of `headerText` property will be overwritten."
5871
+ }
5872
+ ];
4875
5873
  this.elementRef = inject(ElementRef);
4876
5874
  this.injector = inject(Injector);
4877
5875
  }
@@ -5030,6 +6028,57 @@ class ListItemStandard {
5030
6028
  * Fired when the user clicks on the detail button when type is `Detail`.
5031
6029
  */
5032
6030
  this.ui5DetailClick = output();
6031
+ /**
6032
+ * Available slots for content projection in this component.
6033
+ *
6034
+ * Slots allow you to insert custom content into predefined areas of the web component.
6035
+ * Use the `slot` attribute on child elements to target specific slots.
6036
+ *
6037
+ * - **(default)**: Defines the custom formatted text of the component.
6038
+
6039
+ **Note:** For optimal text wrapping and a consistent layout, it is strongly recommended to use the `text` property.
6040
+
6041
+ Use the `default` slot only when custom formatting with HTML elements (e.g., `<b>`, `<i>`) is required.
6042
+ Be aware that wrapping (via `wrappingType="Normal"`) may not function correctly with custom HTML content in the `default` slot.
6043
+
6044
+ If both `text` and `default` slot are used, the `text` property takes precedence.
6045
+ * - **image**: **Note:** While the slot allows option for setting custom avatar, to match the
6046
+ design guidelines, please use the `ui5-avatar` with it's default size - S.
6047
+
6048
+ **Note:** If bigger `ui5-avatar` needs to be used, then the size of the
6049
+ `ui5-li` should be customized in order to fit.
6050
+ * - **deleteButton**: Defines the delete button, displayed in "Delete" mode.
6051
+ **Note:** While the slot allows custom buttons, to match
6052
+ design guidelines, please use the `ui5-button` component.
6053
+ **Note:** When the slot is not present, a built-in delete button will be displayed.
6054
+ *
6055
+ * @example
6056
+ * ```html
6057
+ * <ui5-li>
6058
+ * <div slot="header">Custom header content</div>
6059
+ * <p>Default slot content</p>
6060
+ * </ui5-li>
6061
+ * ```
6062
+ *
6063
+ * @readonly
6064
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
6065
+ */
6066
+ this.slots = [
6067
+ {
6068
+ "name": "default",
6069
+ "description": "Defines the custom formatted text of the component.\n\n**Note:** For optimal text wrapping and a consistent layout, it is strongly recommended to use the `text` property.\n\nUse the `default` slot only when custom formatting with HTML elements (e.g., `<b>`, `<i>`) is required.\nBe aware that wrapping (via `wrappingType=\"Normal\"`) may not function correctly with custom HTML content in the `default` slot.\n\nIf both `text` and `default` slot are used, the `text` property takes precedence."
6070
+ },
6071
+ {
6072
+ "name": "image",
6073
+ "description": "**Note:** While the slot allows option for setting custom avatar, to match the\ndesign guidelines, please use the `ui5-avatar` with it's default size - S.\n\n**Note:** If bigger `ui5-avatar` needs to be used, then the size of the\n`ui5-li` should be customized in order to fit.",
6074
+ "since": "2.0.0"
6075
+ },
6076
+ {
6077
+ "name": "deleteButton",
6078
+ "description": "Defines the delete button, displayed in \"Delete\" mode.\n**Note:** While the slot allows custom buttons, to match\ndesign guidelines, please use the `ui5-button` component.\n**Note:** When the slot is not present, a built-in delete button will be displayed.",
6079
+ "since": "1.9.0"
6080
+ }
6081
+ ];
5033
6082
  this.elementRef = inject(ElementRef);
5034
6083
  this.injector = inject(Injector);
5035
6084
  }
@@ -5159,6 +6208,33 @@ class Menu {
5159
6208
  * Fired after the menu is closed.
5160
6209
  */
5161
6210
  this.ui5Close = output();
6211
+ /**
6212
+ * Available slots for content projection in this component.
6213
+ *
6214
+ * Slots allow you to insert custom content into predefined areas of the web component.
6215
+ * Use the `slot` attribute on child elements to target specific slots.
6216
+ *
6217
+ * - **(default)**: Defines the items of this component.
6218
+
6219
+ **Note:** Use `ui5-menu-item` and `ui5-menu-separator` for their intended design.
6220
+ *
6221
+ * @example
6222
+ * ```html
6223
+ * <ui5-menu>
6224
+ * <div slot="header">Custom header content</div>
6225
+ * <p>Default slot content</p>
6226
+ * </ui5-menu>
6227
+ * ```
6228
+ *
6229
+ * @readonly
6230
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
6231
+ */
6232
+ this.slots = [
6233
+ {
6234
+ "name": "default",
6235
+ "description": "Defines the items of this component.\n\n**Note:** Use `ui5-menu-item` and `ui5-menu-separator` for their intended design."
6236
+ }
6237
+ ];
5162
6238
  this.elementRef = inject(ElementRef);
5163
6239
  this.injector = inject(Injector);
5164
6240
  }
@@ -5343,6 +6419,67 @@ class MenuItem {
5343
6419
  * Fired when the user clicks on the detail button when type is `Detail`.
5344
6420
  */
5345
6421
  this.ui5DetailClick = output();
6422
+ /**
6423
+ * Available slots for content projection in this component.
6424
+ *
6425
+ * Slots allow you to insert custom content into predefined areas of the web component.
6426
+ * Use the `slot` attribute on child elements to target specific slots.
6427
+ *
6428
+ * - **(default)**: Defines the items of this component.
6429
+
6430
+ **Note:** The slot can hold menu item and menu separator items.
6431
+
6432
+ If there are items added to this slot, an arrow will be displayed at the end
6433
+ of the item in order to indicate that there are items added. In that case components added
6434
+ to `endContent` slot or `additionalText` content will not be displayed.
6435
+
6436
+ The priority of what will be displayed at the end of the menu item is as follows:
6437
+ sub-menu arrow (if there are items added in `items` slot) -> components added in `endContent` -> text set to `additionalText`.
6438
+ * - **endContent**: Defines the components that should be displayed at the end of the menu item.
6439
+
6440
+ **Note:** It is highly recommended to slot only components of type `ui5-button`,`ui5-link`
6441
+ or `ui5-icon` in order to preserve the intended design. If there are components added to this slot,
6442
+ and there is text set in `additionalText`, it will not be displayed. If there are items added to `items` slot,
6443
+ nether `additionalText` nor components added to this slot would be displayed.
6444
+
6445
+ The priority of what will be displayed at the end of the menu item is as follows:
6446
+ sub-menu arrow (if there are items added in `items` slot) -> components added in `endContent` -> text set to `additionalText`.
6447
+
6448
+ Application developers are responsible for ensuring that interactive elements placed in the `endContent` slot
6449
+ have the correct accessibility behaviour, including their enabled or disabled states.
6450
+ The menu does not manage these aspects when the menu item state changes.
6451
+ * - **deleteButton**: Defines the delete button, displayed in "Delete" mode.
6452
+ **Note:** While the slot allows custom buttons, to match
6453
+ design guidelines, please use the `ui5-button` component.
6454
+ **Note:** When the slot is not present, a built-in delete button will be displayed.
6455
+ *
6456
+ * @example
6457
+ * ```html
6458
+ * <ui5-menu-item>
6459
+ * <div slot="header">Custom header content</div>
6460
+ * <p>Default slot content</p>
6461
+ * </ui5-menu-item>
6462
+ * ```
6463
+ *
6464
+ * @readonly
6465
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
6466
+ */
6467
+ this.slots = [
6468
+ {
6469
+ "name": "default",
6470
+ "description": "Defines the items of this component.\n\n**Note:** The slot can hold menu item and menu separator items.\n\nIf there are items added to this slot, an arrow will be displayed at the end\nof the item in order to indicate that there are items added. In that case components added\nto `endContent` slot or `additionalText` content will not be displayed.\n\nThe priority of what will be displayed at the end of the menu item is as follows:\nsub-menu arrow (if there are items added in `items` slot) -> components added in `endContent` -> text set to `additionalText`."
6471
+ },
6472
+ {
6473
+ "name": "endContent",
6474
+ "description": "Defines the components that should be displayed at the end of the menu item.\n\n**Note:** It is highly recommended to slot only components of type `ui5-button`,`ui5-link`\nor `ui5-icon` in order to preserve the intended design. If there are components added to this slot,\nand there is text set in `additionalText`, it will not be displayed. If there are items added to `items` slot,\nnether `additionalText` nor components added to this slot would be displayed.\n\nThe priority of what will be displayed at the end of the menu item is as follows:\nsub-menu arrow (if there are items added in `items` slot) -> components added in `endContent` -> text set to `additionalText`.\n\nApplication developers are responsible for ensuring that interactive elements placed in the `endContent` slot\nhave the correct accessibility behaviour, including their enabled or disabled states.\nThe menu does not manage these aspects when the menu item state changes.",
6475
+ "since": "2.0.0"
6476
+ },
6477
+ {
6478
+ "name": "deleteButton",
6479
+ "description": "Defines the delete button, displayed in \"Delete\" mode.\n**Note:** While the slot allows custom buttons, to match\ndesign guidelines, please use the `ui5-button` component.\n**Note:** When the slot is not present, a built-in delete button will be displayed.",
6480
+ "since": "1.9.0"
6481
+ }
6482
+ ];
5346
6483
  this.elementRef = inject(ElementRef);
5347
6484
  this.injector = inject(Injector);
5348
6485
  }
@@ -5426,6 +6563,32 @@ class MenuItemGroup {
5426
6563
  * Defines the component's check mode.
5427
6564
  */
5428
6565
  this.checkMode = input("None", ...(ngDevMode ? [{ debugName: "checkMode" }] : [])); // className is now passed
6566
+ /**
6567
+ * Available slots for content projection in this component.
6568
+ *
6569
+ * Slots allow you to insert custom content into predefined areas of the web component.
6570
+ * Use the `slot` attribute on child elements to target specific slots.
6571
+ *
6572
+ * - **(default)**: Defines the items of this component.
6573
+ **Note:** The slot can hold any combination of components of type `ui5-menu-item` or `ui5-menu-separator` or both.
6574
+ *
6575
+ * @example
6576
+ * ```html
6577
+ * <ui5-menu-item-group>
6578
+ * <div slot="header">Custom header content</div>
6579
+ * <p>Default slot content</p>
6580
+ * </ui5-menu-item-group>
6581
+ * ```
6582
+ *
6583
+ * @readonly
6584
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
6585
+ */
6586
+ this.slots = [
6587
+ {
6588
+ "name": "default",
6589
+ "description": "Defines the items of this component.\n**Note:** The slot can hold any combination of components of type `ui5-menu-item` or `ui5-menu-separator` or both."
6590
+ }
6591
+ ];
5429
6592
  this.elementRef = inject(ElementRef);
5430
6593
  this.injector = inject(Injector);
5431
6594
  }
@@ -5524,6 +6687,43 @@ class MessageStrip {
5524
6687
  click/tap or by using the Enter or Space key.
5525
6688
  */
5526
6689
  this.ui5Close = output();
6690
+ /**
6691
+ * Available slots for content projection in this component.
6692
+ *
6693
+ * Slots allow you to insert custom content into predefined areas of the web component.
6694
+ * Use the `slot` attribute on child elements to target specific slots.
6695
+ *
6696
+ * - **(default)**: Defines the text of the component.
6697
+
6698
+ **Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.
6699
+ * - **icon**: Defines the content to be displayed as graphical element within the component.
6700
+
6701
+ **Note:** If no icon is given, the default icon for the component type will be used.
6702
+ The SAP-icons font provides numerous options.
6703
+
6704
+ See all the available icons in the [Icon Explorer](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html).
6705
+ *
6706
+ * @example
6707
+ * ```html
6708
+ * <ui5-message-strip>
6709
+ * <div slot="header">Custom header content</div>
6710
+ * <p>Default slot content</p>
6711
+ * </ui5-message-strip>
6712
+ * ```
6713
+ *
6714
+ * @readonly
6715
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
6716
+ */
6717
+ this.slots = [
6718
+ {
6719
+ "name": "default",
6720
+ "description": "Defines the text of the component.\n\n**Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design."
6721
+ },
6722
+ {
6723
+ "name": "icon",
6724
+ "description": "Defines the content to be displayed as graphical element within the component.\n\n**Note:** If no icon is given, the default icon for the component type will be used.\nThe SAP-icons font provides numerous options.\n\nSee all the available icons in the [Icon Explorer](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html)."
6725
+ }
6726
+ ];
5527
6727
  this.elementRef = inject(ElementRef);
5528
6728
  this.injector = inject(Injector);
5529
6729
  }
@@ -5680,6 +6880,49 @@ class MultiComboBox {
5680
6880
  * Fired when selection is changed by user interaction.
5681
6881
  */
5682
6882
  this.ui5SelectionChange = output();
6883
+ /**
6884
+ * Available slots for content projection in this component.
6885
+ *
6886
+ * Slots allow you to insert custom content into predefined areas of the web component.
6887
+ * Use the `slot` attribute on child elements to target specific slots.
6888
+ *
6889
+ * - **(default)**: Defines the component items.
6890
+ * - **icon**: Defines the icon to be displayed in the component.
6891
+ * - **valueStateMessage**: Defines the value state message that will be displayed as pop up under the component.
6892
+ The value state message slot should contain only one root element.
6893
+
6894
+ **Note:** If not specified, a default text (in the respective language) will be displayed.
6895
+
6896
+ **Note:** The `valueStateMessage` would be displayed,
6897
+ when the component is in `Information`, `Critical` or `Negative` value state.
6898
+ *
6899
+ * @example
6900
+ * ```html
6901
+ * <ui5-multi-combobox>
6902
+ * <div slot="header">Custom header content</div>
6903
+ * <p>Default slot content</p>
6904
+ * </ui5-multi-combobox>
6905
+ * ```
6906
+ *
6907
+ * @readonly
6908
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
6909
+ */
6910
+ this.slots = [
6911
+ {
6912
+ "name": "default",
6913
+ "description": "Defines the component items."
6914
+ },
6915
+ {
6916
+ "name": "icon",
6917
+ "description": "Defines the icon to be displayed in the component.",
6918
+ "since": "1.0.0-rc.9"
6919
+ },
6920
+ {
6921
+ "name": "valueStateMessage",
6922
+ "description": "Defines the value state message that will be displayed as pop up under the component.\nThe value state message slot should contain only one root element.\n\n**Note:** If not specified, a default text (in the respective language) will be displayed.\n\n**Note:** The `valueStateMessage` would be displayed,\nwhen the component is in `Information`, `Critical` or `Negative` value state.",
6923
+ "since": "1.0.0-rc.9"
6924
+ }
6925
+ ];
5683
6926
  this.elementRef = inject(ElementRef);
5684
6927
  this.injector = inject(Injector);
5685
6928
  }
@@ -5854,6 +7097,38 @@ class MultiComboBoxItemGroup {
5854
7097
  **Note:** `move` event is fired only if there was a preceding `move-over` with prevented default action.
5855
7098
  */
5856
7099
  this.ui5Move = output();
7100
+ /**
7101
+ * Available slots for content projection in this component.
7102
+ *
7103
+ * Slots allow you to insert custom content into predefined areas of the web component.
7104
+ * Use the `slot` attribute on child elements to target specific slots.
7105
+ *
7106
+ * - **(default)**: Defines the items of the <code>ui5-mcb-item-group</code>.
7107
+ * - **header**: Defines the header of the component.
7108
+
7109
+ **Note:** Using this slot, the default header text of group and the value of `headerText` property will be overwritten.
7110
+ *
7111
+ * @example
7112
+ * ```html
7113
+ * <ui5-mcb-item-group>
7114
+ * <div slot="header">Custom header content</div>
7115
+ * <p>Default slot content</p>
7116
+ * </ui5-mcb-item-group>
7117
+ * ```
7118
+ *
7119
+ * @readonly
7120
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
7121
+ */
7122
+ this.slots = [
7123
+ {
7124
+ "name": "default",
7125
+ "description": "Defines the items of the <code>ui5-mcb-item-group</code>."
7126
+ },
7127
+ {
7128
+ "name": "header",
7129
+ "description": "Defines the header of the component.\n\n**Note:** Using this slot, the default header text of group and the value of `headerText` property will be overwritten."
7130
+ }
7131
+ ];
5857
7132
  this.elementRef = inject(ElementRef);
5858
7133
  this.injector = inject(Injector);
5859
7134
  }
@@ -6049,6 +7324,61 @@ class MultiInput {
6049
7324
  * Fired when the suggestions picker is closed.
6050
7325
  */
6051
7326
  this.ui5Close = output();
7327
+ /**
7328
+ * Available slots for content projection in this component.
7329
+ *
7330
+ * Slots allow you to insert custom content into predefined areas of the web component.
7331
+ * Use the `slot` attribute on child elements to target specific slots.
7332
+ *
7333
+ * - **tokens**: Defines the component tokens.
7334
+ * - **(default)**: Defines the suggestion items.
7335
+
7336
+ **Note:** The suggestions would be displayed only if the `showSuggestions`
7337
+ property is set to `true`.
7338
+
7339
+ **Note:** The `<ui5-suggestion-item>`, `<ui5-suggestion-item-group>` and `ui5-suggestion-item-custom` are recommended to be used as suggestion items.
7340
+ * - **icon**: Defines the icon to be displayed in the component.
7341
+ * - **valueStateMessage**: Defines the value state message that will be displayed as pop up under the component.
7342
+ The value state message slot should contain only one root element.
7343
+
7344
+ **Note:** If not specified, a default text (in the respective language) will be displayed.
7345
+
7346
+ **Note:** The `valueStateMessage` would be displayed,
7347
+ when the component is in `Information`, `Critical` or `Negative` value state.
7348
+
7349
+ **Note:** If the component has `suggestionItems`,
7350
+ the `valueStateMessage` would be displayed as part of the same popover, if used on desktop, or dialog - on phone.
7351
+ *
7352
+ * @example
7353
+ * ```html
7354
+ * <ui5-multi-input>
7355
+ * <div slot="header">Custom header content</div>
7356
+ * <p>Default slot content</p>
7357
+ * </ui5-multi-input>
7358
+ * ```
7359
+ *
7360
+ * @readonly
7361
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
7362
+ */
7363
+ this.slots = [
7364
+ {
7365
+ "name": "tokens",
7366
+ "description": "Defines the component tokens."
7367
+ },
7368
+ {
7369
+ "name": "default",
7370
+ "description": "Defines the suggestion items.\n\n**Note:** The suggestions would be displayed only if the `showSuggestions`\nproperty is set to `true`.\n\n**Note:** The `<ui5-suggestion-item>`, `<ui5-suggestion-item-group>` and `ui5-suggestion-item-custom` are recommended to be used as suggestion items."
7371
+ },
7372
+ {
7373
+ "name": "icon",
7374
+ "description": "Defines the icon to be displayed in the component."
7375
+ },
7376
+ {
7377
+ "name": "valueStateMessage",
7378
+ "description": "Defines the value state message that will be displayed as pop up under the component.\nThe value state message slot should contain only one root element.\n\n**Note:** If not specified, a default text (in the respective language) will be displayed.\n\n**Note:** The `valueStateMessage` would be displayed,\nwhen the component is in `Information`, `Critical` or `Negative` value state.\n\n**Note:** If the component has `suggestionItems`,\nthe `valueStateMessage` would be displayed as part of the same popover, if used on desktop, or dialog - on phone.",
7379
+ "since": "1.0.0-rc.6"
7380
+ }
7381
+ ];
6052
7382
  this.elementRef = inject(ElementRef);
6053
7383
  this.injector = inject(Injector);
6054
7384
  }
@@ -6160,6 +7490,33 @@ class Option {
6160
7490
  * Defines the selected state of the component.
6161
7491
  */
6162
7492
  this.selected = input(false, ...(ngDevMode ? [{ debugName: "selected", transform: booleanAttribute }] : [{ transform: booleanAttribute }])); // className is now passed
7493
+ /**
7494
+ * Available slots for content projection in this component.
7495
+ *
7496
+ * Slots allow you to insert custom content into predefined areas of the web component.
7497
+ * Use the `slot` attribute on child elements to target specific slots.
7498
+ *
7499
+ * - **(default)**: Defines the text of the component.
7500
+
7501
+ **Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.
7502
+ *
7503
+ * @example
7504
+ * ```html
7505
+ * <ui5-option>
7506
+ * <div slot="header">Custom header content</div>
7507
+ * <p>Default slot content</p>
7508
+ * </ui5-option>
7509
+ * ```
7510
+ *
7511
+ * @readonly
7512
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
7513
+ */
7514
+ this.slots = [
7515
+ {
7516
+ "name": "default",
7517
+ "description": "Defines the text of the component.\n\n**Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design."
7518
+ }
7519
+ ];
6163
7520
  this.elementRef = inject(ElementRef);
6164
7521
  this.injector = inject(Injector);
6165
7522
  }
@@ -6228,6 +7585,31 @@ class OptionCustom {
6228
7585
  * Defines the selected state of the component.
6229
7586
  */
6230
7587
  this.selected = input(false, ...(ngDevMode ? [{ debugName: "selected", transform: booleanAttribute }] : [{ transform: booleanAttribute }])); // className is now passed
7588
+ /**
7589
+ * Available slots for content projection in this component.
7590
+ *
7591
+ * Slots allow you to insert custom content into predefined areas of the web component.
7592
+ * Use the `slot` attribute on child elements to target specific slots.
7593
+ *
7594
+ * - **(default)**: Defines the content of the component.
7595
+ *
7596
+ * @example
7597
+ * ```html
7598
+ * <ui5-option-custom>
7599
+ * <div slot="header">Custom header content</div>
7600
+ * <p>Default slot content</p>
7601
+ * </ui5-option-custom>
7602
+ * ```
7603
+ *
7604
+ * @readonly
7605
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
7606
+ */
7607
+ this.slots = [
7608
+ {
7609
+ "name": "default",
7610
+ "description": "Defines the content of the component."
7611
+ }
7612
+ ];
6231
7613
  this.elementRef = inject(ElementRef);
6232
7614
  this.injector = inject(Injector);
6233
7615
  }
@@ -6323,6 +7705,38 @@ class Panel {
6323
7705
  * Fired when the component is expanded/collapsed by user interaction.
6324
7706
  */
6325
7707
  this.ui5Toggle = output();
7708
+ /**
7709
+ * Available slots for content projection in this component.
7710
+ *
7711
+ * Slots allow you to insert custom content into predefined areas of the web component.
7712
+ * Use the `slot` attribute on child elements to target specific slots.
7713
+ *
7714
+ * - **(default)**: Defines the content of the component. The content is visible only when the component is expanded.
7715
+ * - **header**: Defines the component header area.
7716
+
7717
+ **Note:** When a header is provided, the `headerText` property is ignored.
7718
+ *
7719
+ * @example
7720
+ * ```html
7721
+ * <ui5-panel>
7722
+ * <div slot="header">Custom header content</div>
7723
+ * <p>Default slot content</p>
7724
+ * </ui5-panel>
7725
+ * ```
7726
+ *
7727
+ * @readonly
7728
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
7729
+ */
7730
+ this.slots = [
7731
+ {
7732
+ "name": "default",
7733
+ "description": "Defines the content of the component. The content is visible only when the component is expanded."
7734
+ },
7735
+ {
7736
+ "name": "header",
7737
+ "description": "Defines the component header area.\n\n**Note:** When a header is provided, the `headerText` property is ignored."
7738
+ }
7739
+ ];
6326
7740
  this.elementRef = inject(ElementRef);
6327
7741
  this.injector = inject(Injector);
6328
7742
  }
@@ -6486,6 +7900,41 @@ class Popover {
6486
7900
  * Fired after the component is closed.
6487
7901
  */
6488
7902
  this.ui5Close = output();
7903
+ /**
7904
+ * Available slots for content projection in this component.
7905
+ *
7906
+ * Slots allow you to insert custom content into predefined areas of the web component.
7907
+ * Use the `slot` attribute on child elements to target specific slots.
7908
+ *
7909
+ * - **header**: Defines the header HTML Element.
7910
+ * - **footer**: Defines the footer HTML Element.
7911
+ * - **(default)**: Defines the content of the Popup.
7912
+ *
7913
+ * @example
7914
+ * ```html
7915
+ * <ui5-popover>
7916
+ * <div slot="header">Custom header content</div>
7917
+ * <p>Default slot content</p>
7918
+ * </ui5-popover>
7919
+ * ```
7920
+ *
7921
+ * @readonly
7922
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
7923
+ */
7924
+ this.slots = [
7925
+ {
7926
+ "name": "header",
7927
+ "description": "Defines the header HTML Element."
7928
+ },
7929
+ {
7930
+ "name": "footer",
7931
+ "description": "Defines the footer HTML Element."
7932
+ },
7933
+ {
7934
+ "name": "default",
7935
+ "description": "Defines the content of the Popup."
7936
+ }
7937
+ ];
6489
7938
  this.elementRef = inject(ElementRef);
6490
7939
  this.injector = inject(Injector);
6491
7940
  }
@@ -7147,6 +8596,41 @@ class ResponsivePopover {
7147
8596
  * Fired after the component is closed.
7148
8597
  */
7149
8598
  this.ui5Close = output();
8599
+ /**
8600
+ * Available slots for content projection in this component.
8601
+ *
8602
+ * Slots allow you to insert custom content into predefined areas of the web component.
8603
+ * Use the `slot` attribute on child elements to target specific slots.
8604
+ *
8605
+ * - **header**: Defines the header HTML Element.
8606
+ * - **footer**: Defines the footer HTML Element.
8607
+ * - **(default)**: Defines the content of the Popup.
8608
+ *
8609
+ * @example
8610
+ * ```html
8611
+ * <ui5-responsive-popover>
8612
+ * <div slot="header">Custom header content</div>
8613
+ * <p>Default slot content</p>
8614
+ * </ui5-responsive-popover>
8615
+ * ```
8616
+ *
8617
+ * @readonly
8618
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
8619
+ */
8620
+ this.slots = [
8621
+ {
8622
+ "name": "header",
8623
+ "description": "Defines the header HTML Element."
8624
+ },
8625
+ {
8626
+ "name": "footer",
8627
+ "description": "Defines the footer HTML Element."
8628
+ },
8629
+ {
8630
+ "name": "default",
8631
+ "description": "Defines the content of the Popup."
8632
+ }
8633
+ ];
7150
8634
  this.elementRef = inject(ElementRef);
7151
8635
  this.injector = inject(Injector);
7152
8636
  }
@@ -7264,6 +8748,35 @@ class SegmentedButton {
7264
8748
  * Fired when the selected item changes.
7265
8749
  */
7266
8750
  this.ui5SelectionChange = output();
8751
+ /**
8752
+ * Available slots for content projection in this component.
8753
+ *
8754
+ * Slots allow you to insert custom content into predefined areas of the web component.
8755
+ * Use the `slot` attribute on child elements to target specific slots.
8756
+ *
8757
+ * - **(default)**: Defines the items of `ui5-segmented-button`.
8758
+
8759
+ **Note:** Multiple items are allowed.
8760
+
8761
+ **Note:** Use the `ui5-segmented-button-item` for the intended design.
8762
+ *
8763
+ * @example
8764
+ * ```html
8765
+ * <ui5-segmented-button>
8766
+ * <div slot="header">Custom header content</div>
8767
+ * <p>Default slot content</p>
8768
+ * </ui5-segmented-button>
8769
+ * ```
8770
+ *
8771
+ * @readonly
8772
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
8773
+ */
8774
+ this.slots = [
8775
+ {
8776
+ "name": "default",
8777
+ "description": "Defines the items of `ui5-segmented-button`.\n\n**Note:** Multiple items are allowed.\n\n**Note:** Use the `ui5-segmented-button-item` for the intended design."
8778
+ }
8779
+ ];
7267
8780
  this.elementRef = inject(ElementRef);
7268
8781
  this.injector = inject(Injector);
7269
8782
  // Internal signal to track selectedItems from selection-change events
@@ -7392,6 +8905,33 @@ class SegmentedButtonItem {
7392
8905
  See all the available icons within the [Icon Explorer](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html).
7393
8906
  */
7394
8907
  this.icon = input(...(ngDevMode ? [undefined, { debugName: "icon" }] : [])); // className is now passed
8908
+ /**
8909
+ * Available slots for content projection in this component.
8910
+ *
8911
+ * Slots allow you to insert custom content into predefined areas of the web component.
8912
+ * Use the `slot` attribute on child elements to target specific slots.
8913
+ *
8914
+ * - **(default)**: Defines the text of the component.
8915
+
8916
+ **Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.
8917
+ *
8918
+ * @example
8919
+ * ```html
8920
+ * <ui5-segmented-button-item>
8921
+ * <div slot="header">Custom header content</div>
8922
+ * <p>Default slot content</p>
8923
+ * </ui5-segmented-button-item>
8924
+ * ```
8925
+ *
8926
+ * @readonly
8927
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
8928
+ */
8929
+ this.slots = [
8930
+ {
8931
+ "name": "default",
8932
+ "description": "Defines the text of the component.\n\n**Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design."
8933
+ }
8934
+ ];
7395
8935
  this.elementRef = inject(ElementRef);
7396
8936
  this.injector = inject(Injector);
7397
8937
  }
@@ -7532,6 +9072,62 @@ class Select {
7532
9072
  * Fired after the component's dropdown menu closes.
7533
9073
  */
7534
9074
  this.ui5Close = output();
9075
+ /**
9076
+ * Available slots for content projection in this component.
9077
+ *
9078
+ * Slots allow you to insert custom content into predefined areas of the web component.
9079
+ * Use the `slot` attribute on child elements to target specific slots.
9080
+ *
9081
+ * - **(default)**: Defines the component options.
9082
+
9083
+ **Note:** Only one selected option is allowed.
9084
+ If more than one option is defined as selected, the last one would be considered as the selected one.
9085
+
9086
+ **Note:** Use the `ui5-option` component to define the desired options.
9087
+ * - **valueStateMessage**: Defines the value state message that will be displayed as pop up under the component.
9088
+
9089
+ **Note:** If not specified, a default text (in the respective language) will be displayed.
9090
+
9091
+ **Note:** The `valueStateMessage` would be displayed,
9092
+ when the component is in `Information`, `Critical` or `Negative` value state.
9093
+
9094
+ **Note:** If the component has `suggestionItems`,
9095
+ the `valueStateMessage` would be displayed as part of the same popover, if used on desktop, or dialog - on phone.
9096
+ * - **label**: Defines the HTML element that will be displayed in the component input part,
9097
+ representing the selected option.
9098
+
9099
+ **Note:** If not specified and `ui5-option-custom` is used,
9100
+ either the option's `display-text` or its textContent will be displayed.
9101
+
9102
+ **Note:** If not specified and `ui5-option` is used,
9103
+ the option's textContent will be displayed.
9104
+ *
9105
+ * @example
9106
+ * ```html
9107
+ * <ui5-select>
9108
+ * <div slot="header">Custom header content</div>
9109
+ * <p>Default slot content</p>
9110
+ * </ui5-select>
9111
+ * ```
9112
+ *
9113
+ * @readonly
9114
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
9115
+ */
9116
+ this.slots = [
9117
+ {
9118
+ "name": "default",
9119
+ "description": "Defines the component options.\n\n**Note:** Only one selected option is allowed.\nIf more than one option is defined as selected, the last one would be considered as the selected one.\n\n**Note:** Use the `ui5-option` component to define the desired options."
9120
+ },
9121
+ {
9122
+ "name": "valueStateMessage",
9123
+ "description": "Defines the value state message that will be displayed as pop up under the component.\n\n**Note:** If not specified, a default text (in the respective language) will be displayed.\n\n**Note:** The `valueStateMessage` would be displayed,\nwhen the component is in `Information`, `Critical` or `Negative` value state.\n\n**Note:** If the component has `suggestionItems`,\nthe `valueStateMessage` would be displayed as part of the same popover, if used on desktop, or dialog - on phone."
9124
+ },
9125
+ {
9126
+ "name": "label",
9127
+ "description": "Defines the HTML element that will be displayed in the component input part,\nrepresenting the selected option.\n\n**Note:** If not specified and `ui5-option-custom` is used,\neither the option's `display-text` or its textContent will be displayed.\n\n**Note:** If not specified and `ui5-option` is used,\nthe option's textContent will be displayed.",
9128
+ "since": "1.17.0"
9129
+ }
9130
+ ];
7535
9131
  this.elementRef = inject(ElementRef);
7536
9132
  this.injector = inject(Injector);
7537
9133
  // Internal signal to track selectedOption from change events
@@ -7887,6 +9483,33 @@ class SplitButton {
7887
9483
  * Fired when the user clicks on the arrow action.
7888
9484
  */
7889
9485
  this.ui5ArrowClick = output();
9486
+ /**
9487
+ * Available slots for content projection in this component.
9488
+ *
9489
+ * Slots allow you to insert custom content into predefined areas of the web component.
9490
+ * Use the `slot` attribute on child elements to target specific slots.
9491
+ *
9492
+ * - **(default)**: Defines the text of the component.
9493
+
9494
+ **Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.
9495
+ *
9496
+ * @example
9497
+ * ```html
9498
+ * <ui5-split-button>
9499
+ * <div slot="header">Custom header content</div>
9500
+ * <p>Default slot content</p>
9501
+ * </ui5-split-button>
9502
+ * ```
9503
+ *
9504
+ * @readonly
9505
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
9506
+ */
9507
+ this.slots = [
9508
+ {
9509
+ "name": "default",
9510
+ "description": "Defines the text of the component.\n\n**Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design."
9511
+ }
9512
+ ];
7890
9513
  this.elementRef = inject(ElementRef);
7891
9514
  this.injector = inject(Injector);
7892
9515
  }
@@ -8026,6 +9649,36 @@ class StepInput {
8026
9649
  prevented, the component will not update the value state.
8027
9650
  */
8028
9651
  this.ui5ValueStateChange = output();
9652
+ /**
9653
+ * Available slots for content projection in this component.
9654
+ *
9655
+ * Slots allow you to insert custom content into predefined areas of the web component.
9656
+ * Use the `slot` attribute on child elements to target specific slots.
9657
+ *
9658
+ * - **valueStateMessage**: Defines the value state message that will be displayed as pop up under the component.
9659
+
9660
+ **Note:** If not specified, a default text (in the respective language) will be displayed.
9661
+
9662
+ **Note:** The `valueStateMessage` would be displayed,
9663
+ when the component is in `Information`, `Critical` or `Negative` value state.
9664
+ *
9665
+ * @example
9666
+ * ```html
9667
+ * <ui5-step-input>
9668
+ * <div slot="header">Custom header content</div>
9669
+ * <p>Default slot content</p>
9670
+ * </ui5-step-input>
9671
+ * ```
9672
+ *
9673
+ * @readonly
9674
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
9675
+ */
9676
+ this.slots = [
9677
+ {
9678
+ "name": "valueStateMessage",
9679
+ "description": "Defines the value state message that will be displayed as pop up under the component.\n\n**Note:** If not specified, a default text (in the respective language) will be displayed.\n\n**Note:** The `valueStateMessage` would be displayed,\nwhen the component is in `Information`, `Critical` or `Negative` value state."
9680
+ }
9681
+ ];
8029
9682
  this.elementRef = inject(ElementRef);
8030
9683
  this.injector = inject(Injector);
8031
9684
  }
@@ -8160,7 +9813,32 @@ class SuggestionItemCustom {
8160
9813
  * Defines the text of the `ui5-suggestion-item-custom`.
8161
9814
  **Note:** The text property is considered only for autocomplete.
8162
9815
  */
8163
- this.text = input(...(ngDevMode ? [undefined, { debugName: "text" }] : [])); // className is now passed
9816
+ this.text = input(...(ngDevMode ? [undefined, { debugName: "text" }] : [])); // className is now passed
9817
+ /**
9818
+ * Available slots for content projection in this component.
9819
+ *
9820
+ * Slots allow you to insert custom content into predefined areas of the web component.
9821
+ * Use the `slot` attribute on child elements to target specific slots.
9822
+ *
9823
+ * - **(default)**: Defines the content of the component.
9824
+ *
9825
+ * @example
9826
+ * ```html
9827
+ * <ui5-suggestion-item-custom>
9828
+ * <div slot="header">Custom header content</div>
9829
+ * <p>Default slot content</p>
9830
+ * </ui5-suggestion-item-custom>
9831
+ * ```
9832
+ *
9833
+ * @readonly
9834
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
9835
+ */
9836
+ this.slots = [
9837
+ {
9838
+ "name": "default",
9839
+ "description": "Defines the content of the component."
9840
+ }
9841
+ ];
8164
9842
  this.elementRef = inject(ElementRef);
8165
9843
  this.injector = inject(Injector);
8166
9844
  }
@@ -8241,6 +9919,38 @@ class SuggestionItemGroup {
8241
9919
  **Note:** `move` event is fired only if there was a preceding `move-over` with prevented default action.
8242
9920
  */
8243
9921
  this.ui5Move = output();
9922
+ /**
9923
+ * Available slots for content projection in this component.
9924
+ *
9925
+ * Slots allow you to insert custom content into predefined areas of the web component.
9926
+ * Use the `slot` attribute on child elements to target specific slots.
9927
+ *
9928
+ * - **(default)**: Defines the items of the <code>ui5-suggestion-item-group</code>.
9929
+ * - **header**: Defines the header of the component.
9930
+
9931
+ **Note:** Using this slot, the default header text of group and the value of `headerText` property will be overwritten.
9932
+ *
9933
+ * @example
9934
+ * ```html
9935
+ * <ui5-suggestion-item-group>
9936
+ * <div slot="header">Custom header content</div>
9937
+ * <p>Default slot content</p>
9938
+ * </ui5-suggestion-item-group>
9939
+ * ```
9940
+ *
9941
+ * @readonly
9942
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
9943
+ */
9944
+ this.slots = [
9945
+ {
9946
+ "name": "default",
9947
+ "description": "Defines the items of the <code>ui5-suggestion-item-group</code>."
9948
+ },
9949
+ {
9950
+ "name": "header",
9951
+ "description": "Defines the header of the component.\n\n**Note:** Using this slot, the default header text of group and the value of `headerText` property will be overwritten."
9952
+ }
9953
+ ];
8244
9954
  this.elementRef = inject(ElementRef);
8245
9955
  this.injector = inject(Injector);
8246
9956
  }
@@ -8487,6 +10197,38 @@ class Tab {
8487
10197
  * Defines if the tab is movable.
8488
10198
  */
8489
10199
  this.movable = input(false, ...(ngDevMode ? [{ debugName: "movable", transform: booleanAttribute }] : [{ transform: booleanAttribute }])); // className is now passed
10200
+ /**
10201
+ * Available slots for content projection in this component.
10202
+ *
10203
+ * Slots allow you to insert custom content into predefined areas of the web component.
10204
+ * Use the `slot` attribute on child elements to target specific slots.
10205
+ *
10206
+ * - **(default)**: Holds the content associated with this tab.
10207
+ * - **items**: Defines hierarchies with nested sub tabs.
10208
+
10209
+ **Note:** Use `ui5-tab` and `ui5-tab-separator` for the intended design.
10210
+ *
10211
+ * @example
10212
+ * ```html
10213
+ * <ui5-tab>
10214
+ * <div slot="header">Custom header content</div>
10215
+ * <p>Default slot content</p>
10216
+ * </ui5-tab>
10217
+ * ```
10218
+ *
10219
+ * @readonly
10220
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
10221
+ */
10222
+ this.slots = [
10223
+ {
10224
+ "name": "default",
10225
+ "description": "Holds the content associated with this tab."
10226
+ },
10227
+ {
10228
+ "name": "items",
10229
+ "description": "Defines hierarchies with nested sub tabs.\n\n**Note:** Use `ui5-tab` and `ui5-tab-separator` for the intended design."
10230
+ }
10231
+ ];
8490
10232
  this.elementRef = inject(ElementRef);
8491
10233
  this.injector = inject(Injector);
8492
10234
  }
@@ -8591,6 +10333,47 @@ class TabContainer {
8591
10333
  **Note:** `move` event is fired only if there was a preceding `move-over` with prevented default action.
8592
10334
  */
8593
10335
  this.ui5Move = output();
10336
+ /**
10337
+ * Available slots for content projection in this component.
10338
+ *
10339
+ * Slots allow you to insert custom content into predefined areas of the web component.
10340
+ * Use the `slot` attribute on child elements to target specific slots.
10341
+ *
10342
+ * - **(default)**: Defines the tabs.
10343
+
10344
+ **Note:** Use `ui5-tab` and `ui5-tab-separator` for the intended design.
10345
+ * - **overflowButton**: Defines the button which will open the overflow menu. If nothing is provided to this slot,
10346
+ the default button will be used.
10347
+ * - **startOverflowButton**: Defines the button which will open the start overflow menu if available. If nothing is provided to this slot,
10348
+ the default button will be used.
10349
+ *
10350
+ * @example
10351
+ * ```html
10352
+ * <ui5-tabcontainer>
10353
+ * <div slot="header">Custom header content</div>
10354
+ * <p>Default slot content</p>
10355
+ * </ui5-tabcontainer>
10356
+ * ```
10357
+ *
10358
+ * @readonly
10359
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
10360
+ */
10361
+ this.slots = [
10362
+ {
10363
+ "name": "default",
10364
+ "description": "Defines the tabs.\n\n**Note:** Use `ui5-tab` and `ui5-tab-separator` for the intended design."
10365
+ },
10366
+ {
10367
+ "name": "overflowButton",
10368
+ "description": "Defines the button which will open the overflow menu. If nothing is provided to this slot,\nthe default button will be used.",
10369
+ "since": "1.0.0-rc.9"
10370
+ },
10371
+ {
10372
+ "name": "startOverflowButton",
10373
+ "description": "Defines the button which will open the start overflow menu if available. If nothing is provided to this slot,\nthe default button will be used.",
10374
+ "since": "1.1.0"
10375
+ }
10376
+ ];
8594
10377
  this.elementRef = inject(ElementRef);
8595
10378
  this.injector = inject(Injector);
8596
10379
  }
@@ -8765,6 +10548,50 @@ class Table {
8765
10548
  * Fired when a row action is clicked.
8766
10549
  */
8767
10550
  this.ui5RowActionClick = output();
10551
+ /**
10552
+ * Available slots for content projection in this component.
10553
+ *
10554
+ * Slots allow you to insert custom content into predefined areas of the web component.
10555
+ * Use the `slot` attribute on child elements to target specific slots.
10556
+ *
10557
+ * - **(default)**: Defines the rows of the component.
10558
+
10559
+ **Note:** Use `ui5-table-row` for the intended design.
10560
+ * - **headerRow**: Defines the header row of the component.
10561
+
10562
+ **Note:** Use `ui5-table-header-row` for the intended design.
10563
+ * - **noData**: Defines the custom visualization if there is no data available.
10564
+ * - **features**: Defines the features of the component.
10565
+ *
10566
+ * @example
10567
+ * ```html
10568
+ * <ui5-table>
10569
+ * <div slot="header">Custom header content</div>
10570
+ * <p>Default slot content</p>
10571
+ * </ui5-table>
10572
+ * ```
10573
+ *
10574
+ * @readonly
10575
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
10576
+ */
10577
+ this.slots = [
10578
+ {
10579
+ "name": "default",
10580
+ "description": "Defines the rows of the component.\n\n**Note:** Use `ui5-table-row` for the intended design."
10581
+ },
10582
+ {
10583
+ "name": "headerRow",
10584
+ "description": "Defines the header row of the component.\n\n**Note:** Use `ui5-table-header-row` for the intended design."
10585
+ },
10586
+ {
10587
+ "name": "noData",
10588
+ "description": "Defines the custom visualization if there is no data available."
10589
+ },
10590
+ {
10591
+ "name": "features",
10592
+ "description": "Defines the features of the component."
10593
+ }
10594
+ ];
8768
10595
  this.elementRef = inject(ElementRef);
8769
10596
  this.injector = inject(Injector);
8770
10597
  }
@@ -8840,6 +10667,31 @@ class TableCell {
8840
10667
  * Determines the horizontal alignment of table cells.
8841
10668
  */
8842
10669
  this.horizontalAlign = input(...(ngDevMode ? [undefined, { debugName: "horizontalAlign" }] : [])); // className is now passed
10670
+ /**
10671
+ * Available slots for content projection in this component.
10672
+ *
10673
+ * Slots allow you to insert custom content into predefined areas of the web component.
10674
+ * Use the `slot` attribute on child elements to target specific slots.
10675
+ *
10676
+ * - **(default)**: Defines the content of the component.
10677
+ *
10678
+ * @example
10679
+ * ```html
10680
+ * <ui5-table-cell>
10681
+ * <div slot="header">Custom header content</div>
10682
+ * <p>Default slot content</p>
10683
+ * </ui5-table-cell>
10684
+ * ```
10685
+ *
10686
+ * @readonly
10687
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
10688
+ */
10689
+ this.slots = [
10690
+ {
10691
+ "name": "default",
10692
+ "description": "Defines the content of the component."
10693
+ }
10694
+ ];
8843
10695
  this.elementRef = inject(ElementRef);
8844
10696
  this.injector = inject(Injector);
8845
10697
  }
@@ -9027,6 +10879,39 @@ class TableHeaderCell {
9027
10879
  * Determines the horizontal alignment of table cells.
9028
10880
  */
9029
10881
  this.horizontalAlign = input(...(ngDevMode ? [undefined, { debugName: "horizontalAlign" }] : [])); // className is now passed
10882
+ /**
10883
+ * Available slots for content projection in this component.
10884
+ *
10885
+ * Slots allow you to insert custom content into predefined areas of the web component.
10886
+ * Use the `slot` attribute on child elements to target specific slots.
10887
+ *
10888
+ * - **action**: Defines the action of the column.
10889
+
10890
+ **Note:** While multiple actions are technically possible, this is not supported.
10891
+ * - **(default)**: Defines the content of the component.
10892
+ *
10893
+ * @example
10894
+ * ```html
10895
+ * <ui5-table-header-cell>
10896
+ * <div slot="header">Custom header content</div>
10897
+ * <p>Default slot content</p>
10898
+ * </ui5-table-header-cell>
10899
+ * ```
10900
+ *
10901
+ * @readonly
10902
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
10903
+ */
10904
+ this.slots = [
10905
+ {
10906
+ "name": "action",
10907
+ "description": "Defines the action of the column.\n\n**Note:** While multiple actions are technically possible, this is not supported.",
10908
+ "since": "2.8.0"
10909
+ },
10910
+ {
10911
+ "name": "default",
10912
+ "description": "Defines the content of the component."
10913
+ }
10914
+ ];
9030
10915
  this.elementRef = inject(ElementRef);
9031
10916
  this.injector = inject(Injector);
9032
10917
  }
@@ -9130,6 +11015,33 @@ class TableHeaderRow {
9130
11015
  Note: If used in combination with overflowMode "Scroll", the table needs a defined height for the sticky header to work as expected.
9131
11016
  */
9132
11017
  this.sticky = input(false, ...(ngDevMode ? [{ debugName: "sticky", transform: booleanAttribute }] : [{ transform: booleanAttribute }])); // className is now passed
11018
+ /**
11019
+ * Available slots for content projection in this component.
11020
+ *
11021
+ * Slots allow you to insert custom content into predefined areas of the web component.
11022
+ * Use the `slot` attribute on child elements to target specific slots.
11023
+ *
11024
+ * - **(default)**: Defines the cells of the component.
11025
+
11026
+ **Note:** Use `ui5-table-header-cell` for the intended design.
11027
+ *
11028
+ * @example
11029
+ * ```html
11030
+ * <ui5-table-header-row>
11031
+ * <div slot="header">Custom header content</div>
11032
+ * <p>Default slot content</p>
11033
+ * </ui5-table-header-row>
11034
+ * ```
11035
+ *
11036
+ * @readonly
11037
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
11038
+ */
11039
+ this.slots = [
11040
+ {
11041
+ "name": "default",
11042
+ "description": "Defines the cells of the component.\n\n**Note:** Use `ui5-table-header-cell` for the intended design."
11043
+ }
11044
+ ];
9133
11045
  this.elementRef = inject(ElementRef);
9134
11046
  this.injector = inject(Injector);
9135
11047
  }
@@ -9198,6 +11110,41 @@ class TableRow {
9198
11110
  * Defines whether the row is movable.
9199
11111
  */
9200
11112
  this.movable = input(false, ...(ngDevMode ? [{ debugName: "movable", transform: booleanAttribute }] : [{ transform: booleanAttribute }])); // className is now passed
11113
+ /**
11114
+ * Available slots for content projection in this component.
11115
+ *
11116
+ * Slots allow you to insert custom content into predefined areas of the web component.
11117
+ * Use the `slot` attribute on child elements to target specific slots.
11118
+ *
11119
+ * - **(default)**: Defines the cells of the component.
11120
+
11121
+ **Note:** Use `ui5-table-cell` for the intended design.
11122
+ * - **actions**: Defines the actions of the component.
11123
+
11124
+ **Note:** Use `ui5-table-row-action` or `ui5-table-row-action-navigation` for the intended design.
11125
+ *
11126
+ * @example
11127
+ * ```html
11128
+ * <ui5-table-row>
11129
+ * <div slot="header">Custom header content</div>
11130
+ * <p>Default slot content</p>
11131
+ * </ui5-table-row>
11132
+ * ```
11133
+ *
11134
+ * @readonly
11135
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
11136
+ */
11137
+ this.slots = [
11138
+ {
11139
+ "name": "default",
11140
+ "description": "Defines the cells of the component.\n\n**Note:** Use `ui5-table-cell` for the intended design."
11141
+ },
11142
+ {
11143
+ "name": "actions",
11144
+ "description": "Defines the actions of the component.\n\n**Note:** Use `ui5-table-row-action` or `ui5-table-row-action-navigation` for the intended design.",
11145
+ "since": "2.7.0"
11146
+ }
11147
+ ];
9201
11148
  this.elementRef = inject(ElementRef);
9202
11149
  this.injector = inject(Injector);
9203
11150
  }
@@ -9759,6 +11706,38 @@ class Tag {
9759
11706
  **Note:** The event will be fired if the `interactive` property is `true`
9760
11707
  */
9761
11708
  this.ui5Click = output();
11709
+ /**
11710
+ * Available slots for content projection in this component.
11711
+ *
11712
+ * Slots allow you to insert custom content into predefined areas of the web component.
11713
+ * Use the `slot` attribute on child elements to target specific slots.
11714
+ *
11715
+ * - **(default)**: Defines the text of the component.
11716
+
11717
+ **Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.
11718
+ * - **icon**: Defines the icon to be displayed in the component.
11719
+ *
11720
+ * @example
11721
+ * ```html
11722
+ * <ui5-tag>
11723
+ * <div slot="header">Custom header content</div>
11724
+ * <p>Default slot content</p>
11725
+ * </ui5-tag>
11726
+ * ```
11727
+ *
11728
+ * @readonly
11729
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
11730
+ */
11731
+ this.slots = [
11732
+ {
11733
+ "name": "default",
11734
+ "description": "Defines the text of the component.\n\n**Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design."
11735
+ },
11736
+ {
11737
+ "name": "icon",
11738
+ "description": "Defines the icon to be displayed in the component."
11739
+ }
11740
+ ];
9762
11741
  this.elementRef = inject(ElementRef);
9763
11742
  this.injector = inject(Injector);
9764
11743
  }
@@ -9833,6 +11812,31 @@ class Text {
9833
11812
  * Specifies if an empty indicator should be displayed when there is no text.
9834
11813
  */
9835
11814
  this.emptyIndicatorMode = input("Off", ...(ngDevMode ? [{ debugName: "emptyIndicatorMode" }] : [])); // className is now passed
11815
+ /**
11816
+ * Available slots for content projection in this component.
11817
+ *
11818
+ * Slots allow you to insert custom content into predefined areas of the web component.
11819
+ * Use the `slot` attribute on child elements to target specific slots.
11820
+ *
11821
+ * - **(default)**: Defines the text of the component.
11822
+ *
11823
+ * @example
11824
+ * ```html
11825
+ * <ui5-text>
11826
+ * <div slot="header">Custom header content</div>
11827
+ * <p>Default slot content</p>
11828
+ * </ui5-text>
11829
+ * ```
11830
+ *
11831
+ * @readonly
11832
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
11833
+ */
11834
+ this.slots = [
11835
+ {
11836
+ "name": "default",
11837
+ "description": "Defines the text of the component."
11838
+ }
11839
+ ];
9836
11840
  this.elementRef = inject(ElementRef);
9837
11841
  this.injector = inject(Injector);
9838
11842
  }
@@ -9984,6 +11988,38 @@ class TextArea {
9984
11988
  * Fired when textarea is scrolled.
9985
11989
  */
9986
11990
  this.ui5Scroll = output();
11991
+ /**
11992
+ * Available slots for content projection in this component.
11993
+ *
11994
+ * Slots allow you to insert custom content into predefined areas of the web component.
11995
+ * Use the `slot` attribute on child elements to target specific slots.
11996
+ *
11997
+ * - **valueStateMessage**: Defines the value state message that will be displayed as pop up under the component.
11998
+ The value state message slot should contain only one root element.
11999
+
12000
+ **Note:** If not specified, a default text (in the respective language) will be displayed.
12001
+
12002
+ **Note:** The `valueStateMessage` would be displayed if the component has
12003
+ `valueState` of type `Information`, `Critical` or `Negative`.
12004
+ *
12005
+ * @example
12006
+ * ```html
12007
+ * <ui5-textarea>
12008
+ * <div slot="header">Custom header content</div>
12009
+ * <p>Default slot content</p>
12010
+ * </ui5-textarea>
12011
+ * ```
12012
+ *
12013
+ * @readonly
12014
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
12015
+ */
12016
+ this.slots = [
12017
+ {
12018
+ "name": "valueStateMessage",
12019
+ "description": "Defines the value state message that will be displayed as pop up under the component.\nThe value state message slot should contain only one root element.\n \n**Note:** If not specified, a default text (in the respective language) will be displayed.\n\n**Note:** The `valueStateMessage` would be displayed if the component has\n`valueState` of type `Information`, `Critical` or `Negative`.",
12020
+ "since": "1.0.0-rc.7"
12021
+ }
12022
+ ];
9987
12023
  this.elementRef = inject(ElementRef);
9988
12024
  this.injector = inject(Injector);
9989
12025
  }
@@ -10144,6 +12180,37 @@ class TimePicker {
10144
12180
  * Fired after the value-help dialog of the component is closed.
10145
12181
  */
10146
12182
  this.ui5Close = output();
12183
+ /**
12184
+ * Available slots for content projection in this component.
12185
+ *
12186
+ * Slots allow you to insert custom content into predefined areas of the web component.
12187
+ * Use the `slot` attribute on child elements to target specific slots.
12188
+ *
12189
+ * - **valueStateMessage**: Defines the value state message that will be displayed as pop up under the `ui5-time-picker`.
12190
+
12191
+ **Note:** If not specified, a default text (in the respective language) will be displayed.
12192
+
12193
+ **Note:** The `valueStateMessage` would be displayed,
12194
+ when the `ui5-time-picker` is in `Information`, `Critical` or `Negative` value state.
12195
+ *
12196
+ * @example
12197
+ * ```html
12198
+ * <ui5-time-picker>
12199
+ * <div slot="header">Custom header content</div>
12200
+ * <p>Default slot content</p>
12201
+ * </ui5-time-picker>
12202
+ * ```
12203
+ *
12204
+ * @readonly
12205
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
12206
+ */
12207
+ this.slots = [
12208
+ {
12209
+ "name": "valueStateMessage",
12210
+ "description": "Defines the value state message that will be displayed as pop up under the `ui5-time-picker`.\n\n**Note:** If not specified, a default text (in the respective language) will be displayed.\n\n**Note:** The `valueStateMessage` would be displayed,\nwhen the `ui5-time-picker` is in `Information`, `Critical` or `Negative` value state.",
12211
+ "since": "1.0.0-rc.8"
12212
+ }
12213
+ ];
10147
12214
  this.elementRef = inject(ElementRef);
10148
12215
  this.injector = inject(Injector);
10149
12216
  }
@@ -10246,6 +12313,34 @@ class Title {
10246
12313
  Available options are: `"H6"` to `"H1"`.
10247
12314
  */
10248
12315
  this.size = input("H5", ...(ngDevMode ? [{ debugName: "size" }] : [])); // className is now passed
12316
+ /**
12317
+ * Available slots for content projection in this component.
12318
+ *
12319
+ * Slots allow you to insert custom content into predefined areas of the web component.
12320
+ * Use the `slot` attribute on child elements to target specific slots.
12321
+ *
12322
+ * - **(default)**: Defines the text of the component.
12323
+ This component supports nesting a `Link` component inside.
12324
+
12325
+ **Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.
12326
+ *
12327
+ * @example
12328
+ * ```html
12329
+ * <ui5-title>
12330
+ * <div slot="header">Custom header content</div>
12331
+ * <p>Default slot content</p>
12332
+ * </ui5-title>
12333
+ * ```
12334
+ *
12335
+ * @readonly
12336
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
12337
+ */
12338
+ this.slots = [
12339
+ {
12340
+ "name": "default",
12341
+ "description": "Defines the text of the component.\nThis component supports nesting a `Link` component inside.\n\n**Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design."
12342
+ }
12343
+ ];
10249
12344
  this.elementRef = inject(ElementRef);
10250
12345
  this.injector = inject(Injector);
10251
12346
  }
@@ -10314,6 +12409,33 @@ class Toast {
10314
12409
  * Fired after the component is auto closed.
10315
12410
  */
10316
12411
  this.ui5Close = output();
12412
+ /**
12413
+ * Available slots for content projection in this component.
12414
+ *
12415
+ * Slots allow you to insert custom content into predefined areas of the web component.
12416
+ * Use the `slot` attribute on child elements to target specific slots.
12417
+ *
12418
+ * - **(default)**: Defines the text of the component.
12419
+
12420
+ **Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.
12421
+ *
12422
+ * @example
12423
+ * ```html
12424
+ * <ui5-toast>
12425
+ * <div slot="header">Custom header content</div>
12426
+ * <p>Default slot content</p>
12427
+ * </ui5-toast>
12428
+ * ```
12429
+ *
12430
+ * @readonly
12431
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
12432
+ */
12433
+ this.slots = [
12434
+ {
12435
+ "name": "default",
12436
+ "description": "Defines the text of the component.\n\n**Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design."
12437
+ }
12438
+ ];
10317
12439
  this.elementRef = inject(ElementRef);
10318
12440
  this.injector = inject(Injector);
10319
12441
  }
@@ -10483,6 +12605,39 @@ class ToggleButton {
10483
12605
  **Note:** The event will not be fired if the `disabled` property is set to `true`.
10484
12606
  */
10485
12607
  this.ui5Click = output();
12608
+ /**
12609
+ * Available slots for content projection in this component.
12610
+ *
12611
+ * Slots allow you to insert custom content into predefined areas of the web component.
12612
+ * Use the `slot` attribute on child elements to target specific slots.
12613
+ *
12614
+ * - **(default)**: Defines the text of the component.
12615
+
12616
+ **Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.
12617
+ * - **badge**: Adds a badge to the button.
12618
+ *
12619
+ * @example
12620
+ * ```html
12621
+ * <ui5-toggle-button>
12622
+ * <div slot="header">Custom header content</div>
12623
+ * <p>Default slot content</p>
12624
+ * </ui5-toggle-button>
12625
+ * ```
12626
+ *
12627
+ * @readonly
12628
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
12629
+ */
12630
+ this.slots = [
12631
+ {
12632
+ "name": "default",
12633
+ "description": "Defines the text of the component.\n\n**Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design."
12634
+ },
12635
+ {
12636
+ "name": "badge",
12637
+ "description": "Adds a badge to the button.",
12638
+ "since": "2.7.0"
12639
+ }
12640
+ ];
10486
12641
  this.elementRef = inject(ElementRef);
10487
12642
  this.injector = inject(Injector);
10488
12643
  }
@@ -10566,6 +12721,33 @@ class Token {
10566
12721
  * Defines whether the component is selected or not.
10567
12722
  */
10568
12723
  this.selected = input(false, ...(ngDevMode ? [{ debugName: "selected", transform: booleanAttribute }] : [{ transform: booleanAttribute }])); // className is now passed
12724
+ /**
12725
+ * Available slots for content projection in this component.
12726
+ *
12727
+ * Slots allow you to insert custom content into predefined areas of the web component.
12728
+ * Use the `slot` attribute on child elements to target specific slots.
12729
+ *
12730
+ * - **closeIcon**: Defines the close icon for the token. If nothing is provided to this slot, the default close icon will be used.
12731
+ Accepts `ui5-icon`.
12732
+ *
12733
+ * @example
12734
+ * ```html
12735
+ * <ui5-token>
12736
+ * <div slot="header">Custom header content</div>
12737
+ * <p>Default slot content</p>
12738
+ * </ui5-token>
12739
+ * ```
12740
+ *
12741
+ * @readonly
12742
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
12743
+ */
12744
+ this.slots = [
12745
+ {
12746
+ "name": "closeIcon",
12747
+ "description": "Defines the close icon for the token. If nothing is provided to this slot, the default close icon will be used.\nAccepts `ui5-icon`.",
12748
+ "since": "1.0.0-rc.9"
12749
+ }
12750
+ ];
10569
12751
  this.elementRef = inject(ElementRef);
10570
12752
  this.injector = inject(Injector);
10571
12753
  }
@@ -10662,6 +12844,31 @@ class Tokenizer {
10662
12844
  * Fired when token selection is changed by user interaction
10663
12845
  */
10664
12846
  this.ui5SelectionChange = output();
12847
+ /**
12848
+ * Available slots for content projection in this component.
12849
+ *
12850
+ * Slots allow you to insert custom content into predefined areas of the web component.
12851
+ * Use the `slot` attribute on child elements to target specific slots.
12852
+ *
12853
+ * - **(default)**: Defines the tokens to be displayed.
12854
+ *
12855
+ * @example
12856
+ * ```html
12857
+ * <ui5-tokenizer>
12858
+ * <div slot="header">Custom header content</div>
12859
+ * <p>Default slot content</p>
12860
+ * </ui5-tokenizer>
12861
+ * ```
12862
+ *
12863
+ * @readonly
12864
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
12865
+ */
12866
+ this.slots = [
12867
+ {
12868
+ "name": "default",
12869
+ "description": "Defines the tokens to be displayed."
12870
+ }
12871
+ ];
10665
12872
  this.elementRef = inject(ElementRef);
10666
12873
  this.injector = inject(Injector);
10667
12874
  }
@@ -10746,6 +12953,33 @@ class Toolbar {
10746
12953
  * Defines the toolbar design.
10747
12954
  */
10748
12955
  this.design = input("Solid", ...(ngDevMode ? [{ debugName: "design" }] : [])); // className is now passed
12956
+ /**
12957
+ * Available slots for content projection in this component.
12958
+ *
12959
+ * Slots allow you to insert custom content into predefined areas of the web component.
12960
+ * Use the `slot` attribute on child elements to target specific slots.
12961
+ *
12962
+ * - **(default)**: Defines the items of the component.
12963
+
12964
+ **Note:** Currently only `ui5-toolbar-button`, `ui5-toolbar-select`, `ui5-toolbar-separator` and `ui5-toolbar-spacer` are allowed here.
12965
+ *
12966
+ * @example
12967
+ * ```html
12968
+ * <ui5-toolbar>
12969
+ * <div slot="header">Custom header content</div>
12970
+ * <p>Default slot content</p>
12971
+ * </ui5-toolbar>
12972
+ * ```
12973
+ *
12974
+ * @readonly
12975
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
12976
+ */
12977
+ this.slots = [
12978
+ {
12979
+ "name": "default",
12980
+ "description": "Defines the items of the component.\n\n**Note:** Currently only `ui5-toolbar-button`, `ui5-toolbar-select`, `ui5-toolbar-separator` and `ui5-toolbar-spacer` are allowed here."
12981
+ }
12982
+ ];
10749
12983
  this.elementRef = inject(ElementRef);
10750
12984
  this.injector = inject(Injector);
10751
12985
  }
@@ -10857,6 +13091,15 @@ class ToolbarButton {
10857
13091
  * Button text
10858
13092
  */
10859
13093
  this.text = input(...(ngDevMode ? [undefined, { debugName: "text" }] : []));
13094
+ /**
13095
+ * Defines whether the button text should only be displayed in the overflow popover.
13096
+
13097
+ When set to `true`, the button appears as icon-only in the main toolbar,
13098
+ but shows both icon and text when moved to the overflow popover.
13099
+
13100
+ **Note:** This property only takes effect when the `text` property is also set.
13101
+ */
13102
+ this.showOverflowText = input(false, ...(ngDevMode ? [{ debugName: "showOverflowText", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
10860
13103
  /**
10861
13104
  * Defines the width of the button.
10862
13105
 
@@ -10899,6 +13142,7 @@ class ToolbarButton {
10899
13142
  'accessibleNameRef',
10900
13143
  'accessibilityAttributes',
10901
13144
  'text',
13145
+ 'showOverflowText',
10902
13146
  'width',
10903
13147
  'overflowPriority',
10904
13148
  'preventOverflowClosing',
@@ -10938,7 +13182,7 @@ class ToolbarButton {
10938
13182
  }
10939
13183
  }
10940
13184
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: ToolbarButton, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
10941
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.1.4", type: ToolbarButton, isStandalone: true, selector: "ui5-toolbar-button, [ui5-toolbar-button]", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, design: { classPropertyName: "design", publicName: "design", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, endIcon: { classPropertyName: "endIcon", publicName: "endIcon", isSignal: true, isRequired: false, transformFunction: null }, tooltip: { classPropertyName: "tooltip", publicName: "tooltip", isSignal: true, isRequired: false, transformFunction: null }, accessibleName: { classPropertyName: "accessibleName", publicName: "accessibleName", isSignal: true, isRequired: false, transformFunction: null }, accessibleNameRef: { classPropertyName: "accessibleNameRef", publicName: "accessibleNameRef", isSignal: true, isRequired: false, transformFunction: null }, accessibilityAttributes: { classPropertyName: "accessibilityAttributes", publicName: "accessibilityAttributes", isSignal: true, isRequired: false, transformFunction: null }, text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, overflowPriority: { classPropertyName: "overflowPriority", publicName: "overflowPriority", isSignal: true, isRequired: false, transformFunction: null }, preventOverflowClosing: { classPropertyName: "preventOverflowClosing", publicName: "preventOverflowClosing", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ui5Click: "ui5Click" }, exportAs: ["ui5ToolbarButton"], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
13185
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.1.4", type: ToolbarButton, isStandalone: true, selector: "ui5-toolbar-button, [ui5-toolbar-button]", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, design: { classPropertyName: "design", publicName: "design", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, endIcon: { classPropertyName: "endIcon", publicName: "endIcon", isSignal: true, isRequired: false, transformFunction: null }, tooltip: { classPropertyName: "tooltip", publicName: "tooltip", isSignal: true, isRequired: false, transformFunction: null }, accessibleName: { classPropertyName: "accessibleName", publicName: "accessibleName", isSignal: true, isRequired: false, transformFunction: null }, accessibleNameRef: { classPropertyName: "accessibleNameRef", publicName: "accessibleNameRef", isSignal: true, isRequired: false, transformFunction: null }, accessibilityAttributes: { classPropertyName: "accessibilityAttributes", publicName: "accessibilityAttributes", isSignal: true, isRequired: false, transformFunction: null }, text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null }, showOverflowText: { classPropertyName: "showOverflowText", publicName: "showOverflowText", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, overflowPriority: { classPropertyName: "overflowPriority", publicName: "overflowPriority", isSignal: true, isRequired: false, transformFunction: null }, preventOverflowClosing: { classPropertyName: "preventOverflowClosing", publicName: "preventOverflowClosing", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ui5Click: "ui5Click" }, exportAs: ["ui5ToolbarButton"], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
10942
13186
  }
10943
13187
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: ToolbarButton, decorators: [{
10944
13188
  type: Component,
@@ -11003,6 +13247,43 @@ class ToolbarSelect {
11003
13247
  * Fired after the component's dropdown menu closes.
11004
13248
  */
11005
13249
  this.ui5Close = output();
13250
+ /**
13251
+ * Available slots for content projection in this component.
13252
+ *
13253
+ * Slots allow you to insert custom content into predefined areas of the web component.
13254
+ * Use the `slot` attribute on child elements to target specific slots.
13255
+ *
13256
+ * - **(default)**: Defines the component options.
13257
+
13258
+ **Note:** Only one selected option is allowed.
13259
+ If more than one option is defined as selected, the last one would be considered as the selected one.
13260
+
13261
+ **Note:** Use the `ui5-toolbar-select-option` component to define the desired options.
13262
+ * - **label**: Defines the HTML element that will be displayed in the component input part,
13263
+ representing the selected option.
13264
+ *
13265
+ * @example
13266
+ * ```html
13267
+ * <ui5-toolbar-select>
13268
+ * <div slot="header">Custom header content</div>
13269
+ * <p>Default slot content</p>
13270
+ * </ui5-toolbar-select>
13271
+ * ```
13272
+ *
13273
+ * @readonly
13274
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
13275
+ */
13276
+ this.slots = [
13277
+ {
13278
+ "name": "default",
13279
+ "description": "Defines the component options.\n\n**Note:** Only one selected option is allowed.\nIf more than one option is defined as selected, the last one would be considered as the selected one.\n\n**Note:** Use the `ui5-toolbar-select-option` component to define the desired options."
13280
+ },
13281
+ {
13282
+ "name": "label",
13283
+ "description": "Defines the HTML element that will be displayed in the component input part,\nrepresenting the selected option.",
13284
+ "since": "2.15.0"
13285
+ }
13286
+ ];
11006
13287
  this.elementRef = inject(ElementRef);
11007
13288
  this.injector = inject(Injector);
11008
13289
  }
@@ -11077,6 +13358,33 @@ class ToolbarSelectOption {
11077
13358
  * Defines the selected state of the component.
11078
13359
  */
11079
13360
  this.selected = input(false, ...(ngDevMode ? [{ debugName: "selected", transform: booleanAttribute }] : [{ transform: booleanAttribute }])); // className is now passed
13361
+ /**
13362
+ * Available slots for content projection in this component.
13363
+ *
13364
+ * Slots allow you to insert custom content into predefined areas of the web component.
13365
+ * Use the `slot` attribute on child elements to target specific slots.
13366
+ *
13367
+ * - **(default)**: Defines the text of the component.
13368
+
13369
+ **Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.
13370
+ *
13371
+ * @example
13372
+ * ```html
13373
+ * <ui5-toolbar-select-option>
13374
+ * <div slot="header">Custom header content</div>
13375
+ * <p>Default slot content</p>
13376
+ * </ui5-toolbar-select-option>
13377
+ * ```
13378
+ *
13379
+ * @readonly
13380
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
13381
+ */
13382
+ this.slots = [
13383
+ {
13384
+ "name": "default",
13385
+ "description": "Defines the text of the component.\n\n**Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design."
13386
+ }
13387
+ ];
11080
13388
  this.elementRef = inject(ElementRef);
11081
13389
  this.injector = inject(Injector);
11082
13390
  }
@@ -11323,6 +13631,41 @@ class Tree {
11323
13631
  **Note:** The `move` event is fired only if there was a preceding `move-over` event with prevented default action.
11324
13632
  */
11325
13633
  this.ui5MoveOver = output();
13634
+ /**
13635
+ * Available slots for content projection in this component.
13636
+ *
13637
+ * Slots allow you to insert custom content into predefined areas of the web component.
13638
+ * Use the `slot` attribute on child elements to target specific slots.
13639
+ *
13640
+ * - **(default)**: Defines the items of the component. Tree items may have other tree items as children.
13641
+
13642
+ **Note:** Use `ui5-tree-item` for the intended design.
13643
+ * - **header**: Defines the component header.
13644
+
13645
+ **Note:** When the `header` slot is set, the
13646
+ `headerText` property is ignored.
13647
+ *
13648
+ * @example
13649
+ * ```html
13650
+ * <ui5-tree>
13651
+ * <div slot="header">Custom header content</div>
13652
+ * <p>Default slot content</p>
13653
+ * </ui5-tree>
13654
+ * ```
13655
+ *
13656
+ * @readonly
13657
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
13658
+ */
13659
+ this.slots = [
13660
+ {
13661
+ "name": "default",
13662
+ "description": "Defines the items of the component. Tree items may have other tree items as children.\n\n**Note:** Use `ui5-tree-item` for the intended design."
13663
+ },
13664
+ {
13665
+ "name": "header",
13666
+ "description": "Defines the component header.\n\n**Note:** When the `header` slot is set, the\n`headerText` property is ignored."
13667
+ }
13668
+ ];
11326
13669
  this.elementRef = inject(ElementRef);
11327
13670
  this.injector = inject(Injector);
11328
13671
  }
@@ -11491,6 +13834,52 @@ class TreeItem {
11491
13834
  * Fired when the user clicks on the detail button when type is `Detail`.
11492
13835
  */
11493
13836
  this.ui5DetailClick = output();
13837
+ /**
13838
+ * Available slots for content projection in this component.
13839
+ *
13840
+ * Slots allow you to insert custom content into predefined areas of the web component.
13841
+ * Use the `slot` attribute on child elements to target specific slots.
13842
+ *
13843
+ * - **(default)**: Defines the items of the component.
13844
+
13845
+ **Note:** Use `ui5-tree-item` or `ui5-tree-item-custom`
13846
+ * - **image**: **Note:** While the slot allows option for setting custom avatar, to match the
13847
+ design guidelines, please use the `ui5-avatar` with size XS.
13848
+
13849
+ **Note:** If bigger `ui5-avatar` needs to be used, then the size of the
13850
+ `ui5-tree-item` should be customized in order to fit.
13851
+ * - **deleteButton**: Defines the delete button, displayed in "Delete" mode.
13852
+ **Note:** While the slot allows custom buttons, to match
13853
+ design guidelines, please use the `ui5-button` component.
13854
+ **Note:** When the slot is not present, a built-in delete button will be displayed.
13855
+ *
13856
+ * @example
13857
+ * ```html
13858
+ * <ui5-tree-item>
13859
+ * <div slot="header">Custom header content</div>
13860
+ * <p>Default slot content</p>
13861
+ * </ui5-tree-item>
13862
+ * ```
13863
+ *
13864
+ * @readonly
13865
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
13866
+ */
13867
+ this.slots = [
13868
+ {
13869
+ "name": "default",
13870
+ "description": "Defines the items of the component.\n\n**Note:** Use `ui5-tree-item` or `ui5-tree-item-custom`"
13871
+ },
13872
+ {
13873
+ "name": "image",
13874
+ "description": "**Note:** While the slot allows option for setting custom avatar, to match the\ndesign guidelines, please use the `ui5-avatar` with size XS.\n\n**Note:** If bigger `ui5-avatar` needs to be used, then the size of the\n`ui5-tree-item` should be customized in order to fit.",
13875
+ "since": "2.10.0"
13876
+ },
13877
+ {
13878
+ "name": "deleteButton",
13879
+ "description": "Defines the delete button, displayed in \"Delete\" mode.\n**Note:** While the slot allows custom buttons, to match\ndesign guidelines, please use the `ui5-button` component.\n**Note:** When the slot is not present, a built-in delete button will be displayed.",
13880
+ "since": "1.9.0"
13881
+ }
13882
+ ];
11494
13883
  this.elementRef = inject(ElementRef);
11495
13884
  this.injector = inject(Injector);
11496
13885
  }
@@ -11655,6 +14044,57 @@ class TreeItemCustom {
11655
14044
  * Fired when the user clicks on the detail button when type is `Detail`.
11656
14045
  */
11657
14046
  this.ui5DetailClick = output();
14047
+ /**
14048
+ * Available slots for content projection in this component.
14049
+ *
14050
+ * Slots allow you to insert custom content into predefined areas of the web component.
14051
+ * Use the `slot` attribute on child elements to target specific slots.
14052
+ *
14053
+ * - **content**: Defines the content of the `ui5-tree-item`.
14054
+ * - **(default)**: Defines the items of the component.
14055
+
14056
+ **Note:** Use `ui5-tree-item` or `ui5-tree-item-custom`
14057
+ * - **image**: **Note:** While the slot allows option for setting custom avatar, to match the
14058
+ design guidelines, please use the `ui5-avatar` with size XS.
14059
+
14060
+ **Note:** If bigger `ui5-avatar` needs to be used, then the size of the
14061
+ `ui5-tree-item` should be customized in order to fit.
14062
+ * - **deleteButton**: Defines the delete button, displayed in "Delete" mode.
14063
+ **Note:** While the slot allows custom buttons, to match
14064
+ design guidelines, please use the `ui5-button` component.
14065
+ **Note:** When the slot is not present, a built-in delete button will be displayed.
14066
+ *
14067
+ * @example
14068
+ * ```html
14069
+ * <ui5-tree-item-custom>
14070
+ * <div slot="header">Custom header content</div>
14071
+ * <p>Default slot content</p>
14072
+ * </ui5-tree-item-custom>
14073
+ * ```
14074
+ *
14075
+ * @readonly
14076
+ * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
14077
+ */
14078
+ this.slots = [
14079
+ {
14080
+ "name": "content",
14081
+ "description": "Defines the content of the `ui5-tree-item`."
14082
+ },
14083
+ {
14084
+ "name": "default",
14085
+ "description": "Defines the items of the component.\n\n**Note:** Use `ui5-tree-item` or `ui5-tree-item-custom`"
14086
+ },
14087
+ {
14088
+ "name": "image",
14089
+ "description": "**Note:** While the slot allows option for setting custom avatar, to match the\ndesign guidelines, please use the `ui5-avatar` with size XS.\n\n**Note:** If bigger `ui5-avatar` needs to be used, then the size of the\n`ui5-tree-item` should be customized in order to fit.",
14090
+ "since": "2.10.0"
14091
+ },
14092
+ {
14093
+ "name": "deleteButton",
14094
+ "description": "Defines the delete button, displayed in \"Delete\" mode.\n**Note:** While the slot allows custom buttons, to match\ndesign guidelines, please use the `ui5-button` component.\n**Note:** When the slot is not present, a built-in delete button will be displayed.",
14095
+ "since": "1.9.0"
14096
+ }
14097
+ ];
11658
14098
  this.elementRef = inject(ElementRef);
11659
14099
  this.injector = inject(Injector);
11660
14100
  }