@fundamental-ngx/ui5-webcomponents-fiori 0.58.0-rc.8 → 0.58.0-rc.80

package/fesm2022/fundamental-ngx-ui5-webcomponents-fiori.mjs

@@ -66,6 +66,7 @@ import '@ui5/webcomponents-fiori/dist/UserMenu.js';
 import '@ui5/webcomponents-fiori/dist/UserMenuAccount.js';
 import '@ui5/webcomponents-fiori/dist/UserMenuItem.js';
 import '@ui5/webcomponents-fiori/dist/UserMenuItemGroup.js';
+import '@ui5/webcomponents-fiori/dist/UserSettingsAccountView.js';
 import '@ui5/webcomponents-fiori/dist/UserSettingsDialog.js';
 import '@ui5/webcomponents-fiori/dist/UserSettingsItem.js';
 import '@ui5/webcomponents-fiori/dist/UserSettingsView.js';
@@ -190,6 +191,48 @@ class BarcodeScannerDialog {
          * Fires when the scan fails with error.
          */
         this.ui5ScanError = output();
+        /**
+         * Available slots for content projection in this component.
+         *
+         * Slots allow you to insert custom content into predefined areas of the web component.
+         * Use the `slot` attribute on child elements to target specific slots.
+         *
+         * - **header**: Defines the header HTML Element.
+      
+      **Note:** If `header` slot is provided, the labelling of the dialog is a responsibility of the application developer.
+      `accessibleName` should be used.
+         * - **footer**: Defines the footer HTML Element.
+      
+      **Note:** When you provide custom content for the `footer` slot, the default close button is not rendered.
+      This means you need to include your own mechanism within the custom `footer` to close the dialog,
+      such as a button with an event listener that closes the dialog.
+      
+      **Note:** If the `footer` slot is not provided, a default footer with a close button is rendered automatically,
+      allowing users to close the dialog without any additional implementation.
+         *
+         * @example
+         * ```html
+         * <ui5-barcode-scanner-dialog>
+         *   <div slot="header">Custom header content</div>
+         *   <p>Default slot content</p>
+         * </ui5-barcode-scanner-dialog>
+         * ```
+         *
+         * @readonly
+         * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
+         */
+        this.slots = [
+            {
+                "name": "header",
+                "description": "Defines the header HTML Element.\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.",
+                "since": "2.4.0"
+            },
+            {
+                "name": "footer",
+                "description": "Defines the footer HTML Element.\n\n**Note:** When you provide custom content for the `footer` slot, the default close button is not rendered.\nThis means you need to include your own mechanism within the custom `footer` to close the dialog,\nsuch as a button with an event listener that closes the dialog.\n\n**Note:** If the `footer` slot is not provided, a default footer with a close button is rendered automatically,\nallowing users to close the dialog without any additional implementation.",
+                "since": "2.4.0"
+            }
+        ];
         this.elementRef = inject(ElementRef);
         this.injector = inject(Injector);
     }
@@ -277,6 +320,46 @@ class DynamicPage {
          * Fired when the expand/collapse area of the title is toggled.
          */
         this.ui5TitleToggle = output();
+        /**
+         * Available slots for content projection in this component.
+         *
+         * Slots allow you to insert custom content into predefined areas of the web component.
+         * Use the `slot` attribute on child elements to target specific slots.
+         *
+         * - **(default)**: Defines the content of the Dynamic Page.
+         * - **titleArea**: Defines the title HTML Element.
+         * - **headerArea**: Defines the header HTML Element.
+         * - **footerArea**: Defines the footer HTML Element.
+         *
+         * @example
+         * ```html
+         * <ui5-dynamic-page>
+         *   <div slot="header">Custom header content</div>
+         *   <p>Default slot content</p>
+         * </ui5-dynamic-page>
+         * ```
+         *
+         * @readonly
+         * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
+         */
+        this.slots = [
+            {
+                "name": "default",
+                "description": "Defines the content of the Dynamic Page."
+            },
+            {
+                "name": "titleArea",
+                "description": "Defines the title HTML Element."
+            },
+            {
+                "name": "headerArea",
+                "description": "Defines the header HTML Element."
+            },
+            {
+                "name": "footerArea",
+                "description": "Defines the footer HTML Element."
+            }
+        ];
         this.elementRef = inject(ElementRef);
         this.injector = inject(Injector);
     }
