diff --git a/.storybook/custom-element-manifests/ai.json b/.storybook/custom-element-manifests/ai.json
index 142438413ce..80065ee65db 100644
--- a/.storybook/custom-element-manifests/ai.json
+++ b/.storybook/custom-element-manifests/ai.json
@@ -2055,6 +2055,12 @@
               },
               "_ui5privacy": "public"
             }
+          ],
+          "cssStates": [
+            {
+              "description": "When the item is displayed in the overflow popover.\nUse this state to apply different styles when the item is overflowed.\nAvailable since 2.20.0.",
+              "name": "overflowed"
+            }
           ]
         }
       ],
@@ -2212,6 +2218,12 @@
               },
               "_ui5privacy": "public"
             }
+          ],
+          "cssStates": [
+            {
+              "description": "When the item is displayed in the overflow popover.\nUse this state to apply different styles when the item is overflowed.\nAvailable since 2.20.0.",
+              "name": "overflowed"
+            }
           ]
         }
       ],
diff --git a/.storybook/custom-element-manifests/fiori.json b/.storybook/custom-element-manifests/fiori.json
index 3f80714901f..f4f082f34b1 100644
--- a/.storybook/custom-element-manifests/fiori.json
+++ b/.storybook/custom-element-manifests/fiori.json
@@ -115,11 +115,19 @@
                   }
                 ]
               },
-              "description": "Fires when the scan is completed successfuuly.",
+              "description": "Fires when the scan is completed successfully.",
               "_ui5Cancelable": false,
               "_ui5allowPreventDefault": false,
               "_ui5Bubbles": true,
               "_ui5parameters": [
+                {
+                  "type": {
+                    "text": "string"
+                  },
+                  "name": "format",
+                  "_ui5privacy": "public",
+                  "description": "the format of the scanned barcode (e.g. \"QR_CODE\", \"EAN_13\", \"CODE_128\")"
+                },
                 {
                   "type": {
                     "text": "Object"
@@ -252,6 +260,24 @@
             }
           ],
           "members": [
+            {
+              "kind": "field",
+              "name": "accessibilityAttributes",
+              "type": {
+                "text": "DynamicPageAccessibilityAttributes",
+                "references": [
+                  {
+                    "name": "DynamicPageAccessibilityAttributes",
+                    "package": "@ui5/webcomponents-fiori",
+                    "module": "dist/DynamicPage.js"
+                  }
+                ]
+              },
+              "default": "{}",
+              "description": "Defines additional accessibility attributes on different areas of the component.\n\nThe accessibilityAttributes object has the following fields,\nwhere each field is an object supporting one or more accessibility attributes:\n\n - **root**: `root.role` and `root.name`.\n - **header**: `header.role` and `header.name`.\n - **content**: `content.role` and `content.name`.\n - **footer**: `footer.role` and `footer.name`.\n\nThe accessibility attributes support the following values:\n\n- **role**: Defines the accessible ARIA landmark role of the area.\nAccepts the following values per section:\n`root` — `none`, `main`, `region`;\n`header` — `none`, `banner`, `region`;\n`content` — `none`, `main`, `region`, `form`;\n`footer` — `none`, `contentinfo`, `region`.\n\n- **name**: Defines the accessible ARIA name of the area.\nAccepts any string.",
+              "privacy": "public",
+              "_ui5since": "2.24.0"
+            },
             {
               "kind": "field",
               "name": "headerPinned",
@@ -318,6 +344,15 @@
             }
           ],
           "attributes": [
+            {
+              "description": "Defines additional accessibility attributes on different areas of the component.\n\nThe accessibilityAttributes object has the following fields,\nwhere each field is an object supporting one or more accessibility attributes:\n\n - **root**: `root.role` and `root.name`.\n - **header**: `header.role` and `header.name`.\n - **content**: `content.role` and `content.name`.\n - **footer**: `footer.role` and `footer.name`.\n\nThe accessibility attributes support the following values:\n\n- **role**: Defines the accessible ARIA landmark role of the area.\nAccepts the following values per section:\n`root` — `none`, `main`, `region`;\n`header` — `none`, `banner`, `region`;\n`content` — `none`, `main`, `region`, `form`;\n`footer` — `none`, `contentinfo`, `region`.\n\n- **name**: Defines the accessible ARIA name of the area.\nAccepts any string.",
+              "name": "accessibility-attributes",
+              "default": "{}",
+              "fieldName": "accessibilityAttributes",
+              "type": {
+                "text": "DynamicPageAccessibilityAttributes"
+              }
+            },
             {
               "description": "Defines if the header is pinned.",
               "name": "header-pinned",
@@ -404,6 +439,30 @@
               "_ui5privacy": "public"
             }
           ],
+          "members": [
+            {
+              "kind": "field",
+              "name": "accessibleName",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "Defines the accessible ARIA label for the header region.\nOverrides the default \"Header Expanded\" / \"Header Snapped\" text.",
+              "privacy": "public",
+              "default": "undefined",
+              "_ui5since": "2.24.0"
+            }
+          ],
+          "attributes": [
+            {
+              "description": "Defines the accessible ARIA label for the header region.\nOverrides the default \"Header Expanded\" / \"Header Snapped\" text.",
+              "name": "accessible-name",
+              "default": "undefined",
+              "fieldName": "accessibleName",
+              "type": {
+                "text": "string | undefined"
+              }
+            }
+          ],
           "superclass": {
             "name": "UI5Element",
             "package": "@ui5/webcomponents-base",
@@ -412,8 +471,7 @@
           "tagName": "ui5-dynamic-page-header",
           "customElement": true,
           "_ui5since": "2.0.0",
-          "_ui5privacy": "public",
-          "members": []
+          "_ui5privacy": "public"
         }
       ],
       "exports": [
@@ -6071,6 +6129,12 @@
           "kind": "class",
           "description": "### Overview\n\nA `ui5-search` is an input with suggestions, used for user search.\n\nThe `ui5-search` consists of several elements parts:\n- Scope - displays a select in the beggining of the component, used for filtering results by their scope.\n- Input field - for user input value\n- Clear button - gives the possibility for deleting the entered value\n- Search button - a primary button for performing search, when the user has entered a search term\n- Suggestions - a list with available search suggestions\n\n### ES6 Module Import\n\n`import \"@ui5/webcomponents-fiori/dist/Search.js\";`",
           "name": "Search",
+          "cssParts": [
+            {
+              "description": "Used to style the suggestions popup",
+              "name": "popover"
+            }
+          ],
           "slots": [
             {
               "name": "action",
@@ -8719,6 +8783,12 @@
           "_ui5experimental": true,
           "_ui5since": "2.10.0",
           "_ui5privacy": "public",
+          "cssParts": [
+            {
+              "description": "Used to style the suggestions popup",
+              "name": "popover"
+            }
+          ],
           "slots": [
             {
               "name": "action",
@@ -10534,7 +10604,7 @@
         },
         {
           "kind": "class",
-          "description": "### Overview\n\nThe `ui5-timeline` component shows entries (such as objects, events, or posts) in chronological order.\nA common use case is to provide information about changes to an object, or events related to an object.\nThese entries can be generated by the system (for example, value XY changed from A to B), or added manually.\nThere are two distinct variants of the timeline: basic and social. The basic timeline is read-only,\nwhile the social timeline offers a high level of interaction and collaboration, and is integrated within SAP Jam.",
+          "description": "### Overview\n\nThe `ui5-timeline` component shows entries (such as objects, events, or posts) in chronological order.\nA common use case is to provide information about changes to an object, or events related to an object.\nThese entries can be generated by the system (for example, value XY changed from A to B), or added manually.\nThere are two distinct variants of the timeline: basic and social. The basic timeline is read-only,\nwhile the social timeline offers a high level of interaction and collaboration, and is integrated within SAP Jam.\n\n### Header and Info Bar Slots\n\nThe Timeline exposes two named slots above the items area:\n\n- `header` — for a controls bar (search field, filter trigger, sort toggle, etc.).\nThe most common pattern is to place a `ui5-toolbar` containing a search input and buttons that open\na filter dialog or toggle sort direction. The Timeline itself performs no filtering, sorting, or\nsearching — the application listens for events from its own controls and reorders, hides, or\nadds items in the default slot accordingly.\n\n- `infoBar` — for a status bar that reflects the result of the controls (active filters,\napplied sort, current search query). Typically contains tokens, labels, or a `ui5-bar`.\n\nThe Timeline itself does not filter, sort, or search — the application owns that logic.\nUse `stickyHeader` to pin both bars while the Timeline's items scroll. Give the Timeline\na constrained height in this mode so it owns its scrollbar.",
           "name": "Timeline",
           "slots": [
             {
@@ -10552,6 +10622,24 @@
                 ]
               },
               "_ui5privacy": "public"
+            },
+            {
+              "name": "header",
+              "description": "Defines the content of the Timeline's header area, displayed above the items.\nTypically a `ui5-toolbar` with search, sort, and filter controls.",
+              "_ui5since": "2.24.0",
+              "_ui5type": {
+                "text": "Array<HTMLElement>"
+              },
+              "_ui5privacy": "public"
+            },
+            {
+              "name": "infoBar",
+              "description": "Defines the content of the Timeline's info bar area, displayed below the header\nand above the items. Use for status display (applied filters, sort direction, counts).",
+              "_ui5since": "2.24.0",
+              "_ui5type": {
+                "text": "Array<HTMLElement>"
+              },
+              "_ui5privacy": "public"
             }
           ],
           "members": [
@@ -10622,6 +10710,17 @@
               "default": "1000",
               "description": "Defines the delay in milliseconds, after which the loading indicator will show up for this component.",
               "privacy": "public"
+            },
+            {
+              "kind": "field",
+              "name": "stickyHeader",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Defines whether the content of the `header` and `infoBar` slots remains visible when the user scrolls the Timeline.\n\n**Note:** The bars pin to the Timeline's own scrollport. Give the Timeline a\nconstrained height (for example `style=\"height: 32rem\"`) so its items scroll\ninside it. Placing the Timeline inside an externally scrolling ancestor while\nleaving the Timeline itself unsized is not supported in this mode — the bars\nwill scroll away with the ancestor.",
+              "privacy": "public",
+              "_ui5since": "2.24.0"
             }
           ],
           "events": [
@@ -10683,6 +10782,15 @@
               "type": {
                 "text": "number"
               }
+            },
+            {
+              "description": "Defines whether the content of the `header` and `infoBar` slots remains visible when the user scrolls the Timeline.\n\n**Note:** The bars pin to the Timeline's own scrollport. Give the Timeline a\nconstrained height (for example `style=\"height: 32rem\"`) so its items scroll\ninside it. Placing the Timeline inside an externally scrolling ancestor while\nleaving the Timeline itself unsized is not supported in this mode — the bars\nwill scroll away with the ancestor.",
+              "name": "sticky-header",
+              "default": "false",
+              "fieldName": "stickyHeader",
+              "type": {
+                "text": "boolean"
+              }
             }
           ],
           "superclass": {
@@ -11858,9 +11966,29 @@
                 "text": "Array<HTMLElement>"
               },
               "_ui5privacy": "public"
+            },
+            {
+              "name": "infoArea",
+              "description": "Defines the content of the info area inside the User Menu's account block.\n\n**Note:** When empty, the User Menu renders unchanged.",
+              "_ui5since": "2.24.0",
+              "_ui5type": {
+                "text": "Array<HTMLElement>"
+              },
+              "_ui5privacy": "public"
             }
           ],
           "members": [
+            {
+              "kind": "field",
+              "name": "avatarInteractive",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Defines whether the avatar of the selected account is interactive (focusable and pressable).\n\nWhen `false` (default), the avatar is rendered as a non-interactive image\nand is not announced as a button by screen readers.\n\n**Note:** When `showEditButton` is set to `true`, the avatar is treated as interactive\nregardless of this property's value, to preserve the edit affordance.",
+              "privacy": "public",
+              "_ui5since": "2.25.0"
+            },
             {
               "kind": "field",
               "name": "open",
@@ -12080,6 +12208,15 @@
             }
           ],
           "attributes": [
+            {
+              "description": "Defines whether the avatar of the selected account is interactive (focusable and pressable).\n\nWhen `false` (default), the avatar is rendered as a non-interactive image\nand is not announced as a button by screen readers.\n\n**Note:** When `showEditButton` is set to `true`, the avatar is treated as interactive\nregardless of this property's value, to preserve the edit affordance.",
+              "name": "avatar-interactive",
+              "default": "false",
+              "fieldName": "avatarInteractive",
+              "type": {
+                "text": "boolean"
+              }
+            },
             {
               "description": "Defines if the User Menu is opened.",
               "name": "open",
diff --git a/.storybook/custom-element-manifests/main.json b/.storybook/custom-element-manifests/main.json
index 437a115c768..2d4e64ef923 100644
--- a/.storybook/custom-element-manifests/main.json
+++ b/.storybook/custom-element-manifests/main.json
@@ -830,7 +830,7 @@
                 ]
               },
               "default": "\"Toolbar\"",
