@fundamental-ngx/ui5-webcomponents 0.58.0-rc.52 → 0.58.0-rc.53
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.
- package/avatar/index.d.ts +34 -0
- package/avatar-group/index.d.ts +38 -0
- package/bar/index.d.ts +25 -0
- package/breadcrumbs/index.d.ts +25 -0
- package/breadcrumbs-item/index.d.ts +25 -0
- package/busy-indicator/index.d.ts +23 -0
- package/button/index.d.ts +31 -0
- package/calendar/index.d.ts +32 -0
- package/calendar-legend/index.d.ts +23 -0
- package/card/index.d.ts +31 -0
- package/card-header/index.d.ts +24 -0
- package/carousel/index.d.ts +26 -0
- package/color-palette/index.d.ts +23 -0
- package/color-palette-popover/index.d.ts +23 -0
- package/combo-box/index.d.ts +36 -0
- package/combo-box-item-group/index.d.ts +26 -0
- package/date-picker/index.d.ts +29 -0
- package/date-range-picker/index.d.ts +29 -0
- package/date-time-picker/index.d.ts +29 -0
- package/dialog/index.d.ts +32 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-avatar-group.mjs +40 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-avatar-group.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-avatar.mjs +41 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-avatar.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-bar.mjs +35 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-bar.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-breadcrumbs-item.mjs +27 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-breadcrumbs-item.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-breadcrumbs.mjs +27 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-breadcrumbs.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-busy-indicator.mjs +25 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-busy-indicator.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-button-badge.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-button.mjs +33 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-button.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-calendar-date-range.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-calendar-date.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-calendar-legend-item.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-calendar-legend.mjs +25 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-calendar-legend.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-calendar.mjs +39 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-calendar.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-card-header.mjs +30 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-card-header.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-card.mjs +33 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-card.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-carousel.mjs +28 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-carousel.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-check-box.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-color-palette-item.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-color-palette-popover.mjs +25 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-color-palette-popover.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-color-palette.mjs +25 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-color-palette.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-color-picker.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-combo-box-item-group.mjs +32 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-combo-box-item-group.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-combo-box-item.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-combo-box.mjs +43 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-combo-box.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-date-picker.mjs +31 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-date-picker.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-date-range-picker.mjs +31 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-date-range-picker.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-date-time-picker.mjs +31 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-date-time-picker.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-dialog.mjs +42 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-dialog.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-dynamic-date-range.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-expandable-text.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-file-uploader.mjs +41 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-file-uploader.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-form-group.mjs +25 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-form-group.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-form-item.mjs +31 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-form-item.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-form.mjs +35 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-form.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-icon.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-input.mjs +50 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-input.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-label.mjs +27 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-label.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-link.mjs +27 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-link.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-list-item-custom.mjs +34 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-list-item-custom.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-list-item-group.mjs +32 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-list-item-group.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-list-item-standard.mjs +51 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-list-item-standard.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-list.mjs +35 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-list.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-menu-item-group.mjs +26 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-menu-item-group.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-menu-item.mjs +61 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-menu-item.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-menu-separator.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-menu.mjs +27 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-menu.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-message-strip.mjs +37 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-message-strip.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-multi-combo-box-item-group.mjs +32 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-multi-combo-box-item-group.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-multi-combo-box-item.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-multi-combo-box.mjs +43 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-multi-combo-box.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-multi-input.mjs +55 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-multi-input.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-option-custom.mjs +25 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-option-custom.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-option.mjs +27 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-option.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-panel.mjs +32 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-panel.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-popover.mjs +35 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-popover.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-progress-indicator.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-radio-button.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-range-slider.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-rating-indicator.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-responsive-popover.mjs +35 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-responsive-popover.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-segmented-button-item.mjs +27 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-segmented-button-item.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-segmented-button.mjs +29 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-segmented-button.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-select.mjs +56 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-select.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-slider.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-special-calendar-date.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-split-button.mjs +27 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-split-button.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-step-input.mjs +30 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-step-input.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-suggestion-item-custom.mjs +25 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-suggestion-item-custom.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-suggestion-item-group.mjs +32 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-suggestion-item-group.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-suggestion-item.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-switch.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-tab-container.mjs +41 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-tab-container.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-tab-separator.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-tab.mjs +32 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-tab.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-table-cell.mjs +25 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-table-cell.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-table-growing.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-table-header-cell-action-a-i.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-table-header-cell.mjs +33 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-table-header-cell.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-table-header-row.mjs +27 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-table-header-row.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-table-row-action-navigation.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-table-row-action.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-table-row.mjs +35 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-table-row.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-table-selection-multi.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-table-selection-single.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-table-selection.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-table-virtualizer.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-table.mjs +44 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-table.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-tag.mjs +32 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-tag.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-text-area.mjs +32 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-text-area.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-text.mjs +25 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-text.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-time-picker.mjs +31 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-time-picker.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-title.mjs +28 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-title.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-toast.mjs +27 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-toast.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-toggle-button.mjs +33 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-toggle-button.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-token.mjs +27 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-token.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-tokenizer.mjs +25 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-tokenizer.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-toolbar-button.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-toolbar-select-option.mjs +27 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-toolbar-select-option.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-toolbar-select.mjs +37 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-toolbar-select.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-toolbar-separator.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-toolbar-spacer.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-toolbar.mjs +27 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-toolbar.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-tree-item-custom.mjs +51 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-tree-item-custom.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-tree-item.mjs +46 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-tree-item.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents-tree.mjs +35 -0
- package/fesm2022/fundamental-ngx-ui5-webcomponents-tree.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-ui5-webcomponents.mjs +2417 -5
- package/fesm2022/fundamental-ngx-ui5-webcomponents.mjs.map +1 -1
- package/file-uploader/index.d.ts +39 -0
- package/form/index.d.ts +29 -0
- package/form-group/index.d.ts +23 -0
- package/form-item/index.d.ts +25 -0
- package/index.d.ts +2107 -0
- package/input/index.d.ts +44 -0
- package/label/index.d.ts +25 -0
- package/link/index.d.ts +25 -0
- package/list/index.d.ts +29 -0
- package/list-item-custom/index.d.ts +32 -0
- package/list-item-group/index.d.ts +26 -0
- package/list-item-standard/index.d.ts +44 -0
- package/menu/index.d.ts +25 -0
- package/menu-item/index.d.ts +54 -0
- package/menu-item-group/index.d.ts +24 -0
- package/message-strip/index.d.ts +31 -0
- package/multi-combo-box/index.d.ts +36 -0
- package/multi-combo-box-item-group/index.d.ts +26 -0
- package/multi-input/index.d.ts +45 -0
- package/option/index.d.ts +25 -0
- package/option-custom/index.d.ts +23 -0
- package/package.json +43 -43
- package/panel/index.d.ts +26 -0
- package/popover/index.d.ts +25 -0
- package/responsive-popover/index.d.ts +25 -0
- package/segmented-button/index.d.ts +27 -0
- package/segmented-button-item/index.d.ts +25 -0
- package/select/index.d.ts +50 -0
- package/split-button/index.d.ts +25 -0
- package/step-input/index.d.ts +28 -0
- package/suggestion-item-custom/index.d.ts +23 -0
- package/suggestion-item-group/index.d.ts +26 -0
- package/tab/index.d.ts +26 -0
- package/tab-container/index.d.ts +34 -0
- package/table/index.d.ts +30 -0
- package/table-cell/index.d.ts +23 -0
- package/table-header-cell/index.d.ts +31 -0
- package/table-header-row/index.d.ts +25 -0
- package/table-row/index.d.ts +33 -0
- package/tag/index.d.ts +26 -0
- package/text/index.d.ts +23 -0
- package/text-area/index.d.ts +30 -0
- package/time-picker/index.d.ts +29 -0
- package/title/index.d.ts +26 -0
- package/toast/index.d.ts +25 -0
- package/toggle-button/index.d.ts +31 -0
- package/token/index.d.ts +25 -0
- package/tokenizer/index.d.ts +23 -0
- package/toolbar/index.d.ts +25 -0
- package/toolbar-select/index.d.ts +35 -0
- package/toolbar-select-option/index.d.ts +25 -0
- package/tree/index.d.ts +29 -0
- package/tree-item/index.d.ts +39 -0
- 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
|
+
`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 `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
|
}
|
|
@@ -560,6 +641,41 @@ class Bar {
|
|
|
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
643
|
this.accessibleRole = input("Toolbar", ...(ngDevMode ? [{ debugName: "accessibleRole" }] : [])); // className is now passed
|
|
644
|
+
/**
|
|
645
|
+
* Available slots for content projection in this component.
|
|
646
|
+
*
|
|
647
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
648
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
649
|
+
*
|
|
650
|
+
* - **startContent**: Defines the content at the start of the bar.
|
|
651
|
+
* - **(default)**: Defines the content in the middle of the bar.
|
|
652
|
+
* - **endContent**: Defines the content at the end of the bar.
|
|
653
|
+
*
|
|
654
|
+
* @example
|
|
655
|
+
* ```html
|
|
656
|
+
* <ui5-bar>
|
|
657
|
+
* <div slot="header">Custom header content</div>
|
|
658
|
+
* <p>Default slot content</p>
|
|
659
|
+
* </ui5-bar>
|
|
660
|
+
* ```
|
|
661
|
+
*
|
|
662
|
+
* @readonly
|
|
663
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
664
|
+
*/
|
|
665
|
+
this.slots = [
|
|
666
|
+
{
|
|
667
|
+
"name": "startContent",
|
|
668
|
+
"description": "Defines the content at the start of the bar."
|
|
669
|
+
},
|
|
670
|
+
{
|
|
671
|
+
"name": "default",
|
|
672
|
+
"description": "Defines the content in the middle of the bar."
|
|
673
|
+
},
|
|
674
|
+
{
|
|
675
|
+
"name": "endContent",
|
|
676
|
+
"description": "Defines the content at the end of the bar."
|
|
677
|
+
}
|
|
678
|
+
];
|
|
563
679
|
this.elementRef = inject(ElementRef);
|
|
564
680
|
this.injector = inject(Injector);
|
|
565
681
|
}
|
|
@@ -625,6 +741,33 @@ class Breadcrumbs {
|
|
|
625
741
|
**Note:** You can prevent browser location change by calling `event.preventDefault()`.
|
|
626
742
|
*/
|
|
627
743
|
this.ui5ItemClick = output();
|
|
744
|
+
/**
|
|
745
|
+
* Available slots for content projection in this component.
|
|
746
|
+
*
|
|
747
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
748
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
749
|
+
*
|
|
750
|
+
* - **(default)**: Defines the component items.
|
|
751
|
+
|
|
752
|
+
**Note:** Use the `ui5-breadcrumbs-item` component to define the desired items.
|
|
753
|
+
*
|
|
754
|
+
* @example
|
|
755
|
+
* ```html
|
|
756
|
+
* <ui5-breadcrumbs>
|
|
757
|
+
* <div slot="header">Custom header content</div>
|
|
758
|
+
* <p>Default slot content</p>
|
|
759
|
+
* </ui5-breadcrumbs>
|
|
760
|
+
* ```
|
|
761
|
+
*
|
|
762
|
+
* @readonly
|
|
763
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
764
|
+
*/
|
|
765
|
+
this.slots = [
|
|
766
|
+
{
|
|
767
|
+
"name": "default",
|
|
768
|
+
"description": "Defines the component items.\n\n**Note:** Use the `ui5-breadcrumbs-item` component to define the desired items."
|
|
769
|
+
}
|
|
770
|
+
];
|
|
628
771
|
this.elementRef = inject(ElementRef);
|
|
629
772
|
this.injector = inject(Injector);
|
|
630
773
|
}
|
|
@@ -711,6 +854,33 @@ class BreadcrumbsItem {
|
|
|
711
854
|
* Defines the accessible ARIA name of the item.
|
|
712
855
|
*/
|
|
713
856
|
this.accessibleName = input(...(ngDevMode ? [undefined, { debugName: "accessibleName" }] : [])); // className is now passed
|
|
857
|
+
/**
|
|
858
|
+
* Available slots for content projection in this component.
|
|
859
|
+
*
|
|
860
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
861
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
862
|
+
*
|
|
863
|
+
* - **(default)**: Defines the text of the component.
|
|
864
|
+
|
|
865
|
+
**Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.
|
|
866
|
+
*
|
|
867
|
+
* @example
|
|
868
|
+
* ```html
|
|
869
|
+
* <ui5-breadcrumbs-item>
|
|
870
|
+
* <div slot="header">Custom header content</div>
|
|
871
|
+
* <p>Default slot content</p>
|
|
872
|
+
* </ui5-breadcrumbs-item>
|
|
873
|
+
* ```
|
|
874
|
+
*
|
|
875
|
+
* @readonly
|
|
876
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
877
|
+
*/
|
|
878
|
+
this.slots = [
|
|
879
|
+
{
|
|
880
|
+
"name": "default",
|
|
881
|
+
"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."
|
|
882
|
+
}
|
|
883
|
+
];
|
|
714
884
|
this.elementRef = inject(ElementRef);
|
|
715
885
|
this.injector = inject(Injector);
|
|
716
886
|
}
|
|
@@ -779,6 +949,31 @@ class BusyIndicator {
|
|
|
779
949
|
* Defines the placement of the text.
|
|
780
950
|
*/
|
|
781
951
|
this.textPlacement = input("Bottom", ...(ngDevMode ? [{ debugName: "textPlacement" }] : [])); // className is now passed
|
|
952
|
+
/**
|
|
953
|
+
* Available slots for content projection in this component.
|
|
954
|
+
*
|
|
955
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
956
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
957
|
+
*
|
|
958
|
+
* - **(default)**: Determines the content over which the component will appear.
|
|
959
|
+
*
|
|
960
|
+
* @example
|
|
961
|
+
* ```html
|
|
962
|
+
* <ui5-busy-indicator>
|
|
963
|
+
* <div slot="header">Custom header content</div>
|
|
964
|
+
* <p>Default slot content</p>
|
|
965
|
+
* </ui5-busy-indicator>
|
|
966
|
+
* ```
|
|
967
|
+
*
|
|
968
|
+
* @readonly
|
|
969
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
970
|
+
*/
|
|
971
|
+
this.slots = [
|
|
972
|
+
{
|
|
973
|
+
"name": "default",
|
|
974
|
+
"description": "Determines the content over which the component will appear."
|
|
975
|
+
}
|
|
976
|
+
];
|
|
782
977
|
this.elementRef = inject(ElementRef);
|
|
783
978
|
this.injector = inject(Injector);
|
|
784
979
|
}
|
|
@@ -931,6 +1126,39 @@ class Button {
|
|
|
931
1126
|
**Note:** The event will not be fired if the `disabled` property is set to `true`.
|
|
932
1127
|
*/
|
|
933
1128
|
this.ui5Click = output();
|
|
1129
|
+
/**
|
|
1130
|
+
* Available slots for content projection in this component.
|
|
1131
|
+
*
|
|
1132
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
1133
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
1134
|
+
*
|
|
1135
|
+
* - **(default)**: Defines the text of the component.
|
|
1136
|
+
|
|
1137
|
+
**Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.
|
|
1138
|
+
* - **badge**: Adds a badge to the button.
|
|
1139
|
+
*
|
|
1140
|
+
* @example
|
|
1141
|
+
* ```html
|
|
1142
|
+
* <ui5-button>
|
|
1143
|
+
* <div slot="header">Custom header content</div>
|
|
1144
|
+
* <p>Default slot content</p>
|
|
1145
|
+
* </ui5-button>
|
|
1146
|
+
* ```
|
|
1147
|
+
*
|
|
1148
|
+
* @readonly
|
|
1149
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
1150
|
+
*/
|
|
1151
|
+
this.slots = [
|
|
1152
|
+
{
|
|
1153
|
+
"name": "default",
|
|
1154
|
+
"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."
|
|
1155
|
+
},
|
|
1156
|
+
{
|
|
1157
|
+
"name": "badge",
|
|
1158
|
+
"description": "Adds a badge to the button.",
|
|
1159
|
+
"since": "2.7.0"
|
|
1160
|
+
}
|
|
1161
|
+
];
|
|
934
1162
|
this.elementRef = inject(ElementRef);
|
|
935
1163
|
this.injector = inject(Injector);
|
|
936
1164
|
}
|
|
@@ -1129,6 +1357,45 @@ class Calendar {
|
|
|
1129
1357
|
create instances of `ui5-date` for the newly selected dates. In that case you should do this manually.
|
|
1130
1358
|
*/
|
|
1131
1359
|
this.ui5SelectionChange = output();
|
|
1360
|
+
/**
|
|
1361
|
+
* Available slots for content projection in this component.
|
|
1362
|
+
*
|
|
1363
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
1364
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
1365
|
+
*
|
|
1366
|
+
* - **calendarLegend**: Defines the calendar legend of the component.
|
|
1367
|
+
* - **(default)**: Defines the selected date or dates (depending on the `selectionMode` property)
|
|
1368
|
+
for this calendar as instances of `ui5-date` or `ui5-date-range`.
|
|
1369
|
+
Use `ui5-date` for single or multiple selection, and `ui5-date-range` for range selection.
|
|
1370
|
+
* - **specialDates**: Defines the special dates, visually emphasized in the calendar.
|
|
1371
|
+
*
|
|
1372
|
+
* @example
|
|
1373
|
+
* ```html
|
|
1374
|
+
* <ui5-calendar>
|
|
1375
|
+
* <div slot="header">Custom header content</div>
|
|
1376
|
+
* <p>Default slot content</p>
|
|
1377
|
+
* </ui5-calendar>
|
|
1378
|
+
* ```
|
|
1379
|
+
*
|
|
1380
|
+
* @readonly
|
|
1381
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
1382
|
+
*/
|
|
1383
|
+
this.slots = [
|
|
1384
|
+
{
|
|
1385
|
+
"name": "calendarLegend",
|
|
1386
|
+
"description": "Defines the calendar legend of the component.",
|
|
1387
|
+
"since": "1.23.0"
|
|
1388
|
+
},
|
|
1389
|
+
{
|
|
1390
|
+
"name": "default",
|
|
1391
|
+
"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."
|
|
1392
|
+
},
|
|
1393
|
+
{
|
|
1394
|
+
"name": "specialDates",
|
|
1395
|
+
"description": "Defines the special dates, visually emphasized in the calendar.",
|
|
1396
|
+
"since": "1.23.0"
|
|
1397
|
+
}
|
|
1398
|
+
];
|
|
1132
1399
|
this.elementRef = inject(ElementRef);
|
|
1133
1400
|
this.injector = inject(Injector);
|
|
1134
1401
|
}
|
|
@@ -1323,6 +1590,31 @@ class CalendarLegend {
|
|
|
1323
1590
|
* Hides the Working day item in the legend.
|
|
1324
1591
|
*/
|
|
1325
1592
|
this.hideWorkingDay = input(false, ...(ngDevMode ? [{ debugName: "hideWorkingDay", transform: booleanAttribute }] : [{ transform: booleanAttribute }])); // className is now passed
|
|
1593
|
+
/**
|
|
1594
|
+
* Available slots for content projection in this component.
|
|
1595
|
+
*
|
|
1596
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
1597
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
1598
|
+
*
|
|
1599
|
+
* - **(default)**: Defines the items of the component.
|
|
1600
|
+
*
|
|
1601
|
+
* @example
|
|
1602
|
+
* ```html
|
|
1603
|
+
* <ui5-calendar-legend>
|
|
1604
|
+
* <div slot="header">Custom header content</div>
|
|
1605
|
+
* <p>Default slot content</p>
|
|
1606
|
+
* </ui5-calendar-legend>
|
|
1607
|
+
* ```
|
|
1608
|
+
*
|
|
1609
|
+
* @readonly
|
|
1610
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
1611
|
+
*/
|
|
1612
|
+
this.slots = [
|
|
1613
|
+
{
|
|
1614
|
+
"name": "default",
|
|
1615
|
+
"description": "Defines the items of the component."
|
|
1616
|
+
}
|
|
1617
|
+
];
|
|
1326
1618
|
this.elementRef = inject(ElementRef);
|
|
1327
1619
|
this.injector = inject(Injector);
|
|
1328
1620
|
}
|
|
@@ -1445,6 +1737,39 @@ class Card {
|
|
|
1445
1737
|
* Defines the delay in milliseconds, after which the loading indicator will show up for this card.
|
|
1446
1738
|
*/
|
|
1447
1739
|
this.loadingDelay = input(1000, ...(ngDevMode ? [{ debugName: "loadingDelay" }] : [])); // className is now passed
|
|
1740
|
+
/**
|
|
1741
|
+
* Available slots for content projection in this component.
|
|
1742
|
+
*
|
|
1743
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
1744
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
1745
|
+
*
|
|
1746
|
+
* - **(default)**: Defines the content of the component.
|
|
1747
|
+
* - **header**: Defines the header of the component.
|
|
1748
|
+
|
|
1749
|
+
**Note:** Use `ui5-card-header` for the intended design.
|
|
1750
|
+
*
|
|
1751
|
+
* @example
|
|
1752
|
+
* ```html
|
|
1753
|
+
* <ui5-card>
|
|
1754
|
+
* <div slot="header">Custom header content</div>
|
|
1755
|
+
* <p>Default slot content</p>
|
|
1756
|
+
* </ui5-card>
|
|
1757
|
+
* ```
|
|
1758
|
+
*
|
|
1759
|
+
* @readonly
|
|
1760
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
1761
|
+
*/
|
|
1762
|
+
this.slots = [
|
|
1763
|
+
{
|
|
1764
|
+
"name": "default",
|
|
1765
|
+
"description": "Defines the content of the component."
|
|
1766
|
+
},
|
|
1767
|
+
{
|
|
1768
|
+
"name": "header",
|
|
1769
|
+
"description": "Defines the header of the component.\n\n**Note:** Use `ui5-card-header` for the intended design.",
|
|
1770
|
+
"since": "1.0.0-rc.15"
|
|
1771
|
+
}
|
|
1772
|
+
];
|
|
1448
1773
|
this.elementRef = inject(ElementRef);
|
|
1449
1774
|
this.injector = inject(Injector);
|
|
1450
1775
|
}
|
|
@@ -1517,6 +1842,36 @@ class CardHeader {
|
|
|
1517
1842
|
**Note:** The event would be fired only if the `interactive` property is set to true.
|
|
1518
1843
|
*/
|
|
1519
1844
|
this.ui5Click = output();
|
|
1845
|
+
/**
|
|
1846
|
+
* Available slots for content projection in this component.
|
|
1847
|
+
*
|
|
1848
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
1849
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
1850
|
+
*
|
|
1851
|
+
* - **avatar**: Defines an avatar image, displayed in the left most part of the header.
|
|
1852
|
+
* - **action**: Defines an action, displayed in the right most part of the header.
|
|
1853
|
+
*
|
|
1854
|
+
* @example
|
|
1855
|
+
* ```html
|
|
1856
|
+
* <ui5-card-header>
|
|
1857
|
+
* <div slot="header">Custom header content</div>
|
|
1858
|
+
* <p>Default slot content</p>
|
|
1859
|
+
* </ui5-card-header>
|
|
1860
|
+
* ```
|
|
1861
|
+
*
|
|
1862
|
+
* @readonly
|
|
1863
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
1864
|
+
*/
|
|
1865
|
+
this.slots = [
|
|
1866
|
+
{
|
|
1867
|
+
"name": "avatar",
|
|
1868
|
+
"description": "Defines an avatar image, displayed in the left most part of the header."
|
|
1869
|
+
},
|
|
1870
|
+
{
|
|
1871
|
+
"name": "action",
|
|
1872
|
+
"description": "Defines an action, displayed in the right most part of the header."
|
|
1873
|
+
}
|
|
1874
|
+
];
|
|
1520
1875
|
this.elementRef = inject(ElementRef);
|
|
1521
1876
|
this.injector = inject(Injector);
|
|
1522
1877
|
}
|
|
@@ -1649,6 +2004,34 @@ class Carousel {
|
|
|
1649
2004
|
based on the `items-per-page` property.
|
|
1650
2005
|
*/
|
|
1651
2006
|
this.ui5Navigate = output();
|
|
2007
|
+
/**
|
|
2008
|
+
* Available slots for content projection in this component.
|
|
2009
|
+
*
|
|
2010
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
2011
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
2012
|
+
*
|
|
2013
|
+
* - **(default)**: Defines the content of the component.
|
|
2014
|
+
|
|
2015
|
+
**Note:** Items with the `hidden` attribute will be automatically excluded from carousel navigation and page calculations.
|
|
2016
|
+
They will not be displayed or accessible via keyboard navigation. See [sample](./#carousel-with-hidden-items).
|
|
2017
|
+
*
|
|
2018
|
+
* @example
|
|
2019
|
+
* ```html
|
|
2020
|
+
* <ui5-carousel>
|
|
2021
|
+
* <div slot="header">Custom header content</div>
|
|
2022
|
+
* <p>Default slot content</p>
|
|
2023
|
+
* </ui5-carousel>
|
|
2024
|
+
* ```
|
|
2025
|
+
*
|
|
2026
|
+
* @readonly
|
|
2027
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
2028
|
+
*/
|
|
2029
|
+
this.slots = [
|
|
2030
|
+
{
|
|
2031
|
+
"name": "default",
|
|
2032
|
+
"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)."
|
|
2033
|
+
}
|
|
2034
|
+
];
|
|
1652
2035
|
this.elementRef = inject(ElementRef);
|
|
1653
2036
|
this.injector = inject(Injector);
|
|
1654
2037
|
}
|
|
@@ -1898,6 +2281,31 @@ class ColorPalette {
|
|
|
1898
2281
|
* Fired when the user selects a color.
|
|
1899
2282
|
*/
|
|
1900
2283
|
this.ui5ItemClick = output();
|
|
2284
|
+
/**
|
|
2285
|
+
* Available slots for content projection in this component.
|
|
2286
|
+
*
|
|
2287
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
2288
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
2289
|
+
*
|
|
2290
|
+
* - **(default)**: Defines the `ui5-color-palette-item` elements.
|
|
2291
|
+
*
|
|
2292
|
+
* @example
|
|
2293
|
+
* ```html
|
|
2294
|
+
* <ui5-color-palette>
|
|
2295
|
+
* <div slot="header">Custom header content</div>
|
|
2296
|
+
* <p>Default slot content</p>
|
|
2297
|
+
* </ui5-color-palette>
|
|
2298
|
+
* ```
|
|
2299
|
+
*
|
|
2300
|
+
* @readonly
|
|
2301
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
2302
|
+
*/
|
|
2303
|
+
this.slots = [
|
|
2304
|
+
{
|
|
2305
|
+
"name": "default",
|
|
2306
|
+
"description": "Defines the `ui5-color-palette-item` elements."
|
|
2307
|
+
}
|
|
2308
|
+
];
|
|
1901
2309
|
this.elementRef = inject(ElementRef);
|
|
1902
2310
|
this.injector = inject(Injector);
|
|
1903
2311
|
}
|
|
@@ -2034,6 +2442,31 @@ class ColorPalettePopover {
|
|
|
2034
2442
|
* Fired when the `ui5-color-palette-popover` is closed due to user interaction.
|
|
2035
2443
|
*/
|
|
2036
2444
|
this.ui5Close = output();
|
|
2445
|
+
/**
|
|
2446
|
+
* Available slots for content projection in this component.
|
|
2447
|
+
*
|
|
2448
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
2449
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
2450
|
+
*
|
|
2451
|
+
* - **(default)**: Defines the content of the component.
|
|
2452
|
+
*
|
|
2453
|
+
* @example
|
|
2454
|
+
* ```html
|
|
2455
|
+
* <ui5-color-palette-popover>
|
|
2456
|
+
* <div slot="header">Custom header content</div>
|
|
2457
|
+
* <p>Default slot content</p>
|
|
2458
|
+
* </ui5-color-palette-popover>
|
|
2459
|
+
* ```
|
|
2460
|
+
*
|
|
2461
|
+
* @readonly
|
|
2462
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
2463
|
+
*/
|
|
2464
|
+
this.slots = [
|
|
2465
|
+
{
|
|
2466
|
+
"name": "default",
|
|
2467
|
+
"description": "Defines the content of the component."
|
|
2468
|
+
}
|
|
2469
|
+
];
|
|
2037
2470
|
this.elementRef = inject(ElementRef);
|
|
2038
2471
|
this.injector = inject(Injector);
|
|
2039
2472
|
}
|
|
@@ -2270,6 +2703,49 @@ class ComboBox {
|
|
|
2270
2703
|
* Fired when selection is changed by user interaction
|
|
2271
2704
|
*/
|
|
2272
2705
|
this.ui5SelectionChange = output();
|
|
2706
|
+
/**
|
|
2707
|
+
* Available slots for content projection in this component.
|
|
2708
|
+
*
|
|
2709
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
2710
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
2711
|
+
*
|
|
2712
|
+
* - **(default)**: Defines the component items.
|
|
2713
|
+
* - **valueStateMessage**: Defines the value state message that will be displayed as pop up under the component.
|
|
2714
|
+
The value state message slot should contain only one root element.
|
|
2715
|
+
|
|
2716
|
+
**Note:** If not specified, a default text (in the respective language) will be displayed.
|
|
2717
|
+
|
|
2718
|
+
**Note:** The `valueStateMessage` would be displayed,
|
|
2719
|
+
when the `ui5-combobox` is in `Information`, `Critical` or `Negative` value state.
|
|
2720
|
+
* - **icon**: Defines the icon to be displayed in the input field.
|
|
2721
|
+
*
|
|
2722
|
+
* @example
|
|
2723
|
+
* ```html
|
|
2724
|
+
* <ui5-combobox>
|
|
2725
|
+
* <div slot="header">Custom header content</div>
|
|
2726
|
+
* <p>Default slot content</p>
|
|
2727
|
+
* </ui5-combobox>
|
|
2728
|
+
* ```
|
|
2729
|
+
*
|
|
2730
|
+
* @readonly
|
|
2731
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
2732
|
+
*/
|
|
2733
|
+
this.slots = [
|
|
2734
|
+
{
|
|
2735
|
+
"name": "default",
|
|
2736
|
+
"description": "Defines the component items."
|
|
2737
|
+
},
|
|
2738
|
+
{
|
|
2739
|
+
"name": "valueStateMessage",
|
|
2740
|
+
"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.",
|
|
2741
|
+
"since": "1.0.0-rc.9"
|
|
2742
|
+
},
|
|
2743
|
+
{
|
|
2744
|
+
"name": "icon",
|
|
2745
|
+
"description": "Defines the icon to be displayed in the input field.",
|
|
2746
|
+
"since": "1.0.0-rc.9"
|
|
2747
|
+
}
|
|
2748
|
+
];
|
|
2273
2749
|
this.elementRef = inject(ElementRef);
|
|
2274
2750
|
this.injector = inject(Injector);
|
|
2275
2751
|
}
|
|
@@ -2438,6 +2914,38 @@ class ComboBoxItemGroup {
|
|
|
2438
2914
|
**Note:** `move` event is fired only if there was a preceding `move-over` with prevented default action.
|
|
2439
2915
|
*/
|
|
2440
2916
|
this.ui5Move = output();
|
|
2917
|
+
/**
|
|
2918
|
+
* Available slots for content projection in this component.
|
|
2919
|
+
*
|
|
2920
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
2921
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
2922
|
+
*
|
|
2923
|
+
* - **(default)**: Defines the items of the <code>ui5-cb-item-group</code>.
|
|
2924
|
+
* - **header**: Defines the header of the component.
|
|
2925
|
+
|
|
2926
|
+
**Note:** Using this slot, the default header text of group and the value of `headerText` property will be overwritten.
|
|
2927
|
+
*
|
|
2928
|
+
* @example
|
|
2929
|
+
* ```html
|
|
2930
|
+
* <ui5-cb-item-group>
|
|
2931
|
+
* <div slot="header">Custom header content</div>
|
|
2932
|
+
* <p>Default slot content</p>
|
|
2933
|
+
* </ui5-cb-item-group>
|
|
2934
|
+
* ```
|
|
2935
|
+
*
|
|
2936
|
+
* @readonly
|
|
2937
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
2938
|
+
*/
|
|
2939
|
+
this.slots = [
|
|
2940
|
+
{
|
|
2941
|
+
"name": "default",
|
|
2942
|
+
"description": "Defines the items of the <code>ui5-cb-item-group</code>."
|
|
2943
|
+
},
|
|
2944
|
+
{
|
|
2945
|
+
"name": "header",
|
|
2946
|
+
"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."
|
|
2947
|
+
}
|
|
2948
|
+
];
|
|
2441
2949
|
this.elementRef = inject(ElementRef);
|
|
2442
2950
|
this.injector = inject(Injector);
|
|
2443
2951
|
}
|
|
@@ -2624,6 +3132,37 @@ class DatePicker {
|
|
|
2624
3132
|
* Fired after the component's picker is closed.
|
|
2625
3133
|
*/
|
|
2626
3134
|
this.ui5Close = output();
|
|
3135
|
+
/**
|
|
3136
|
+
* Available slots for content projection in this component.
|
|
3137
|
+
*
|
|
3138
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
3139
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
3140
|
+
*
|
|
3141
|
+
* - **valueStateMessage**: Defines the value state message that will be displayed as pop up under the component.
|
|
3142
|
+
|
|
3143
|
+
**Note:** If not specified, a default text (in the respective language) will be displayed.
|
|
3144
|
+
|
|
3145
|
+
**Note:** The `valueStateMessage` would be displayed,
|
|
3146
|
+
when the component is in `Information`, `Critical` or `Negative` value state.
|
|
3147
|
+
*
|
|
3148
|
+
* @example
|
|
3149
|
+
* ```html
|
|
3150
|
+
* <ui5-date-picker>
|
|
3151
|
+
* <div slot="header">Custom header content</div>
|
|
3152
|
+
* <p>Default slot content</p>
|
|
3153
|
+
* </ui5-date-picker>
|
|
3154
|
+
* ```
|
|
3155
|
+
*
|
|
3156
|
+
* @readonly
|
|
3157
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
3158
|
+
*/
|
|
3159
|
+
this.slots = [
|
|
3160
|
+
{
|
|
3161
|
+
"name": "valueStateMessage",
|
|
3162
|
+
"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.",
|
|
3163
|
+
"since": "1.0.0-rc.7"
|
|
3164
|
+
}
|
|
3165
|
+
];
|
|
2627
3166
|
this.elementRef = inject(ElementRef);
|
|
2628
3167
|
this.injector = inject(Injector);
|
|
2629
3168
|
}
|
|
@@ -2844,6 +3383,37 @@ class DateRangePicker {
|
|
|
2844
3383
|
* Fired after the component's picker is closed.
|
|
2845
3384
|
*/
|
|
2846
3385
|
this.ui5Close = output();
|
|
3386
|
+
/**
|
|
3387
|
+
* Available slots for content projection in this component.
|
|
3388
|
+
*
|
|
3389
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
3390
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
3391
|
+
*
|
|
3392
|
+
* - **valueStateMessage**: Defines the value state message that will be displayed as pop up under the component.
|
|
3393
|
+
|
|
3394
|
+
**Note:** If not specified, a default text (in the respective language) will be displayed.
|
|
3395
|
+
|
|
3396
|
+
**Note:** The `valueStateMessage` would be displayed,
|
|
3397
|
+
when the component is in `Information`, `Critical` or `Negative` value state.
|
|
3398
|
+
*
|
|
3399
|
+
* @example
|
|
3400
|
+
* ```html
|
|
3401
|
+
* <ui5-daterange-picker>
|
|
3402
|
+
* <div slot="header">Custom header content</div>
|
|
3403
|
+
* <p>Default slot content</p>
|
|
3404
|
+
* </ui5-daterange-picker>
|
|
3405
|
+
* ```
|
|
3406
|
+
*
|
|
3407
|
+
* @readonly
|
|
3408
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
3409
|
+
*/
|
|
3410
|
+
this.slots = [
|
|
3411
|
+
{
|
|
3412
|
+
"name": "valueStateMessage",
|
|
3413
|
+
"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.",
|
|
3414
|
+
"since": "1.0.0-rc.7"
|
|
3415
|
+
}
|
|
3416
|
+
];
|
|
2847
3417
|
this.elementRef = inject(ElementRef);
|
|
2848
3418
|
this.injector = inject(Injector);
|
|
2849
3419
|
}
|
|
@@ -3081,6 +3651,37 @@ class DateTimePicker {
|
|
|
3081
3651
|
* Fired after the component's picker is closed.
|
|
3082
3652
|
*/
|
|
3083
3653
|
this.ui5Close = output();
|
|
3654
|
+
/**
|
|
3655
|
+
* Available slots for content projection in this component.
|
|
3656
|
+
*
|
|
3657
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
3658
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
3659
|
+
*
|
|
3660
|
+
* - **valueStateMessage**: Defines the value state message that will be displayed as pop up under the component.
|
|
3661
|
+
|
|
3662
|
+
**Note:** If not specified, a default text (in the respective language) will be displayed.
|
|
3663
|
+
|
|
3664
|
+
**Note:** The `valueStateMessage` would be displayed,
|
|
3665
|
+
when the component is in `Information`, `Critical` or `Negative` value state.
|
|
3666
|
+
*
|
|
3667
|
+
* @example
|
|
3668
|
+
* ```html
|
|
3669
|
+
* <ui5-datetime-picker>
|
|
3670
|
+
* <div slot="header">Custom header content</div>
|
|
3671
|
+
* <p>Default slot content</p>
|
|
3672
|
+
* </ui5-datetime-picker>
|
|
3673
|
+
* ```
|
|
3674
|
+
*
|
|
3675
|
+
* @readonly
|
|
3676
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
3677
|
+
*/
|
|
3678
|
+
this.slots = [
|
|
3679
|
+
{
|
|
3680
|
+
"name": "valueStateMessage",
|
|
3681
|
+
"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.",
|
|
3682
|
+
"since": "1.0.0-rc.7"
|
|
3683
|
+
}
|
|
3684
|
+
];
|
|
3084
3685
|
this.elementRef = inject(ElementRef);
|
|
3085
3686
|
this.injector = inject(Injector);
|
|
3086
3687
|
}
|
|
@@ -3271,6 +3872,48 @@ class Dialog {
|
|
|
3271
3872
|
* Fired after the component is closed.
|
|
3272
3873
|
*/
|
|
3273
3874
|
this.ui5Close = output();
|
|
3875
|
+
/**
|
|
3876
|
+
* Available slots for content projection in this component.
|
|
3877
|
+
*
|
|
3878
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
3879
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
3880
|
+
*
|
|
3881
|
+
* - **header**: Defines the header HTML Element.
|
|
3882
|
+
|
|
3883
|
+
**Note:** When a `ui5-bar` is used in the header, you should remove the default dialog's paddings.
|
|
3884
|
+
|
|
3885
|
+
**Note:** If `header` slot is provided, the labelling of the dialog is a responsibility of the application developer.
|
|
3886
|
+
`accessibleName` should be used.
|
|
3887
|
+
* - **footer**: Defines the footer HTML Element.
|
|
3888
|
+
|
|
3889
|
+
**Note:** When a `ui5-bar` is used in the footer, you should remove the default dialog's paddings.
|
|
3890
|
+
* - **(default)**: Defines the content of the Popup.
|
|
3891
|
+
*
|
|
3892
|
+
* @example
|
|
3893
|
+
* ```html
|
|
3894
|
+
* <ui5-dialog>
|
|
3895
|
+
* <div slot="header">Custom header content</div>
|
|
3896
|
+
* <p>Default slot content</p>
|
|
3897
|
+
* </ui5-dialog>
|
|
3898
|
+
* ```
|
|
3899
|
+
*
|
|
3900
|
+
* @readonly
|
|
3901
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
3902
|
+
*/
|
|
3903
|
+
this.slots = [
|
|
3904
|
+
{
|
|
3905
|
+
"name": "header",
|
|
3906
|
+
"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."
|
|
3907
|
+
},
|
|
3908
|
+
{
|
|
3909
|
+
"name": "footer",
|
|
3910
|
+
"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."
|
|
3911
|
+
},
|
|
3912
|
+
{
|
|
3913
|
+
"name": "default",
|
|
3914
|
+
"description": "Defines the content of the Popup."
|
|
3915
|
+
}
|
|
3916
|
+
];
|
|
3274
3917
|
this.elementRef = inject(ElementRef);
|
|
3275
3918
|
this.injector = inject(Injector);
|
|
3276
3919
|
}
|
|
@@ -3568,6 +4211,47 @@ class FileUploader {
|
|
|
3568
4211
|
* Event is fired when the size of a file is above the `maxFileSize` property value.
|
|
3569
4212
|
*/
|
|
3570
4213
|
this.ui5FileSizeExceed = output();
|
|
4214
|
+
/**
|
|
4215
|
+
* Available slots for content projection in this component.
|
|
4216
|
+
*
|
|
4217
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
4218
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
4219
|
+
*
|
|
4220
|
+
* - **(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.
|
|
4221
|
+
|
|
4222
|
+
**Note:** For best accessibility experience, set a `tabindex` of "-1" on your interactive element, or it will be set automatically.
|
|
4223
|
+
This slot is intended for use cases where you want a button-only file uploader.
|
|
4224
|
+
It is recommended to set `hideInput` property to "true" when using this slot.
|
|
4225
|
+
Not setting `hideInput` may negatively impact the screen reader users.
|
|
4226
|
+
* - **valueStateMessage**: Defines the value state message that will be displayed as pop up under the component.
|
|
4227
|
+
|
|
4228
|
+
**Note:** If not specified, a default text (in the respective language) will be displayed.
|
|
4229
|
+
|
|
4230
|
+
**Note:** The `valueStateMessage` would be displayed,
|
|
4231
|
+
when the component is in `Information`, `Critical` or `Negative` value state.
|
|
4232
|
+
*
|
|
4233
|
+
* @example
|
|
4234
|
+
* ```html
|
|
4235
|
+
* <ui5-file-uploader>
|
|
4236
|
+
* <div slot="header">Custom header content</div>
|
|
4237
|
+
* <p>Default slot content</p>
|
|
4238
|
+
* </ui5-file-uploader>
|
|
4239
|
+
* ```
|
|
4240
|
+
*
|
|
4241
|
+
* @readonly
|
|
4242
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
4243
|
+
*/
|
|
4244
|
+
this.slots = [
|
|
4245
|
+
{
|
|
4246
|
+
"name": "default",
|
|
4247
|
+
"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."
|
|
4248
|
+
},
|
|
4249
|
+
{
|
|
4250
|
+
"name": "valueStateMessage",
|
|
4251
|
+
"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.",
|
|
4252
|
+
"since": "1.0.0-rc.9"
|
|
4253
|
+
}
|
|
4254
|
+
];
|
|
3571
4255
|
this.elementRef = inject(ElementRef);
|
|
3572
4256
|
this.injector = inject(Injector);
|
|
3573
4257
|
// Internal signal to track files from change events
|
|
@@ -3736,6 +4420,41 @@ class Form {
|
|
|
3736
4420
|
to avoid "jumping" effect, caused by the hight difference between texts in "display"("non-edit") mode and the input fields in "edit" mode.
|
|
3737
4421
|
*/
|
|
3738
4422
|
this.itemSpacing = input("Normal", ...(ngDevMode ? [{ debugName: "itemSpacing" }] : [])); // className is now passed
|
|
4423
|
+
/**
|
|
4424
|
+
* Available slots for content projection in this component.
|
|
4425
|
+
*
|
|
4426
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
4427
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
4428
|
+
*
|
|
4429
|
+
* - **header**: Defines the component header area.
|
|
4430
|
+
|
|
4431
|
+
**Note:** When a `header` is provided, the `headerText` property is ignored.
|
|
4432
|
+
* - **(default)**: Defines the component content - FormGroups or FormItems.
|
|
4433
|
+
|
|
4434
|
+
**Note:** Mixing FormGroups and standalone FormItems (not belonging to a group) is not supported.
|
|
4435
|
+
Either use FormGroups and make sure all FormItems are part of a FormGroup, or use just FormItems without any FormGroups.
|
|
4436
|
+
*
|
|
4437
|
+
* @example
|
|
4438
|
+
* ```html
|
|
4439
|
+
* <ui5-form>
|
|
4440
|
+
* <div slot="header">Custom header content</div>
|
|
4441
|
+
* <p>Default slot content</p>
|
|
4442
|
+
* </ui5-form>
|
|
4443
|
+
* ```
|
|
4444
|
+
*
|
|
4445
|
+
* @readonly
|
|
4446
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
4447
|
+
*/
|
|
4448
|
+
this.slots = [
|
|
4449
|
+
{
|
|
4450
|
+
"name": "header",
|
|
4451
|
+
"description": "Defines the component header area.\n\n**Note:** When a `header` is provided, the `headerText` property is ignored."
|
|
4452
|
+
},
|
|
4453
|
+
{
|
|
4454
|
+
"name": "default",
|
|
4455
|
+
"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."
|
|
4456
|
+
}
|
|
4457
|
+
];
|
|
3739
4458
|
this.elementRef = inject(ElementRef);
|
|
3740
4459
|
this.injector = inject(Injector);
|
|
3741
4460
|
}
|
|
@@ -3812,6 +4531,31 @@ class FormGroup {
|
|
|
3812
4531
|
* Defines id (or many ids) of the element (or elements) that label the component.
|
|
3813
4532
|
*/
|
|
3814
4533
|
this.accessibleNameRef = input(...(ngDevMode ? [undefined, { debugName: "accessibleNameRef" }] : [])); // className is now passed
|
|
4534
|
+
/**
|
|
4535
|
+
* Available slots for content projection in this component.
|
|
4536
|
+
*
|
|
4537
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
4538
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
4539
|
+
*
|
|
4540
|
+
* - **(default)**: Defines the items of the component.
|
|
4541
|
+
*
|
|
4542
|
+
* @example
|
|
4543
|
+
* ```html
|
|
4544
|
+
* <ui5-form-group>
|
|
4545
|
+
* <div slot="header">Custom header content</div>
|
|
4546
|
+
* <p>Default slot content</p>
|
|
4547
|
+
* </ui5-form-group>
|
|
4548
|
+
* ```
|
|
4549
|
+
*
|
|
4550
|
+
* @readonly
|
|
4551
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
4552
|
+
*/
|
|
4553
|
+
this.slots = [
|
|
4554
|
+
{
|
|
4555
|
+
"name": "default",
|
|
4556
|
+
"description": "Defines the items of the component."
|
|
4557
|
+
}
|
|
4558
|
+
];
|
|
3815
4559
|
this.elementRef = inject(ElementRef);
|
|
3816
4560
|
this.injector = inject(Injector);
|
|
3817
4561
|
}
|
|
@@ -3871,11 +4615,42 @@ class FormItem {
|
|
|
3871
4615
|
A number bigger than the available columns won't take effect.
|
|
3872
4616
|
*/
|
|
3873
4617
|
this.columnSpan = input(...(ngDevMode ? [undefined, { debugName: "columnSpan" }] : [])); // className is now passed
|
|
3874
|
-
|
|
3875
|
-
|
|
3876
|
-
|
|
3877
|
-
|
|
3878
|
-
|
|
4618
|
+
/**
|
|
4619
|
+
* Available slots for content projection in this component.
|
|
4620
|
+
*
|
|
4621
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
4622
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
4623
|
+
*
|
|
4624
|
+
* - **labelContent**: Defines the label of the component.
|
|
4625
|
+
* - **(default)**: Defines the content of the component,
|
|
4626
|
+
associated to `labelContent`.
|
|
4627
|
+
*
|
|
4628
|
+
* @example
|
|
4629
|
+
* ```html
|
|
4630
|
+
* <ui5-form-item>
|
|
4631
|
+
* <div slot="header">Custom header content</div>
|
|
4632
|
+
* <p>Default slot content</p>
|
|
4633
|
+
* </ui5-form-item>
|
|
4634
|
+
* ```
|
|
4635
|
+
*
|
|
4636
|
+
* @readonly
|
|
4637
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
4638
|
+
*/
|
|
4639
|
+
this.slots = [
|
|
4640
|
+
{
|
|
4641
|
+
"name": "labelContent",
|
|
4642
|
+
"description": "Defines the label of the component."
|
|
4643
|
+
},
|
|
4644
|
+
{
|
|
4645
|
+
"name": "default",
|
|
4646
|
+
"description": "Defines the content of the component,\nassociated to `labelContent`."
|
|
4647
|
+
}
|
|
4648
|
+
];
|
|
4649
|
+
this.elementRef = inject(ElementRef);
|
|
4650
|
+
this.injector = inject(Injector);
|
|
4651
|
+
}
|
|
4652
|
+
get element() {
|
|
4653
|
+
return this.elementRef.nativeElement;
|
|
3879
4654
|
}
|
|
3880
4655
|
ngAfterViewInit() {
|
|
3881
4656
|
const wcElement = this.element;
|
|
@@ -4149,6 +4924,56 @@ class Input {
|
|
|
4149
4924
|
* Fired when the suggestions picker is closed.
|
|
4150
4925
|
*/
|
|
4151
4926
|
this.ui5Close = output();
|
|
4927
|
+
/**
|
|
4928
|
+
* Available slots for content projection in this component.
|
|
4929
|
+
*
|
|
4930
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
4931
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
4932
|
+
*
|
|
4933
|
+
* - **(default)**: Defines the suggestion items.
|
|
4934
|
+
|
|
4935
|
+
**Note:** The suggestions would be displayed only if the `showSuggestions`
|
|
4936
|
+
property is set to `true`.
|
|
4937
|
+
|
|
4938
|
+
**Note:** The `<ui5-suggestion-item>`, `<ui5-suggestion-item-group>` and `ui5-suggestion-item-custom` are recommended to be used as suggestion items.
|
|
4939
|
+
* - **icon**: Defines the icon to be displayed in the component.
|
|
4940
|
+
* - **valueStateMessage**: Defines the value state message that will be displayed as pop up under the component.
|
|
4941
|
+
The value state message slot should contain only one root element.
|
|
4942
|
+
|
|
4943
|
+
**Note:** If not specified, a default text (in the respective language) will be displayed.
|
|
4944
|
+
|
|
4945
|
+
**Note:** The `valueStateMessage` would be displayed,
|
|
4946
|
+
when the component is in `Information`, `Critical` or `Negative` value state.
|
|
4947
|
+
|
|
4948
|
+
**Note:** If the component has `suggestionItems`,
|
|
4949
|
+
the `valueStateMessage` would be displayed as part of the same popover, if used on desktop, or dialog - on phone.
|
|
4950
|
+
*
|
|
4951
|
+
* @example
|
|
4952
|
+
* ```html
|
|
4953
|
+
* <ui5-input>
|
|
4954
|
+
* <div slot="header">Custom header content</div>
|
|
4955
|
+
* <p>Default slot content</p>
|
|
4956
|
+
* </ui5-input>
|
|
4957
|
+
* ```
|
|
4958
|
+
*
|
|
4959
|
+
* @readonly
|
|
4960
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
4961
|
+
*/
|
|
4962
|
+
this.slots = [
|
|
4963
|
+
{
|
|
4964
|
+
"name": "default",
|
|
4965
|
+
"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."
|
|
4966
|
+
},
|
|
4967
|
+
{
|
|
4968
|
+
"name": "icon",
|
|
4969
|
+
"description": "Defines the icon to be displayed in the component."
|
|
4970
|
+
},
|
|
4971
|
+
{
|
|
4972
|
+
"name": "valueStateMessage",
|
|
4973
|
+
"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.",
|
|
4974
|
+
"since": "1.0.0-rc.6"
|
|
4975
|
+
}
|
|
4976
|
+
];
|
|
4152
4977
|
this.elementRef = inject(ElementRef);
|
|
4153
4978
|
this.injector = inject(Injector);
|
|
4154
4979
|
}
|
|
@@ -4258,6 +5083,33 @@ class Label {
|
|
|
4258
5083
|
**Note:** for option "Normal" the text will wrap and the words will not be broken based on hyphenation.
|
|
4259
5084
|
*/
|
|
4260
5085
|
this.wrappingType = input("Normal", ...(ngDevMode ? [{ debugName: "wrappingType" }] : [])); // className is now passed
|
|
5086
|
+
/**
|
|
5087
|
+
* Available slots for content projection in this component.
|
|
5088
|
+
*
|
|
5089
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
5090
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
5091
|
+
*
|
|
5092
|
+
* - **(default)**: Defines the text of the component.
|
|
5093
|
+
|
|
5094
|
+
**Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.
|
|
5095
|
+
*
|
|
5096
|
+
* @example
|
|
5097
|
+
* ```html
|
|
5098
|
+
* <ui5-label>
|
|
5099
|
+
* <div slot="header">Custom header content</div>
|
|
5100
|
+
* <p>Default slot content</p>
|
|
5101
|
+
* </ui5-label>
|
|
5102
|
+
* ```
|
|
5103
|
+
*
|
|
5104
|
+
* @readonly
|
|
5105
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
5106
|
+
*/
|
|
5107
|
+
this.slots = [
|
|
5108
|
+
{
|
|
5109
|
+
"name": "default",
|
|
5110
|
+
"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."
|
|
5111
|
+
}
|
|
5112
|
+
];
|
|
4261
5113
|
this.elementRef = inject(ElementRef);
|
|
4262
5114
|
this.injector = inject(Injector);
|
|
4263
5115
|
}
|
|
@@ -4415,6 +5267,33 @@ class Link {
|
|
|
4415
5267
|
or by using the Enter key.
|
|
4416
5268
|
*/
|
|
4417
5269
|
this.ui5Click = output();
|
|
5270
|
+
/**
|
|
5271
|
+
* Available slots for content projection in this component.
|
|
5272
|
+
*
|
|
5273
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
5274
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
5275
|
+
*
|
|
5276
|
+
* - **(default)**: Defines the text of the component.
|
|
5277
|
+
|
|
5278
|
+
**Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.
|
|
5279
|
+
*
|
|
5280
|
+
* @example
|
|
5281
|
+
* ```html
|
|
5282
|
+
* <ui5-link>
|
|
5283
|
+
* <div slot="header">Custom header content</div>
|
|
5284
|
+
* <p>Default slot content</p>
|
|
5285
|
+
* </ui5-link>
|
|
5286
|
+
* ```
|
|
5287
|
+
*
|
|
5288
|
+
* @readonly
|
|
5289
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
5290
|
+
*/
|
|
5291
|
+
this.slots = [
|
|
5292
|
+
{
|
|
5293
|
+
"name": "default",
|
|
5294
|
+
"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."
|
|
5295
|
+
}
|
|
5296
|
+
];
|
|
4418
5297
|
this.elementRef = inject(ElementRef);
|
|
4419
5298
|
this.injector = inject(Injector);
|
|
4420
5299
|
}
|
|
@@ -4629,6 +5508,41 @@ class List {
|
|
|
4629
5508
|
**Note:** `move` event is fired only if there was a preceding `move-over` with prevented default action.
|
|
4630
5509
|
*/
|
|
4631
5510
|
this.ui5Move = output();
|
|
5511
|
+
/**
|
|
5512
|
+
* Available slots for content projection in this component.
|
|
5513
|
+
*
|
|
5514
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
5515
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
5516
|
+
*
|
|
5517
|
+
* - **(default)**: Defines the items of the component.
|
|
5518
|
+
|
|
5519
|
+
**Note:** Use `ui5-li`, `ui5-li-custom`, and `ui5-li-group` for the intended design.
|
|
5520
|
+
* - **header**: Defines the component header.
|
|
5521
|
+
|
|
5522
|
+
**Note:** When `header` is set, the
|
|
5523
|
+
`headerText` property is ignored.
|
|
5524
|
+
*
|
|
5525
|
+
* @example
|
|
5526
|
+
* ```html
|
|
5527
|
+
* <ui5-list>
|
|
5528
|
+
* <div slot="header">Custom header content</div>
|
|
5529
|
+
* <p>Default slot content</p>
|
|
5530
|
+
* </ui5-list>
|
|
5531
|
+
* ```
|
|
5532
|
+
*
|
|
5533
|
+
* @readonly
|
|
5534
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
5535
|
+
*/
|
|
5536
|
+
this.slots = [
|
|
5537
|
+
{
|
|
5538
|
+
"name": "default",
|
|
5539
|
+
"description": "Defines the items of the component.\n\n**Note:** Use `ui5-li`, `ui5-li-custom`, and `ui5-li-group` for the intended design."
|
|
5540
|
+
},
|
|
5541
|
+
{
|
|
5542
|
+
"name": "header",
|
|
5543
|
+
"description": "Defines the component header.\n\n**Note:** When `header` is set, the\n`headerText` property is ignored."
|
|
5544
|
+
}
|
|
5545
|
+
];
|
|
4632
5546
|
this.elementRef = inject(ElementRef);
|
|
4633
5547
|
this.injector = inject(Injector);
|
|
4634
5548
|
}
|
|
@@ -4770,6 +5684,40 @@ class ListItemCustom {
|
|
|
4770
5684
|
* Fired when the user clicks on the detail button when type is `Detail`.
|
|
4771
5685
|
*/
|
|
4772
5686
|
this.ui5DetailClick = output();
|
|
5687
|
+
/**
|
|
5688
|
+
* Available slots for content projection in this component.
|
|
5689
|
+
*
|
|
5690
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
5691
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
5692
|
+
*
|
|
5693
|
+
* - **(default)**: Defines the content of the component.
|
|
5694
|
+
* - **deleteButton**: Defines the delete button, displayed in "Delete" mode.
|
|
5695
|
+
**Note:** While the slot allows custom buttons, to match
|
|
5696
|
+
design guidelines, please use the `ui5-button` component.
|
|
5697
|
+
**Note:** When the slot is not present, a built-in delete button will be displayed.
|
|
5698
|
+
*
|
|
5699
|
+
* @example
|
|
5700
|
+
* ```html
|
|
5701
|
+
* <ui5-li-custom>
|
|
5702
|
+
* <div slot="header">Custom header content</div>
|
|
5703
|
+
* <p>Default slot content</p>
|
|
5704
|
+
* </ui5-li-custom>
|
|
5705
|
+
* ```
|
|
5706
|
+
*
|
|
5707
|
+
* @readonly
|
|
5708
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
5709
|
+
*/
|
|
5710
|
+
this.slots = [
|
|
5711
|
+
{
|
|
5712
|
+
"name": "default",
|
|
5713
|
+
"description": "Defines the content of the component."
|
|
5714
|
+
},
|
|
5715
|
+
{
|
|
5716
|
+
"name": "deleteButton",
|
|
5717
|
+
"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.",
|
|
5718
|
+
"since": "1.9.0"
|
|
5719
|
+
}
|
|
5720
|
+
];
|
|
4773
5721
|
this.elementRef = inject(ElementRef);
|
|
4774
5722
|
this.injector = inject(Injector);
|
|
4775
5723
|
}
|
|
@@ -4872,6 +5820,38 @@ class ListItemGroup {
|
|
|
4872
5820
|
**Note:** `move` event is fired only if there was a preceding `move-over` with prevented default action.
|
|
4873
5821
|
*/
|
|
4874
5822
|
this.ui5Move = output();
|
|
5823
|
+
/**
|
|
5824
|
+
* Available slots for content projection in this component.
|
|
5825
|
+
*
|
|
5826
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
5827
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
5828
|
+
*
|
|
5829
|
+
* - **(default)**: Defines the items of the <code>ui5-li-group</code>.
|
|
5830
|
+
* - **header**: Defines the header of the component.
|
|
5831
|
+
|
|
5832
|
+
**Note:** Using this slot, the default header text of group and the value of `headerText` property will be overwritten.
|
|
5833
|
+
*
|
|
5834
|
+
* @example
|
|
5835
|
+
* ```html
|
|
5836
|
+
* <ui5-li-group>
|
|
5837
|
+
* <div slot="header">Custom header content</div>
|
|
5838
|
+
* <p>Default slot content</p>
|
|
5839
|
+
* </ui5-li-group>
|
|
5840
|
+
* ```
|
|
5841
|
+
*
|
|
5842
|
+
* @readonly
|
|
5843
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
5844
|
+
*/
|
|
5845
|
+
this.slots = [
|
|
5846
|
+
{
|
|
5847
|
+
"name": "default",
|
|
5848
|
+
"description": "Defines the items of the <code>ui5-li-group</code>."
|
|
5849
|
+
},
|
|
5850
|
+
{
|
|
5851
|
+
"name": "header",
|
|
5852
|
+
"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."
|
|
5853
|
+
}
|
|
5854
|
+
];
|
|
4875
5855
|
this.elementRef = inject(ElementRef);
|
|
4876
5856
|
this.injector = inject(Injector);
|
|
4877
5857
|
}
|
|
@@ -5030,6 +6010,57 @@ class ListItemStandard {
|
|
|
5030
6010
|
* Fired when the user clicks on the detail button when type is `Detail`.
|
|
5031
6011
|
*/
|
|
5032
6012
|
this.ui5DetailClick = output();
|
|
6013
|
+
/**
|
|
6014
|
+
* Available slots for content projection in this component.
|
|
6015
|
+
*
|
|
6016
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
6017
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
6018
|
+
*
|
|
6019
|
+
* - **(default)**: Defines the custom formatted text of the component.
|
|
6020
|
+
|
|
6021
|
+
**Note:** For optimal text wrapping and a consistent layout, it is strongly recommended to use the `text` property.
|
|
6022
|
+
|
|
6023
|
+
Use the `default` slot only when custom formatting with HTML elements (e.g., `<b>`, `<i>`) is required.
|
|
6024
|
+
Be aware that wrapping (via `wrappingType="Normal"`) may not function correctly with custom HTML content in the `default` slot.
|
|
6025
|
+
|
|
6026
|
+
If both `text` and `default` slot are used, the `text` property takes precedence.
|
|
6027
|
+
* - **image**: **Note:** While the slot allows option for setting custom avatar, to match the
|
|
6028
|
+
design guidelines, please use the `ui5-avatar` with it's default size - S.
|
|
6029
|
+
|
|
6030
|
+
**Note:** If bigger `ui5-avatar` needs to be used, then the size of the
|
|
6031
|
+
`ui5-li` should be customized in order to fit.
|
|
6032
|
+
* - **deleteButton**: Defines the delete button, displayed in "Delete" mode.
|
|
6033
|
+
**Note:** While the slot allows custom buttons, to match
|
|
6034
|
+
design guidelines, please use the `ui5-button` component.
|
|
6035
|
+
**Note:** When the slot is not present, a built-in delete button will be displayed.
|
|
6036
|
+
*
|
|
6037
|
+
* @example
|
|
6038
|
+
* ```html
|
|
6039
|
+
* <ui5-li>
|
|
6040
|
+
* <div slot="header">Custom header content</div>
|
|
6041
|
+
* <p>Default slot content</p>
|
|
6042
|
+
* </ui5-li>
|
|
6043
|
+
* ```
|
|
6044
|
+
*
|
|
6045
|
+
* @readonly
|
|
6046
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
6047
|
+
*/
|
|
6048
|
+
this.slots = [
|
|
6049
|
+
{
|
|
6050
|
+
"name": "default",
|
|
6051
|
+
"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."
|
|
6052
|
+
},
|
|
6053
|
+
{
|
|
6054
|
+
"name": "image",
|
|
6055
|
+
"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.",
|
|
6056
|
+
"since": "2.0.0"
|
|
6057
|
+
},
|
|
6058
|
+
{
|
|
6059
|
+
"name": "deleteButton",
|
|
6060
|
+
"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.",
|
|
6061
|
+
"since": "1.9.0"
|
|
6062
|
+
}
|
|
6063
|
+
];
|
|
5033
6064
|
this.elementRef = inject(ElementRef);
|
|
5034
6065
|
this.injector = inject(Injector);
|
|
5035
6066
|
}
|
|
@@ -5159,6 +6190,33 @@ class Menu {
|
|
|
5159
6190
|
* Fired after the menu is closed.
|
|
5160
6191
|
*/
|
|
5161
6192
|
this.ui5Close = output();
|
|
6193
|
+
/**
|
|
6194
|
+
* Available slots for content projection in this component.
|
|
6195
|
+
*
|
|
6196
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
6197
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
6198
|
+
*
|
|
6199
|
+
* - **(default)**: Defines the items of this component.
|
|
6200
|
+
|
|
6201
|
+
**Note:** Use `ui5-menu-item` and `ui5-menu-separator` for their intended design.
|
|
6202
|
+
*
|
|
6203
|
+
* @example
|
|
6204
|
+
* ```html
|
|
6205
|
+
* <ui5-menu>
|
|
6206
|
+
* <div slot="header">Custom header content</div>
|
|
6207
|
+
* <p>Default slot content</p>
|
|
6208
|
+
* </ui5-menu>
|
|
6209
|
+
* ```
|
|
6210
|
+
*
|
|
6211
|
+
* @readonly
|
|
6212
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
6213
|
+
*/
|
|
6214
|
+
this.slots = [
|
|
6215
|
+
{
|
|
6216
|
+
"name": "default",
|
|
6217
|
+
"description": "Defines the items of this component.\n\n**Note:** Use `ui5-menu-item` and `ui5-menu-separator` for their intended design."
|
|
6218
|
+
}
|
|
6219
|
+
];
|
|
5162
6220
|
this.elementRef = inject(ElementRef);
|
|
5163
6221
|
this.injector = inject(Injector);
|
|
5164
6222
|
}
|
|
@@ -5343,6 +6401,67 @@ class MenuItem {
|
|
|
5343
6401
|
* Fired when the user clicks on the detail button when type is `Detail`.
|
|
5344
6402
|
*/
|
|
5345
6403
|
this.ui5DetailClick = output();
|
|
6404
|
+
/**
|
|
6405
|
+
* Available slots for content projection in this component.
|
|
6406
|
+
*
|
|
6407
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
6408
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
6409
|
+
*
|
|
6410
|
+
* - **(default)**: Defines the items of this component.
|
|
6411
|
+
|
|
6412
|
+
**Note:** The slot can hold menu item and menu separator items.
|
|
6413
|
+
|
|
6414
|
+
If there are items added to this slot, an arrow will be displayed at the end
|
|
6415
|
+
of the item in order to indicate that there are items added. In that case components added
|
|
6416
|
+
to `endContent` slot or `additionalText` content will not be displayed.
|
|
6417
|
+
|
|
6418
|
+
The priority of what will be displayed at the end of the menu item is as follows:
|
|
6419
|
+
sub-menu arrow (if there are items added in `items` slot) -> components added in `endContent` -> text set to `additionalText`.
|
|
6420
|
+
* - **endContent**: Defines the components that should be displayed at the end of the menu item.
|
|
6421
|
+
|
|
6422
|
+
**Note:** It is highly recommended to slot only components of type `ui5-button`,`ui5-link`
|
|
6423
|
+
or `ui5-icon` in order to preserve the intended design. If there are components added to this slot,
|
|
6424
|
+
and there is text set in `additionalText`, it will not be displayed. If there are items added to `items` slot,
|
|
6425
|
+
nether `additionalText` nor components added to this slot would be displayed.
|
|
6426
|
+
|
|
6427
|
+
The priority of what will be displayed at the end of the menu item is as follows:
|
|
6428
|
+
sub-menu arrow (if there are items added in `items` slot) -> components added in `endContent` -> text set to `additionalText`.
|
|
6429
|
+
|
|
6430
|
+
Application developers are responsible for ensuring that interactive elements placed in the `endContent` slot
|
|
6431
|
+
have the correct accessibility behaviour, including their enabled or disabled states.
|
|
6432
|
+
The menu does not manage these aspects when the menu item state changes.
|
|
6433
|
+
* - **deleteButton**: Defines the delete button, displayed in "Delete" mode.
|
|
6434
|
+
**Note:** While the slot allows custom buttons, to match
|
|
6435
|
+
design guidelines, please use the `ui5-button` component.
|
|
6436
|
+
**Note:** When the slot is not present, a built-in delete button will be displayed.
|
|
6437
|
+
*
|
|
6438
|
+
* @example
|
|
6439
|
+
* ```html
|
|
6440
|
+
* <ui5-menu-item>
|
|
6441
|
+
* <div slot="header">Custom header content</div>
|
|
6442
|
+
* <p>Default slot content</p>
|
|
6443
|
+
* </ui5-menu-item>
|
|
6444
|
+
* ```
|
|
6445
|
+
*
|
|
6446
|
+
* @readonly
|
|
6447
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
6448
|
+
*/
|
|
6449
|
+
this.slots = [
|
|
6450
|
+
{
|
|
6451
|
+
"name": "default",
|
|
6452
|
+
"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`."
|
|
6453
|
+
},
|
|
6454
|
+
{
|
|
6455
|
+
"name": "endContent",
|
|
6456
|
+
"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.",
|
|
6457
|
+
"since": "2.0.0"
|
|
6458
|
+
},
|
|
6459
|
+
{
|
|
6460
|
+
"name": "deleteButton",
|
|
6461
|
+
"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.",
|
|
6462
|
+
"since": "1.9.0"
|
|
6463
|
+
}
|
|
6464
|
+
];
|
|
5346
6465
|
this.elementRef = inject(ElementRef);
|
|
5347
6466
|
this.injector = inject(Injector);
|
|
5348
6467
|
}
|
|
@@ -5426,6 +6545,32 @@ class MenuItemGroup {
|
|
|
5426
6545
|
* Defines the component's check mode.
|
|
5427
6546
|
*/
|
|
5428
6547
|
this.checkMode = input("None", ...(ngDevMode ? [{ debugName: "checkMode" }] : [])); // className is now passed
|
|
6548
|
+
/**
|
|
6549
|
+
* Available slots for content projection in this component.
|
|
6550
|
+
*
|
|
6551
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
6552
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
6553
|
+
*
|
|
6554
|
+
* - **(default)**: Defines the items of this component.
|
|
6555
|
+
**Note:** The slot can hold any combination of components of type `ui5-menu-item` or `ui5-menu-separator` or both.
|
|
6556
|
+
*
|
|
6557
|
+
* @example
|
|
6558
|
+
* ```html
|
|
6559
|
+
* <ui5-menu-item-group>
|
|
6560
|
+
* <div slot="header">Custom header content</div>
|
|
6561
|
+
* <p>Default slot content</p>
|
|
6562
|
+
* </ui5-menu-item-group>
|
|
6563
|
+
* ```
|
|
6564
|
+
*
|
|
6565
|
+
* @readonly
|
|
6566
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
6567
|
+
*/
|
|
6568
|
+
this.slots = [
|
|
6569
|
+
{
|
|
6570
|
+
"name": "default",
|
|
6571
|
+
"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."
|
|
6572
|
+
}
|
|
6573
|
+
];
|
|
5429
6574
|
this.elementRef = inject(ElementRef);
|
|
5430
6575
|
this.injector = inject(Injector);
|
|
5431
6576
|
}
|
|
@@ -5524,6 +6669,43 @@ class MessageStrip {
|
|
|
5524
6669
|
click/tap or by using the Enter or Space key.
|
|
5525
6670
|
*/
|
|
5526
6671
|
this.ui5Close = output();
|
|
6672
|
+
/**
|
|
6673
|
+
* Available slots for content projection in this component.
|
|
6674
|
+
*
|
|
6675
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
6676
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
6677
|
+
*
|
|
6678
|
+
* - **(default)**: Defines the text of the component.
|
|
6679
|
+
|
|
6680
|
+
**Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.
|
|
6681
|
+
* - **icon**: Defines the content to be displayed as graphical element within the component.
|
|
6682
|
+
|
|
6683
|
+
**Note:** If no icon is given, the default icon for the component type will be used.
|
|
6684
|
+
The SAP-icons font provides numerous options.
|
|
6685
|
+
|
|
6686
|
+
See all the available icons in the [Icon Explorer](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html).
|
|
6687
|
+
*
|
|
6688
|
+
* @example
|
|
6689
|
+
* ```html
|
|
6690
|
+
* <ui5-message-strip>
|
|
6691
|
+
* <div slot="header">Custom header content</div>
|
|
6692
|
+
* <p>Default slot content</p>
|
|
6693
|
+
* </ui5-message-strip>
|
|
6694
|
+
* ```
|
|
6695
|
+
*
|
|
6696
|
+
* @readonly
|
|
6697
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
6698
|
+
*/
|
|
6699
|
+
this.slots = [
|
|
6700
|
+
{
|
|
6701
|
+
"name": "default",
|
|
6702
|
+
"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."
|
|
6703
|
+
},
|
|
6704
|
+
{
|
|
6705
|
+
"name": "icon",
|
|
6706
|
+
"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)."
|
|
6707
|
+
}
|
|
6708
|
+
];
|
|
5527
6709
|
this.elementRef = inject(ElementRef);
|
|
5528
6710
|
this.injector = inject(Injector);
|
|
5529
6711
|
}
|
|
@@ -5680,6 +6862,49 @@ class MultiComboBox {
|
|
|
5680
6862
|
* Fired when selection is changed by user interaction.
|
|
5681
6863
|
*/
|
|
5682
6864
|
this.ui5SelectionChange = output();
|
|
6865
|
+
/**
|
|
6866
|
+
* Available slots for content projection in this component.
|
|
6867
|
+
*
|
|
6868
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
6869
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
6870
|
+
*
|
|
6871
|
+
* - **(default)**: Defines the component items.
|
|
6872
|
+
* - **icon**: Defines the icon to be displayed in the component.
|
|
6873
|
+
* - **valueStateMessage**: Defines the value state message that will be displayed as pop up under the component.
|
|
6874
|
+
The value state message slot should contain only one root element.
|
|
6875
|
+
|
|
6876
|
+
**Note:** If not specified, a default text (in the respective language) will be displayed.
|
|
6877
|
+
|
|
6878
|
+
**Note:** The `valueStateMessage` would be displayed,
|
|
6879
|
+
when the component is in `Information`, `Critical` or `Negative` value state.
|
|
6880
|
+
*
|
|
6881
|
+
* @example
|
|
6882
|
+
* ```html
|
|
6883
|
+
* <ui5-multi-combobox>
|
|
6884
|
+
* <div slot="header">Custom header content</div>
|
|
6885
|
+
* <p>Default slot content</p>
|
|
6886
|
+
* </ui5-multi-combobox>
|
|
6887
|
+
* ```
|
|
6888
|
+
*
|
|
6889
|
+
* @readonly
|
|
6890
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
6891
|
+
*/
|
|
6892
|
+
this.slots = [
|
|
6893
|
+
{
|
|
6894
|
+
"name": "default",
|
|
6895
|
+
"description": "Defines the component items."
|
|
6896
|
+
},
|
|
6897
|
+
{
|
|
6898
|
+
"name": "icon",
|
|
6899
|
+
"description": "Defines the icon to be displayed in the component.",
|
|
6900
|
+
"since": "1.0.0-rc.9"
|
|
6901
|
+
},
|
|
6902
|
+
{
|
|
6903
|
+
"name": "valueStateMessage",
|
|
6904
|
+
"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.",
|
|
6905
|
+
"since": "1.0.0-rc.9"
|
|
6906
|
+
}
|
|
6907
|
+
];
|
|
5683
6908
|
this.elementRef = inject(ElementRef);
|
|
5684
6909
|
this.injector = inject(Injector);
|
|
5685
6910
|
}
|
|
@@ -5854,6 +7079,38 @@ class MultiComboBoxItemGroup {
|
|
|
5854
7079
|
**Note:** `move` event is fired only if there was a preceding `move-over` with prevented default action.
|
|
5855
7080
|
*/
|
|
5856
7081
|
this.ui5Move = output();
|
|
7082
|
+
/**
|
|
7083
|
+
* Available slots for content projection in this component.
|
|
7084
|
+
*
|
|
7085
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
7086
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
7087
|
+
*
|
|
7088
|
+
* - **(default)**: Defines the items of the <code>ui5-mcb-item-group</code>.
|
|
7089
|
+
* - **header**: Defines the header of the component.
|
|
7090
|
+
|
|
7091
|
+
**Note:** Using this slot, the default header text of group and the value of `headerText` property will be overwritten.
|
|
7092
|
+
*
|
|
7093
|
+
* @example
|
|
7094
|
+
* ```html
|
|
7095
|
+
* <ui5-mcb-item-group>
|
|
7096
|
+
* <div slot="header">Custom header content</div>
|
|
7097
|
+
* <p>Default slot content</p>
|
|
7098
|
+
* </ui5-mcb-item-group>
|
|
7099
|
+
* ```
|
|
7100
|
+
*
|
|
7101
|
+
* @readonly
|
|
7102
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
7103
|
+
*/
|
|
7104
|
+
this.slots = [
|
|
7105
|
+
{
|
|
7106
|
+
"name": "default",
|
|
7107
|
+
"description": "Defines the items of the <code>ui5-mcb-item-group</code>."
|
|
7108
|
+
},
|
|
7109
|
+
{
|
|
7110
|
+
"name": "header",
|
|
7111
|
+
"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."
|
|
7112
|
+
}
|
|
7113
|
+
];
|
|
5857
7114
|
this.elementRef = inject(ElementRef);
|
|
5858
7115
|
this.injector = inject(Injector);
|
|
5859
7116
|
}
|
|
@@ -6049,6 +7306,61 @@ class MultiInput {
|
|
|
6049
7306
|
* Fired when the suggestions picker is closed.
|
|
6050
7307
|
*/
|
|
6051
7308
|
this.ui5Close = output();
|
|
7309
|
+
/**
|
|
7310
|
+
* Available slots for content projection in this component.
|
|
7311
|
+
*
|
|
7312
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
7313
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
7314
|
+
*
|
|
7315
|
+
* - **tokens**: Defines the component tokens.
|
|
7316
|
+
* - **(default)**: Defines the suggestion items.
|
|
7317
|
+
|
|
7318
|
+
**Note:** The suggestions would be displayed only if the `showSuggestions`
|
|
7319
|
+
property is set to `true`.
|
|
7320
|
+
|
|
7321
|
+
**Note:** The `<ui5-suggestion-item>`, `<ui5-suggestion-item-group>` and `ui5-suggestion-item-custom` are recommended to be used as suggestion items.
|
|
7322
|
+
* - **icon**: Defines the icon to be displayed in the component.
|
|
7323
|
+
* - **valueStateMessage**: Defines the value state message that will be displayed as pop up under the component.
|
|
7324
|
+
The value state message slot should contain only one root element.
|
|
7325
|
+
|
|
7326
|
+
**Note:** If not specified, a default text (in the respective language) will be displayed.
|
|
7327
|
+
|
|
7328
|
+
**Note:** The `valueStateMessage` would be displayed,
|
|
7329
|
+
when the component is in `Information`, `Critical` or `Negative` value state.
|
|
7330
|
+
|
|
7331
|
+
**Note:** If the component has `suggestionItems`,
|
|
7332
|
+
the `valueStateMessage` would be displayed as part of the same popover, if used on desktop, or dialog - on phone.
|
|
7333
|
+
*
|
|
7334
|
+
* @example
|
|
7335
|
+
* ```html
|
|
7336
|
+
* <ui5-multi-input>
|
|
7337
|
+
* <div slot="header">Custom header content</div>
|
|
7338
|
+
* <p>Default slot content</p>
|
|
7339
|
+
* </ui5-multi-input>
|
|
7340
|
+
* ```
|
|
7341
|
+
*
|
|
7342
|
+
* @readonly
|
|
7343
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
7344
|
+
*/
|
|
7345
|
+
this.slots = [
|
|
7346
|
+
{
|
|
7347
|
+
"name": "tokens",
|
|
7348
|
+
"description": "Defines the component tokens."
|
|
7349
|
+
},
|
|
7350
|
+
{
|
|
7351
|
+
"name": "default",
|
|
7352
|
+
"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."
|
|
7353
|
+
},
|
|
7354
|
+
{
|
|
7355
|
+
"name": "icon",
|
|
7356
|
+
"description": "Defines the icon to be displayed in the component."
|
|
7357
|
+
},
|
|
7358
|
+
{
|
|
7359
|
+
"name": "valueStateMessage",
|
|
7360
|
+
"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.",
|
|
7361
|
+
"since": "1.0.0-rc.6"
|
|
7362
|
+
}
|
|
7363
|
+
];
|
|
6052
7364
|
this.elementRef = inject(ElementRef);
|
|
6053
7365
|
this.injector = inject(Injector);
|
|
6054
7366
|
}
|
|
@@ -6160,6 +7472,33 @@ class Option {
|
|
|
6160
7472
|
* Defines the selected state of the component.
|
|
6161
7473
|
*/
|
|
6162
7474
|
this.selected = input(false, ...(ngDevMode ? [{ debugName: "selected", transform: booleanAttribute }] : [{ transform: booleanAttribute }])); // className is now passed
|
|
7475
|
+
/**
|
|
7476
|
+
* Available slots for content projection in this component.
|
|
7477
|
+
*
|
|
7478
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
7479
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
7480
|
+
*
|
|
7481
|
+
* - **(default)**: Defines the text of the component.
|
|
7482
|
+
|
|
7483
|
+
**Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.
|
|
7484
|
+
*
|
|
7485
|
+
* @example
|
|
7486
|
+
* ```html
|
|
7487
|
+
* <ui5-option>
|
|
7488
|
+
* <div slot="header">Custom header content</div>
|
|
7489
|
+
* <p>Default slot content</p>
|
|
7490
|
+
* </ui5-option>
|
|
7491
|
+
* ```
|
|
7492
|
+
*
|
|
7493
|
+
* @readonly
|
|
7494
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
7495
|
+
*/
|
|
7496
|
+
this.slots = [
|
|
7497
|
+
{
|
|
7498
|
+
"name": "default",
|
|
7499
|
+
"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."
|
|
7500
|
+
}
|
|
7501
|
+
];
|
|
6163
7502
|
this.elementRef = inject(ElementRef);
|
|
6164
7503
|
this.injector = inject(Injector);
|
|
6165
7504
|
}
|
|
@@ -6228,6 +7567,31 @@ class OptionCustom {
|
|
|
6228
7567
|
* Defines the selected state of the component.
|
|
6229
7568
|
*/
|
|
6230
7569
|
this.selected = input(false, ...(ngDevMode ? [{ debugName: "selected", transform: booleanAttribute }] : [{ transform: booleanAttribute }])); // className is now passed
|
|
7570
|
+
/**
|
|
7571
|
+
* Available slots for content projection in this component.
|
|
7572
|
+
*
|
|
7573
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
7574
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
7575
|
+
*
|
|
7576
|
+
* - **(default)**: Defines the content of the component.
|
|
7577
|
+
*
|
|
7578
|
+
* @example
|
|
7579
|
+
* ```html
|
|
7580
|
+
* <ui5-option-custom>
|
|
7581
|
+
* <div slot="header">Custom header content</div>
|
|
7582
|
+
* <p>Default slot content</p>
|
|
7583
|
+
* </ui5-option-custom>
|
|
7584
|
+
* ```
|
|
7585
|
+
*
|
|
7586
|
+
* @readonly
|
|
7587
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
7588
|
+
*/
|
|
7589
|
+
this.slots = [
|
|
7590
|
+
{
|
|
7591
|
+
"name": "default",
|
|
7592
|
+
"description": "Defines the content of the component."
|
|
7593
|
+
}
|
|
7594
|
+
];
|
|
6231
7595
|
this.elementRef = inject(ElementRef);
|
|
6232
7596
|
this.injector = inject(Injector);
|
|
6233
7597
|
}
|
|
@@ -6323,6 +7687,38 @@ class Panel {
|
|
|
6323
7687
|
* Fired when the component is expanded/collapsed by user interaction.
|
|
6324
7688
|
*/
|
|
6325
7689
|
this.ui5Toggle = output();
|
|
7690
|
+
/**
|
|
7691
|
+
* Available slots for content projection in this component.
|
|
7692
|
+
*
|
|
7693
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
7694
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
7695
|
+
*
|
|
7696
|
+
* - **(default)**: Defines the content of the component. The content is visible only when the component is expanded.
|
|
7697
|
+
* - **header**: Defines the component header area.
|
|
7698
|
+
|
|
7699
|
+
**Note:** When a header is provided, the `headerText` property is ignored.
|
|
7700
|
+
*
|
|
7701
|
+
* @example
|
|
7702
|
+
* ```html
|
|
7703
|
+
* <ui5-panel>
|
|
7704
|
+
* <div slot="header">Custom header content</div>
|
|
7705
|
+
* <p>Default slot content</p>
|
|
7706
|
+
* </ui5-panel>
|
|
7707
|
+
* ```
|
|
7708
|
+
*
|
|
7709
|
+
* @readonly
|
|
7710
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
7711
|
+
*/
|
|
7712
|
+
this.slots = [
|
|
7713
|
+
{
|
|
7714
|
+
"name": "default",
|
|
7715
|
+
"description": "Defines the content of the component. The content is visible only when the component is expanded."
|
|
7716
|
+
},
|
|
7717
|
+
{
|
|
7718
|
+
"name": "header",
|
|
7719
|
+
"description": "Defines the component header area.\n\n**Note:** When a header is provided, the `headerText` property is ignored."
|
|
7720
|
+
}
|
|
7721
|
+
];
|
|
6326
7722
|
this.elementRef = inject(ElementRef);
|
|
6327
7723
|
this.injector = inject(Injector);
|
|
6328
7724
|
}
|
|
@@ -6486,6 +7882,41 @@ class Popover {
|
|
|
6486
7882
|
* Fired after the component is closed.
|
|
6487
7883
|
*/
|
|
6488
7884
|
this.ui5Close = output();
|
|
7885
|
+
/**
|
|
7886
|
+
* Available slots for content projection in this component.
|
|
7887
|
+
*
|
|
7888
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
7889
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
7890
|
+
*
|
|
7891
|
+
* - **header**: Defines the header HTML Element.
|
|
7892
|
+
* - **footer**: Defines the footer HTML Element.
|
|
7893
|
+
* - **(default)**: Defines the content of the Popup.
|
|
7894
|
+
*
|
|
7895
|
+
* @example
|
|
7896
|
+
* ```html
|
|
7897
|
+
* <ui5-popover>
|
|
7898
|
+
* <div slot="header">Custom header content</div>
|
|
7899
|
+
* <p>Default slot content</p>
|
|
7900
|
+
* </ui5-popover>
|
|
7901
|
+
* ```
|
|
7902
|
+
*
|
|
7903
|
+
* @readonly
|
|
7904
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
7905
|
+
*/
|
|
7906
|
+
this.slots = [
|
|
7907
|
+
{
|
|
7908
|
+
"name": "header",
|
|
7909
|
+
"description": "Defines the header HTML Element."
|
|
7910
|
+
},
|
|
7911
|
+
{
|
|
7912
|
+
"name": "footer",
|
|
7913
|
+
"description": "Defines the footer HTML Element."
|
|
7914
|
+
},
|
|
7915
|
+
{
|
|
7916
|
+
"name": "default",
|
|
7917
|
+
"description": "Defines the content of the Popup."
|
|
7918
|
+
}
|
|
7919
|
+
];
|
|
6489
7920
|
this.elementRef = inject(ElementRef);
|
|
6490
7921
|
this.injector = inject(Injector);
|
|
6491
7922
|
}
|
|
@@ -7147,6 +8578,41 @@ class ResponsivePopover {
|
|
|
7147
8578
|
* Fired after the component is closed.
|
|
7148
8579
|
*/
|
|
7149
8580
|
this.ui5Close = output();
|
|
8581
|
+
/**
|
|
8582
|
+
* Available slots for content projection in this component.
|
|
8583
|
+
*
|
|
8584
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
8585
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
8586
|
+
*
|
|
8587
|
+
* - **header**: Defines the header HTML Element.
|
|
8588
|
+
* - **footer**: Defines the footer HTML Element.
|
|
8589
|
+
* - **(default)**: Defines the content of the Popup.
|
|
8590
|
+
*
|
|
8591
|
+
* @example
|
|
8592
|
+
* ```html
|
|
8593
|
+
* <ui5-responsive-popover>
|
|
8594
|
+
* <div slot="header">Custom header content</div>
|
|
8595
|
+
* <p>Default slot content</p>
|
|
8596
|
+
* </ui5-responsive-popover>
|
|
8597
|
+
* ```
|
|
8598
|
+
*
|
|
8599
|
+
* @readonly
|
|
8600
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
8601
|
+
*/
|
|
8602
|
+
this.slots = [
|
|
8603
|
+
{
|
|
8604
|
+
"name": "header",
|
|
8605
|
+
"description": "Defines the header HTML Element."
|
|
8606
|
+
},
|
|
8607
|
+
{
|
|
8608
|
+
"name": "footer",
|
|
8609
|
+
"description": "Defines the footer HTML Element."
|
|
8610
|
+
},
|
|
8611
|
+
{
|
|
8612
|
+
"name": "default",
|
|
8613
|
+
"description": "Defines the content of the Popup."
|
|
8614
|
+
}
|
|
8615
|
+
];
|
|
7150
8616
|
this.elementRef = inject(ElementRef);
|
|
7151
8617
|
this.injector = inject(Injector);
|
|
7152
8618
|
}
|
|
@@ -7264,6 +8730,35 @@ class SegmentedButton {
|
|
|
7264
8730
|
* Fired when the selected item changes.
|
|
7265
8731
|
*/
|
|
7266
8732
|
this.ui5SelectionChange = output();
|
|
8733
|
+
/**
|
|
8734
|
+
* Available slots for content projection in this component.
|
|
8735
|
+
*
|
|
8736
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
8737
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
8738
|
+
*
|
|
8739
|
+
* - **(default)**: Defines the items of `ui5-segmented-button`.
|
|
8740
|
+
|
|
8741
|
+
**Note:** Multiple items are allowed.
|
|
8742
|
+
|
|
8743
|
+
**Note:** Use the `ui5-segmented-button-item` for the intended design.
|
|
8744
|
+
*
|
|
8745
|
+
* @example
|
|
8746
|
+
* ```html
|
|
8747
|
+
* <ui5-segmented-button>
|
|
8748
|
+
* <div slot="header">Custom header content</div>
|
|
8749
|
+
* <p>Default slot content</p>
|
|
8750
|
+
* </ui5-segmented-button>
|
|
8751
|
+
* ```
|
|
8752
|
+
*
|
|
8753
|
+
* @readonly
|
|
8754
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
8755
|
+
*/
|
|
8756
|
+
this.slots = [
|
|
8757
|
+
{
|
|
8758
|
+
"name": "default",
|
|
8759
|
+
"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."
|
|
8760
|
+
}
|
|
8761
|
+
];
|
|
7267
8762
|
this.elementRef = inject(ElementRef);
|
|
7268
8763
|
this.injector = inject(Injector);
|
|
7269
8764
|
// Internal signal to track selectedItems from selection-change events
|
|
@@ -7392,6 +8887,33 @@ class SegmentedButtonItem {
|
|
|
7392
8887
|
See all the available icons within the [Icon Explorer](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html).
|
|
7393
8888
|
*/
|
|
7394
8889
|
this.icon = input(...(ngDevMode ? [undefined, { debugName: "icon" }] : [])); // className is now passed
|
|
8890
|
+
/**
|
|
8891
|
+
* Available slots for content projection in this component.
|
|
8892
|
+
*
|
|
8893
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
8894
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
8895
|
+
*
|
|
8896
|
+
* - **(default)**: Defines the text of the component.
|
|
8897
|
+
|
|
8898
|
+
**Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.
|
|
8899
|
+
*
|
|
8900
|
+
* @example
|
|
8901
|
+
* ```html
|
|
8902
|
+
* <ui5-segmented-button-item>
|
|
8903
|
+
* <div slot="header">Custom header content</div>
|
|
8904
|
+
* <p>Default slot content</p>
|
|
8905
|
+
* </ui5-segmented-button-item>
|
|
8906
|
+
* ```
|
|
8907
|
+
*
|
|
8908
|
+
* @readonly
|
|
8909
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
8910
|
+
*/
|
|
8911
|
+
this.slots = [
|
|
8912
|
+
{
|
|
8913
|
+
"name": "default",
|
|
8914
|
+
"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."
|
|
8915
|
+
}
|
|
8916
|
+
];
|
|
7395
8917
|
this.elementRef = inject(ElementRef);
|
|
7396
8918
|
this.injector = inject(Injector);
|
|
7397
8919
|
}
|
|
@@ -7532,6 +9054,62 @@ class Select {
|
|
|
7532
9054
|
* Fired after the component's dropdown menu closes.
|
|
7533
9055
|
*/
|
|
7534
9056
|
this.ui5Close = output();
|
|
9057
|
+
/**
|
|
9058
|
+
* Available slots for content projection in this component.
|
|
9059
|
+
*
|
|
9060
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
9061
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
9062
|
+
*
|
|
9063
|
+
* - **(default)**: Defines the component options.
|
|
9064
|
+
|
|
9065
|
+
**Note:** Only one selected option is allowed.
|
|
9066
|
+
If more than one option is defined as selected, the last one would be considered as the selected one.
|
|
9067
|
+
|
|
9068
|
+
**Note:** Use the `ui5-option` component to define the desired options.
|
|
9069
|
+
* - **valueStateMessage**: Defines the value state message that will be displayed as pop up under the component.
|
|
9070
|
+
|
|
9071
|
+
**Note:** If not specified, a default text (in the respective language) will be displayed.
|
|
9072
|
+
|
|
9073
|
+
**Note:** The `valueStateMessage` would be displayed,
|
|
9074
|
+
when the component is in `Information`, `Critical` or `Negative` value state.
|
|
9075
|
+
|
|
9076
|
+
**Note:** If the component has `suggestionItems`,
|
|
9077
|
+
the `valueStateMessage` would be displayed as part of the same popover, if used on desktop, or dialog - on phone.
|
|
9078
|
+
* - **label**: Defines the HTML element that will be displayed in the component input part,
|
|
9079
|
+
representing the selected option.
|
|
9080
|
+
|
|
9081
|
+
**Note:** If not specified and `ui5-option-custom` is used,
|
|
9082
|
+
either the option's `display-text` or its textContent will be displayed.
|
|
9083
|
+
|
|
9084
|
+
**Note:** If not specified and `ui5-option` is used,
|
|
9085
|
+
the option's textContent will be displayed.
|
|
9086
|
+
*
|
|
9087
|
+
* @example
|
|
9088
|
+
* ```html
|
|
9089
|
+
* <ui5-select>
|
|
9090
|
+
* <div slot="header">Custom header content</div>
|
|
9091
|
+
* <p>Default slot content</p>
|
|
9092
|
+
* </ui5-select>
|
|
9093
|
+
* ```
|
|
9094
|
+
*
|
|
9095
|
+
* @readonly
|
|
9096
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
9097
|
+
*/
|
|
9098
|
+
this.slots = [
|
|
9099
|
+
{
|
|
9100
|
+
"name": "default",
|
|
9101
|
+
"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."
|
|
9102
|
+
},
|
|
9103
|
+
{
|
|
9104
|
+
"name": "valueStateMessage",
|
|
9105
|
+
"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."
|
|
9106
|
+
},
|
|
9107
|
+
{
|
|
9108
|
+
"name": "label",
|
|
9109
|
+
"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.",
|
|
9110
|
+
"since": "1.17.0"
|
|
9111
|
+
}
|
|
9112
|
+
];
|
|
7535
9113
|
this.elementRef = inject(ElementRef);
|
|
7536
9114
|
this.injector = inject(Injector);
|
|
7537
9115
|
// Internal signal to track selectedOption from change events
|
|
@@ -7887,6 +9465,33 @@ class SplitButton {
|
|
|
7887
9465
|
* Fired when the user clicks on the arrow action.
|
|
7888
9466
|
*/
|
|
7889
9467
|
this.ui5ArrowClick = output();
|
|
9468
|
+
/**
|
|
9469
|
+
* Available slots for content projection in this component.
|
|
9470
|
+
*
|
|
9471
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
9472
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
9473
|
+
*
|
|
9474
|
+
* - **(default)**: Defines the text of the component.
|
|
9475
|
+
|
|
9476
|
+
**Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.
|
|
9477
|
+
*
|
|
9478
|
+
* @example
|
|
9479
|
+
* ```html
|
|
9480
|
+
* <ui5-split-button>
|
|
9481
|
+
* <div slot="header">Custom header content</div>
|
|
9482
|
+
* <p>Default slot content</p>
|
|
9483
|
+
* </ui5-split-button>
|
|
9484
|
+
* ```
|
|
9485
|
+
*
|
|
9486
|
+
* @readonly
|
|
9487
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
9488
|
+
*/
|
|
9489
|
+
this.slots = [
|
|
9490
|
+
{
|
|
9491
|
+
"name": "default",
|
|
9492
|
+
"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."
|
|
9493
|
+
}
|
|
9494
|
+
];
|
|
7890
9495
|
this.elementRef = inject(ElementRef);
|
|
7891
9496
|
this.injector = inject(Injector);
|
|
7892
9497
|
}
|
|
@@ -8026,6 +9631,36 @@ class StepInput {
|
|
|
8026
9631
|
prevented, the component will not update the value state.
|
|
8027
9632
|
*/
|
|
8028
9633
|
this.ui5ValueStateChange = output();
|
|
9634
|
+
/**
|
|
9635
|
+
* Available slots for content projection in this component.
|
|
9636
|
+
*
|
|
9637
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
9638
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
9639
|
+
*
|
|
9640
|
+
* - **valueStateMessage**: Defines the value state message that will be displayed as pop up under the component.
|
|
9641
|
+
|
|
9642
|
+
**Note:** If not specified, a default text (in the respective language) will be displayed.
|
|
9643
|
+
|
|
9644
|
+
**Note:** The `valueStateMessage` would be displayed,
|
|
9645
|
+
when the component is in `Information`, `Critical` or `Negative` value state.
|
|
9646
|
+
*
|
|
9647
|
+
* @example
|
|
9648
|
+
* ```html
|
|
9649
|
+
* <ui5-step-input>
|
|
9650
|
+
* <div slot="header">Custom header content</div>
|
|
9651
|
+
* <p>Default slot content</p>
|
|
9652
|
+
* </ui5-step-input>
|
|
9653
|
+
* ```
|
|
9654
|
+
*
|
|
9655
|
+
* @readonly
|
|
9656
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
9657
|
+
*/
|
|
9658
|
+
this.slots = [
|
|
9659
|
+
{
|
|
9660
|
+
"name": "valueStateMessage",
|
|
9661
|
+
"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."
|
|
9662
|
+
}
|
|
9663
|
+
];
|
|
8029
9664
|
this.elementRef = inject(ElementRef);
|
|
8030
9665
|
this.injector = inject(Injector);
|
|
8031
9666
|
}
|
|
@@ -8161,6 +9796,31 @@ class SuggestionItemCustom {
|
|
|
8161
9796
|
**Note:** The text property is considered only for autocomplete.
|
|
8162
9797
|
*/
|
|
8163
9798
|
this.text = input(...(ngDevMode ? [undefined, { debugName: "text" }] : [])); // className is now passed
|
|
9799
|
+
/**
|
|
9800
|
+
* Available slots for content projection in this component.
|
|
9801
|
+
*
|
|
9802
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
9803
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
9804
|
+
*
|
|
9805
|
+
* - **(default)**: Defines the content of the component.
|
|
9806
|
+
*
|
|
9807
|
+
* @example
|
|
9808
|
+
* ```html
|
|
9809
|
+
* <ui5-suggestion-item-custom>
|
|
9810
|
+
* <div slot="header">Custom header content</div>
|
|
9811
|
+
* <p>Default slot content</p>
|
|
9812
|
+
* </ui5-suggestion-item-custom>
|
|
9813
|
+
* ```
|
|
9814
|
+
*
|
|
9815
|
+
* @readonly
|
|
9816
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
9817
|
+
*/
|
|
9818
|
+
this.slots = [
|
|
9819
|
+
{
|
|
9820
|
+
"name": "default",
|
|
9821
|
+
"description": "Defines the content of the component."
|
|
9822
|
+
}
|
|
9823
|
+
];
|
|
8164
9824
|
this.elementRef = inject(ElementRef);
|
|
8165
9825
|
this.injector = inject(Injector);
|
|
8166
9826
|
}
|
|
@@ -8241,6 +9901,38 @@ class SuggestionItemGroup {
|
|
|
8241
9901
|
**Note:** `move` event is fired only if there was a preceding `move-over` with prevented default action.
|
|
8242
9902
|
*/
|
|
8243
9903
|
this.ui5Move = output();
|
|
9904
|
+
/**
|
|
9905
|
+
* Available slots for content projection in this component.
|
|
9906
|
+
*
|
|
9907
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
9908
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
9909
|
+
*
|
|
9910
|
+
* - **(default)**: Defines the items of the <code>ui5-suggestion-item-group</code>.
|
|
9911
|
+
* - **header**: Defines the header of the component.
|
|
9912
|
+
|
|
9913
|
+
**Note:** Using this slot, the default header text of group and the value of `headerText` property will be overwritten.
|
|
9914
|
+
*
|
|
9915
|
+
* @example
|
|
9916
|
+
* ```html
|
|
9917
|
+
* <ui5-suggestion-item-group>
|
|
9918
|
+
* <div slot="header">Custom header content</div>
|
|
9919
|
+
* <p>Default slot content</p>
|
|
9920
|
+
* </ui5-suggestion-item-group>
|
|
9921
|
+
* ```
|
|
9922
|
+
*
|
|
9923
|
+
* @readonly
|
|
9924
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
9925
|
+
*/
|
|
9926
|
+
this.slots = [
|
|
9927
|
+
{
|
|
9928
|
+
"name": "default",
|
|
9929
|
+
"description": "Defines the items of the <code>ui5-suggestion-item-group</code>."
|
|
9930
|
+
},
|
|
9931
|
+
{
|
|
9932
|
+
"name": "header",
|
|
9933
|
+
"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."
|
|
9934
|
+
}
|
|
9935
|
+
];
|
|
8244
9936
|
this.elementRef = inject(ElementRef);
|
|
8245
9937
|
this.injector = inject(Injector);
|
|
8246
9938
|
}
|
|
@@ -8487,6 +10179,38 @@ class Tab {
|
|
|
8487
10179
|
* Defines if the tab is movable.
|
|
8488
10180
|
*/
|
|
8489
10181
|
this.movable = input(false, ...(ngDevMode ? [{ debugName: "movable", transform: booleanAttribute }] : [{ transform: booleanAttribute }])); // className is now passed
|
|
10182
|
+
/**
|
|
10183
|
+
* Available slots for content projection in this component.
|
|
10184
|
+
*
|
|
10185
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
10186
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
10187
|
+
*
|
|
10188
|
+
* - **(default)**: Holds the content associated with this tab.
|
|
10189
|
+
* - **items**: Defines hierarchies with nested sub tabs.
|
|
10190
|
+
|
|
10191
|
+
**Note:** Use `ui5-tab` and `ui5-tab-separator` for the intended design.
|
|
10192
|
+
*
|
|
10193
|
+
* @example
|
|
10194
|
+
* ```html
|
|
10195
|
+
* <ui5-tab>
|
|
10196
|
+
* <div slot="header">Custom header content</div>
|
|
10197
|
+
* <p>Default slot content</p>
|
|
10198
|
+
* </ui5-tab>
|
|
10199
|
+
* ```
|
|
10200
|
+
*
|
|
10201
|
+
* @readonly
|
|
10202
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
10203
|
+
*/
|
|
10204
|
+
this.slots = [
|
|
10205
|
+
{
|
|
10206
|
+
"name": "default",
|
|
10207
|
+
"description": "Holds the content associated with this tab."
|
|
10208
|
+
},
|
|
10209
|
+
{
|
|
10210
|
+
"name": "items",
|
|
10211
|
+
"description": "Defines hierarchies with nested sub tabs.\n\n**Note:** Use `ui5-tab` and `ui5-tab-separator` for the intended design."
|
|
10212
|
+
}
|
|
10213
|
+
];
|
|
8490
10214
|
this.elementRef = inject(ElementRef);
|
|
8491
10215
|
this.injector = inject(Injector);
|
|
8492
10216
|
}
|
|
@@ -8591,6 +10315,47 @@ class TabContainer {
|
|
|
8591
10315
|
**Note:** `move` event is fired only if there was a preceding `move-over` with prevented default action.
|
|
8592
10316
|
*/
|
|
8593
10317
|
this.ui5Move = output();
|
|
10318
|
+
/**
|
|
10319
|
+
* Available slots for content projection in this component.
|
|
10320
|
+
*
|
|
10321
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
10322
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
10323
|
+
*
|
|
10324
|
+
* - **(default)**: Defines the tabs.
|
|
10325
|
+
|
|
10326
|
+
**Note:** Use `ui5-tab` and `ui5-tab-separator` for the intended design.
|
|
10327
|
+
* - **overflowButton**: Defines the button which will open the overflow menu. If nothing is provided to this slot,
|
|
10328
|
+
the default button will be used.
|
|
10329
|
+
* - **startOverflowButton**: Defines the button which will open the start overflow menu if available. If nothing is provided to this slot,
|
|
10330
|
+
the default button will be used.
|
|
10331
|
+
*
|
|
10332
|
+
* @example
|
|
10333
|
+
* ```html
|
|
10334
|
+
* <ui5-tabcontainer>
|
|
10335
|
+
* <div slot="header">Custom header content</div>
|
|
10336
|
+
* <p>Default slot content</p>
|
|
10337
|
+
* </ui5-tabcontainer>
|
|
10338
|
+
* ```
|
|
10339
|
+
*
|
|
10340
|
+
* @readonly
|
|
10341
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
10342
|
+
*/
|
|
10343
|
+
this.slots = [
|
|
10344
|
+
{
|
|
10345
|
+
"name": "default",
|
|
10346
|
+
"description": "Defines the tabs.\n\n**Note:** Use `ui5-tab` and `ui5-tab-separator` for the intended design."
|
|
10347
|
+
},
|
|
10348
|
+
{
|
|
10349
|
+
"name": "overflowButton",
|
|
10350
|
+
"description": "Defines the button which will open the overflow menu. If nothing is provided to this slot,\nthe default button will be used.",
|
|
10351
|
+
"since": "1.0.0-rc.9"
|
|
10352
|
+
},
|
|
10353
|
+
{
|
|
10354
|
+
"name": "startOverflowButton",
|
|
10355
|
+
"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.",
|
|
10356
|
+
"since": "1.1.0"
|
|
10357
|
+
}
|
|
10358
|
+
];
|
|
8594
10359
|
this.elementRef = inject(ElementRef);
|
|
8595
10360
|
this.injector = inject(Injector);
|
|
8596
10361
|
}
|
|
@@ -8765,6 +10530,50 @@ class Table {
|
|
|
8765
10530
|
* Fired when a row action is clicked.
|
|
8766
10531
|
*/
|
|
8767
10532
|
this.ui5RowActionClick = output();
|
|
10533
|
+
/**
|
|
10534
|
+
* Available slots for content projection in this component.
|
|
10535
|
+
*
|
|
10536
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
10537
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
10538
|
+
*
|
|
10539
|
+
* - **(default)**: Defines the rows of the component.
|
|
10540
|
+
|
|
10541
|
+
**Note:** Use `ui5-table-row` for the intended design.
|
|
10542
|
+
* - **headerRow**: Defines the header row of the component.
|
|
10543
|
+
|
|
10544
|
+
**Note:** Use `ui5-table-header-row` for the intended design.
|
|
10545
|
+
* - **noData**: Defines the custom visualization if there is no data available.
|
|
10546
|
+
* - **features**: Defines the features of the component.
|
|
10547
|
+
*
|
|
10548
|
+
* @example
|
|
10549
|
+
* ```html
|
|
10550
|
+
* <ui5-table>
|
|
10551
|
+
* <div slot="header">Custom header content</div>
|
|
10552
|
+
* <p>Default slot content</p>
|
|
10553
|
+
* </ui5-table>
|
|
10554
|
+
* ```
|
|
10555
|
+
*
|
|
10556
|
+
* @readonly
|
|
10557
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
10558
|
+
*/
|
|
10559
|
+
this.slots = [
|
|
10560
|
+
{
|
|
10561
|
+
"name": "default",
|
|
10562
|
+
"description": "Defines the rows of the component.\n\n**Note:** Use `ui5-table-row` for the intended design."
|
|
10563
|
+
},
|
|
10564
|
+
{
|
|
10565
|
+
"name": "headerRow",
|
|
10566
|
+
"description": "Defines the header row of the component.\n\n**Note:** Use `ui5-table-header-row` for the intended design."
|
|
10567
|
+
},
|
|
10568
|
+
{
|
|
10569
|
+
"name": "noData",
|
|
10570
|
+
"description": "Defines the custom visualization if there is no data available."
|
|
10571
|
+
},
|
|
10572
|
+
{
|
|
10573
|
+
"name": "features",
|
|
10574
|
+
"description": "Defines the features of the component."
|
|
10575
|
+
}
|
|
10576
|
+
];
|
|
8768
10577
|
this.elementRef = inject(ElementRef);
|
|
8769
10578
|
this.injector = inject(Injector);
|
|
8770
10579
|
}
|
|
@@ -8840,6 +10649,31 @@ class TableCell {
|
|
|
8840
10649
|
* Determines the horizontal alignment of table cells.
|
|
8841
10650
|
*/
|
|
8842
10651
|
this.horizontalAlign = input(...(ngDevMode ? [undefined, { debugName: "horizontalAlign" }] : [])); // className is now passed
|
|
10652
|
+
/**
|
|
10653
|
+
* Available slots for content projection in this component.
|
|
10654
|
+
*
|
|
10655
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
10656
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
10657
|
+
*
|
|
10658
|
+
* - **(default)**: Defines the content of the component.
|
|
10659
|
+
*
|
|
10660
|
+
* @example
|
|
10661
|
+
* ```html
|
|
10662
|
+
* <ui5-table-cell>
|
|
10663
|
+
* <div slot="header">Custom header content</div>
|
|
10664
|
+
* <p>Default slot content</p>
|
|
10665
|
+
* </ui5-table-cell>
|
|
10666
|
+
* ```
|
|
10667
|
+
*
|
|
10668
|
+
* @readonly
|
|
10669
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
10670
|
+
*/
|
|
10671
|
+
this.slots = [
|
|
10672
|
+
{
|
|
10673
|
+
"name": "default",
|
|
10674
|
+
"description": "Defines the content of the component."
|
|
10675
|
+
}
|
|
10676
|
+
];
|
|
8843
10677
|
this.elementRef = inject(ElementRef);
|
|
8844
10678
|
this.injector = inject(Injector);
|
|
8845
10679
|
}
|
|
@@ -9027,6 +10861,39 @@ class TableHeaderCell {
|
|
|
9027
10861
|
* Determines the horizontal alignment of table cells.
|
|
9028
10862
|
*/
|
|
9029
10863
|
this.horizontalAlign = input(...(ngDevMode ? [undefined, { debugName: "horizontalAlign" }] : [])); // className is now passed
|
|
10864
|
+
/**
|
|
10865
|
+
* Available slots for content projection in this component.
|
|
10866
|
+
*
|
|
10867
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
10868
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
10869
|
+
*
|
|
10870
|
+
* - **action**: Defines the action of the column.
|
|
10871
|
+
|
|
10872
|
+
**Note:** While multiple actions are technically possible, this is not supported.
|
|
10873
|
+
* - **(default)**: Defines the content of the component.
|
|
10874
|
+
*
|
|
10875
|
+
* @example
|
|
10876
|
+
* ```html
|
|
10877
|
+
* <ui5-table-header-cell>
|
|
10878
|
+
* <div slot="header">Custom header content</div>
|
|
10879
|
+
* <p>Default slot content</p>
|
|
10880
|
+
* </ui5-table-header-cell>
|
|
10881
|
+
* ```
|
|
10882
|
+
*
|
|
10883
|
+
* @readonly
|
|
10884
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
10885
|
+
*/
|
|
10886
|
+
this.slots = [
|
|
10887
|
+
{
|
|
10888
|
+
"name": "action",
|
|
10889
|
+
"description": "Defines the action of the column.\n\n**Note:** While multiple actions are technically possible, this is not supported.",
|
|
10890
|
+
"since": "2.8.0"
|
|
10891
|
+
},
|
|
10892
|
+
{
|
|
10893
|
+
"name": "default",
|
|
10894
|
+
"description": "Defines the content of the component."
|
|
10895
|
+
}
|
|
10896
|
+
];
|
|
9030
10897
|
this.elementRef = inject(ElementRef);
|
|
9031
10898
|
this.injector = inject(Injector);
|
|
9032
10899
|
}
|
|
@@ -9130,6 +10997,33 @@ class TableHeaderRow {
|
|
|
9130
10997
|
Note: If used in combination with overflowMode "Scroll", the table needs a defined height for the sticky header to work as expected.
|
|
9131
10998
|
*/
|
|
9132
10999
|
this.sticky = input(false, ...(ngDevMode ? [{ debugName: "sticky", transform: booleanAttribute }] : [{ transform: booleanAttribute }])); // className is now passed
|
|
11000
|
+
/**
|
|
11001
|
+
* Available slots for content projection in this component.
|
|
11002
|
+
*
|
|
11003
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
11004
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
11005
|
+
*
|
|
11006
|
+
* - **(default)**: Defines the cells of the component.
|
|
11007
|
+
|
|
11008
|
+
**Note:** Use `ui5-table-header-cell` for the intended design.
|
|
11009
|
+
*
|
|
11010
|
+
* @example
|
|
11011
|
+
* ```html
|
|
11012
|
+
* <ui5-table-header-row>
|
|
11013
|
+
* <div slot="header">Custom header content</div>
|
|
11014
|
+
* <p>Default slot content</p>
|
|
11015
|
+
* </ui5-table-header-row>
|
|
11016
|
+
* ```
|
|
11017
|
+
*
|
|
11018
|
+
* @readonly
|
|
11019
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
11020
|
+
*/
|
|
11021
|
+
this.slots = [
|
|
11022
|
+
{
|
|
11023
|
+
"name": "default",
|
|
11024
|
+
"description": "Defines the cells of the component.\n\n**Note:** Use `ui5-table-header-cell` for the intended design."
|
|
11025
|
+
}
|
|
11026
|
+
];
|
|
9133
11027
|
this.elementRef = inject(ElementRef);
|
|
9134
11028
|
this.injector = inject(Injector);
|
|
9135
11029
|
}
|
|
@@ -9198,6 +11092,41 @@ class TableRow {
|
|
|
9198
11092
|
* Defines whether the row is movable.
|
|
9199
11093
|
*/
|
|
9200
11094
|
this.movable = input(false, ...(ngDevMode ? [{ debugName: "movable", transform: booleanAttribute }] : [{ transform: booleanAttribute }])); // className is now passed
|
|
11095
|
+
/**
|
|
11096
|
+
* Available slots for content projection in this component.
|
|
11097
|
+
*
|
|
11098
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
11099
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
11100
|
+
*
|
|
11101
|
+
* - **(default)**: Defines the cells of the component.
|
|
11102
|
+
|
|
11103
|
+
**Note:** Use `ui5-table-cell` for the intended design.
|
|
11104
|
+
* - **actions**: Defines the actions of the component.
|
|
11105
|
+
|
|
11106
|
+
**Note:** Use `ui5-table-row-action` or `ui5-table-row-action-navigation` for the intended design.
|
|
11107
|
+
*
|
|
11108
|
+
* @example
|
|
11109
|
+
* ```html
|
|
11110
|
+
* <ui5-table-row>
|
|
11111
|
+
* <div slot="header">Custom header content</div>
|
|
11112
|
+
* <p>Default slot content</p>
|
|
11113
|
+
* </ui5-table-row>
|
|
11114
|
+
* ```
|
|
11115
|
+
*
|
|
11116
|
+
* @readonly
|
|
11117
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
11118
|
+
*/
|
|
11119
|
+
this.slots = [
|
|
11120
|
+
{
|
|
11121
|
+
"name": "default",
|
|
11122
|
+
"description": "Defines the cells of the component.\n\n**Note:** Use `ui5-table-cell` for the intended design."
|
|
11123
|
+
},
|
|
11124
|
+
{
|
|
11125
|
+
"name": "actions",
|
|
11126
|
+
"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.",
|
|
11127
|
+
"since": "2.7.0"
|
|
11128
|
+
}
|
|
11129
|
+
];
|
|
9201
11130
|
this.elementRef = inject(ElementRef);
|
|
9202
11131
|
this.injector = inject(Injector);
|
|
9203
11132
|
}
|
|
@@ -9759,6 +11688,38 @@ class Tag {
|
|
|
9759
11688
|
**Note:** The event will be fired if the `interactive` property is `true`
|
|
9760
11689
|
*/
|
|
9761
11690
|
this.ui5Click = output();
|
|
11691
|
+
/**
|
|
11692
|
+
* Available slots for content projection in this component.
|
|
11693
|
+
*
|
|
11694
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
11695
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
11696
|
+
*
|
|
11697
|
+
* - **(default)**: Defines the text of the component.
|
|
11698
|
+
|
|
11699
|
+
**Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.
|
|
11700
|
+
* - **icon**: Defines the icon to be displayed in the component.
|
|
11701
|
+
*
|
|
11702
|
+
* @example
|
|
11703
|
+
* ```html
|
|
11704
|
+
* <ui5-tag>
|
|
11705
|
+
* <div slot="header">Custom header content</div>
|
|
11706
|
+
* <p>Default slot content</p>
|
|
11707
|
+
* </ui5-tag>
|
|
11708
|
+
* ```
|
|
11709
|
+
*
|
|
11710
|
+
* @readonly
|
|
11711
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
11712
|
+
*/
|
|
11713
|
+
this.slots = [
|
|
11714
|
+
{
|
|
11715
|
+
"name": "default",
|
|
11716
|
+
"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."
|
|
11717
|
+
},
|
|
11718
|
+
{
|
|
11719
|
+
"name": "icon",
|
|
11720
|
+
"description": "Defines the icon to be displayed in the component."
|
|
11721
|
+
}
|
|
11722
|
+
];
|
|
9762
11723
|
this.elementRef = inject(ElementRef);
|
|
9763
11724
|
this.injector = inject(Injector);
|
|
9764
11725
|
}
|
|
@@ -9833,6 +11794,31 @@ class Text {
|
|
|
9833
11794
|
* Specifies if an empty indicator should be displayed when there is no text.
|
|
9834
11795
|
*/
|
|
9835
11796
|
this.emptyIndicatorMode = input("Off", ...(ngDevMode ? [{ debugName: "emptyIndicatorMode" }] : [])); // className is now passed
|
|
11797
|
+
/**
|
|
11798
|
+
* Available slots for content projection in this component.
|
|
11799
|
+
*
|
|
11800
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
11801
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
11802
|
+
*
|
|
11803
|
+
* - **(default)**: Defines the text of the component.
|
|
11804
|
+
*
|
|
11805
|
+
* @example
|
|
11806
|
+
* ```html
|
|
11807
|
+
* <ui5-text>
|
|
11808
|
+
* <div slot="header">Custom header content</div>
|
|
11809
|
+
* <p>Default slot content</p>
|
|
11810
|
+
* </ui5-text>
|
|
11811
|
+
* ```
|
|
11812
|
+
*
|
|
11813
|
+
* @readonly
|
|
11814
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
11815
|
+
*/
|
|
11816
|
+
this.slots = [
|
|
11817
|
+
{
|
|
11818
|
+
"name": "default",
|
|
11819
|
+
"description": "Defines the text of the component."
|
|
11820
|
+
}
|
|
11821
|
+
];
|
|
9836
11822
|
this.elementRef = inject(ElementRef);
|
|
9837
11823
|
this.injector = inject(Injector);
|
|
9838
11824
|
}
|
|
@@ -9984,6 +11970,38 @@ class TextArea {
|
|
|
9984
11970
|
* Fired when textarea is scrolled.
|
|
9985
11971
|
*/
|
|
9986
11972
|
this.ui5Scroll = output();
|
|
11973
|
+
/**
|
|
11974
|
+
* Available slots for content projection in this component.
|
|
11975
|
+
*
|
|
11976
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
11977
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
11978
|
+
*
|
|
11979
|
+
* - **valueStateMessage**: Defines the value state message that will be displayed as pop up under the component.
|
|
11980
|
+
The value state message slot should contain only one root element.
|
|
11981
|
+
|
|
11982
|
+
**Note:** If not specified, a default text (in the respective language) will be displayed.
|
|
11983
|
+
|
|
11984
|
+
**Note:** The `valueStateMessage` would be displayed if the component has
|
|
11985
|
+
`valueState` of type `Information`, `Critical` or `Negative`.
|
|
11986
|
+
*
|
|
11987
|
+
* @example
|
|
11988
|
+
* ```html
|
|
11989
|
+
* <ui5-textarea>
|
|
11990
|
+
* <div slot="header">Custom header content</div>
|
|
11991
|
+
* <p>Default slot content</p>
|
|
11992
|
+
* </ui5-textarea>
|
|
11993
|
+
* ```
|
|
11994
|
+
*
|
|
11995
|
+
* @readonly
|
|
11996
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
11997
|
+
*/
|
|
11998
|
+
this.slots = [
|
|
11999
|
+
{
|
|
12000
|
+
"name": "valueStateMessage",
|
|
12001
|
+
"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`.",
|
|
12002
|
+
"since": "1.0.0-rc.7"
|
|
12003
|
+
}
|
|
12004
|
+
];
|
|
9987
12005
|
this.elementRef = inject(ElementRef);
|
|
9988
12006
|
this.injector = inject(Injector);
|
|
9989
12007
|
}
|
|
@@ -10144,6 +12162,37 @@ class TimePicker {
|
|
|
10144
12162
|
* Fired after the value-help dialog of the component is closed.
|
|
10145
12163
|
*/
|
|
10146
12164
|
this.ui5Close = output();
|
|
12165
|
+
/**
|
|
12166
|
+
* Available slots for content projection in this component.
|
|
12167
|
+
*
|
|
12168
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
12169
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
12170
|
+
*
|
|
12171
|
+
* - **valueStateMessage**: Defines the value state message that will be displayed as pop up under the `ui5-time-picker`.
|
|
12172
|
+
|
|
12173
|
+
**Note:** If not specified, a default text (in the respective language) will be displayed.
|
|
12174
|
+
|
|
12175
|
+
**Note:** The `valueStateMessage` would be displayed,
|
|
12176
|
+
when the `ui5-time-picker` is in `Information`, `Critical` or `Negative` value state.
|
|
12177
|
+
*
|
|
12178
|
+
* @example
|
|
12179
|
+
* ```html
|
|
12180
|
+
* <ui5-time-picker>
|
|
12181
|
+
* <div slot="header">Custom header content</div>
|
|
12182
|
+
* <p>Default slot content</p>
|
|
12183
|
+
* </ui5-time-picker>
|
|
12184
|
+
* ```
|
|
12185
|
+
*
|
|
12186
|
+
* @readonly
|
|
12187
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
12188
|
+
*/
|
|
12189
|
+
this.slots = [
|
|
12190
|
+
{
|
|
12191
|
+
"name": "valueStateMessage",
|
|
12192
|
+
"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.",
|
|
12193
|
+
"since": "1.0.0-rc.8"
|
|
12194
|
+
}
|
|
12195
|
+
];
|
|
10147
12196
|
this.elementRef = inject(ElementRef);
|
|
10148
12197
|
this.injector = inject(Injector);
|
|
10149
12198
|
}
|
|
@@ -10246,6 +12295,34 @@ class Title {
|
|
|
10246
12295
|
Available options are: `"H6"` to `"H1"`.
|
|
10247
12296
|
*/
|
|
10248
12297
|
this.size = input("H5", ...(ngDevMode ? [{ debugName: "size" }] : [])); // className is now passed
|
|
12298
|
+
/**
|
|
12299
|
+
* Available slots for content projection in this component.
|
|
12300
|
+
*
|
|
12301
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
12302
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
12303
|
+
*
|
|
12304
|
+
* - **(default)**: Defines the text of the component.
|
|
12305
|
+
This component supports nesting a `Link` component inside.
|
|
12306
|
+
|
|
12307
|
+
**Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.
|
|
12308
|
+
*
|
|
12309
|
+
* @example
|
|
12310
|
+
* ```html
|
|
12311
|
+
* <ui5-title>
|
|
12312
|
+
* <div slot="header">Custom header content</div>
|
|
12313
|
+
* <p>Default slot content</p>
|
|
12314
|
+
* </ui5-title>
|
|
12315
|
+
* ```
|
|
12316
|
+
*
|
|
12317
|
+
* @readonly
|
|
12318
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
12319
|
+
*/
|
|
12320
|
+
this.slots = [
|
|
12321
|
+
{
|
|
12322
|
+
"name": "default",
|
|
12323
|
+
"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."
|
|
12324
|
+
}
|
|
12325
|
+
];
|
|
10249
12326
|
this.elementRef = inject(ElementRef);
|
|
10250
12327
|
this.injector = inject(Injector);
|
|
10251
12328
|
}
|
|
@@ -10314,6 +12391,33 @@ class Toast {
|
|
|
10314
12391
|
* Fired after the component is auto closed.
|
|
10315
12392
|
*/
|
|
10316
12393
|
this.ui5Close = output();
|
|
12394
|
+
/**
|
|
12395
|
+
* Available slots for content projection in this component.
|
|
12396
|
+
*
|
|
12397
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
12398
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
12399
|
+
*
|
|
12400
|
+
* - **(default)**: Defines the text of the component.
|
|
12401
|
+
|
|
12402
|
+
**Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.
|
|
12403
|
+
*
|
|
12404
|
+
* @example
|
|
12405
|
+
* ```html
|
|
12406
|
+
* <ui5-toast>
|
|
12407
|
+
* <div slot="header">Custom header content</div>
|
|
12408
|
+
* <p>Default slot content</p>
|
|
12409
|
+
* </ui5-toast>
|
|
12410
|
+
* ```
|
|
12411
|
+
*
|
|
12412
|
+
* @readonly
|
|
12413
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
12414
|
+
*/
|
|
12415
|
+
this.slots = [
|
|
12416
|
+
{
|
|
12417
|
+
"name": "default",
|
|
12418
|
+
"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."
|
|
12419
|
+
}
|
|
12420
|
+
];
|
|
10317
12421
|
this.elementRef = inject(ElementRef);
|
|
10318
12422
|
this.injector = inject(Injector);
|
|
10319
12423
|
}
|
|
@@ -10483,6 +12587,39 @@ class ToggleButton {
|
|
|
10483
12587
|
**Note:** The event will not be fired if the `disabled` property is set to `true`.
|
|
10484
12588
|
*/
|
|
10485
12589
|
this.ui5Click = output();
|
|
12590
|
+
/**
|
|
12591
|
+
* Available slots for content projection in this component.
|
|
12592
|
+
*
|
|
12593
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
12594
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
12595
|
+
*
|
|
12596
|
+
* - **(default)**: Defines the text of the component.
|
|
12597
|
+
|
|
12598
|
+
**Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.
|
|
12599
|
+
* - **badge**: Adds a badge to the button.
|
|
12600
|
+
*
|
|
12601
|
+
* @example
|
|
12602
|
+
* ```html
|
|
12603
|
+
* <ui5-toggle-button>
|
|
12604
|
+
* <div slot="header">Custom header content</div>
|
|
12605
|
+
* <p>Default slot content</p>
|
|
12606
|
+
* </ui5-toggle-button>
|
|
12607
|
+
* ```
|
|
12608
|
+
*
|
|
12609
|
+
* @readonly
|
|
12610
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
12611
|
+
*/
|
|
12612
|
+
this.slots = [
|
|
12613
|
+
{
|
|
12614
|
+
"name": "default",
|
|
12615
|
+
"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."
|
|
12616
|
+
},
|
|
12617
|
+
{
|
|
12618
|
+
"name": "badge",
|
|
12619
|
+
"description": "Adds a badge to the button.",
|
|
12620
|
+
"since": "2.7.0"
|
|
12621
|
+
}
|
|
12622
|
+
];
|
|
10486
12623
|
this.elementRef = inject(ElementRef);
|
|
10487
12624
|
this.injector = inject(Injector);
|
|
10488
12625
|
}
|
|
@@ -10566,6 +12703,33 @@ class Token {
|
|
|
10566
12703
|
* Defines whether the component is selected or not.
|
|
10567
12704
|
*/
|
|
10568
12705
|
this.selected = input(false, ...(ngDevMode ? [{ debugName: "selected", transform: booleanAttribute }] : [{ transform: booleanAttribute }])); // className is now passed
|
|
12706
|
+
/**
|
|
12707
|
+
* Available slots for content projection in this component.
|
|
12708
|
+
*
|
|
12709
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
12710
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
12711
|
+
*
|
|
12712
|
+
* - **closeIcon**: Defines the close icon for the token. If nothing is provided to this slot, the default close icon will be used.
|
|
12713
|
+
Accepts `ui5-icon`.
|
|
12714
|
+
*
|
|
12715
|
+
* @example
|
|
12716
|
+
* ```html
|
|
12717
|
+
* <ui5-token>
|
|
12718
|
+
* <div slot="header">Custom header content</div>
|
|
12719
|
+
* <p>Default slot content</p>
|
|
12720
|
+
* </ui5-token>
|
|
12721
|
+
* ```
|
|
12722
|
+
*
|
|
12723
|
+
* @readonly
|
|
12724
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
12725
|
+
*/
|
|
12726
|
+
this.slots = [
|
|
12727
|
+
{
|
|
12728
|
+
"name": "closeIcon",
|
|
12729
|
+
"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`.",
|
|
12730
|
+
"since": "1.0.0-rc.9"
|
|
12731
|
+
}
|
|
12732
|
+
];
|
|
10569
12733
|
this.elementRef = inject(ElementRef);
|
|
10570
12734
|
this.injector = inject(Injector);
|
|
10571
12735
|
}
|
|
@@ -10662,6 +12826,31 @@ class Tokenizer {
|
|
|
10662
12826
|
* Fired when token selection is changed by user interaction
|
|
10663
12827
|
*/
|
|
10664
12828
|
this.ui5SelectionChange = output();
|
|
12829
|
+
/**
|
|
12830
|
+
* Available slots for content projection in this component.
|
|
12831
|
+
*
|
|
12832
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
12833
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
12834
|
+
*
|
|
12835
|
+
* - **(default)**: Defines the tokens to be displayed.
|
|
12836
|
+
*
|
|
12837
|
+
* @example
|
|
12838
|
+
* ```html
|
|
12839
|
+
* <ui5-tokenizer>
|
|
12840
|
+
* <div slot="header">Custom header content</div>
|
|
12841
|
+
* <p>Default slot content</p>
|
|
12842
|
+
* </ui5-tokenizer>
|
|
12843
|
+
* ```
|
|
12844
|
+
*
|
|
12845
|
+
* @readonly
|
|
12846
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
12847
|
+
*/
|
|
12848
|
+
this.slots = [
|
|
12849
|
+
{
|
|
12850
|
+
"name": "default",
|
|
12851
|
+
"description": "Defines the tokens to be displayed."
|
|
12852
|
+
}
|
|
12853
|
+
];
|
|
10665
12854
|
this.elementRef = inject(ElementRef);
|
|
10666
12855
|
this.injector = inject(Injector);
|
|
10667
12856
|
}
|
|
@@ -10746,6 +12935,33 @@ class Toolbar {
|
|
|
10746
12935
|
* Defines the toolbar design.
|
|
10747
12936
|
*/
|
|
10748
12937
|
this.design = input("Solid", ...(ngDevMode ? [{ debugName: "design" }] : [])); // className is now passed
|
|
12938
|
+
/**
|
|
12939
|
+
* Available slots for content projection in this component.
|
|
12940
|
+
*
|
|
12941
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
12942
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
12943
|
+
*
|
|
12944
|
+
* - **(default)**: Defines the items of the component.
|
|
12945
|
+
|
|
12946
|
+
**Note:** Currently only `ui5-toolbar-button`, `ui5-toolbar-select`, `ui5-toolbar-separator` and `ui5-toolbar-spacer` are allowed here.
|
|
12947
|
+
*
|
|
12948
|
+
* @example
|
|
12949
|
+
* ```html
|
|
12950
|
+
* <ui5-toolbar>
|
|
12951
|
+
* <div slot="header">Custom header content</div>
|
|
12952
|
+
* <p>Default slot content</p>
|
|
12953
|
+
* </ui5-toolbar>
|
|
12954
|
+
* ```
|
|
12955
|
+
*
|
|
12956
|
+
* @readonly
|
|
12957
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
12958
|
+
*/
|
|
12959
|
+
this.slots = [
|
|
12960
|
+
{
|
|
12961
|
+
"name": "default",
|
|
12962
|
+
"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."
|
|
12963
|
+
}
|
|
12964
|
+
];
|
|
10749
12965
|
this.elementRef = inject(ElementRef);
|
|
10750
12966
|
this.injector = inject(Injector);
|
|
10751
12967
|
}
|
|
@@ -11003,6 +13219,43 @@ class ToolbarSelect {
|
|
|
11003
13219
|
* Fired after the component's dropdown menu closes.
|
|
11004
13220
|
*/
|
|
11005
13221
|
this.ui5Close = output();
|
|
13222
|
+
/**
|
|
13223
|
+
* Available slots for content projection in this component.
|
|
13224
|
+
*
|
|
13225
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
13226
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
13227
|
+
*
|
|
13228
|
+
* - **(default)**: Defines the component options.
|
|
13229
|
+
|
|
13230
|
+
**Note:** Only one selected option is allowed.
|
|
13231
|
+
If more than one option is defined as selected, the last one would be considered as the selected one.
|
|
13232
|
+
|
|
13233
|
+
**Note:** Use the `ui5-toolbar-select-option` component to define the desired options.
|
|
13234
|
+
* - **label**: Defines the HTML element that will be displayed in the component input part,
|
|
13235
|
+
representing the selected option.
|
|
13236
|
+
*
|
|
13237
|
+
* @example
|
|
13238
|
+
* ```html
|
|
13239
|
+
* <ui5-toolbar-select>
|
|
13240
|
+
* <div slot="header">Custom header content</div>
|
|
13241
|
+
* <p>Default slot content</p>
|
|
13242
|
+
* </ui5-toolbar-select>
|
|
13243
|
+
* ```
|
|
13244
|
+
*
|
|
13245
|
+
* @readonly
|
|
13246
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
13247
|
+
*/
|
|
13248
|
+
this.slots = [
|
|
13249
|
+
{
|
|
13250
|
+
"name": "default",
|
|
13251
|
+
"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."
|
|
13252
|
+
},
|
|
13253
|
+
{
|
|
13254
|
+
"name": "label",
|
|
13255
|
+
"description": "Defines the HTML element that will be displayed in the component input part,\nrepresenting the selected option.",
|
|
13256
|
+
"since": "2.15.0"
|
|
13257
|
+
}
|
|
13258
|
+
];
|
|
11006
13259
|
this.elementRef = inject(ElementRef);
|
|
11007
13260
|
this.injector = inject(Injector);
|
|
11008
13261
|
}
|
|
@@ -11077,6 +13330,33 @@ class ToolbarSelectOption {
|
|
|
11077
13330
|
* Defines the selected state of the component.
|
|
11078
13331
|
*/
|
|
11079
13332
|
this.selected = input(false, ...(ngDevMode ? [{ debugName: "selected", transform: booleanAttribute }] : [{ transform: booleanAttribute }])); // className is now passed
|
|
13333
|
+
/**
|
|
13334
|
+
* Available slots for content projection in this component.
|
|
13335
|
+
*
|
|
13336
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
13337
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
13338
|
+
*
|
|
13339
|
+
* - **(default)**: Defines the text of the component.
|
|
13340
|
+
|
|
13341
|
+
**Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.
|
|
13342
|
+
*
|
|
13343
|
+
* @example
|
|
13344
|
+
* ```html
|
|
13345
|
+
* <ui5-toolbar-select-option>
|
|
13346
|
+
* <div slot="header">Custom header content</div>
|
|
13347
|
+
* <p>Default slot content</p>
|
|
13348
|
+
* </ui5-toolbar-select-option>
|
|
13349
|
+
* ```
|
|
13350
|
+
*
|
|
13351
|
+
* @readonly
|
|
13352
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
13353
|
+
*/
|
|
13354
|
+
this.slots = [
|
|
13355
|
+
{
|
|
13356
|
+
"name": "default",
|
|
13357
|
+
"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."
|
|
13358
|
+
}
|
|
13359
|
+
];
|
|
11080
13360
|
this.elementRef = inject(ElementRef);
|
|
11081
13361
|
this.injector = inject(Injector);
|
|
11082
13362
|
}
|
|
@@ -11323,6 +13603,41 @@ class Tree {
|
|
|
11323
13603
|
**Note:** The `move` event is fired only if there was a preceding `move-over` event with prevented default action.
|
|
11324
13604
|
*/
|
|
11325
13605
|
this.ui5MoveOver = output();
|
|
13606
|
+
/**
|
|
13607
|
+
* Available slots for content projection in this component.
|
|
13608
|
+
*
|
|
13609
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
13610
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
13611
|
+
*
|
|
13612
|
+
* - **(default)**: Defines the items of the component. Tree items may have other tree items as children.
|
|
13613
|
+
|
|
13614
|
+
**Note:** Use `ui5-tree-item` for the intended design.
|
|
13615
|
+
* - **header**: Defines the component header.
|
|
13616
|
+
|
|
13617
|
+
**Note:** When the `header` slot is set, the
|
|
13618
|
+
`headerText` property is ignored.
|
|
13619
|
+
*
|
|
13620
|
+
* @example
|
|
13621
|
+
* ```html
|
|
13622
|
+
* <ui5-tree>
|
|
13623
|
+
* <div slot="header">Custom header content</div>
|
|
13624
|
+
* <p>Default slot content</p>
|
|
13625
|
+
* </ui5-tree>
|
|
13626
|
+
* ```
|
|
13627
|
+
*
|
|
13628
|
+
* @readonly
|
|
13629
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
13630
|
+
*/
|
|
13631
|
+
this.slots = [
|
|
13632
|
+
{
|
|
13633
|
+
"name": "default",
|
|
13634
|
+
"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."
|
|
13635
|
+
},
|
|
13636
|
+
{
|
|
13637
|
+
"name": "header",
|
|
13638
|
+
"description": "Defines the component header.\n\n**Note:** When the `header` slot is set, the\n`headerText` property is ignored."
|
|
13639
|
+
}
|
|
13640
|
+
];
|
|
11326
13641
|
this.elementRef = inject(ElementRef);
|
|
11327
13642
|
this.injector = inject(Injector);
|
|
11328
13643
|
}
|
|
@@ -11491,6 +13806,52 @@ class TreeItem {
|
|
|
11491
13806
|
* Fired when the user clicks on the detail button when type is `Detail`.
|
|
11492
13807
|
*/
|
|
11493
13808
|
this.ui5DetailClick = output();
|
|
13809
|
+
/**
|
|
13810
|
+
* Available slots for content projection in this component.
|
|
13811
|
+
*
|
|
13812
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
13813
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
13814
|
+
*
|
|
13815
|
+
* - **(default)**: Defines the items of the component.
|
|
13816
|
+
|
|
13817
|
+
**Note:** Use `ui5-tree-item` or `ui5-tree-item-custom`
|
|
13818
|
+
* - **image**: **Note:** While the slot allows option for setting custom avatar, to match the
|
|
13819
|
+
design guidelines, please use the `ui5-avatar` with size XS.
|
|
13820
|
+
|
|
13821
|
+
**Note:** If bigger `ui5-avatar` needs to be used, then the size of the
|
|
13822
|
+
`ui5-tree-item` should be customized in order to fit.
|
|
13823
|
+
* - **deleteButton**: Defines the delete button, displayed in "Delete" mode.
|
|
13824
|
+
**Note:** While the slot allows custom buttons, to match
|
|
13825
|
+
design guidelines, please use the `ui5-button` component.
|
|
13826
|
+
**Note:** When the slot is not present, a built-in delete button will be displayed.
|
|
13827
|
+
*
|
|
13828
|
+
* @example
|
|
13829
|
+
* ```html
|
|
13830
|
+
* <ui5-tree-item>
|
|
13831
|
+
* <div slot="header">Custom header content</div>
|
|
13832
|
+
* <p>Default slot content</p>
|
|
13833
|
+
* </ui5-tree-item>
|
|
13834
|
+
* ```
|
|
13835
|
+
*
|
|
13836
|
+
* @readonly
|
|
13837
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
13838
|
+
*/
|
|
13839
|
+
this.slots = [
|
|
13840
|
+
{
|
|
13841
|
+
"name": "default",
|
|
13842
|
+
"description": "Defines the items of the component.\n\n**Note:** Use `ui5-tree-item` or `ui5-tree-item-custom`"
|
|
13843
|
+
},
|
|
13844
|
+
{
|
|
13845
|
+
"name": "image",
|
|
13846
|
+
"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.",
|
|
13847
|
+
"since": "2.10.0"
|
|
13848
|
+
},
|
|
13849
|
+
{
|
|
13850
|
+
"name": "deleteButton",
|
|
13851
|
+
"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.",
|
|
13852
|
+
"since": "1.9.0"
|
|
13853
|
+
}
|
|
13854
|
+
];
|
|
11494
13855
|
this.elementRef = inject(ElementRef);
|
|
11495
13856
|
this.injector = inject(Injector);
|
|
11496
13857
|
}
|
|
@@ -11655,6 +14016,57 @@ class TreeItemCustom {
|
|
|
11655
14016
|
* Fired when the user clicks on the detail button when type is `Detail`.
|
|
11656
14017
|
*/
|
|
11657
14018
|
this.ui5DetailClick = output();
|
|
14019
|
+
/**
|
|
14020
|
+
* Available slots for content projection in this component.
|
|
14021
|
+
*
|
|
14022
|
+
* Slots allow you to insert custom content into predefined areas of the web component.
|
|
14023
|
+
* Use the `slot` attribute on child elements to target specific slots.
|
|
14024
|
+
*
|
|
14025
|
+
* - **content**: Defines the content of the `ui5-tree-item`.
|
|
14026
|
+
* - **(default)**: Defines the items of the component.
|
|
14027
|
+
|
|
14028
|
+
**Note:** Use `ui5-tree-item` or `ui5-tree-item-custom`
|
|
14029
|
+
* - **image**: **Note:** While the slot allows option for setting custom avatar, to match the
|
|
14030
|
+
design guidelines, please use the `ui5-avatar` with size XS.
|
|
14031
|
+
|
|
14032
|
+
**Note:** If bigger `ui5-avatar` needs to be used, then the size of the
|
|
14033
|
+
`ui5-tree-item` should be customized in order to fit.
|
|
14034
|
+
* - **deleteButton**: Defines the delete button, displayed in "Delete" mode.
|
|
14035
|
+
**Note:** While the slot allows custom buttons, to match
|
|
14036
|
+
design guidelines, please use the `ui5-button` component.
|
|
14037
|
+
**Note:** When the slot is not present, a built-in delete button will be displayed.
|
|
14038
|
+
*
|
|
14039
|
+
* @example
|
|
14040
|
+
* ```html
|
|
14041
|
+
* <ui5-tree-item-custom>
|
|
14042
|
+
* <div slot="header">Custom header content</div>
|
|
14043
|
+
* <p>Default slot content</p>
|
|
14044
|
+
* </ui5-tree-item-custom>
|
|
14045
|
+
* ```
|
|
14046
|
+
*
|
|
14047
|
+
* @readonly
|
|
14048
|
+
* @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
|
|
14049
|
+
*/
|
|
14050
|
+
this.slots = [
|
|
14051
|
+
{
|
|
14052
|
+
"name": "content",
|
|
14053
|
+
"description": "Defines the content of the `ui5-tree-item`."
|
|
14054
|
+
},
|
|
14055
|
+
{
|
|
14056
|
+
"name": "default",
|
|
14057
|
+
"description": "Defines the items of the component.\n\n**Note:** Use `ui5-tree-item` or `ui5-tree-item-custom`"
|
|
14058
|
+
},
|
|
14059
|
+
{
|
|
14060
|
+
"name": "image",
|
|
14061
|
+
"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.",
|
|
14062
|
+
"since": "2.10.0"
|
|
14063
|
+
},
|
|
14064
|
+
{
|
|
14065
|
+
"name": "deleteButton",
|
|
14066
|
+
"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.",
|
|
14067
|
+
"since": "1.9.0"
|
|
14068
|
+
}
|
|
14069
|
+
];
|
|
11658
14070
|
this.elementRef = inject(ElementRef);
|
|
11659
14071
|
this.injector = inject(Injector);
|
|
11660
14072
|
}
|