@@ -343,6 +426,31 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.4", ngImpor
 class DynamicPageHeader {
     constructor() {
         // className is now passed
+        /**
+         * Available slots for content projection in this component.
+         *
+         * Slots allow you to insert custom content into predefined areas of the web component.
+         * Use the `slot` attribute on child elements to target specific slots.
+         *
+         * - **(default)**: Defines the content of the Dynamic Page Header.
+         *
+         * @example
+         * ```html
+         * <ui5-dynamic-page-header>
+         *   <div slot="header">Custom header content</div>
+         *   <p>Default slot content</p>
+         * </ui5-dynamic-page-header>
+         * ```
+         *
+         * @readonly
+         * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
+         */
+        this.slots = [
+            {
+                "name": "default",
+                "description": "Defines the content of the Dynamic Page Header."
+            }
+        ];
         this.elementRef = inject(ElementRef);
         this.injector = inject(Injector);
     }
@@ -369,6 +477,85 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.4", ngImpor
 class DynamicPageTitle {
     constructor() {
         // className is now passed
+        /**
+         * Available slots for content projection in this component.
+         *
+         * Slots allow you to insert custom content into predefined areas of the web component.
+         * Use the `slot` attribute on child elements to target specific slots.
+         *
+         * - **heading**: Defines the content of the Heading of the Dynamic Page.
+      
+      The font size of the title within the `heading` slot can be adjusted to the recommended values using the following CSS variables:
+      
+      **Expanded:** `var(--sapObjectHeader_Title_FontSize)`
+      
+      **Collapsed:** `var(--sapObjectHeader_Title_SnappedFontSize)`
+         * - **snappedHeading**: Defines the heading that is shown only when the header is snapped.
+         * - **snappedTitleOnMobile**: Defines the content of the snapped title on mobile devices.
+      
+      This slot is displayed only when the `DynamicPageTitle` is in the snapped state on mobile devices.
+      It should be used to provide a simplified, single-line title that takes up less space on smaller screens.
+      
+      **Note:**
+      - The content set in this slot **overrides** all other content set in the `DynamicPageTitle` slots when displayed.
+      - The slot is intended for a single `ui5-title` component.
+         * - **actionsBar**: Defines the bar with actions in the Dynamic page title.
+         * - **navigationBar**: Defines the bar with navigation actions in the Dynamic page title.
+         * - **(default)**: Defines the content of the Dynamic page title.
+         * - **subheading**: Defines the content of the title that is shown only when the header is not snapped.
+         * - **snappedSubheading**: Defines the content of the title that is shown only when the header is snapped.
+         * - **breadcrumbs**: Defines the content of the breadcrumbs inside Dynamic Page Title.
+         *
+         * @example
+         * ```html
+         * <ui5-dynamic-page-title>
+         *   <div slot="header">Custom header content</div>
+         *   <p>Default slot content</p>
+         * </ui5-dynamic-page-title>
+         * ```
+         *
+         * @readonly
+         * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
+         */
+        this.slots = [
+            {
+                "name": "heading",
+                "description": "Defines the content of the Heading of the Dynamic Page.\n\nThe font size of the title within the `heading` slot can be adjusted to the recommended values using the following CSS variables:\n\n**Expanded:** `var(--sapObjectHeader_Title_FontSize)`\n\n**Collapsed:** `var(--sapObjectHeader_Title_SnappedFontSize)`"
+            },
+            {
+                "name": "snappedHeading",
+                "description": "Defines the heading that is shown only when the header is snapped."
+            },
+            {
+                "name": "snappedTitleOnMobile",
+                "description": "Defines the content of the snapped title on mobile devices.\n\nThis slot is displayed only when the `DynamicPageTitle` is in the snapped state on mobile devices.\nIt should be used to provide a simplified, single-line title that takes up less space on smaller screens.\n\n**Note:**\n- The content set in this slot **overrides** all other content set in the `DynamicPageTitle` slots when displayed.\n- The slot is intended for a single `ui5-title` component.",
+                "since": "2.3.0"
+            },
+            {
+                "name": "actionsBar",
+                "description": "Defines the bar with actions in the Dynamic page title."
+            },
+            {
+                "name": "navigationBar",
+                "description": "Defines the bar with navigation actions in the Dynamic page title."
+            },
+            {
+                "name": "default",
+                "description": "Defines the content of the Dynamic page title."
+            },
+            {
+                "name": "subheading",
+                "description": "Defines the content of the title that is shown only when the header is not snapped."
+            },
+            {
+                "name": "snappedSubheading",
+                "description": "Defines the content of the title that is shown only when the header is snapped."
+            },
+            {
+                "name": "breadcrumbs",
+                "description": "Defines the content of the breadcrumbs inside Dynamic Page Title."
+            }
+        ];
         this.elementRef = inject(ElementRef);
         this.injector = inject(Injector);
     }
@@ -435,6 +622,36 @@ class DynamicSideContent {
          * Fires when the current breakpoint has been changed.
          */
         this.ui5LayoutChange = output();
+        /**
+         * Available slots for content projection in this component.
+         *
+         * Slots allow you to insert custom content into predefined areas of the web component.
+         * Use the `slot` attribute on child elements to target specific slots.
+         *
+         * - **(default)**: Defines the main content.
+         * - **sideContent**: Defines the side content.
+         *
+         * @example
+         * ```html
+         * <ui5-dynamic-side-content>
+         *   <div slot="header">Custom header content</div>
+         *   <p>Default slot content</p>
+         * </ui5-dynamic-side-content>
+         * ```
+         *
+         * @readonly
+         * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
+         */
+        this.slots = [
+            {
+                "name": "default",
+                "description": "Defines the main content."
+            },
+            {
+                "name": "sideContent",
+                "description": "Defines the side content."
+            }
+        ];
         this.elementRef = inject(ElementRef);
         this.injector = inject(Injector);
     }
@@ -511,6 +728,31 @@ class FilterItem {
       This text is typically used to show the number of selected filter options within this category.
          */
         this.additionalText = input(...(ngDevMode ? [undefined, { debugName: "additionalText" }] : [])); // className is now passed
+        /**
+         * Available slots for content projection in this component.
+         *
+         * Slots allow you to insert custom content into predefined areas of the web component.
+         * Use the `slot` attribute on child elements to target specific slots.
+         *
+         * - **values**: Defines the filter options available for this filter category.
+         *
+         * @example
+         * ```html
+         * <ui5-filter-item>
+         *   <div slot="header">Custom header content</div>
+         *   <p>Default slot content</p>
+         * </ui5-filter-item>
+         * ```
+         *
+         * @readonly
+         * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
+         */
+        this.slots = [
+            {
+                "name": "values",
+                "description": "Defines the filter options available for this filter category."
+            }
+        ];
         this.elementRef = inject(ElementRef);
         this.injector = inject(Injector);
     }
@@ -698,6 +940,41 @@ class FlexibleColumnLayout {
          * Fired when the `layoutsConfiguration` changes via user interaction by dragging the separators.
          */
         this.ui5LayoutConfigurationChange = output();
+        /**
+         * Available slots for content projection in this component.
+         *
+         * Slots allow you to insert custom content into predefined areas of the web component.
+         * Use the `slot` attribute on child elements to target specific slots.
+         *
+         * - **startColumn**: Defines the content in the start column.
+         * - **midColumn**: Defines the content in the middle column.
+         * - **endColumn**: Defines the content in the end column.
+         *
+         * @example
+         * ```html
+         * <ui5-flexible-column-layout>
+         *   <div slot="header">Custom header content</div>
+         *   <p>Default slot content</p>
+         * </ui5-flexible-column-layout>
+         * ```
+         *
+         * @readonly
+         * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
+         */
+        this.slots = [
+            {
+                "name": "startColumn",
+                "description": "Defines the content in the start column."
+            },
+            {
+                "name": "midColumn",
+                "description": "Defines the content in the middle column."
+            },
+            {
+                "name": "endColumn",
+                "description": "Defines the content in the end column."
+            }
+        ];
         this.elementRef = inject(ElementRef);
         this.injector = inject(Injector);
         // Internal signal to track columnLayout from layout-change events
@@ -975,6 +1252,49 @@ class IllustratedMessage {
       When set to `true`, the attributes `role="presentation"` and `aria-hidden="true"` are applied to the SVG element.
          */
         this.decorative = input(false, ...(ngDevMode ? [{ debugName: "decorative", transform: booleanAttribute }] : [{ transform: booleanAttribute }])); // className is now passed
+        /**
+         * Available slots for content projection in this component.
+         *
+         * Slots allow you to insert custom content into predefined areas of the web component.
+         * Use the `slot` attribute on child elements to target specific slots.
+         *
+         * - **title**: Defines the title of the component.
+      
+      **Note:** Using this slot, the default title text of illustration and the value of `title` property will be overwritten.
+         * - **subtitle**: Defines the subtitle of the component.
+      
+      **Note:** Using this slot, the default subtitle text of illustration and the value of `subtitleText` property will be overwritten.
+         * - **(default)**: Defines the component actions.
+      
+      **Note:** Not displayed when the `design` property is set to `Base`.
+         *
+         * @example
+         * ```html
+         * <ui5-illustrated-message>
+         *   <div slot="header">Custom header content</div>
+         *   <p>Default slot content</p>
+         * </ui5-illustrated-message>
+         * ```
+         *
+         * @readonly
+         * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
+         */
+        this.slots = [
+            {
+                "name": "title",
+                "description": "Defines the title of the component.\n\n**Note:** Using this slot, the default title text of illustration and the value of `title` property will be overwritten.",
+                "since": "1.7.0"
+            },
+            {
+                "name": "subtitle",
+                "description": "Defines the subtitle of the component.\n\n**Note:** Using this slot, the default subtitle text of illustration and the value of `subtitleText` property will be overwritten.",
+                "since": "1.0.0-rc.16"
+            },
+            {
+                "name": "default",
+                "description": "Defines the component actions.\n\n**Note:** Not displayed when the `design` property is set to `Base`."
+            }
+        ];
         this.elementRef = inject(ElementRef);
         this.injector = inject(Injector);
     }
@@ -1068,6 +1388,35 @@ class MediaGallery {
       the enlarged content of the currently selected item.
          */
         this.ui5DisplayAreaClick = output();
+        /**
+         * Available slots for content projection in this component.
+         *
+         * Slots allow you to insert custom content into predefined areas of the web component.
+         * Use the `slot` attribute on child elements to target specific slots.
+         *
+         * - **(default)**: Defines the component items.
+      
+      **Note:** Only one selected item is allowed.
+      
+      **Note:** Use the `ui5-media-gallery-item` component to define the desired items.
+         *
+         * @example
+         * ```html
+         * <ui5-media-gallery>
+         *   <div slot="header">Custom header content</div>
+         *   <p>Default slot content</p>
+         * </ui5-media-gallery>
+         * ```
+         *
+         * @readonly
+         * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
+         */
+        this.slots = [
+            {
+                "name": "default",
+                "description": "Defines the component items.\n\n**Note:** Only one selected item is allowed.\n\n**Note:** Use the `ui5-media-gallery-item` component to define the desired items."
+            }
+        ];
         this.elementRef = inject(ElementRef);
         this.injector = inject(Injector);
     }
@@ -1147,6 +1496,36 @@ class MediaGalleryItem {
          * Determines the layout of the item container.
          */
         this.layout = input("Square", ...(ngDevMode ? [{ debugName: "layout" }] : [])); // className is now passed
+        /**
+         * Available slots for content projection in this component.
+         *
+         * Slots allow you to insert custom content into predefined areas of the web component.
+         * Use the `slot` attribute on child elements to target specific slots.
+         *
+         * - **(default)**: Defines the content of the component.
+         * - **thumbnail**: Defines the content of the thumbnail.
+         *
+         * @example
+         * ```html
+         * <ui5-media-gallery-item>
+         *   <div slot="header">Custom header content</div>
+         *   <p>Default slot content</p>
+         * </ui5-media-gallery-item>
+         * ```
+         *
+         * @readonly
+         * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
+         */
+        this.slots = [
+            {
+                "name": "default",
+                "description": "Defines the content of the component."
+            },
+            {
+                "name": "thumbnail",
+                "description": "Defines the content of the thumbnail."
+            }
+        ];
         this.elementRef = inject(ElementRef);
         this.injector = inject(Injector);
     }
@@ -1199,6 +1578,41 @@ class NavigationLayout {
          * Specifies the navigation layout mode.
          */
         this.mode = input("Auto", ...(ngDevMode ? [{ debugName: "mode" }] : [])); // className is now passed
+        /**
+         * Available slots for content projection in this component.
+         *
+         * Slots allow you to insert custom content into predefined areas of the web component.
+         * Use the `slot` attribute on child elements to target specific slots.
+         *
+         * - **header**: Defines the header.
+         * - **sideContent**: Defines the side content.
+         * - **(default)**: Defines the content.
+         *
+         * @example
+         * ```html
+         * <ui5-navigation-layout>
+         *   <div slot="header">Custom header content</div>
+         *   <p>Default slot content</p>
+         * </ui5-navigation-layout>
+         * ```
+         *
+         * @readonly
+         * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
+         */
+        this.slots = [
+            {
+                "name": "header",
+                "description": "Defines the header."
+            },
+            {
+                "name": "sideContent",
+                "description": "Defines the side content."
+            },
+            {
+                "name": "default",
+                "description": "Defines the content."
+            }
+        ];
         this.elementRef = inject(ElementRef);
         this.injector = inject(Injector);
     }
@@ -1261,6 +1675,31 @@ class NotificationList {
          * Fired when an item is toggled.
          */
         this.ui5ItemToggle = output();
+        /**
+         * Available slots for content projection in this component.
+         *
+         * Slots allow you to insert custom content into predefined areas of the web component.
+         * Use the `slot` attribute on child elements to target specific slots.
+         *
+         * - **(default)**: Defines the items of the component.
+         *
+         * @example
+         * ```html
+         * <ui5-notification-list>
+         *   <div slot="header">Custom header content</div>
+         *   <p>Default slot content</p>
+         * </ui5-notification-list>
+         * ```
+         *
+         * @readonly
+         * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
+         */
+        this.slots = [
+            {
+                "name": "default",
+                "description": "Defines the items of the component."
+            }
+        ];
         this.elementRef = inject(ElementRef);
         this.injector = inject(Injector);
     }
@@ -1360,6 +1799,32 @@ class NotificationListGroupItem {
          * Fired when additional items are requested.
          */
         this.ui5LoadMore = output();
+        /**
+         * Available slots for content projection in this component.
+         *
+         * Slots allow you to insert custom content into predefined areas of the web component.
+         * Use the `slot` attribute on child elements to target specific slots.
+         *
+         * - **(default)**: Defines the items of the `ui5-li-notification-group`,
+      usually `ui5-li-notification` items.
+         *
+         * @example
+         * ```html
+         * <ui5-li-notification-group>
+         *   <div slot="header">Custom header content</div>
+         *   <p>Default slot content</p>
+         * </ui5-li-notification-group>
+         * ```
+         *
+         * @readonly
+         * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
+         */
+        this.slots = [
+            {
+                "name": "default",
+                "description": "Defines the items of the `ui5-li-notification-group`,\nusually `ui5-li-notification` items."
+            }
+        ];
         this.elementRef = inject(ElementRef);
         this.injector = inject(Injector);
     }
@@ -1470,6 +1935,59 @@ class NotificationListItem {
          * Fired when the `Close` button is pressed.
          */
         this.ui5Close = output();
+        /**
+         * Available slots for content projection in this component.
+         *
+         * Slots allow you to insert custom content into predefined areas of the web component.
+         * Use the `slot` attribute on child elements to target specific slots.
+         *
+         * - **avatar**: Defines the avatar, displayed in the `ui5-li-notification`.
+      
+      **Note:** Consider using the `ui5-avatar` to display icons, initials or images.
+      
+      **Note:** In order to be complaint with the UX guidlines and for best experience,
+      we recommend using avatars with 2rem X 2rem in size (32px X 32px). In case you are using the `ui5-avatar`
+      you can set its `size` property to `XS` to get the required size - `<ui5-avatar size="XS"></ui5-avatar>`.
+         * - **menu**: Defines the menu, displayed in the `ui5-li-notification`.
+      
+      **Note:** Use this for implementing actions.
+      
+      **Note:** Should be used instead `u5-notification-action`, which is deprecated as of version 2.0.
+         * - **footnotes**: Defines the elements, displayed in the footer of the of the component.
+         * - **(default)**: Defines the content of the `ui5-li-notification`,
+      usually a description of the notification.
+      
+      **Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.
+         *
+         * @example
+         * ```html
+         * <ui5-li-notification>
+         *   <div slot="header">Custom header content</div>
+         *   <p>Default slot content</p>
+         * </ui5-li-notification>
+         * ```
+         *
+         * @readonly
+         * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
+         */
+        this.slots = [
+            {
+                "name": "avatar",
+                "description": "Defines the avatar, displayed in the `ui5-li-notification`.\n\n**Note:** Consider using the `ui5-avatar` to display icons, initials or images.\n\n**Note:** In order to be complaint with the UX guidlines and for best experience,\nwe recommend using avatars with 2rem X 2rem in size (32px X 32px). In case you are using the `ui5-avatar`\nyou can set its `size` property to `XS` to get the required size - `<ui5-avatar size=\"XS\"></ui5-avatar>`."
+            },
+            {
+                "name": "menu",
+                "description": "Defines the menu, displayed in the `ui5-li-notification`.\n\n**Note:** Use this for implementing actions.\n\n**Note:** Should be used instead `u5-notification-action`, which is deprecated as of version 2.0."
+            },
+            {
+                "name": "footnotes",
+                "description": "Defines the elements, displayed in the footer of the of the component."
+            },
+            {
+                "name": "default",
+                "description": "Defines the content of the `ui5-li-notification`,\nusually a description of the notification.\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."
+            }
+        ];
         this.elementRef = inject(ElementRef);
         this.injector = inject(Injector);
     }
@@ -1559,6 +2077,41 @@ class Page {
          * Defines the footer visibility.
          */
         this.hideFooter = input(false, ...(ngDevMode ? [{ debugName: "hideFooter", transform: booleanAttribute }] : [{ transform: booleanAttribute }])); // className is now passed
+        /**
+         * Available slots for content projection in this component.
+         *
+         * Slots allow you to insert custom content into predefined areas of the web component.
+         * Use the `slot` attribute on child elements to target specific slots.
+         *
+         * - **header**: Defines the header HTML Element.
+         * - **(default)**: Defines the content HTML Element.
+         * - **footer**: Defines the footer HTML Element.
+         *
+         * @example
+         * ```html
+         * <ui5-page>
+         *   <div slot="header">Custom header content</div>
+         *   <p>Default slot content</p>
+         * </ui5-page>
+         * ```
+         *
+         * @readonly
+         * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
+         */
+        this.slots = [
+            {
+                "name": "header",
+                "description": "Defines the header HTML Element."
+            },
+            {
+                "name": "default",
+                "description": "Defines the content HTML Element."
+            },
+            {
+                "name": "footer",
+                "description": "Defines the footer HTML Element."
+            }
+        ];
         this.elementRef = inject(ElementRef);
         this.injector = inject(Injector);
     }
@@ -1609,6 +2162,31 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.4", ngImpor
 class ProductSwitch {
     constructor() {
         // className is now passed
+        /**
+         * Available slots for content projection in this component.
+         *
+         * Slots allow you to insert custom content into predefined areas of the web component.
+         * Use the `slot` attribute on child elements to target specific slots.
+         *
+         * - **(default)**: Defines the items of the `ui5-product-switch`.
+         *
+         * @example
+         * ```html
+         * <ui5-product-switch>
+         *   <div slot="header">Custom header content</div>
+         *   <p>Default slot content</p>
+         * </ui5-product-switch>
+         * ```
+         *
+         * @readonly
+         * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
+         */
+        this.slots = [
+            {
+                "name": "default",
+                "description": "Defines the items of the `ui5-product-switch`."
+            }
+        ];
         this.elementRef = inject(ElementRef);
         this.injector = inject(Injector);
     }
@@ -1675,6 +2253,35 @@ class ProductSwitchItem {
       click/tap or by using the Enter or Space key.
          */
         this.ui5Click = output();
+        /**
+         * Available slots for content projection in this component.
+         *
+         * Slots allow you to insert custom content into predefined areas of the web component.
+         * Use the `slot` attribute on child elements to target specific slots.
+         *
+         * - **image**: Defines an image to be displayed instead of the standard icon.
+      
+      **Note:** The image slot takes precedence over the icon property.
+      **Note:** We recommend using non-interactive ui5-avatar with size S, Square shape and Transparent colorScheme for best alignment.
+         *
+         * @example
+         * ```html
+         * <ui5-product-switch-item>
+         *   <div slot="header">Custom header content</div>
+         *   <p>Default slot content</p>
+         * </ui5-product-switch-item>
+         * ```
+         *
+         * @readonly
+         * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
+         */
+        this.slots = [
+            {
+                "name": "image",
+                "description": "Defines an image to be displayed instead of the standard icon.\n\n**Note:** The image slot takes precedence over the icon property.\n**Note:** We recommend using non-interactive ui5-avatar with size S, Square shape and Transparent colorScheme for best alignment.",
+                "since": "2.14.0"
+            }
+        ];
         this.elementRef = inject(ElementRef);
         this.injector = inject(Injector);
     }
@@ -1795,6 +2402,60 @@ class Search {
          * Fired when the user has triggered search with Enter key or Search Button press.
          */
         this.ui5Search = output();
+        /**
+         * Available slots for content projection in this component.
+         *
+         * Slots allow you to insert custom content into predefined areas of the web component.
+         * Use the `slot` attribute on child elements to target specific slots.
+         *
+         * - **(default)**: Defines the Search suggestion items.
+         * - **action**: Defines the popup footer action button.
+         * - **illustration**: Defines the illustrated message to be shown in the popup.
+         * - **messageArea**: Defines the illustrated message to be shown in the popup.
+         * - **scopes**: Defines the component scope options.
+         * - **filterButton**: Defines the filter button slot, used to display an additional filtering button.
+      This slot is intended for passing a `ui5-button` with a filter icon to provide extended filtering options.
+      
+      **Note:** Scope button and Filter button are mutually exclusive.
+         *
+         * @example
+         * ```html
+         * <ui5-search>
+         *   <div slot="header">Custom header content</div>
+         *   <p>Default slot content</p>
+         * </ui5-search>
+         * ```
+         *
+         * @readonly
+         * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
+         */
+        this.slots = [
+            {
+                "name": "default",
+                "description": "Defines the Search suggestion items."
+            },
+            {
+                "name": "action",
+                "description": "Defines the popup footer action button."
+            },
+            {
+                "name": "illustration",
+                "description": "Defines the illustrated message to be shown in the popup."
+            },
+            {
+                "name": "messageArea",
+                "description": "Defines the illustrated message to be shown in the popup."
+            },
+            {
+                "name": "scopes",
+                "description": "Defines the component scope options."
+            },
+            {
+                "name": "filterButton",
+                "description": "Defines the filter button slot, used to display an additional filtering button.\nThis slot is intended for passing a `ui5-button` with a filter icon to provide extended filtering options.\n\n**Note:** Scope button and Filter button are mutually exclusive.",
+                "since": "2.11.0"
+            }
+        ];
         this.elementRef = inject(ElementRef);
         this.injector = inject(Injector);
     }
@@ -1896,6 +2557,44 @@ class SearchItem {
          * Fired when delete button is pressed.
          */
         this.ui5Delete = output();
+        /**
+         * Available slots for content projection in this component.
+         *
+         * Slots allow you to insert custom content into predefined areas of the web component.
+         * Use the `slot` attribute on child elements to target specific slots.
+         *
+         * - **image**: **Note:** While the slot allows the option of setting a custom avatar, to comply with the
+      design guidelines, use the `ui5-avatar` with size - XS.
+         * - **actions**: Defines the actionable elements.
+      This slot allows placing additional interactive elements (such as buttons, icons, or tags)
+      next to the delete button, providing flexible customization for various user actions.
+      
+      **Note:** While the slot is flexible, for consistency with design guidelines,
+      it's recommended to use `ui5-button` with `Transparent` design or `ui5-icon` elements.
+         *
+         * @example
+         * ```html
+         * <ui5-search-item>
+         *   <div slot="header">Custom header content</div>
+         *   <p>Default slot content</p>
+         * </ui5-search-item>
+         * ```
+         *
+         * @readonly
+         * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
+         */
+        this.slots = [
+            {
+                "name": "image",
+                "description": "**Note:** While the slot allows the option of setting a custom avatar, to comply with the\ndesign guidelines, use the `ui5-avatar` with size - XS.",
+                "since": "2.12.0"
+            },
+            {
+                "name": "actions",
+                "description": "Defines the actionable elements.\nThis slot allows placing additional interactive elements (such as buttons, icons, or tags)\nnext to the delete button, providing flexible customization for various user actions.\n\n**Note:** While the slot is flexible, for consistency with design guidelines,\nit's recommended to use `ui5-button` with `Transparent` design or `ui5-icon` elements.",
+                "since": "2.16.0"
+            }
+        ];
         this.elementRef = inject(ElementRef);
         this.injector = inject(Injector);
     }
@@ -1990,8 +2689,8 @@ class SearchItemShowMore {
     constructor() {
         /**
          * Specifies the number of additional items available to show.
-      This value replaces the placeholder (N) in the "Show more (N)" text.
-      If not set, the placeholder will remain as (N).
+      If no value is defined, the control shows "Show more" (without any counter).
+      If a number is provided, it displays "Show more (N)", where N is that number.
          */
         this.itemsToShowCount = input(...(ngDevMode ? [undefined, { debugName: "itemsToShowCount" }] : []));
         /**
@@ -2295,6 +2994,98 @@ class ShellBar {
       **Note:** The `content-item-visibility-change` event is in an experimental state and is a subject to change.
          */
         this.ui5ContentItemVisibilityChange = output();
+        /**
+         * Available slots for content projection in this component.
+         *
+         * Slots allow you to insert custom content into predefined areas of the web component.
+         * Use the `slot` attribute on child elements to target specific slots.
+         *
+         * - **assistant**: Defines the assistant slot.
+         * - **branding**: Defines the branding slot.
+      The `ui5-shellbar-branding` component is intended to be placed inside this slot.
+      Content placed here takes precedence over the `primaryTitle` property and the `logo` content slot.
+      
+      **Note:** The `branding` slot is in an experimental state and is a subject to change.
+         * - **(default)**: Defines the `ui5-shellbar` additional items.
+      
+      **Note:**
+      You can use the `<ui5-shellbar-item></ui5-shellbar-item>`.
+         * - **profile**: You can pass `ui5-avatar` to set the profile image/icon.
+      If no profile slot is set - profile will be excluded from actions.
+      
+      **Note:** We recommend not using the `size` attribute of `ui5-avatar` because
+      it should have specific size by design in the context of `ui5-shellbar` profile.
+         * - **logo**: Defines the logo of the `ui5-shellbar`.
+      For example, you can use `ui5-avatar` or `img` elements as logo.
+         * - **menuItems**: Defines the items displayed in menu after a click on a start button.
+      
+      **Note:** You can use the  `<ui5-li></ui5-li>` and its ancestors.
+         * - **searchField**: Defines the `ui5-input`, that will be used as a search field.
+         * - **startButton**: Defines a `ui5-button` in the bar that will be placed in the beginning.
+      We encourage this slot to be used for a menu button.
+      It gets overstyled to match ShellBar's styling.
+         * - **content**: Define the items displayed in the content area.
+      
+      Use the `data-hide-order` attribute with numeric value to specify the order of the items to be hidden when the space is not enough.
+      Lower values will be hidden first.
+      
+      **Note:** The `content` slot is in an experimental state and is a subject to change.
+         *
+         * @example
+         * ```html
+         * <ui5-shellbar>
+         *   <div slot="header">Custom header content</div>
+         *   <p>Default slot content</p>
+         * </ui5-shellbar>
+         * ```
+         *
+         * @readonly
+         * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
+         */
+        this.slots = [
+            {
+                "name": "assistant",
+                "description": "Defines the assistant slot.",
+                "since": "2.0.0"
+            },
+            {
+                "name": "branding",
+                "description": "Defines the branding slot.\nThe `ui5-shellbar-branding` component is intended to be placed inside this slot.\nContent placed here takes precedence over the `primaryTitle` property and the `logo` content slot.\n\n**Note:** The `branding` slot is in an experimental state and is a subject to change.",
+                "since": "2.12.0"
+            },
+            {
+                "name": "default",
+                "description": "Defines the `ui5-shellbar` additional items.\n\n**Note:**\nYou can use the `<ui5-shellbar-item></ui5-shellbar-item>`."
+            },
+            {
+                "name": "profile",
+                "description": "You can pass `ui5-avatar` to set the profile image/icon.\nIf no profile slot is set - profile will be excluded from actions.\n\n**Note:** We recommend not using the `size` attribute of `ui5-avatar` because\nit should have specific size by design in the context of `ui5-shellbar` profile.",
+                "since": "1.0.0-rc.6"
+            },
+            {
+                "name": "logo",
+                "description": "Defines the logo of the `ui5-shellbar`.\nFor example, you can use `ui5-avatar` or `img` elements as logo.",
+                "since": "1.0.0-rc.8"
+            },
+            {
+                "name": "menuItems",
+                "description": "Defines the items displayed in menu after a click on a start button.\n\n**Note:** You can use the  `<ui5-li></ui5-li>` and its ancestors.",
+                "since": "0.10"
+            },
+            {
+                "name": "searchField",
+                "description": "Defines the `ui5-input`, that will be used as a search field."
+            },
+            {
+                "name": "startButton",
+                "description": "Defines a `ui5-button` in the bar that will be placed in the beginning.\nWe encourage this slot to be used for a menu button.\nIt gets overstyled to match ShellBar's styling."
+            },
+            {
+                "name": "content",
+                "description": "Define the items displayed in the content area.\n\nUse the `data-hide-order` attribute with numeric value to specify the order of the items to be hidden when the space is not enough.\nLower values will be hidden first.\n\n**Note:** The `content` slot is in an experimental state and is a subject to change.",
+                "since": "2.7.0"
+            }
+        ];
         this.elementRef = inject(ElementRef);
         this.injector = inject(Injector);
     }
@@ -2436,6 +3227,39 @@ class ShellBarBranding {
          * Fired, when the logo is activated.
          */
         this.ui5Click = output();
+        /**
+         * Available slots for content projection in this component.
+         *
+         * Slots allow you to insert custom content into predefined areas of the web component.
+         * Use the `slot` attribute on child elements to target specific slots.
+         *
+         * - **(default)**: Defines the title for the ui5-shellbar-branding component.
+      
+      **Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.
+         * - **logo**: Defines the logo of the `ui5-shellbar`.
+      For example, you can use `ui5-avatar` or `img` elements as logo.
+         *
+         * @example
+         * ```html
+         * <ui5-shellbar-branding>
+         *   <div slot="header">Custom header content</div>
+         *   <p>Default slot content</p>
+         * </ui5-shellbar-branding>
+         * ```
+         *
+         * @readonly
+         * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
+         */
+        this.slots = [
+            {
+                "name": "default",
+                "description": "Defines the title for the ui5-shellbar-branding 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."
+            },
+            {
+                "name": "logo",
+                "description": "Defines the logo of the `ui5-shellbar`.\nFor example, you can use `ui5-avatar` or `img` elements as logo."
+            }
+        ];
         this.elementRef = inject(ElementRef);
         this.injector = inject(Injector);
     }
@@ -2657,6 +3481,60 @@ class ShellBarSearch {
          * Fired when the user has triggered search with Enter key or Search Button press.
          */
         this.ui5Search = output();
+        /**
+         * Available slots for content projection in this component.
+         *
+         * Slots allow you to insert custom content into predefined areas of the web component.
+         * Use the `slot` attribute on child elements to target specific slots.
+         *
+         * - **(default)**: Defines the Search suggestion items.
+         * - **action**: Defines the popup footer action button.
+         * - **illustration**: Defines the illustrated message to be shown in the popup.
+         * - **messageArea**: Defines the illustrated message to be shown in the popup.
+         * - **scopes**: Defines the component scope options.
+         * - **filterButton**: Defines the filter button slot, used to display an additional filtering button.
+      This slot is intended for passing a `ui5-button` with a filter icon to provide extended filtering options.
+      
+      **Note:** Scope button and Filter button are mutually exclusive.
+         *
+         * @example
+         * ```html
+         * <ui5-shellbar-search>
+         *   <div slot="header">Custom header content</div>
+         *   <p>Default slot content</p>
+         * </ui5-shellbar-search>
+         * ```
+         *
+         * @readonly
+         * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
+         */
+        this.slots = [
+            {
+                "name": "default",
+                "description": "Defines the Search suggestion items."
+            },
+            {
+                "name": "action",
+                "description": "Defines the popup footer action button."
+            },
+            {
+                "name": "illustration",
+                "description": "Defines the illustrated message to be shown in the popup."
+            },
+            {
+                "name": "messageArea",
+                "description": "Defines the illustrated message to be shown in the popup."
+            },
+            {
+                "name": "scopes",
+                "description": "Defines the component scope options."
+            },
+            {
+                "name": "filterButton",
+                "description": "Defines the filter button slot, used to display an additional filtering button.\nThis slot is intended for passing a `ui5-button` with a filter icon to provide extended filtering options.\n\n**Note:** Scope button and Filter button are mutually exclusive.",
+                "since": "2.11.0"
+            }
+        ];
         this.elementRef = inject(ElementRef);
         this.injector = inject(Injector);
     }
@@ -2774,6 +3652,46 @@ class SideNavigation {
          * Fired when the selection has changed via user interaction
          */
         this.ui5SelectionChange = output();
+        /**
+         * Available slots for content projection in this component.
+         *
+         * Slots allow you to insert custom content into predefined areas of the web component.
+         * Use the `slot` attribute on child elements to target specific slots.
+         *
+         * - **(default)**: Defines the main items of the component.
+         * - **fixedItems**: Defines the fixed items at the bottom of the component.
+      
+      **Note:** In order to achieve the best user experience, it is recommended that you keep the fixed items "flat" (do not pass sub-items)
+         * - **header**: Defines the header of the `ui5-side-navigation`.
+      
+      **Note:** The header is displayed when the component is expanded - the property `collapsed` is false;
+         *
+         * @example
+         * ```html
+         * <ui5-side-navigation>
+         *   <div slot="header">Custom header content</div>
+         *   <p>Default slot content</p>
+         * </ui5-side-navigation>
+         * ```
+         *
+         * @readonly
+         * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
+         */
+        this.slots = [
+            {
+                "name": "default",
+                "description": "Defines the main items of the component."
+            },
+            {
+                "name": "fixedItems",
+                "description": "Defines the fixed items at the bottom of the component.\n\n**Note:** In order to achieve the best user experience, it is recommended that you keep the fixed items \"flat\" (do not pass sub-items)"
+            },
+            {
+                "name": "header",
+                "description": "Defines the header of the `ui5-side-navigation`.\n\n**Note:** The header is displayed when the component is expanded - the property `collapsed` is false;",
+                "since": "1.0.0-rc.11"
+            }
+        ];
         this.elementRef = inject(ElementRef);
         this.injector = inject(Injector);
     }
@@ -2857,6 +3775,31 @@ class SideNavigationGroup {
       when the component is collapsed ("icon only" design is visualized) or the item text is truncated.
          */
         this.tooltip = input(...(ngDevMode ? [undefined, { debugName: "tooltip" }] : [])); // className is now passed
+        /**
+         * Available slots for content projection in this component.
+         *
+         * Slots allow you to insert custom content into predefined areas of the web component.
+         * Use the `slot` attribute on child elements to target specific slots.
+         *
+         * - **(default)**: Defines nested items by passing `ui5-side-navigation-item` to the default slot.
+         *
+         * @example
+         * ```html
+         * <ui5-side-navigation-group>
+         *   <div slot="header">Custom header content</div>
+         *   <p>Default slot content</p>
+         * </ui5-side-navigation-group>
+         * ```
+         *
+         * @readonly
+         * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
+         */
+        this.slots = [
+            {
+                "name": "default",
+                "description": "Defines nested items by passing `ui5-side-navigation-item` to the default slot."
+            }
+        ];
         this.elementRef = inject(ElementRef);
         this.injector = inject(Injector);
     }
@@ -2995,6 +3938,31 @@ class SideNavigationItem {
          * Fired when the component is activated either with a click/tap or by using the [Enter] or [Space] keys.
          */
         this.ui5Click = output();
+        /**
+         * Available slots for content projection in this component.
+         *
+         * Slots allow you to insert custom content into predefined areas of the web component.
+         * Use the `slot` attribute on child elements to target specific slots.
+         *
+         * - **(default)**: Defines nested items by passing `ui5-side-navigation-sub-item` to the default slot.
+         *
+         * @example
+         * ```html
+         * <ui5-side-navigation-item>
+         *   <div slot="header">Custom header content</div>
+         *   <p>Default slot content</p>
+         * </ui5-side-navigation-item>
+         * ```
+         *
+         * @readonly
+         * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
+         */
+        this.slots = [
+            {
+                "name": "default",
+                "description": "Defines nested items by passing `ui5-side-navigation-sub-item` to the default slot."
+            }
+        ];
         this.elementRef = inject(ElementRef);
         this.injector = inject(Injector);
     }
@@ -3311,6 +4279,31 @@ class Timeline {
       **Note:** The event will be fired if `growing` is set to `Button` or `Scroll`.
          */
         this.ui5LoadMore = output();
+        /**
+         * Available slots for content projection in this component.
+         *
+         * Slots allow you to insert custom content into predefined areas of the web component.
+         * Use the `slot` attribute on child elements to target specific slots.
+         *
+         * - **(default)**: Determines the content of the `ui5-timeline`.
+         *
+         * @example
+         * ```html
+         * <ui5-timeline>
+         *   <div slot="header">Custom header content</div>
+         *   <p>Default slot content</p>
+         * </ui5-timeline>
+         * ```
+         *
+         * @readonly
+         * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
+         */
+        this.slots = [
+            {
+                "name": "default",
+                "description": "Determines the content of the `ui5-timeline`."
+            }
+        ];
         this.elementRef = inject(ElementRef);
         this.injector = inject(Injector);
     }
@@ -3388,6 +4381,31 @@ class TimelineGroupItem {
          * Fired when the group item is expanded or collapsed.
          */
         this.ui5Toggle = output();
+        /**
+         * Available slots for content projection in this component.
+         *
+         * Slots allow you to insert custom content into predefined areas of the web component.
+         * Use the `slot` attribute on child elements to target specific slots.
+         *
+         * - **(default)**: Determines the content of the `ui5-timeline-group-item`.
+         *
+         * @example
+         * ```html
+         * <ui5-timeline-group-item>
+         *   <div slot="header">Custom header content</div>
+         *   <p>Default slot content</p>
+         * </ui5-timeline-group-item>
+         * ```
+         *
+         * @readonly
+         * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
+         */
+        this.slots = [
+            {
+                "name": "default",
+                "description": "Determines the content of the `ui5-timeline-group-item`."
+            }
+        ];
         this.elementRef = inject(ElementRef);
         this.injector = inject(Injector);
     }
@@ -3485,6 +4503,31 @@ class TimelineItem {
       attribute is not set.
          */
         this.ui5NameClick = output();
+        /**
+         * Available slots for content projection in this component.
+         *
+         * Slots allow you to insert custom content into predefined areas of the web component.
+         * Use the `slot` attribute on child elements to target specific slots.
+         *
+         * - **(default)**: Defines the content of the `ui5-timeline-item`.
+         *
+         * @example
+         * ```html
+         * <ui5-timeline-item>
+         *   <div slot="header">Custom header content</div>
+         *   <p>Default slot content</p>
+         * </ui5-timeline-item>
+         * ```
+         *
+         * @readonly
+         * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
+         */
+        this.slots = [
+            {
+                "name": "default",
+                "description": "Defines the content of the `ui5-timeline-item`."
+            }
+        ];
         this.elementRef = inject(ElementRef);
         this.injector = inject(Injector);
     }
@@ -3590,6 +4633,42 @@ class UploadCollection {
       in `Single` and `Multiple` modes.
          */
         this.ui5SelectionChange = output();
+        /**
+         * Available slots for content projection in this component.
+         *
+         * Slots allow you to insert custom content into predefined areas of the web component.
+         * Use the `slot` attribute on child elements to target specific slots.
+         *
+         * - **(default)**: Defines the items of the `ui5-upload-collection`.
+      
+      **Note:** Use `ui5-upload-collection-item` for the intended design.
+         * - **header**: Defines the `ui5-upload-collection` header.
+      
+      **Note:** If `header` slot is provided,
+      the labelling of the `UploadCollection` is a responsibility of the application developer.
+      `accessibleName` should be used.
+         *
+         * @example
+         * ```html
+         * <ui5-upload-collection>
+         *   <div slot="header">Custom header content</div>
+         *   <p>Default slot content</p>
+         * </ui5-upload-collection>
+         * ```
+         *
+         * @readonly
+         * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
+         */
+        this.slots = [
+            {
+                "name": "default",
+                "description": "Defines the items of the `ui5-upload-collection`.\n\n**Note:** Use `ui5-upload-collection-item` for the intended design."
+            },
+            {
+                "name": "header",
+                "description": "Defines the `ui5-upload-collection` header.\n\n**Note:** If `header` slot is provided,\nthe labelling of the `UploadCollection` is a responsibility of the application developer.\n`accessibleName` should be used."
+            }
+        ];
         this.elementRef = inject(ElementRef);
         this.injector = inject(Injector);
     }
@@ -3727,6 +4806,38 @@ class UploadCollectionItem {
       **Note:** Retry button is displayed when `uploadState` property is set to `Error`.
          */
         this.ui5Retry = output();
+        /**
+         * Available slots for content projection in this component.
+         *
+         * Slots allow you to insert custom content into predefined areas of the web component.
+         * Use the `slot` attribute on child elements to target specific slots.
+         *
+         * - **(default)**: Hold the description of the `ui5-upload-collection-item`. Will be shown below the file name.
+         * - **thumbnail**: A thumbnail, which will be shown in the beginning of the `ui5-upload-collection-item`.
+      
+      **Note:** Use `ui5-icon` or `img` for the intended design.
+         *
+         * @example
+         * ```html
+         * <ui5-upload-collection-item>
+         *   <div slot="header">Custom header content</div>
+         *   <p>Default slot content</p>
+         * </ui5-upload-collection-item>
+         * ```
+         *
+         * @readonly
+         * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
+         */
+        this.slots = [
+            {
+                "name": "default",
+                "description": "Hold the description of the `ui5-upload-collection-item`. Will be shown below the file name."
+            },
+            {
+                "name": "thumbnail",
+                "description": "A thumbnail, which will be shown in the beginning of the `ui5-upload-collection-item`.\n\n**Note:** Use `ui5-icon` or `img` for the intended design."
+            }
+        ];
         this.elementRef = inject(ElementRef);
         this.injector = inject(Injector);
     }
@@ -3857,6 +4968,39 @@ class UserMenu {
          * Fired when the "Sign Out" button is selected.
          */
         this.ui5SignOutClick = output();
+        /**
+         * Available slots for content projection in this component.
+         *
+         * Slots allow you to insert custom content into predefined areas of the web component.
+         * Use the `slot` attribute on child elements to target specific slots.
+         *
+         * - **(default)**: Defines the menu items.
+         * - **accounts**: Defines the user accounts.
+      
+      **Note:** If one item is used, it will be shown as the selected one. If more than one item is used, the first one will be shown as selected unless
+      there is an item with `selected` property set to `true`.
+         *
+         * @example
+         * ```html
+         * <ui5-user-menu>
+         *   <div slot="header">Custom header content</div>
+         *   <p>Default slot content</p>
+         * </ui5-user-menu>
+         * ```
+         *
+         * @readonly
+         * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
+         */
+        this.slots = [
+            {
+                "name": "default",
+                "description": "Defines the menu items."
+            },
+            {
+                "name": "accounts",
+                "description": "Defines the user accounts.\n\n**Note:** If one item is used, it will be shown as the selected one. If more than one item is used, the first one will be shown as selected unless\nthere is an item with `selected` property set to `true`."
+            }
+        ];
         this.elementRef = inject(ElementRef);
         this.injector = inject(Injector);
     }
@@ -4016,6 +5160,33 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.4", ngImpor
 class UserMenuItem {
     constructor() {
         // className is now passed
+        /**
+         * Available slots for content projection in this component.
+         *
+         * Slots allow you to insert custom content into predefined areas of the web component.
+         * Use the `slot` attribute on child elements to target specific slots.
+         *
+         * - **(default)**: Defines the items of this component.
+      
+      **Note:** Use `ui5-user-menu-item` for the intended design.
+         *
+         * @example
+         * ```html
+         * <ui5-user-menu-item>
+         *   <div slot="header">Custom header content</div>
+         *   <p>Default slot content</p>
+         * </ui5-user-menu-item>
+         * ```
+         *
+         * @readonly
+         * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
+         */
+        this.slots = [
+            {
+                "name": "default",
+                "description": "Defines the items of this component.\n\n**Note:** Use `ui5-user-menu-item` for the intended design."
+            }
+        ];
         this.elementRef = inject(ElementRef);
         this.injector = inject(Injector);
     }
@@ -4065,6 +5236,126 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.4", ngImpor
                 }]
         }] });
 
