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