-              "description": "Specifies the ARIA role applied to the component for accessibility purposes.\n\n**Note:**\n\n- Set accessibleRole to \"toolbar\" only when the component contains two or more active, interactive elements (such as buttons, links, or input fields) within the bar.\n\n- 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.",
+              "description": "Specifies the ARIA role applied to the component for accessibility purposes.\n\n**Note:**\n\n- By default, accessibleRole is set to \"Toolbar\", which renders the ARIA role \"toolbar\".\n\n- Use the default accessibleRole value \"Toolbar\" only when the component contains two or more active, interactive elements (such as buttons, links, or input fields) within the bar.\n\n- If there is only one or no active element, set accessibleRole to \"None\" to avoid rendering the ARIA role \"toolbar\", as that role implies a grouping of multiple interactive controls.",
               "privacy": "public",
               "_ui5since": "2.10.0"
             },
@@ -872,7 +872,7 @@
               }
             },
             {
-              "description": "Specifies the ARIA role applied to the component for accessibility purposes.\n\n**Note:**\n\n- Set accessibleRole to \"toolbar\" only when the component contains two or more active, interactive elements (such as buttons, links, or input fields) within the bar.\n\n- 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.",
+              "description": "Specifies the ARIA role applied to the component for accessibility purposes.\n\n**Note:**\n\n- By default, accessibleRole is set to \"Toolbar\", which renders the ARIA role \"toolbar\".\n\n- Use the default accessibleRole value \"Toolbar\" only when the component contains two or more active, interactive elements (such as buttons, links, or input fields) within the bar.\n\n- If there is only one or no active element, set accessibleRole to \"None\" to avoid rendering the ARIA role \"toolbar\", as that role implies a grouping of multiple interactive controls.",
               "name": "accessible-role",
               "default": "\"Toolbar\"",
               "fieldName": "accessibleRole",
@@ -947,6 +947,17 @@
             }
           ],
           "members": [
+            {
+              "kind": "field",
+              "name": "accessibleName",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "Defines the accessible name of the component.",
+              "default": "undefined",
+              "privacy": "public",
+              "_ui5since": "2.24.0"
+            },
             {
               "kind": "field",
               "name": "design",
@@ -1045,6 +1056,15 @@
             }
           ],
           "attributes": [
+            {
+              "description": "Defines the accessible name of the component.",
+              "name": "accessible-name",
+              "default": "undefined",
+              "fieldName": "accessibleName",
+              "type": {
+                "text": "string | undefined"
+              }
+            },
             {
               "description": "Defines the visual appearance of the last BreadcrumbsItem.\n\nThe Breadcrumbs supports two visual appearances for the last BreadcrumbsItem:\n- \"Standard\" - displaying the last item as \"current page\" (bold and without separator)\n- \"NoCurrentPage\" - displaying the last item as a regular BreadcrumbsItem, followed by separator",
               "name": "design",
@@ -5092,6 +5112,7 @@
               "_ui5Cancelable": false,
               "_ui5allowPreventDefault": false,
               "_ui5Bubbles": true,
+              "_ui5since": "2.24.0",
               "_ui5parameters": [
                 {
                   "type": {
@@ -5107,6 +5128,14 @@
                   "name": "item",
                   "_ui5privacy": "public",
                   "description": "item to be selected."
+                },
+                {
+                  "type": {
+                    "text": "string"
+                  },
+                  "name": "trigger",
+                  "_ui5privacy": "public",
+                  "description": "source of the selection change - typeahead, click or keyboard navigation."
                 }
               ]
             }
@@ -5422,6 +5451,135 @@
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "dist/ComboBoxItemCustom.js",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "The `ui5-cb-item-custom` is a combobox item component\nthat allows placing custom content inside a combobox item.\nThe `text` property is used for filtering and auto-complete.\nFor highlighting functionality, see `@ui5/webcomponents-base/dist/util/generateHighlightedMarkup.js`.",
+          "name": "ComboBoxItemCustom",
+          "slots": [
+            {
+              "name": "default",
+              "description": "Defines the content of the component.",
+              "_ui5propertyName": "content",
+              "_ui5type": {
+                "text": "Array<Node>"
+              },
+              "_ui5privacy": "public"
+            }
+          ],
+          "members": [
+            {
+              "kind": "field",
+              "name": "text",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "Defines the text of the component.\nUsed for filtering, autocomplete, and mobile rendering.",
+              "default": "undefined",
+              "privacy": "public"
+            },
+            {
+              "kind": "field",
+              "name": "value",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "Defines the value of the component.\nUsed for programmatic selection via the `selectedValue` property.",
+              "default": "undefined",
+              "privacy": "public"
+            }
+          ],
+          "events": [
+            {
+              "name": "click",
+              "_ui5privacy": "public",
+              "type": {
+                "text": "CustomEvent<ComboBoxItemCustomClickEventDetail>",
+                "references": [
+                  {
+                    "name": "ComboBoxItemCustomClickEventDetail",
+                    "package": "@ui5/webcomponents",
+                    "module": "dist/ComboBoxItemCustom.js"
+                  }
+                ]
+              },
+              "description": "Fired when the component is activated either with a mouse/tap or by using the Enter or Space key.\n\n**Note:** The event will not be fired if the `disabled` property is set to `true`.",
+              "_ui5Cancelable": false,
+              "_ui5allowPreventDefault": false,
+              "_ui5Bubbles": true,
+              "_ui5since": "2.24.0",
+              "_ui5parameters": [
+                {
+                  "type": {
+                    "text": "Event"
+                  },
+                  "name": "originalEvent",
+                  "_ui5privacy": "public",
+                  "description": "The original event from the user interaction."
+                }
+              ]
+            }
+          ],
+          "attributes": [
+            {
+              "description": "Defines the text of the component.\nUsed for filtering, autocomplete, and mobile rendering.",
+              "name": "text",
+              "default": "undefined",
+              "fieldName": "text",
+              "type": {
+                "text": "string | undefined"
+              }
+            },
+            {
+              "description": "Defines the value of the component.\nUsed for programmatic selection via the `selectedValue` property.",
+              "name": "value",
+              "default": "undefined",
+              "fieldName": "value",
+              "type": {
+                "text": "string | undefined"
+              }
+            }
+          ],
+          "superclass": {
+            "name": "ListItemBase",
+            "package": "@ui5/webcomponents",
+            "module": "dist/ListItemBase.js"
+          },
+          "tagName": "ui5-cb-item-custom",
+          "customElement": true,
+          "_ui5since": "2.24.0",
+          "_ui5privacy": "public",
+          "_ui5implements": [
+            {
+              "name": "IComboBoxItem",
+              "package": "@ui5/webcomponents",
+              "module": "dist/ComboBox.js"
+            }
+          ]
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "default",
+          "declaration": {
+            "name": "ComboBoxItemCustom",
+            "module": "dist/ComboBoxItemCustom.js"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "ui5-cb-item-custom",
+          "declaration": {
+            "name": "ComboBoxItemCustom",
+            "module": "dist/ComboBoxItemCustom.js"
+          }
+        }
+      ]
+    },
     {
       "kind": "javascript-module",
       "path": "dist/ComboBoxItemGroup.js",
@@ -9180,7 +9338,7 @@
       "declarations": [
         {
           "kind": "class",
-          "description": "### Overview\nThe `ui5-dialog` component is used to temporarily display some information in a\nsize-limited window in front of the regular app screen.\nIt is used to prompt the user for an action or a confirmation.\nThe `ui5-dialog` interrupts the current app processing as it is the only focused UI element and\nthe main screen is dimmed/blocked.\nThe dialog combines concepts known from other technologies where the windows have\nnames such as dialog box, dialog window, pop-up, pop-up window, alert box, or message box.\n\nThe `ui5-dialog` is modal, which means that a user action is required before it is possible to return to the parent window.\nTo open multiple dialogs, each dialog element should be separate in the markup. This will ensure the correct modal behavior. Avoid nesting dialogs within each other.\nThe content of the `ui5-dialog` is fully customizable.\n\n### Structure\nA `ui5-dialog` consists of a header, content, and a footer for action buttons.\nThe `ui5-dialog` is usually displayed at the center of the screen.\nIts position can be changed by the user. To enable this, you need to set the property `draggable` accordingly.\n\n\n### Responsive Behavior\nThe `stretch` property can be used to stretch the `ui5-dialog` to full screen. For better usability, it's recommended to stretch the dialog to full screen on phone devices.\n\n**Note:** When a `ui5-bar` is used in the header or in the footer, you should remove the default dialog's paddings.\n\nFor more information see the sample \"Bar in Header/Footer\".\n\n### Keyboard Handling\n\n#### Basic Navigation\nWhen the `ui5-dialog` has the `draggable` property set to `true` and the header is focused, the user can move the dialog\nwith the following keyboard shortcuts:\n\n- [Up] or [Down] arrow keys - Move the dialog up/down.\n- [Left] or [Right] arrow keys - Move the dialog left/right.\n\n#### Resizing\nWhen the `ui5-dialog` has the `resizable` property set to `true` and the header is focused, the user can change the size of the dialog\nwith the following keyboard shortcuts:\n\n- [Shift] + [Up] or [Down] - Decrease/Increase the height of the dialog.\n- [Shift] + [Left] or [Right] - Decrease/Increase the width of the dialog.\n\n### ES6 Module Import\n\n`import \"@ui5/webcomponents/dist/Dialog\";`",
+          "description": "### Overview\nThe `ui5-dialog` component is used to temporarily display some information in a\nsize-limited window in front of the regular app screen.\nIt is used to prompt the user for an action or a confirmation.\nThe `ui5-dialog` interrupts the current app processing as it is the only focused UI element and\nthe main screen is dimmed/blocked.\nThe dialog combines concepts known from other technologies where the windows have\nnames such as dialog box, dialog window, pop-up, pop-up window, alert box, or message box.\n\nThe `ui5-dialog` is modal, which means that a user action is required before it is possible to return to the parent window.\nTo open multiple dialogs, each dialog element should be separate in the markup. This will ensure the correct modal behavior. Avoid nesting dialogs within each other.\nThe content of the `ui5-dialog` is fully customizable.\n\n### Structure\nA `ui5-dialog` consists of a header, content, and a footer for action buttons.\nThe `ui5-dialog` is usually displayed at the center of the screen.\nIts position can be changed by the user. To enable this, you need to set the property `draggable` accordingly.\n\n\n### Responsive Behavior\nThe `stretch` property can be used to stretch the `ui5-dialog` to full screen. For better usability, it's recommended to stretch the dialog to full screen on phone devices.\n\n**Note:** When a `ui5-bar` is used in the header or in the footer, you should remove the default dialog's paddings.\n\nFor more information see the sample \"Bar in Header/Footer\".\n\n### Keyboard Handling\n\n#### Basic Navigation\nWhen the `ui5-dialog` has the `draggable` property set to `true`, the user can move the dialog\nwith the following keyboard shortcuts:\n\n- [Up] or [Down] arrow keys - Move the dialog up/down.\n- [Left] or [Right] arrow keys - Move the dialog left/right.\n\n#### Resizing\nWhen the `ui5-dialog` has the `resizable` property set to `true`, the user can change the size of the dialog\nwith the following keyboard shortcuts:\n\n- [Shift] + [Up] or [Down] - Decrease/Increase the height of the dialog.\n- [Shift] + [Left] or [Right] - Decrease/Increase the width of the dialog.\n\n### ES6 Module Import\n\n`import \"@ui5/webcomponents/dist/Dialog\";`",
           "name": "Dialog",
           "cssParts": [
             {
@@ -16787,6 +16945,135 @@
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "dist/MultiComboBoxItemCustom.js",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "The `ui5-mcb-item-custom` is a multi-combobox item component\nthat allows placing custom content inside a multi-combobox item.\nThe `text` property is used for filtering and token display.\nFor highlighting functionality, see `@ui5/webcomponents-base/dist/util/generateHighlightedMarkup.js`.",
+          "name": "MultiComboBoxItemCustom",
+          "slots": [
+            {
+              "name": "default",
+              "description": "Defines the content of the component.",
+              "_ui5propertyName": "content",
+              "_ui5type": {
+                "text": "Array<Node>"
+              },
+              "_ui5privacy": "public"
+            }
+          ],
+          "members": [
+            {
+              "kind": "field",
+              "name": "text",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "Defines the text of the component.\nUsed for filtering and token display.",
+              "default": "undefined",
+              "privacy": "public"
+            },
+            {
+              "kind": "field",
+              "name": "value",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "Defines the value of the component.\nUsed for programmatic selection via selectedValues property.",
+              "default": "undefined",
+              "privacy": "public"
+            }
+          ],
+          "events": [
+            {
+              "name": "click",
+              "_ui5privacy": "public",
+              "type": {
+                "text": "CustomEvent<MultiComboBoxItemCustomClickEventDetail>",
+                "references": [
+                  {
+                    "name": "MultiComboBoxItemCustomClickEventDetail",
+                    "package": "@ui5/webcomponents",
+                    "module": "dist/MultiComboBoxItemCustom.js"
+                  }
+                ]
+              },
+              "description": "Fired when the component is activated either with a mouse/tap or by using the Enter or Space key.\n\n**Note:** The event will not be fired if the `disabled` property is set to `true`.",
+              "_ui5Cancelable": false,
+              "_ui5allowPreventDefault": false,
+              "_ui5Bubbles": true,
+              "_ui5since": "2.24.0",
+              "_ui5parameters": [
+                {
+                  "type": {
+                    "text": "Event"
+                  },
+                  "name": "originalEvent",
+                  "_ui5privacy": "public",
+                  "description": "The original event from the user interaction."
+                }
+              ]
+            }
+          ],
+          "attributes": [
+            {
+              "description": "Defines the text of the component.\nUsed for filtering and token display.",
+              "name": "text",
+              "default": "undefined",
+              "fieldName": "text",
+              "type": {
+                "text": "string | undefined"
+              }
+            },
+            {
+              "description": "Defines the value of the component.\nUsed for programmatic selection via selectedValues property.",
+              "name": "value",
+              "default": "undefined",
+              "fieldName": "value",
+              "type": {
+                "text": "string | undefined"
+              }
+            }
+          ],
+          "superclass": {
+            "name": "ListItemBase",
+            "package": "@ui5/webcomponents",
+            "module": "dist/ListItemBase.js"
+          },
+          "tagName": "ui5-mcb-item-custom",
+          "customElement": true,
+          "_ui5since": "2.24.0",
+          "_ui5privacy": "public",
+          "_ui5implements": [
+            {
+              "name": "IMultiComboBoxItem",
+              "package": "@ui5/webcomponents",
+              "module": "dist/MultiComboBox.js"
+            }
+          ]
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "default",
+          "declaration": {
+            "name": "MultiComboBoxItemCustom",
+            "module": "dist/MultiComboBoxItemCustom.js"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "ui5-mcb-item-custom",
+          "declaration": {
+            "name": "MultiComboBoxItemCustom",
+            "module": "dist/MultiComboBoxItemCustom.js"
+          }
+        }
+      ]
+    },
     {
       "kind": "javascript-module",
       "path": "dist/MultiComboBoxItemGroup.js",
@@ -31417,7 +31704,13 @@
           "customElement": true,
           "_ui5since": "1.17.0",
           "_ui5privacy": "public",
-          "_ui5abstract": true
+          "_ui5abstract": true,
+          "cssStates": [
+            {
+              "description": "When the item is displayed in the overflow popover.\nUse this state to apply different styles when the item is overflowed.\nAvailable since 2.20.0.",
+              "name": "overflowed"
+            }
+          ]
         }
       ],
       "exports": [
@@ -31530,6 +31823,12 @@
                 "text": "boolean"
               }
             }
+          ],
+          "cssStates": [
+            {
+              "description": "When the item is displayed in the overflow popover.\nUse this state to apply different styles when the item is overflowed.\nAvailable since 2.20.0.",
+              "name": "overflowed"
+            }
           ]
         }
       ],