+class UserSettingsAccountView {
+    constructor() {
+        /**
+         * Defines if the User Menu shows the `Manage Account` option.
+         */
+        this.showManageAccount = input(false, ...(ngDevMode ? [{ debugName: "showManageAccount", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
+        /**
+         * Defines the title text of the user settings view.
+         */
+        this.text = input(...(ngDevMode ? [undefined, { debugName: "text" }] : []));
+        /**
+         * Defines whether the view is selected. There can be just one selected view at a time.
+         */
+        this.selected = input(false, ...(ngDevMode ? [{ debugName: "selected", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
+        /**
+         * Indicates whether the view is secondary. It is relevant only if the view is used in `pages` slot of `ui5-user-settings-item`
+      and controls the visibility of the back button.
+         */
+        this.secondary = input(false, ...(ngDevMode ? [{ debugName: "secondary", transform: booleanAttribute }] : [{ transform: booleanAttribute }])); // className is now passed
+        /**
+         * Fired when the `Edit Accounts` button is selected.
+         */
+        this.ui5EditAccountsClick = output();
+        /**
+         * Fired when the `Manage Account` button is selected.
+         */
+        this.ui5ManageAccountClick = output();
+        /**
+         * Available slots for content projection in this component.
+         *
+         * Slots allow you to insert custom content into predefined areas of the web component.
+         * Use the `slot` attribute on child elements to target specific slots.
+         *
+         * - **account**: Defines the user account.
+         * - **(default)**: Defines the content of the view.
+         *
+         * @example
+         * ```html
+         * <ui5-user-settings-account-view>
+         *   <div slot="header">Custom header content</div>
+         *   <p>Default slot content</p>
+         * </ui5-user-settings-account-view>
+         * ```
+         *
+         * @readonly
+         * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
+         */
+        this.slots = [
+            {
+                "name": "account",
+                "description": "Defines the user account."
+            },
+            {
+                "name": "default",
+                "description": "Defines the content of the view."
+            }
+        ];
+        this.elementRef = inject(ElementRef);
+        this.injector = inject(Injector);
+    }
+    get element() {
+        return this.elementRef.nativeElement;
+    }
+    ngAfterViewInit() {
+        const wcElement = this.element;
+        const inputsToSync = [
+            'showManageAccount',
+            'text',
+            'selected',
+            'secondary',
+        ];
+        // Synchronize inputs (properties)
+        for (const inputName of inputsToSync) {
+            // Find the corresponding camelCase signal property on the Angular component
+            const signalName = inputName.replace(/-./g, (x) => x[1].toUpperCase());
+            // Use the Injector to run the effect in the correct context
+            if (this[signalName] && typeof this[signalName] === 'function') {
+                runInInjectionContext(this.injector, () => {
+                    effect(() => {
+                        // Read the signal value
+                        const value = this[signalName]();
+                        if (wcElement) {
+                            // Write the value to the Web Component's property
+                            wcElement[inputName] = value;
+                        }
+                    });
+                });
+            }
+        }
+        const outputsToSync = [
+            'ui5EditAccountsClick',
+            'ui5ManageAccountClick',
+        ];
+        // Synchronize outputs (events)
+        for (const outputName of outputsToSync) {
+            // Map Angular output name to UI5 web component event name
+            const eventName = outputName.replace('ui5', '').replace(/([A-Z])/g, '-$1').toLowerCase().substring(1);
+            // Ensure the output property exists and has an emit function before adding listener
+            if (this[outputName] && typeof this[outputName].emit === 'function' && wcElement.addEventListener) {
+                // Cast the listener to the correct type to satisfy TypeScript
+                wcElement.addEventListener(eventName, (e) => {
+                    this[outputName].emit(e);
+                });
+            }
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: UserSettingsAccountView, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.1.4", type: UserSettingsAccountView, isStandalone: true, selector: "ui5-user-settings-account-view, [ui5-user-settings-account-view]", inputs: { showManageAccount: { classPropertyName: "showManageAccount", publicName: "showManageAccount", isSignal: true, isRequired: false, transformFunction: null }, text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null }, secondary: { classPropertyName: "secondary", publicName: "secondary", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ui5EditAccountsClick: "ui5EditAccountsClick", ui5ManageAccountClick: "ui5ManageAccountClick" }, exportAs: ["ui5UserSettingsAccountView"], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: UserSettingsAccountView, decorators: [{
+            type: Component,
+            args: [{
+                    standalone: true,
+                    selector: 'ui5-user-settings-account-view, [ui5-user-settings-account-view]',
+                    template: '<ng-content></ng-content>',
+                    exportAs: 'ui5UserSettingsAccountView',
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                }]
+        }] });
+
 class UserSettingsDialog {
     constructor() {
         /**
@@ -4097,6 +5388,38 @@ class UserSettingsDialog {
          * Fired when a settings dialog is closed.
          */
         this.ui5Close = output();
+        /**
+         * Available slots for content projection in this component.
+         *
+         * Slots allow you to insert custom content into predefined areas of the web component.
+         * Use the `slot` attribute on child elements to target specific slots.
+         *
+         * - **(default)**: Defines the user settings items.
+      
+      **Note:**  If no setting item is set as `selected`, the first one will be selected.
+         * - **fixedItems**: Defines the fixed user settings items.
+         *
+         * @example
+         * ```html
+         * <ui5-user-settings-dialog>
+         *   <div slot="header">Custom header content</div>
+         *   <p>Default slot content</p>
+         * </ui5-user-settings-dialog>
+         * ```
+         *
+         * @readonly
+         * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
+         */
+        this.slots = [
+            {
+                "name": "default",
+                "description": "Defines the user settings items.\n\n**Note:**  If no setting item is set as `selected`, the first one will be selected."
+            },
+            {
+                "name": "fixedItems",
+                "description": "Defines the fixed user settings items."
+            }
+        ];
         this.elementRef = inject(ElementRef);
         this.injector = inject(Injector);
     }
@@ -4207,6 +5530,41 @@ class UserSettingsItem {
          * Fired when a selected view changed.
          */
         this.ui5SelectionChange = output();
+        /**
+         * Available slots for content projection in this component.
+         *
+         * Slots allow you to insert custom content into predefined areas of the web component.
+         * Use the `slot` attribute on child elements to target specific slots.
+         *
+         * - **(default)**: Defines the page views of the user settings item.
+      
+      If there are no tab views, the first page view will be shown unless there is selected one. If there is selected page
+      view it will be shown no matter if there are tab views.
+      
+      The page views are displayed by default if there is no selected tab view.
+         * - **tabs**: Defines the tab views of the user settings item.
+         *
+         * @example
+         * ```html
+         * <ui5-user-settings-item>
+         *   <div slot="header">Custom header content</div>
+         *   <p>Default slot content</p>
+         * </ui5-user-settings-item>
+         * ```
+         *
+         * @readonly
+         * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
+         */
+        this.slots = [
+            {
+                "name": "default",
+                "description": "Defines the page views of the user settings item.\n\nIf there are no tab views, the first page view will be shown unless there is selected one. If there is selected page\nview it will be shown no matter if there are tab views.\n\nThe page views are displayed by default if there is no selected tab view."
+            },
+            {
+                "name": "tabs",
+                "description": "Defines the tab views of the user settings item."
+            }
+        ];
         this.elementRef = inject(ElementRef);
         this.injector = inject(Injector);
     }
@@ -4289,6 +5647,31 @@ class UserSettingsView {
       and controls the visibility of the back button.
          */
         this.secondary = input(false, ...(ngDevMode ? [{ debugName: "secondary", transform: booleanAttribute }] : [{ transform: booleanAttribute }])); // className is now passed
+        /**
+         * Available slots for content projection in this component.
+         *
+         * Slots allow you to insert custom content into predefined areas of the web component.
+         * Use the `slot` attribute on child elements to target specific slots.
+         *
+         * - **(default)**: Defines the content of the view.
+         *
+         * @example
+         * ```html
+         * <ui5-user-settings-view>
+         *   <div slot="header">Custom header content</div>
+         *   <p>Default slot content</p>
+         * </ui5-user-settings-view>
+         * ```
+         *
+         * @readonly
+         * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
+         */
+        this.slots = [
+            {
+                "name": "default",
+                "description": "Defines the content of the view."
+            }
+        ];
         this.elementRef = inject(ElementRef);
         this.injector = inject(Injector);
     }
@@ -4369,6 +5752,47 @@ class ViewSettingsDialog {
          * Fired after the dialog is closed.
          */
         this.ui5Close = output();
+        /**
+         * Available slots for content projection in this component.
+         *
+         * Slots allow you to insert custom content into predefined areas of the web component.
+         * Use the `slot` attribute on child elements to target specific slots.
+         *
+         * - **sortItems**: Defines the list of items against which the user could sort data.
+      
+      **Note:** If you want to use this slot, you need to import used item: `import "@ui5/webcomponents-fiori/dist/SortItem.js";`
+         * - **filterItems**: Defines the `filterItems` list.
+      
+      **Note:** If you want to use this slot, you need to import used item: `import "@ui5/webcomponents-fiori/dist/FilterItem.js";`
+         * - **groupItems**: Defines the list of items against which the user could group data.
+      
+      **Note:** If you want to use this slot, you need to import used item: `import "@ui5/webcomponents-fiori/dist/GroupItem.js";`
+         *
+         * @example
+         * ```html
+         * <ui5-view-settings-dialog>
+         *   <div slot="header">Custom header content</div>
+         *   <p>Default slot content</p>
+         * </ui5-view-settings-dialog>
+         * ```
+         *
+         * @readonly
+         * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
+         */
+        this.slots = [
+            {
+                "name": "sortItems",
+                "description": "Defines the list of items against which the user could sort data.\n\n**Note:** If you want to use this slot, you need to import used item: `import \"@ui5/webcomponents-fiori/dist/SortItem.js\";`"
+            },
+            {
+                "name": "filterItems",
+                "description": "Defines the `filterItems` list.\n\n**Note:** If you want to use this slot, you need to import used item: `import \"@ui5/webcomponents-fiori/dist/FilterItem.js\";`"
+            },
+            {
+                "name": "groupItems",
+                "description": "Defines the list of items against which the user could group data.\n\n**Note:** If you want to use this slot, you need to import used item: `import \"@ui5/webcomponents-fiori/dist/GroupItem.js\";`"
+            }
+        ];
         this.elementRef = inject(ElementRef);
         this.injector = inject(Injector);
     }
@@ -4445,6 +5869,33 @@ class Wizard {
       or by clicking on the steps within the component header.
          */
         this.ui5StepChange = output();
+        /**
+         * Available slots for content projection in this component.
+         *
+         * Slots allow you to insert custom content into predefined areas of the web component.
+         * Use the `slot` attribute on child elements to target specific slots.
+         *
+         * - **(default)**: Defines the steps.
+      
+      **Note:** Use the available `ui5-wizard-step` component.
+         *
+         * @example
+         * ```html
+         * <ui5-wizard>
+         *   <div slot="header">Custom header content</div>
+         *   <p>Default slot content</p>
+         * </ui5-wizard>
+         * ```
+         *
+         * @readonly
+         * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
+         */
+        this.slots = [
+            {
+                "name": "default",
+                "description": "Defines the steps.\n\n**Note:** Use the available `ui5-wizard-step` component."
+            }
+        ];
         this.elementRef = inject(ElementRef);
         this.injector = inject(Injector);
     }
@@ -4550,6 +6001,31 @@ class WizardStep {
       and later add new steps when it becomes clear how the wizard flow should continue.
          */
         this.branching = input(false, ...(ngDevMode ? [{ debugName: "branching", transform: booleanAttribute }] : [{ transform: booleanAttribute }])); // className is now passed
+        /**
+         * Available slots for content projection in this component.
+         *
+         * Slots allow you to insert custom content into predefined areas of the web component.
+         * Use the `slot` attribute on child elements to target specific slots.
+         *
+         * - **(default)**: Defines the step content.
+         *
+         * @example
+         * ```html
+         * <ui5-wizard-step>
+         *   <div slot="header">Custom header content</div>
+         *   <p>Default slot content</p>
+         * </ui5-wizard-step>
+         * ```
+         *
+         * @readonly
+         * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_templates_and_slots | MDN Web Components Slots}
+         */
+        this.slots = [
+            {
+                "name": "default",
+                "description": "Defines the step content."
+            }
+        ];
         this.elementRef = inject(ElementRef);
         this.injector = inject(Injector);
     }
@@ -4616,5 +6092,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.4", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { BarcodeScannerDialog, DynamicPage, DynamicPageHeader, DynamicPageTitle, DynamicSideContent, FilterItem, FilterItemOption, FlexibleColumnLayout, GenericControlValueAccessor, GroupItem, IllustratedMessage, MediaGallery, MediaGalleryItem, NavigationLayout, NotificationList, NotificationListGroupItem, NotificationListItem, Page, ProductSwitch, ProductSwitchItem, Search, SearchItem, SearchItemGroup, SearchItemShowMore, SearchMessageArea, SearchScope, ShellBar, ShellBarBranding, ShellBarItem, ShellBarSearch, ShellBarSpacer, SideNavigation, SideNavigationGroup, SideNavigationItem, SideNavigationSubItem, SortItem, Timeline, TimelineGroupItem, TimelineItem, Ui5WebcomponentsFioriThemingService, UploadCollection, UploadCollectionItem, UserMenu, UserMenuAccount, UserMenuItem, UserMenuItemGroup, UserSettingsDialog, UserSettingsItem, UserSettingsView, ViewSettingsDialog, Wizard, WizardStep };
+export { BarcodeScannerDialog, DynamicPage, DynamicPageHeader, DynamicPageTitle, DynamicSideContent, FilterItem, FilterItemOption, FlexibleColumnLayout, GenericControlValueAccessor, GroupItem, IllustratedMessage, MediaGallery, MediaGalleryItem, NavigationLayout, NotificationList, NotificationListGroupItem, NotificationListItem, Page, ProductSwitch, ProductSwitchItem, Search, SearchItem, SearchItemGroup, SearchItemShowMore, SearchMessageArea, SearchScope, ShellBar, ShellBarBranding, ShellBarItem, ShellBarSearch, ShellBarSpacer, SideNavigation, SideNavigationGroup, SideNavigationItem, SideNavigationSubItem, SortItem, Timeline, TimelineGroupItem, TimelineItem, Ui5WebcomponentsFioriThemingService, UploadCollection, UploadCollectionItem, UserMenu, UserMenuAccount, UserMenuItem, UserMenuItemGroup, UserSettingsAccountView, UserSettingsDialog, UserSettingsItem, UserSettingsView, ViewSettingsDialog, Wizard, WizardStep };
 //# sourceMappingURL=fundamental-ngx-ui5-webcomponents-fiori.mjs.map