@@ -31609,6 +31908,12 @@
               }
             }
           ],
+          "cssStates": [
+            {
+              "description": "When the item is displayed in the overflow popover.\nUse this state to apply different styles when the item is overflowed.\nAvailable since 2.20.0.",
+              "name": "overflowed"
+            }
+          ],
           "superclass": {
             "name": "UI5Element",
             "package": "@ui5/webcomponents-base",
@@ -31898,7 +32203,13 @@
           "customElement": true,
           "_ui5since": "1.17.0",
           "_ui5privacy": "public",
-          "_ui5abstract": true
+          "_ui5abstract": true,
+          "cssStates": [
+            {
+              "description": "When the item is displayed in the overflow popover.\nUse this state to apply different styles when the item is overflowed.\nAvailable since 2.20.0.",
+              "name": "overflowed"
+            }
+          ]
         }
       ],
       "exports": [
@@ -32059,6 +32370,12 @@
                 "text": "boolean"
               }
             }
+          ],
+          "cssStates": [
+            {
+              "description": "When the item is displayed in the overflow popover.\nUse this state to apply different styles when the item is overflowed.\nAvailable since 2.20.0.",
+              "name": "overflowed"
+            }
           ]
         }
       ],
@@ -32166,7 +32483,13 @@
           "customElement": true,
           "_ui5since": "1.17.0",
           "_ui5privacy": "public",
-          "_ui5abstract": true
+          "_ui5abstract": true,
+          "cssStates": [
+            {
+              "description": "When the item is displayed in the overflow popover.\nUse this state to apply different styles when the item is overflowed.\nAvailable since 2.20.0.",
+              "name": "overflowed"
+            }
+          ]
         }
       ],
       "exports": [
diff --git a/config/version-info.json b/config/version-info.json
index daa6e442b5f..c463b9aacb6 100644
--- a/config/version-info.json
+++ b/config/version-info.json
@@ -65,5 +65,6 @@
   "2.20.0": "2.20.0",
   "2.21.0": "2.21.0",
   "2.22.0": "2.22.0",
-  "2.23.0": "2.23.0"
+  "2.23.0": "2.23.0",
+  "2.24.0": "2.24.0"
 }
diff --git a/package.json b/package.json
index a563d90b4ac..9761a088092 100644
--- a/package.json
+++ b/package.json
@@ -48,11 +48,11 @@
     "@storybook/addon-a11y": "10.4.6",
     "@storybook/addon-docs": "10.4.6",
     "@storybook/react-vite": "10.4.6",
-    "@ui5/webcomponents": "2.23.2",
-    "@ui5/webcomponents-ai": "2.23.2",
-    "@ui5/webcomponents-compat": "2.23.2",
-    "@ui5/webcomponents-fiori": "2.23.2",
-    "@ui5/webcomponents-icons": "2.23.2",
+    "@ui5/webcomponents": "2.24.0",
+    "@ui5/webcomponents-ai": "2.24.0",
+    "@ui5/webcomponents-compat": "2.24.0",
+    "@ui5/webcomponents-fiori": "2.24.0",
+    "@ui5/webcomponents-icons": "2.24.0",
     "react": "19.2.7",
     "react-dom": "19.2.7",
     "remark-gfm": "4.0.1",
@@ -76,7 +76,7 @@
     "@types/node": "24.13.2",
     "@types/react": "19.2.17",
     "@types/react-dom": "19.2.3",
-    "@ui5/webcomponents-tools": "2.23.2",
+    "@ui5/webcomponents-tools": "2.24.0",
     "@vitejs/plugin-react": "6.0.3",
     "chromatic": "17.7.2",
     "cssnano": "8.0.2",
diff --git a/packages/ai/package.json b/packages/ai/package.json
index 8e522b67e73..0f2a9cd5d9c 100644
--- a/packages/ai/package.json
+++ b/packages/ai/package.json
@@ -53,7 +53,7 @@
     "@ui5/webcomponents-react-base": "workspace:~"
   },
   "peerDependencies": {
-    "@ui5/webcomponents-ai": "~2.23.0",
+    "@ui5/webcomponents-ai": "~2.24.0",
     "react": "^18 || ^19"
   },
   "publishConfig": {
diff --git a/packages/base/package.json b/packages/base/package.json
index 5a88b62c272..cfa0d806c74 100644
--- a/packages/base/package.json
+++ b/packages/base/package.json
@@ -88,7 +88,7 @@
   },
   "peerDependencies": {
     "@types/react": "*",
-    "@ui5/webcomponents-base": "~2.23.0",
+    "@ui5/webcomponents-base": "~2.24.0",
     "react": "^18 || ^19"
   },
   "peerDependenciesMeta": {
diff --git a/packages/compat/package.json b/packages/compat/package.json
index d68110105ba..fd1acfbed89 100644
--- a/packages/compat/package.json
+++ b/packages/compat/package.json
@@ -93,8 +93,8 @@
   "peerDependencies": {
     "@types/react": "*",
     "@types/react-dom": "*",
-    "@ui5/webcomponents-compat": "~2.23.0",
-    "@ui5/webcomponents-react": "~2.23.0",
+    "@ui5/webcomponents-compat": "~2.24.0",
+    "@ui5/webcomponents-react": "~2.24.0",
     "react": "^18 || ^19",
     "react-dom": "^18 || ^19"
   },
diff --git a/packages/cypress-commands/package.json b/packages/cypress-commands/package.json
index bb36f17b8cb..59b8f5f6361 100644
--- a/packages/cypress-commands/package.json
+++ b/packages/cypress-commands/package.json
@@ -23,8 +23,8 @@
     "clean": "rimraf dist api-commands.json api-queries.json"
   },
   "peerDependencies": {
-    "@ui5/webcomponents": "~2.23.0",
-    "@ui5/webcomponents-base": "~2.23.0",
+    "@ui5/webcomponents": "~2.24.0",
+    "@ui5/webcomponents-base": "~2.24.0",
     "cypress": "^12 || ^13 || ^14 || ^15"
   },
   "peerDependenciesMeta": {
diff --git a/packages/main/package.json b/packages/main/package.json
index ce3ca585b01..1d8cff74fa6 100644
--- a/packages/main/package.json
+++ b/packages/main/package.json
@@ -243,6 +243,10 @@
       "types": "./dist/webComponents/ComboBoxItem/index.d.ts",
       "default": "./dist/webComponents/ComboBoxItem/index.js"
     },
+    "./ComboBoxItemCustom": {
+      "types": "./dist/webComponents/ComboBoxItemCustom/index.d.ts",
+      "default": "./dist/webComponents/ComboBoxItemCustom/index.js"
+    },
     "./ComboBoxItemGroup": {
       "types": "./dist/webComponents/ComboBoxItemGroup/index.d.ts",
       "default": "./dist/webComponents/ComboBoxItemGroup/index.js"
@@ -395,6 +399,10 @@
       "types": "./dist/webComponents/MultiComboBoxItem/index.d.ts",
       "default": "./dist/webComponents/MultiComboBoxItem/index.js"
     },
+    "./MultiComboBoxItemCustom": {
+      "types": "./dist/webComponents/MultiComboBoxItemCustom/index.d.ts",
+      "default": "./dist/webComponents/MultiComboBoxItemCustom/index.js"
+    },
     "./MultiComboBoxItemGroup": {
       "types": "./dist/webComponents/MultiComboBoxItemGroup/index.d.ts",
       "default": "./dist/webComponents/MultiComboBoxItemGroup/index.js"
@@ -831,10 +839,10 @@
   "peerDependencies": {
     "@types/react": "*",
     "@types/react-dom": "*",
-    "@ui5/webcomponents": "~2.23.0",
-    "@ui5/webcomponents-base": "~2.23.0",
-    "@ui5/webcomponents-fiori": "~2.23.0",
-    "@ui5/webcomponents-icons": "~2.23.0",
+    "@ui5/webcomponents": "~2.24.0",
+    "@ui5/webcomponents-base": "~2.24.0",
+    "@ui5/webcomponents-fiori": "~2.24.0",
+    "@ui5/webcomponents-icons": "~2.24.0",
     "react": "^18 || ^19",
     "react-dom": "^18 || ^19"
   },
diff --git a/packages/main/src/webComponents/Bar/index.tsx b/packages/main/src/webComponents/Bar/index.tsx
index e924d581b18..1d195b88663 100644
--- a/packages/main/src/webComponents/Bar/index.tsx
+++ b/packages/main/src/webComponents/Bar/index.tsx
@@ -29,9 +29,11 @@ interface BarAttributes {
    *
    * **Note:**
    *
-   * - Set accessibleRole to "toolbar" only when the component contains two or more active, interactive elements (such as buttons, links, or input fields) within the bar.
+   * - By default, accessibleRole is set to "Toolbar", which renders the ARIA role "toolbar".
    *
-   * - 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.
+   * - Use the default accessibleRole value "Toolbar" only when the component contains two or more active, interactive elements (such as buttons, links, or input fields) within the bar.
+   *
+   * - If there is only one or no active element, set accessibleRole to "None" to avoid rendering the ARIA role "toolbar", as that role implies a grouping of multiple interactive controls.
    *
    * **Note:** Available since [v2.10.0](https://github.com/UI5/webcomponents/releases/tag/v2.10.0) of **@ui5/webcomponents**.
    * @default "Toolbar"
diff --git a/packages/main/src/webComponents/BarcodeScannerDialog/index.tsx b/packages/main/src/webComponents/BarcodeScannerDialog/index.tsx
index 130ecca846e..dc9aa262fe4 100644
--- a/packages/main/src/webComponents/BarcodeScannerDialog/index.tsx
+++ b/packages/main/src/webComponents/BarcodeScannerDialog/index.tsx
@@ -87,7 +87,7 @@ interface BarcodeScannerDialogPropTypes
   onScanError?: (event: Ui5CustomEvent<BarcodeScannerDialogDomRef, BarcodeScannerDialogScanErrorEventDetail>) => void;
 
   /**
-   * Fires when the scan is completed successfuuly.
+   * Fires when the scan is completed successfully.
    *
    * | cancelable | bubbles |
    * | :--------: | :-----: |
diff --git a/packages/main/src/webComponents/Breadcrumbs/index.tsx b/packages/main/src/webComponents/Breadcrumbs/index.tsx
index c8f929b1c82..bed8e3719e3 100644
--- a/packages/main/src/webComponents/Breadcrumbs/index.tsx
+++ b/packages/main/src/webComponents/Breadcrumbs/index.tsx
@@ -9,6 +9,14 @@ import { withWebComponent } from '@ui5/webcomponents-react-base';
 import type { ReactNode } from 'react';
 
 interface BreadcrumbsAttributes {
+  /**
+   * Defines the accessible name of the component.
+   *
+   * **Note:** Available since [v2.24.0](https://github.com/UI5/webcomponents/releases/tag/v2.24.0) of **@ui5/webcomponents**.
+   * @default undefined
+   */
+  accessibleName?: string | undefined;
+
   /**
    * Defines the visual appearance of the last BreadcrumbsItem.
    *
@@ -78,7 +86,7 @@ interface BreadcrumbsPropTypes
  */
 const Breadcrumbs = withWebComponent<BreadcrumbsPropTypes, BreadcrumbsDomRef>(
   'ui5-breadcrumbs',
-  ['design', 'separators'],
+  ['accessibleName', 'design', 'separators'],
   [],
   [],
   ['item-click'],
diff --git a/packages/main/src/webComponents/ComboBox/ComboBox.mdx b/packages/main/src/webComponents/ComboBox/ComboBox.mdx
index e58544210a5..9899b57c3ec 100644
--- a/packages/main/src/webComponents/ComboBox/ComboBox.mdx
+++ b/packages/main/src/webComponents/ComboBox/ComboBox.mdx
@@ -4,6 +4,7 @@ import { Canvas, Description, Markdown, Meta } from '@storybook/addon-docs/block
 import '@ui5/webcomponents-icons/dist/employee.js';
 import { ComboBoxItemGroup } from '../ComboBoxItemGroup';
 import { ComboBoxItem } from '../ComboBoxItem';
+import { ComboBoxItemCustom } from '../ComboBoxItemCustom';
 import * as ComponentStories from './ComboBox.stories';
 import { excludePropsForAbstract } from '@sb/utils';
 
@@ -35,6 +36,10 @@ All available filter types controlled by the `filter` prop.
 
 <Canvas of={ComponentStories.WithGroups} />
 
+## ComboBox with ComboBoxItemCustom
+
+<Canvas of={ComponentStories.WithCustomItems} />
+
 <Markdown>{SubcomponentsSection}</Markdown>
 
 ## ComboBoxItem
@@ -42,6 +47,11 @@ All available filter types controlled by the `filter` prop.
 <Description of={ComboBoxItem} />
 <ArgTypesWithNote metaOf={ComponentStories} hideHTMLPropsNote exclude={excludePropsForAbstract} of={ComboBoxItem} />
 
+## ComboBoxItemCustom
+
+<Description of={ComboBoxItemCustom} />
+<ArgTypesWithNote metaOf={ComponentStories} hideHTMLPropsNote exclude={excludePropsForAbstract} of={ComboBoxItemCustom} />
+
 ## ComboBoxItemGroup
 
 <Description of={ComboBoxItemGroup} />
diff --git a/packages/main/src/webComponents/ComboBox/ComboBox.stories.tsx b/packages/main/src/webComponents/ComboBox/ComboBox.stories.tsx
index afcbc12e661..038f7fa43c0 100644
--- a/packages/main/src/webComponents/ComboBox/ComboBox.stories.tsx
+++ b/packages/main/src/webComponents/ComboBox/ComboBox.stories.tsx
@@ -4,6 +4,7 @@ import employeeIcon from '@ui5/webcomponents-icons/dist/employee.js';
 import { FlexBox } from '../../components/FlexBox/index.js';
 import { FlexBoxDirection, FlexBoxJustifyContent } from '../../enums/index.js';
 import { ComboBoxItem } from '../ComboBoxItem/index.js';
+import { ComboBoxItemCustom } from '../ComboBoxItemCustom/index.js';
 import { ComboBoxItemGroup } from '../ComboBoxItemGroup/index.js';
 import { Icon } from '../Icon/index.js';
 import { Label } from '../Label/index.js';
@@ -60,6 +61,34 @@ export const WithGroups: Story = {
   },
 };
 
+export const WithCustomItems: Story = {
+  name: 'ComboBoxItemCustom',
+  render(args) {
+    return (
+      <ComboBox {...args}>
+        <ComboBoxItemCustom text="Austria">
+          <FlexBox justifyContent={FlexBoxJustifyContent.SpaceBetween} style={{ width: '100%' }}>
+            <Label>Austria</Label>
+            <Label>AT</Label>
+          </FlexBox>
+        </ComboBoxItemCustom>
+        <ComboBoxItemCustom text="Germany">
+          <FlexBox justifyContent={FlexBoxJustifyContent.SpaceBetween} style={{ width: '100%' }}>
+            <Label>Germany</Label>
+            <Label>DE</Label>
+          </FlexBox>
+        </ComboBoxItemCustom>
+        <ComboBoxItemCustom text="Switzerland">
+          <FlexBox justifyContent={FlexBoxJustifyContent.SpaceBetween} style={{ width: '100%' }}>
+            <Label>Switzerland</Label>
+            <Label>CH</Label>
+          </FlexBox>
+        </ComboBoxItemCustom>
+      </ComboBox>
+    );
+  },
+};
+
 export const FilterTypes: Story = {
   render: () => {
     return (
diff --git a/packages/main/src/webComponents/ComboBox/index.tsx b/packages/main/src/webComponents/ComboBox/index.tsx
index 3905fb5a952..2a379dc302c 100644
--- a/packages/main/src/webComponents/ComboBox/index.tsx
+++ b/packages/main/src/webComponents/ComboBox/index.tsx
@@ -229,6 +229,8 @@ interface ComboBoxPropTypes
   /**
    * Fired when selection is changed by user interaction
    *
+   * **Note:** Available since [v2.24.0](https://github.com/UI5/webcomponents/releases/tag/v2.24.0) of **@ui5/webcomponents**.
+   *
    * | cancelable | bubbles |
    * | :--------: | :-----: |
    * | ❌|✅|
diff --git a/packages/main/src/webComponents/ComboBoxItemCustom/index.tsx b/packages/main/src/webComponents/ComboBoxItemCustom/index.tsx
new file mode 100644
index 00000000000..96ddf2b2a0b
--- /dev/null
+++ b/packages/main/src/webComponents/ComboBoxItemCustom/index.tsx
@@ -0,0 +1,70 @@
+'use client';
+
+import '@ui5/webcomponents/dist/ComboBoxItemCustom.js';
+import type { ComboBoxItemCustomClickEventDetail } from '@ui5/webcomponents/dist/ComboBoxItemCustom.js';
+import { withWebComponent } from '@ui5/webcomponents-react-base';
+import type { CommonProps, Ui5CustomEvent, Ui5DomRef } from '@ui5/webcomponents-react-base';
+import type { ReactNode } from 'react';
+
+interface ComboBoxItemCustomAttributes {
+  /**
+   * Defines the text of the component.
+   * Used for filtering, autocomplete, and mobile rendering.
+   * @default undefined
+   */
+  text?: string | undefined;
+
+  /**
+   * Defines the value of the component.
+   * Used for programmatic selection via the `selectedValue` property.
+   * @default undefined
+   */
+  value?: string | undefined;
+}
+
+interface ComboBoxItemCustomDomRef extends Required<ComboBoxItemCustomAttributes>, Ui5DomRef {}
+
+interface ComboBoxItemCustomPropTypes
+  extends ComboBoxItemCustomAttributes, Omit<CommonProps, keyof ComboBoxItemCustomAttributes | 'children' | 'onClick'> {
+  /**
+   * Defines the content of the component.
+   *
+   * __Supported Node Type/s:__ `Array<Node>`
+   */
+  children?: ReactNode | ReactNode[];
+  /**
+   * Fired when the component is activated either with a mouse/tap or by using the Enter or Space key.
+   *
+   * **Note:** The event will not be fired if the `disabled` property is set to `true`.
+   *
+   * **Note:** Available since [v2.24.0](https://github.com/UI5/webcomponents/releases/tag/v2.24.0) of **@ui5/webcomponents**.
+   *
+   * | cancelable | bubbles |
+   * | :--------: | :-----: |
+   * | ❌|✅|
+   */
+  onClick?: (event: Ui5CustomEvent<ComboBoxItemCustomDomRef, ComboBoxItemCustomClickEventDetail>) => void;
+}
+
+/**
+ * The `ComboBoxItemCustom` is a combobox item component
+ * that allows placing custom content inside a combobox item.
+ * The `text` property is used for filtering and auto-complete.
+ * For highlighting functionality, see `@ui5/webcomponents-base/dist/util/generateHighlightedMarkup.js`.
+ *
+ * __Note:__ This is a UI5 Web Component! [ComboBoxItemCustom UI5 Web Component Documentation](https://ui5.github.io/webcomponents/components/ComboBoxItemCustom) | [Repository](https://github.com/UI5/webcomponents)
+ *
+ * @since [2.24.0](https://github.com/UI5/webcomponents/releases/tag/v2.24.0) of __@ui5/webcomponents__.
+ */
+const ComboBoxItemCustom = withWebComponent<ComboBoxItemCustomPropTypes, ComboBoxItemCustomDomRef>(
+  'ui5-cb-item-custom',
+  ['text', 'value'],
+  [],
+  [],
+  ['click'],
+);
+
+ComboBoxItemCustom.displayName = 'ComboBoxItemCustom';
+
+export { ComboBoxItemCustom };
+export type { ComboBoxItemCustomDomRef, ComboBoxItemCustomPropTypes };
diff --git a/packages/main/src/webComponents/Dialog/index.tsx b/packages/main/src/webComponents/Dialog/index.tsx
index 1d969046f9e..39bd2d0df5e 100644
--- a/packages/main/src/webComponents/Dialog/index.tsx
+++ b/packages/main/src/webComponents/Dialog/index.tsx
@@ -259,14 +259,14 @@ interface DialogPropTypes
  * ### Keyboard Handling
  *
  * #### Basic Navigation
- * When the `Dialog` has the `draggable` property set to `true` and the header is focused, the user can move the dialog
+ * When the `Dialog` has the `draggable` property set to `true`, the user can move the dialog
  * with the following keyboard shortcuts:
  *
  * - [Up] or [Down] arrow keys - Move the dialog up/down.
  * - [Left] or [Right] arrow keys - Move the dialog left/right.
  *
  * #### Resizing
- * When the `Dialog` has the `resizable` property set to `true` and the header is focused, the user can change the size of the dialog
+ * When the `Dialog` has the `resizable` property set to `true`, the user can change the size of the dialog
  * with the following keyboard shortcuts:
  *
  * - [Shift] + [Up] or [Down] - Decrease/Increase the height of the dialog.
diff --git a/packages/main/src/webComponents/DynamicPage/DynamicPage.mdx b/packages/main/src/webComponents/DynamicPage/DynamicPage.mdx
index 967a1a19786..53742a4b58c 100644
--- a/packages/main/src/webComponents/DynamicPage/DynamicPage.mdx
+++ b/packages/main/src/webComponents/DynamicPage/DynamicPage.mdx
@@ -29,7 +29,7 @@ This example shows how you could achieve this behavior by applying custom CSS an
 These are the key points of this implementation:
 
 - Using the `part` pseudo-element selector to set the `fit-content` part to use `position: static;`.
-- Adding a `ResizeObserver` to measure the `header` element inside the shadow root of the component.
+- Adding a `ResizeObserver` to measure the title/header wrapper (`.ui5-dynamic-page-title-header-wrapper`) inside the shadow root of the component.
 - Waiting for the custom element to be defined and for the `shadowRoot` to be populated.
 
 ### Code
@@ -41,6 +41,8 @@ These are the key points of this implementation:
 ```
 
 ```tsx
+const HEADER_SELECTOR = '.ui5-dynamic-page-title-header-wrapper';
+
 const useGetHeaderHeight = (dynamicPageRef: RefObject<DynamicPageDomRef & { shadowRoot: ShadowRoot }>) => {
   const [headerHeight, setHeaderHeight] = useState<undefined | number>(undefined);
   useEffect(() => {
@@ -54,7 +56,7 @@ const useGetHeaderHeight = (dynamicPageRef: RefObject<DynamicPageDomRef & { shad
 
         // wait for the shadowRoot to be populated
         const shadowRootObserver = new MutationObserver(() => {
-          const header = shadowRoot.querySelector('header');
+          const header = shadowRoot.querySelector(HEADER_SELECTOR);
           if (header) {
             shadowRootObserver.disconnect();
             headerObserver.observe(header);
@@ -62,7 +64,7 @@ const useGetHeaderHeight = (dynamicPageRef: RefObject<DynamicPageDomRef & { shad
         });
 
         if (shadowRoot && shadowRoot.childElementCount) {
-          headerObserver.observe(shadowRoot.querySelector('header'));
+          headerObserver.observe(shadowRoot.querySelector(HEADER_SELECTOR));
         } else {
           shadowRootObserver.observe(shadowRoot, { childList: true });
         }
diff --git a/packages/main/src/webComponents/DynamicPage/helpers.ts b/packages/main/src/webComponents/DynamicPage/helpers.ts
index 6331df8a4b0..08d6b7e3449 100644
--- a/packages/main/src/webComponents/DynamicPage/helpers.ts
+++ b/packages/main/src/webComponents/DynamicPage/helpers.ts
@@ -2,6 +2,8 @@ import type { RefObject } from 'react';
 import { useEffect, useState } from 'react';
 import type { DynamicPageDomRef } from './index.js';
 
+const HEADER_SELECTOR = '.ui5-dynamic-page-title-header-wrapper';
+
 export const useGetHeaderHeight = (dynamicPageRef: RefObject<DynamicPageDomRef & { shadowRoot: ShadowRoot }>) => {
   const [headerHeight, setHeaderHeight] = useState<undefined | number>(undefined);
   useEffect(() => {
@@ -15,7 +17,7 @@ export const useGetHeaderHeight = (dynamicPageRef: RefObject<DynamicPageDomRef &
 
         // wait for the shadowRoot to be populated
         const shadowRootObserver = new MutationObserver(() => {
-          const header = shadowRoot.querySelector('header');
+          const header = shadowRoot.querySelector(HEADER_SELECTOR);
           if (header) {
             shadowRootObserver.disconnect();
             headerObserver.observe(header);
@@ -23,7 +25,7 @@ export const useGetHeaderHeight = (dynamicPageRef: RefObject<DynamicPageDomRef &
         });
 
         if (shadowRoot && shadowRoot.childElementCount) {
-          headerObserver.observe(shadowRoot.querySelector('header'));
+          headerObserver.observe(shadowRoot.querySelector(HEADER_SELECTOR));
         } else {
           shadowRootObserver.observe(shadowRoot, { childList: true });
         }
diff --git a/packages/main/src/webComponents/DynamicPage/index.tsx b/packages/main/src/webComponents/DynamicPage/index.tsx
index 144b4e1f991..5445bab640e 100644
--- a/packages/main/src/webComponents/DynamicPage/index.tsx
+++ b/packages/main/src/webComponents/DynamicPage/index.tsx
@@ -1,11 +1,40 @@
 'use client';
 
 import '@ui5/webcomponents-fiori/dist/DynamicPage.js';
+import type { DynamicPageAccessibilityAttributes } from '@ui5/webcomponents-fiori/dist/DynamicPage.js';
 import { withWebComponent } from '@ui5/webcomponents-react-base';
 import type { CommonProps, Ui5CustomEvent, Ui5DomRef, UI5WCSlotsNode } from '@ui5/webcomponents-react-base';
 import type { ReactNode } from 'react';
 
 interface DynamicPageAttributes {
+  /**
+   * Defines additional accessibility attributes on different areas of the component.
+   *
+   * The accessibilityAttributes object has the following fields,
+   * where each field is an object supporting one or more accessibility attributes:
+   *
+   *  - **root**: `root.role` and `root.name`.
+   *  - **header**: `header.role` and `header.name`.
+   *  - **content**: `content.role` and `content.name`.
+   *  - **footer**: `footer.role` and `footer.name`.
+   *
+   * The accessibility attributes support the following values:
+   *
+   * - **role**: Defines the accessible ARIA landmark role of the area.
+   * Accepts the following values per section:
+   * `root` — `none`, `main`, `region`;
+   * `header` — `none`, `banner`, `region`;
+   * `content` — `none`, `main`, `region`, `form`;
+   * `footer` — `none`, `contentinfo`, `region`.
+   *
+   * - **name**: Defines the accessible ARIA name of the area.
+   * Accepts any string.
+   *
+   * **Note:** Available since [v2.24.0](https://github.com/UI5/webcomponents/releases/tag/v2.24.0) of **@ui5/webcomponents-fiori**.
+   * @default {}
+   */
+  accessibilityAttributes?: DynamicPageAccessibilityAttributes;
+
   /**
    * Defines if the header is pinned.
    * @default false
@@ -163,7 +192,7 @@ interface DynamicPagePropTypes
  */
 const DynamicPage = withWebComponent<DynamicPagePropTypes, DynamicPageDomRef>(
   'ui5-dynamic-page',
-  [],
+  ['accessibilityAttributes'],
   ['headerPinned', 'headerSnapped', 'hidePinButton', 'showFooter'],
   ['footerArea', 'headerArea', 'titleArea'],
   ['pin-button-toggle', 'title-toggle'],
diff --git a/packages/main/src/webComponents/DynamicPageHeader/index.tsx b/packages/main/src/webComponents/DynamicPageHeader/index.tsx
index 46ac71141c0..e01498bc865 100644
--- a/packages/main/src/webComponents/DynamicPageHeader/index.tsx
+++ b/packages/main/src/webComponents/DynamicPageHeader/index.tsx
@@ -5,11 +5,21 @@ import { withWebComponent } from '@ui5/webcomponents-react-base';
 import type { CommonProps, Ui5DomRef } from '@ui5/webcomponents-react-base';
 import type { ReactNode } from 'react';
 
-interface DynamicPageHeaderAttributes {}
+interface DynamicPageHeaderAttributes {
+  /**
+   * Defines the accessible ARIA label for the header region.
+   * Overrides the default "Header Expanded" / "Header Snapped" text.
+   *
+   * **Note:** Available since [v2.24.0](https://github.com/UI5/webcomponents/releases/tag/v2.24.0) of **@ui5/webcomponents-fiori**.
+   * @default undefined
+   */
+  accessibleName?: string | undefined;
+}
 
 interface DynamicPageHeaderDomRef extends Required<DynamicPageHeaderAttributes>, Ui5DomRef {}
 
-interface DynamicPageHeaderPropTypes extends DynamicPageHeaderAttributes, Omit<CommonProps, 'children'> {
+interface DynamicPageHeaderPropTypes
+  extends DynamicPageHeaderAttributes, Omit<CommonProps, keyof DynamicPageHeaderAttributes | 'children'> {
   /**
    * Defines the content of the Dynamic Page Header.
    *
@@ -47,7 +57,7 @@ interface DynamicPageHeaderPropTypes extends DynamicPageHeaderAttributes, Omit<C
  */
 const DynamicPageHeader = withWebComponent<DynamicPageHeaderPropTypes, DynamicPageHeaderDomRef>(
   'ui5-dynamic-page-header',
-  [],
+  ['accessibleName'],
   [],
   [],
   [],
diff --git a/packages/main/src/webComponents/MultiComboBox/MultiComboBox.mdx b/packages/main/src/webComponents/MultiComboBox/MultiComboBox.mdx
index 1eace59546a..b12e8af456d 100644
--- a/packages/main/src/webComponents/MultiComboBox/MultiComboBox.mdx
+++ b/packages/main/src/webComponents/MultiComboBox/MultiComboBox.mdx
@@ -4,6 +4,7 @@ import { Canvas, Description, Markdown, Meta } from '@storybook/addon-docs/block
 import { MultiComboBoxItemGroup } from '../MultiComboBoxItemGroup';
 import { Token } from '../Token';
 import { MultiComboBoxItem } from '../MultiComboBoxItem';
+import { MultiComboBoxItemCustom } from '../MultiComboBoxItemCustom';
 import * as ComponentStories from './MultiComboBox.stories';
 import { excludePropsForAbstract } from '@sb/utils';
 
@@ -27,6 +28,10 @@ import { excludePropsForAbstract } from '@sb/utils';
 
 <Canvas of={ComponentStories.Grouping} />
 
+## MultiComboBox with MultiComboBoxItemCustom
+
+<Canvas of={ComponentStories.WithCustomItems} />
+
 <Markdown>{SubcomponentsSection}</Markdown>
 
 ## MultiComboBoxItem
@@ -34,6 +39,11 @@ import { excludePropsForAbstract } from '@sb/utils';
 <Description of={MultiComboBoxItem} />
 <ArgTypesWithNote metaOf={ComponentStories} hideHTMLPropsNote exclude={excludePropsForAbstract} of={MultiComboBoxItem} />
 
+## MultiComboBoxItemCustom
+
+<Description of={MultiComboBoxItemCustom} />
+<ArgTypesWithNote metaOf={ComponentStories} hideHTMLPropsNote exclude={excludePropsForAbstract} of={MultiComboBoxItemCustom} />
+
 ## MultiComboBoxItemGroup
 
 <Description of={MultiComboBoxItemGroup} />
diff --git a/packages/main/src/webComponents/MultiComboBox/MultiComboBox.stories.tsx b/packages/main/src/webComponents/MultiComboBox/MultiComboBox.stories.tsx
index 684c78d8f9a..f63b0fc6064 100644
--- a/packages/main/src/webComponents/MultiComboBox/MultiComboBox.stories.tsx
+++ b/packages/main/src/webComponents/MultiComboBox/MultiComboBox.stories.tsx
@@ -1,6 +1,10 @@
 import type { Meta, StoryObj } from '@storybook/react-vite';
 import ValueState from '@ui5/webcomponents-base/dist/types/ValueState.js';
+import { FlexBox } from '../../components/FlexBox/index.js';
+import { FlexBoxJustifyContent } from '../../enums/index.js';
+import { Label } from '../Label/index.js';
 import { MultiComboBoxItem } from '../MultiComboBoxItem/index.js';
+import { MultiComboBoxItemCustom } from '../MultiComboBoxItemCustom/index.js';
 import { MultiComboBoxItemGroup } from '../MultiComboBoxItemGroup/index.js';
 import { MultiComboBox } from './index.js';
 
@@ -35,6 +39,34 @@ export const Default: Story = {
   },
 };
 
+export const WithCustomItems: Story = {
+  name: 'MultiComboBoxItemCustom',
+  render: (args) => {
+    return (
+      <MultiComboBox {...args}>
+        <MultiComboBoxItemCustom text="Austria">
+          <FlexBox justifyContent={FlexBoxJustifyContent.SpaceBetween} style={{ width: '100%' }}>
+            <Label>Austria</Label>
+            <Label>AT</Label>
+          </FlexBox>
+        </MultiComboBoxItemCustom>
+        <MultiComboBoxItemCustom text="Germany">
+          <FlexBox justifyContent={FlexBoxJustifyContent.SpaceBetween} style={{ width: '100%' }}>
+            <Label>Germany</Label>
+            <Label>DE</Label>
+          </FlexBox>
+        </MultiComboBoxItemCustom>
+        <MultiComboBoxItemCustom text="Switzerland">
+          <FlexBox justifyContent={FlexBoxJustifyContent.SpaceBetween} style={{ width: '100%' }}>
+            <Label>Switzerland</Label>
+            <Label>CH</Label>
+          </FlexBox>
+        </MultiComboBoxItemCustom>
+      </MultiComboBox>
+    );
+  },
+};
+
 export const Grouping: Story = {
   render: (args) => {
     return (
diff --git a/packages/main/src/webComponents/MultiComboBoxItemCustom/index.tsx b/packages/main/src/webComponents/MultiComboBoxItemCustom/index.tsx
new file mode 100644
index 00000000000..86e464fd18f
--- /dev/null
+++ b/packages/main/src/webComponents/MultiComboBoxItemCustom/index.tsx
@@ -0,0 +1,72 @@
+'use client';
+
+import '@ui5/webcomponents/dist/MultiComboBoxItemCustom.js';
+import type { MultiComboBoxItemCustomClickEventDetail } from '@ui5/webcomponents/dist/MultiComboBoxItemCustom.js';
+import { withWebComponent } from '@ui5/webcomponents-react-base';
+import type { CommonProps, Ui5CustomEvent, Ui5DomRef } from '@ui5/webcomponents-react-base';
+import type { ReactNode } from 'react';
+
+interface MultiComboBoxItemCustomAttributes {
+  /**
+   * Defines the text of the component.
+   * Used for filtering and token display.
+   * @default undefined
+   */
+  text?: string | undefined;
+
+  /**
+   * Defines the value of the component.
+   * Used for programmatic selection via selectedValues property.
+   * @default undefined
+   */
+  value?: string | undefined;
+}
+
+interface MultiComboBoxItemCustomDomRef extends Required<MultiComboBoxItemCustomAttributes>, Ui5DomRef {}
+
+interface MultiComboBoxItemCustomPropTypes
+  extends
+    MultiComboBoxItemCustomAttributes,
+    Omit<CommonProps, keyof MultiComboBoxItemCustomAttributes | 'children' | 'onClick'> {
+  /**
+   * Defines the content of the component.
+   *
+   * __Supported Node Type/s:__ `Array<Node>`
+   */
+  children?: ReactNode | ReactNode[];
+  /**
+   * Fired when the component is activated either with a mouse/tap or by using the Enter or Space key.
+   *
+   * **Note:** The event will not be fired if the `disabled` property is set to `true`.
+   *
+   * **Note:** Available since [v2.24.0](https://github.com/UI5/webcomponents/releases/tag/v2.24.0) of **@ui5/webcomponents**.
+   *
+   * | cancelable | bubbles |
+   * | :--------: | :-----: |
+   * | ❌|✅|
+   */
+  onClick?: (event: Ui5CustomEvent<MultiComboBoxItemCustomDomRef, MultiComboBoxItemCustomClickEventDetail>) => void;
+}
+
+/**
+ * The `MultiComboBoxItemCustom` is a multi-combobox item component
+ * that allows placing custom content inside a multi-combobox item.
+ * The `text` property is used for filtering and token display.
+ * For highlighting functionality, see `@ui5/webcomponents-base/dist/util/generateHighlightedMarkup.js`.
+ *
+ * __Note:__ This is a UI5 Web Component! [MultiComboBoxItemCustom UI5 Web Component Documentation](https://ui5.github.io/webcomponents/components/MultiComboBoxItemCustom) | [Repository](https://github.com/UI5/webcomponents)
+ *
+ * @since [2.24.0](https://github.com/UI5/webcomponents/releases/tag/v2.24.0) of __@ui5/webcomponents__.
+ */
+const MultiComboBoxItemCustom = withWebComponent<MultiComboBoxItemCustomPropTypes, MultiComboBoxItemCustomDomRef>(
+  'ui5-mcb-item-custom',
+  ['text', 'value'],
+  [],
+  [],
+  ['click'],
+);
+
+MultiComboBoxItemCustom.displayName = 'MultiComboBoxItemCustom';
+
+export { MultiComboBoxItemCustom };
+export type { MultiComboBoxItemCustomDomRef, MultiComboBoxItemCustomPropTypes };
diff --git a/packages/main/src/webComponents/Timeline/index.tsx b/packages/main/src/webComponents/Timeline/index.tsx
index 3794a50c6bc..af49c512f97 100644
--- a/packages/main/src/webComponents/Timeline/index.tsx
+++ b/packages/main/src/webComponents/Timeline/index.tsx
@@ -4,7 +4,7 @@ import '@ui5/webcomponents-fiori/dist/Timeline.js';
 import type TimelineGrowingMode from '@ui5/webcomponents-fiori/dist/types/TimelineGrowingMode.js';
 import type TimelineLayout from '@ui5/webcomponents-fiori/dist/types/TimelineLayout.js';
 import { withWebComponent } from '@ui5/webcomponents-react-base';
-import type { CommonProps, Ui5CustomEvent, Ui5DomRef } from '@ui5/webcomponents-react-base';
+import type { CommonProps, Ui5CustomEvent, Ui5DomRef, UI5WCSlotsNode } from '@ui5/webcomponents-react-base';
 import type { ReactNode } from 'react';
 
 interface TimelineAttributes {
@@ -52,18 +52,66 @@ interface TimelineAttributes {
    * @default 1000
    */
   loadingDelay?: number;
+
+  /**
+   * Defines whether the content of the `header` and `infoBar` slots remains visible when the user scrolls the Timeline.
+   *
+   * **Note:** The bars pin to the Timeline's own scrollport. Give the Timeline a
+   * constrained height (for example `style="height: 32rem"`) so its items scroll
+   * inside it. Placing the Timeline inside an externally scrolling ancestor while
+   * leaving the Timeline itself unsized is not supported in this mode — the bars
+   * will scroll away with the ancestor.
+   *
+   * **Note:** Available since [v2.24.0](https://github.com/UI5/webcomponents/releases/tag/v2.24.0) of **@ui5/webcomponents-fiori**.
+   * @default false
+   */
+  stickyHeader?: boolean;
 }
 
 interface TimelineDomRef extends Required<TimelineAttributes>, Ui5DomRef {}
 
 interface TimelinePropTypes
-  extends TimelineAttributes, Omit<CommonProps, keyof TimelineAttributes | 'children' | 'onLoadMore'> {
+  extends
+    TimelineAttributes,
+    Omit<CommonProps, keyof TimelineAttributes | 'children' | 'header' | 'infoBar' | 'onLoadMore'> {
   /**
    * Determines the content of the `Timeline`.
    *
    * __Supported Node Type/s:__ `Array<ITimelineItem>`
    */
   children?: ReactNode | ReactNode[];
+
+  /**
+   * Defines the content of the Timeline's header area, displayed above the items.
+   * Typically a `ui5-toolbar` with search, sort, and filter controls.
+   *
+   * __Note:__ The content of the prop will be rendered into a [&lt;slot&gt;](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/slot) by assigning the respective [slot](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/slot) attribute (`slot="header"`).
+   * Since you can't change the DOM order of slots when declaring them within a prop, it might prove beneficial to manually mount them as part of the component's children, especially when facing problems with the reading order of screen readers.
+   *
+   * __Note:__ When passing a custom React component to this prop, you have to make sure your component reads the `slot` prop and appends it to the most outer element of your component.
+   * Learn more about it [here](https://ui5.github.io/webcomponents-react/v2/?path=/docs/knowledge-base-handling-slots--docs).
+   *
+   * **Note:** Available since [v2.24.0](https://github.com/UI5/webcomponents/releases/tag/v2.24.0) of **@ui5/webcomponents-fiori**.
+   *
+   * __Supported Node Type/s:__ `Array<HTMLElement>`
+   */
+  header?: UI5WCSlotsNode;
+
+  /**
+   * Defines the content of the Timeline's info bar area, displayed below the header
+   * and above the items. Use for status display (applied filters, sort direction, counts).
+   *
+   * __Note:__ The content of the prop will be rendered into a [&lt;slot&gt;](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/slot) by assigning the respective [slot](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/slot) attribute (`slot="infoBar"`).
+   * Since you can't change the DOM order of slots when declaring them within a prop, it might prove beneficial to manually mount them as part of the component's children, especially when facing problems with the reading order of screen readers.
+   *
+   * __Note:__ When passing a custom React component to this prop, you have to make sure your component reads the `slot` prop and appends it to the most outer element of your component.
+   * Learn more about it [here](https://ui5.github.io/webcomponents-react/v2/?path=/docs/knowledge-base-handling-slots--docs).
+   *
+   * **Note:** Available since [v2.24.0](https://github.com/UI5/webcomponents/releases/tag/v2.24.0) of **@ui5/webcomponents-fiori**.
+   *
+   * __Supported Node Type/s:__ `Array<HTMLElement>`
+   */
+  infoBar?: UI5WCSlotsNode;
   /**
    * Fired when the user presses the `More` button or scrolls to the Timeline's end.
    *
@@ -85,13 +133,30 @@ interface TimelinePropTypes
  * There are two distinct variants of the timeline: basic and social. The basic timeline is read-only,
  * while the social timeline offers a high level of interaction and collaboration, and is integrated within SAP Jam.
  *
+ * ### Header and Info Bar Slots
+ *
+ * The Timeline exposes two named slots above the items area:
+ *
+ * - `header` — for a controls bar (search field, filter trigger, sort toggle, etc.).
+ * The most common pattern is to place a `ui5-toolbar` containing a search input and buttons that open
+ * a filter dialog or toggle sort direction. The Timeline itself performs no filtering, sorting, or
+ * searching — the application listens for events from its own controls and reorders, hides, or
+ * adds items in the default slot accordingly.
+ *
+ * - `infoBar` — for a status bar that reflects the result of the controls (active filters,
+ * applied sort, current search query). Typically contains tokens, labels, or a `ui5-bar`.
+ *
+ * The Timeline itself does not filter, sort, or search — the application owns that logic.
+ * Use `stickyHeader` to pin both bars while the Timeline's items scroll. Give the Timeline
+ * a constrained height in this mode so it owns its scrollbar.
+ *
  * __Note:__ This is a UI5 Web Component! [Timeline UI5 Web Component Documentation](https://ui5.github.io/webcomponents/components/fiori/Timeline) | [Repository](https://github.com/UI5/webcomponents)
  */
 const Timeline = withWebComponent<TimelinePropTypes, TimelineDomRef>(
   'ui5-timeline',
   ['accessibleName', 'growing', 'layout', 'loadingDelay'],
-  ['loading'],
-  [],
+  ['loading', 'stickyHeader'],
+  ['header', 'infoBar'],
   ['load-more'],
 );
 
diff --git a/packages/main/src/webComponents/UserMenu/index.tsx b/packages/main/src/webComponents/UserMenu/index.tsx
index 0a77c44954f..76abbb7f2aa 100644
--- a/packages/main/src/webComponents/UserMenu/index.tsx
+++ b/packages/main/src/webComponents/UserMenu/index.tsx
@@ -10,6 +10,20 @@ import type { CommonProps, Ui5CustomEvent, Ui5DomRef, UI5WCSlotsNode } from '@ui
 import type { ReactNode } from 'react';
 
 interface UserMenuAttributes {
+  /**
+   * Defines whether the avatar of the selected account is interactive (focusable and pressable).
+   *
+   * When `false` (default), the avatar is rendered as a non-interactive image
+   * and is not announced as a button by screen readers.
+   *
+   * **Note:** When `showEditButton` is set to `true`, the avatar is treated as interactive
+   * regardless of this property's value, to preserve the edit affordance.
+   *
+   * **Note:** Available since [v2.25.0](https://github.com/UI5/webcomponents/releases/tag/v2.25.0) of **@ui5/webcomponents-fiori**.
+   * @default false
+   */
+  avatarInteractive?: boolean;
+
   /**
    * Defines if the User Menu is opened.
    * @default false
@@ -62,6 +76,7 @@ interface UserMenuPropTypes
       | 'accounts'
       | 'children'
       | 'footer'
+      | 'infoArea'
       | 'onAvatarClick'
       | 'onChangeAccount'
       | 'onClose'
@@ -110,6 +125,23 @@ interface UserMenuPropTypes
    * __Supported Node Type/s:__ `Array<HTMLElement>`
    */
   footer?: UI5WCSlotsNode;
+
+  /**
+   * Defines the content of the info area inside the User Menu's account block.
+   *
+   * **Note:** When empty, the User Menu renders unchanged.
+   *
+   * __Note:__ The content of the prop will be rendered into a [&lt;slot&gt;](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/slot) by assigning the respective [slot](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/slot) attribute (`slot="infoArea"`).
+   * Since you can't change the DOM order of slots when declaring them within a prop, it might prove beneficial to manually mount them as part of the component's children, especially when facing problems with the reading order of screen readers.
+   *
+   * __Note:__ When passing a custom React component to this prop, you have to make sure your component reads the `slot` prop and appends it to the most outer element of your component.
+   * Learn more about it [here](https://ui5.github.io/webcomponents-react/v2/?path=/docs/knowledge-base-handling-slots--docs).
+   *
+   * **Note:** Available since [v2.24.0](https://github.com/UI5/webcomponents/releases/tag/v2.24.0) of **@ui5/webcomponents-fiori**.
+   *
+   * __Supported Node Type/s:__ `Array<HTMLElement>`
+   */
+  infoArea?: UI5WCSlotsNode;
   /**
    * Fired when the account avatar is selected.
    *
@@ -210,8 +242,8 @@ interface UserMenuPropTypes
 const UserMenu = withWebComponent<UserMenuPropTypes, UserMenuDomRef>(
   'ui5-user-menu',
   ['opener'],
-  ['open', 'showEditAccounts', 'showEditButton', 'showManageAccount', 'showOtherAccounts'],
-  ['accounts', 'footer'],
+  ['avatarInteractive', 'open', 'showEditAccounts', 'showEditButton', 'showManageAccount', 'showOtherAccounts'],
+  ['accounts', 'footer', 'infoArea'],
   [
     'avatar-click',
     'change-account',
diff --git a/packages/main/src/webComponents/index.ts b/packages/main/src/webComponents/index.ts
index 1319be3ddba..0ad9defab07 100644
--- a/packages/main/src/webComponents/index.ts
+++ b/packages/main/src/webComponents/index.ts
@@ -23,6 +23,7 @@ export * from './ColorPalettePopover/index.js';
 export * from './ColorPicker/index.js';
 export * from './ComboBox/index.js';
 export * from './ComboBoxItem/index.js';
+export * from './ComboBoxItemCustom/index.js';
 export * from './ComboBoxItemGroup/index.js';
 export * from './DatePicker/index.js';
 export * from './DateRangePicker/index.js';
@@ -61,6 +62,7 @@ export * from './MenuSeparator/index.js';
 export * from './MessageStrip/index.js';
 export * from './MultiComboBox/index.js';
 export * from './MultiComboBoxItem/index.js';
+export * from './MultiComboBoxItemCustom/index.js';
 export * from './MultiComboBoxItemGroup/index.js';
 export * from './MultiInput/index.js';
 export * from './NavigationLayout/index.js';
diff --git a/packages/mcp-server/src/utils/component-config.ts b/packages/mcp-server/src/utils/component-config.ts
index 79df7398f07..6888bd2d083 100644
--- a/packages/mcp-server/src/utils/component-config.ts
+++ b/packages/mcp-server/src/utils/component-config.ts
@@ -88,6 +88,7 @@ export const WEB_COMPONENT_CATEGORIES = {
     'ColorPicker',
     'ComboBox',
     'ComboBoxItem',
+    'ComboBoxItemCustom',
     'ComboBoxItemGroup',
     'DatePicker',
     'DateRangePicker',
@@ -97,6 +98,7 @@ export const WEB_COMPONENT_CATEGORIES = {
     'Input',
     'MultiComboBox',
     'MultiComboBoxItem',
+    'MultiComboBoxItemCustom',
     'MultiComboBoxItemGroup',
     'MultiInput',
     'ProductSwitch',
diff --git a/yarn.lock b/yarn.lock
index c770540dc33..d6c1658f97a 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -4182,10 +4182,10 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@sap-theming/theming-base-content@npm:11.36.3":
-  version: 11.36.3
-  resolution: "@sap-theming/theming-base-content@npm:11.36.3"
-  checksum: 10c0/5b0e6287a8e0f3c8c12be5e2b2f0b9be6aafce19f99d6a96d30e71070573893fac663ba573c1406122d07e1dfb40533b1c9fea04ec9df246aa5b00d9d1abd67f
+"@sap-theming/theming-base-content@npm:11.36.4":
+  version: 11.36.4
+  resolution: "@sap-theming/theming-base-content@npm:11.36.4"
+  checksum: 10c0/cb12afcde87e2b96da7b967841972538511b34895b4423886935fb8f9c0601647b794aa698e650cf936e473495b016f489abc675c43fc0742ef97c483bae933c
   languageName: node
   linkType: hard
 
@@ -5666,26 +5666,26 @@ __metadata:
   dependencies:
     "@ui5/webcomponents-react-base": "workspace:~"
   peerDependencies:
-    "@ui5/webcomponents-ai": ~2.23.0
+    "@ui5/webcomponents-ai": ~2.24.0
     react: ^18 || ^19
   languageName: unknown
   linkType: soft
 
-"@ui5/webcomponents-ai@npm:2.23.2":
-  version: 2.23.2
-  resolution: "@ui5/webcomponents-ai@npm:2.23.2"
+"@ui5/webcomponents-ai@npm:2.24.0":
+  version: 2.24.0
+  resolution: "@ui5/webcomponents-ai@npm:2.24.0"
   dependencies:
-    "@ui5/webcomponents": "npm:2.23.2"
-    "@ui5/webcomponents-base": "npm:2.23.2"
-    "@ui5/webcomponents-icons": "npm:2.23.2"
-    "@ui5/webcomponents-theming": "npm:2.23.2"
-  checksum: 10c0/066f03731438ffd4989cdf44581da0fada43242baca862606daf65d1f91fb12bfc8b2724f20bc96f0bd0cb45f6d6784d44b0a0f8b27ad3fafbae45805f1141fc
+    "@ui5/webcomponents": "npm:2.24.0"
+    "@ui5/webcomponents-base": "npm:2.24.0"
+    "@ui5/webcomponents-icons": "npm:2.24.0"
+    "@ui5/webcomponents-theming": "npm:2.24.0"
+  checksum: 10c0/f2e7a66bb209e392b5035c76b11ee6dfc01b5f6b2516d80b8ec87265bf864f550f62b8df1511f88a6966e49623e8dff91ddf72e12189f91100386ee228dbc648
   languageName: node
   linkType: hard
 
-"@ui5/webcomponents-base@npm:2.23.2":
-  version: 2.23.2
-  resolution: "@ui5/webcomponents-base@npm:2.23.2"
+"@ui5/webcomponents-base@npm:2.24.0":
+  version: 2.24.0
+  resolution: "@ui5/webcomponents-base@npm:2.24.0"
   dependencies:
     "@lit-labs/ssr-dom-shim": "npm:^1.1.2"
     lit-html: "npm:^2.0.1"
@@ -5694,19 +5694,19 @@ __metadata:
   peerDependenciesMeta:
     react:
       optional: true
-  checksum: 10c0/f76989963084c671ebbb69568e61afc98726bc3e02f91dec31d7dd63027a904499965ba33c1fd3e999fb499dfac245fbf475448164dbe111f08b8c5a8ae6fc0b
+  checksum: 10c0/4f3eea8575a10842d3b676f3c371697d031410530e2c2f14b8d286cdb0b90544ca38ce9dc0381a0a910c3a1806c4bfe93c8670fbf189cd91fa08c67e3032e0c1
   languageName: node
   linkType: hard
 
-"@ui5/webcomponents-compat@npm:2.23.2":
-  version: 2.23.2
-  resolution: "@ui5/webcomponents-compat@npm:2.23.2"
+"@ui5/webcomponents-compat@npm:2.24.0":
+  version: 2.24.0
+  resolution: "@ui5/webcomponents-compat@npm:2.24.0"
   dependencies:
-    "@ui5/webcomponents": "npm:2.23.2"
-    "@ui5/webcomponents-base": "npm:2.23.2"
-    "@ui5/webcomponents-icons": "npm:2.23.2"
-    "@ui5/webcomponents-theming": "npm:2.23.2"
-  checksum: 10c0/5e0408bf94dd8143c328dadae7849a6e5baf664878c9753f12b93728fa741de6e355a6c745d6b9f4dee54f9cc1e9ee0959829a0a5a29de75a3a3a15aa1e109d4
+    "@ui5/webcomponents": "npm:2.24.0"
+    "@ui5/webcomponents-base": "npm:2.24.0"
+    "@ui5/webcomponents-icons": "npm:2.24.0"
+    "@ui5/webcomponents-theming": "npm:2.24.0"
+  checksum: 10c0/938496b279784bcba5418d6df2470058e94b6d3dec8df81571fd1a8af04269c5bfb553197948dfa48f39ecbd78ccf927b531f0fe4fb7bb734164f7727a94615b
   languageName: node
   linkType: hard
 
@@ -5714,8 +5714,8 @@ __metadata:
   version: 0.0.0-use.local
   resolution: "@ui5/webcomponents-cypress-commands@workspace:packages/cypress-commands"
   peerDependencies:
-    "@ui5/webcomponents": ~2.23.0
-    "@ui5/webcomponents-base": ~2.23.0
+    "@ui5/webcomponents": ~2.24.0
+    "@ui5/webcomponents-base": ~2.24.0
     cypress: ^12 || ^13 || ^14 || ^15
   peerDependenciesMeta:
     "@ui5/webcomponents":
@@ -5725,53 +5725,53 @@ __metadata:
   languageName: unknown
   linkType: soft
 
-"@ui5/webcomponents-fiori@npm:2.23.2":
-  version: 2.23.2
-  resolution: "@ui5/webcomponents-fiori@npm:2.23.2"
+"@ui5/webcomponents-fiori@npm:2.24.0":
+  version: 2.24.0
+  resolution: "@ui5/webcomponents-fiori@npm:2.24.0"
   dependencies:
-    "@ui5/webcomponents": "npm:2.23.2"
-    "@ui5/webcomponents-base": "npm:2.23.2"
-    "@ui5/webcomponents-icons": "npm:2.23.2"
-    "@ui5/webcomponents-theming": "npm:2.23.2"
+    "@ui5/webcomponents": "npm:2.24.0"
+    "@ui5/webcomponents-base": "npm:2.24.0"
+    "@ui5/webcomponents-icons": "npm:2.24.0"
+    "@ui5/webcomponents-theming": "npm:2.24.0"
     "@zxing/library": "npm:^0.21.3"
-  checksum: 10c0/07863bb23ac778a015684274a5e7c38499e965290213857931b12e6cde395635e184fdbf8869ef538a46111a00ba3ba0432712c52750133211d5981bff8f4284
+  checksum: 10c0/e7982e7d6a7a26f42c32474290d4fd90de3179a5b3accb5b9502a832eca0d100f93c0ac8f4cf41c0e20e5720fe73f9bb5309d39aa9ca0283488c96205f6b543c
   languageName: node
   linkType: hard
 
-"@ui5/webcomponents-icons-business-suite@npm:2.23.2":
-  version: 2.23.2
-  resolution: "@ui5/webcomponents-icons-business-suite@npm:2.23.2"
+"@ui5/webcomponents-icons-business-suite@npm:2.24.0":
+  version: 2.24.0
+  resolution: "@ui5/webcomponents-icons-business-suite@npm:2.24.0"
   dependencies:
-    "@ui5/webcomponents-base": "npm:2.23.2"
-  checksum: 10c0/2a6141d256308a040b18c9f8f895c8617b6bb5b48127ac567a5b9932e6d214a51eb8f4dd170bf75571ab5446d633f3fac5f81e54f6239f2366fb3f83741826e2
+    "@ui5/webcomponents-base": "npm:2.24.0"
+  checksum: 10c0/4e4ee95cbdf781c128325005032e3aeac6e88427d0b7ed2c77c04e5dbae88a6076e73047a637d8aa39dc4b8caec8c88d8691d4e5215b214fff31474295d78aec
   languageName: node
   linkType: hard
 
-"@ui5/webcomponents-icons-tnt@npm:2.23.2":
-  version: 2.23.2
-  resolution: "@ui5/webcomponents-icons-tnt@npm:2.23.2"
+"@ui5/webcomponents-icons-tnt@npm:2.24.0":
+  version: 2.24.0
+  resolution: "@ui5/webcomponents-icons-tnt@npm:2.24.0"
   dependencies:
-    "@ui5/webcomponents-base": "npm:2.23.2"
-  checksum: 10c0/f9deac4eef25eef0cdc3252138d0e24253826d408492e366e4784eb86322617e820642f2270b446d93eccb41c008682eb181d1bd1912858eb2d4f69be61ef4b2
+    "@ui5/webcomponents-base": "npm:2.24.0"
+  checksum: 10c0/5268d30262e12aad3f5f1946bb87b64944f4eb2e2830f656f91992c13c8ae57748efe1463386a16f45bd75691f49ee4d75377c23454b176363516a98b1676687
   languageName: node
   linkType: hard
 
-"@ui5/webcomponents-icons@npm:2.23.2":
-  version: 2.23.2
-  resolution: "@ui5/webcomponents-icons@npm:2.23.2"
+"@ui5/webcomponents-icons@npm:2.24.0":
+  version: 2.24.0
+  resolution: "@ui5/webcomponents-icons@npm:2.24.0"
   dependencies:
-    "@ui5/webcomponents-base": "npm:2.23.2"
-  checksum: 10c0/7c0dbbc668466af596905ac06d2aef5875818d1728aca6cd8ac2d363bcdb564cc9203669fde9736efdc817eff099a68d9e7b86e95d191bf6a9cb3c1c8f5e3d5c
+    "@ui5/webcomponents-base": "npm:2.24.0"
+  checksum: 10c0/fe6969a7f30b4d131224dec1c7a93e61962e0eb497e189693f89812d0e4e0a171de428befeceaef858d7b0ef1bd9d51263a1afe82a6646ef5c165de94364e554
   languageName: node
   linkType: hard
 
-"@ui5/webcomponents-localization@npm:2.23.2":
-  version: 2.23.2
-  resolution: "@ui5/webcomponents-localization@npm:2.23.2"
+"@ui5/webcomponents-localization@npm:2.24.0":
+  version: 2.24.0
+  resolution: "@ui5/webcomponents-localization@npm:2.24.0"
   dependencies:
     "@types/openui5": "npm:^1.146.0"
-    "@ui5/webcomponents-base": "npm:2.23.2"
-  checksum: 10c0/20bd9646853f95227771fe213ca87f26a60513e3006375c668999ffe6006d65241cace3b19504d4f3f2387572979c01b427cb54716c27a61f556ee9408735fc2
+    "@ui5/webcomponents-base": "npm:2.24.0"
+  checksum: 10c0/44abac600236aff50c4460064b0b828a0fb498c072d8e02e9898298e52dfae0a76cd74cb560d2a9381792a53894a221026c52dda59ecfcf9b5cb8963195daf19
   languageName: node
   linkType: hard
 
@@ -5780,7 +5780,7 @@ __metadata:
   resolution: "@ui5/webcomponents-react-base@workspace:packages/base"
   peerDependencies:
     "@types/react": "*"
-    "@ui5/webcomponents-base": ~2.23.0
+    "@ui5/webcomponents-base": ~2.24.0
     react: ^18 || ^19
   peerDependenciesMeta:
     "@types/react":
@@ -5822,8 +5822,8 @@ __metadata:
   peerDependencies:
     "@types/react": "*"
     "@types/react-dom": "*"
-    "@ui5/webcomponents-compat": ~2.23.0
-    "@ui5/webcomponents-react": ~2.23.0
+    "@ui5/webcomponents-compat": ~2.24.0
+    "@ui5/webcomponents-react": ~2.24.0
     react: ^18 || ^19
     react-dom: ^18 || ^19
   peerDependenciesMeta:
@@ -5863,10 +5863,10 @@ __metadata:
   peerDependencies:
     "@types/react": "*"
     "@types/react-dom": "*"
-    "@ui5/webcomponents": ~2.23.0
-    "@ui5/webcomponents-base": ~2.23.0
-    "@ui5/webcomponents-fiori": ~2.23.0
-    "@ui5/webcomponents-icons": ~2.23.0
+    "@ui5/webcomponents": ~2.24.0
+    "@ui5/webcomponents-base": ~2.24.0
+    "@ui5/webcomponents-fiori": ~2.24.0
+    "@ui5/webcomponents-icons": ~2.24.0
     react: ^18 || ^19
     react-dom: ^18 || ^19
   peerDependenciesMeta:
@@ -5883,19 +5883,19 @@ __metadata:
   languageName: unknown
   linkType: soft
 
-"@ui5/webcomponents-theming@npm:2.23.2":
-  version: 2.23.2
-  resolution: "@ui5/webcomponents-theming@npm:2.23.2"
+"@ui5/webcomponents-theming@npm:2.24.0":
+  version: 2.24.0
+  resolution: "@ui5/webcomponents-theming@npm:2.24.0"
   dependencies:
-    "@sap-theming/theming-base-content": "npm:11.36.3"
-    "@ui5/webcomponents-base": "npm:2.23.2"
-  checksum: 10c0/9a2a08656dc030ffb268c6e7e5caf185cd83b5e14f05a36a7aa1bbdfe0d49db94ece9c82fbaf22eb7cbc9871d444230ce8b63e17e0397adf00ad9f9e7c4fa427
+    "@sap-theming/theming-base-content": "npm:11.36.4"
+    "@ui5/webcomponents-base": "npm:2.24.0"
+  checksum: 10c0/43fffe69c4b9b8b77e10012a83a433f81f12a8b7f5a5b66b38f2f881d6c191720cc090ea5b1d5c4e127783dc275c9bd0c3bb9d2c7971e695216f9dac8a38d47b
   languageName: node
   linkType: hard
 
-"@ui5/webcomponents-tools@npm:2.23.2":
-  version: 2.23.2
-  resolution: "@ui5/webcomponents-tools@npm:2.23.2"
+"@ui5/webcomponents-tools@npm:2.24.0":
+  version: 2.24.0
+  resolution: "@ui5/webcomponents-tools@npm:2.24.0"
   dependencies:
     "@custom-elements-manifest/analyzer": "npm:^0.10.10"
     "@typescript-eslint/eslint-plugin": "npm:^6.9.0"
@@ -5952,21 +5952,21 @@ __metadata:
     ui5nps: bin/ui5nps.js
     wc-create-ui5-element: bin/create-ui5-element.js
     wc-dev: bin/dev.js
-  checksum: 10c0/4a9b1c3db070ffb274484484fa466fd3f24002d772ce3cbdd96af4f7f36db70552494da49d8fa418c484e797a516652db51442bb7c4d5df059e4a624e682a188
+  checksum: 10c0/654b101f70729b81086f686229617a357608238185ea1688bb8b429c25a4d878162f381d16ecb9f46cce980046e8101b1151ecc1b27ccae3d53340d6fc5737a0
   languageName: node
   linkType: hard
 
-"@ui5/webcomponents@npm:2.23.2":
-  version: 2.23.2
-  resolution: "@ui5/webcomponents@npm:2.23.2"
+"@ui5/webcomponents@npm:2.24.0":
+  version: 2.24.0
+  resolution: "@ui5/webcomponents@npm:2.24.0"
   dependencies:
-    "@ui5/webcomponents-base": "npm:2.23.2"
-    "@ui5/webcomponents-icons": "npm:2.23.2"
-    "@ui5/webcomponents-icons-business-suite": "npm:2.23.2"
-    "@ui5/webcomponents-icons-tnt": "npm:2.23.2"
-    "@ui5/webcomponents-localization": "npm:2.23.2"
-    "@ui5/webcomponents-theming": "npm:2.23.2"
-  checksum: 10c0/46c23fb6864b4b6518e6fa342c192f0b7d2943f7aa11e65b6d31a261fd6f188364adfb14bb99a58a3c14109e6b74a351113183b8d2fda5587c8e079824a500db
+    "@ui5/webcomponents-base": "npm:2.24.0"
+    "@ui5/webcomponents-icons": "npm:2.24.0"
+    "@ui5/webcomponents-icons-business-suite": "npm:2.24.0"
+    "@ui5/webcomponents-icons-tnt": "npm:2.24.0"
+    "@ui5/webcomponents-localization": "npm:2.24.0"
+    "@ui5/webcomponents-theming": "npm:2.24.0"
+  checksum: 10c0/f768b81419ec7d2b47d7690df6c51da2ed6555e1c7416a806c470ea2cd24d4ea9ca168b85fdc9dd35f0f2e88a773fae3886f2b03f01f4bc0b3b7b3574b270d4c
   languageName: node
   linkType: hard
 
@@ -22154,12 +22154,12 @@ __metadata:
     "@types/node": "npm:24.13.2"
     "@types/react": "npm:19.2.17"
     "@types/react-dom": "npm:19.2.3"
-    "@ui5/webcomponents": "npm:2.23.2"
-    "@ui5/webcomponents-ai": "npm:2.23.2"
-    "@ui5/webcomponents-compat": "npm:2.23.2"
-    "@ui5/webcomponents-fiori": "npm:2.23.2"
-    "@ui5/webcomponents-icons": "npm:2.23.2"
-    "@ui5/webcomponents-tools": "npm:2.23.2"
+    "@ui5/webcomponents": "npm:2.24.0"
+    "@ui5/webcomponents-ai": "npm:2.24.0"
+    "@ui5/webcomponents-compat": "npm:2.24.0"
+    "@ui5/webcomponents-fiori": "npm:2.24.0"
+    "@ui5/webcomponents-icons": "npm:2.24.0"
+    "@ui5/webcomponents-tools": "npm:2.24.0"
     "@vitejs/plugin-react": "npm:6.0.3"
     chromatic: "npm:17.7.2"
     cssnano: "npm:8.0.2"