@ui5/webcomponents-fiori 0.0.0-df5b4199a → 0.0.0-e03cd01f3

package/dist/web-types.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://raw.githubusercontent.com/JetBrains/web-types/master/schema/web-types.json",
   "name": "@ui5/webcomponents-fiori",
-  "version": "2.17.0-rc.3",
+  "version": "2.18.0",
   "description-markup": "markdown",
   "contributions": {
     "html": {
@@ -168,6 +168,14 @@
           "events": [],
           "js": { "properties": [], "events": [] }
         },
+        {
+          "name": "ui5-dynamic-page-header-actions",
+          "description": "### Overview\n\nThe `DynamicPageHeaderActions` component is part of the `DynamicPage`\nfamily and is holding the action buttons behind the `DynamicPageTitle` and the `DynamicPageHeader`.\n\nThe \"pin\" action is used to attach the header to a certain state (expanded/collapsed).\nThe expand/collapse action is used to switch between the two states of `DynamicPageHeader`.\n---\n",
+          "doc-url": "",
+          "attributes": [],
+          "events": [],
+          "js": { "properties": [], "events": [] }
+        },
         {
           "name": "ui5-dynamic-page-title",
           "description": "### Overview\n\nTitle of the `DynamicPage`.\n\nThe `DynamicPageTitle` component is part of the `DynamicPage`\nfamily and is used to serve as title of the `DynamicPage`.\n\n### Usage\n\nThe `DynamicPageTitle` can hold any component and displays the most important\ninformation regarding the object that will always remain visible while scrolling.\n\n**Note:** The `actions` slot accepts any UI5 web component, but it's\nrecommended to use `ui5-toolbar`.\n\nThe user can switch between the expanded/collapsed states of the\n`DynamicPage` by clicking on the `DynamicPageTitle`\nor by using the expand/collapse visual indicators, positioned at the bottom of the\n`DynamicPageTitle` and the `DynamicPageHeader` inside `ui5-dynamic-page-header-actions`.\n\n### Responsive Behavior\n\nThe responsive behavior of the `DynamicPageTitle` depends on the behavior of the\ncontent that is displayed.\n---\n\n\n### **Slots:**\n - **heading** - Defines the content of the Heading of the Dynamic Page.\n\nThe font size of the title within the `heading` slot can be adjusted to the recommended values using the following CSS variables:\n\n**Expanded:** `var(--sapObjectHeader_Title_FontSize)`\n\n**Collapsed:** `var(--sapObjectHeader_Title_SnappedFontSize)`\n- **snappedHeading** - Defines the heading that is shown only when the header is snapped.\n- **snappedTitleOnMobile** - Defines the content of the snapped title on mobile devices.\n\nThis slot is displayed only when the `DynamicPageTitle` is in the snapped state on mobile devices.\nIt should be used to provide a simplified, single-line title that takes up less space on smaller screens.\n\n**Note:**\n- The content set in this slot **overrides** all other content set in the `DynamicPageTitle` slots when displayed.\n- The slot is intended for a single `ui5-title` component.\n- **actionsBar** - Defines the bar with actions in the Dynamic page title.\n- **navigationBar** - Defines the bar with navigation actions in the Dynamic page title.\n- **default** - Defines the content of the Dynamic page title.\n- **subheading** - Defines the content of the title that is shown only when the header is not snapped.\n- **snappedSubheading** - Defines the content of the title that is shown only when the header is snapped.\n- **breadcrumbs** - Defines the content of the breadcrumbs inside Dynamic Page Title.",
@@ -855,6 +863,53 @@
             "events": []
           }
         },
+        {
+          "name": "ui5-navigation-menu",
+          "description": "### Overview\n\n`ui5-navigation-menu` component represents a hierarchical menu structure, inherits all the functionality of `ui5-menu`.\n\n### Usage\n\n`ui5-navigation-menu` contains `ui5-navigation-menu-item` components.\nAn arbitrary hierarchy structure can be represented by recursively nesting navigation menu items.\n\n### ES6 Module Import\n\n`import \"@ui5/webcomponents-fiori/dist/NavigationMenu.js\";`\n---\n\n\n### **Slots:**\n - **default** - Defines the items of this component.\n\n**Note:** Use `ui5-navigation-menu-item` for the intended design.",
+          "doc-url": "",
+          "attributes": [],
+          "slots": [
+            {
+              "name": "default",
+              "description": "Defines the items of this component.\n\n**Note:** Use `ui5-navigation-menu-item` for the intended design."
+            }
+          ],
+          "events": [],
+          "js": { "properties": [], "events": [] }
+        },
+        {
+          "name": "ui5-navigation-menu-item",
+          "description": "### Overview\n\n`ui5-navigation-menu-item` is the item to use inside a `ui5-navigation-menu`.\nAn arbitrary hierarchy structure can be represented by recursively nesting navigation menu items.\n\n### Usage\n\n`ui5-navigation-menu-item` represents a node in a `ui5-navigation-menu`. The navigation menu itself is rendered as a list,\nand each `ui5-navigation-menu-item` is represented by a list item in that list. Therefore, you should only use\n`ui5-navigation-menu-item` directly in your apps. The `ui5-li` list item is internal for the list, and not intended for public use.\n\n### ES6 Module Import\n\n`import \"@ui5/webcomponents-fiori/dist/NavigationMenuItem.js\";`\n---\n",
+          "doc-url": "",
+          "attributes": [
+            {
+              "name": "href",
+              "description": "Defines the link target URI. Supports standard hyperlink behavior.\nIf a JavaScript action should be triggered,\nthis should not be set, but instead an event handler\nfor the `click` event should be registered.",
+              "value": { "type": "string | undefined", "default": "undefined" }
+            },
+            {
+              "name": "target",
+              "description": "Defines the component target.\n\n**Notes:**\n\n- `_self`\n- `_top`\n- `_blank`\n- `_parent`\n- `_search`\n\n**This property must only be used when the `href` property is set.**",
+              "value": { "type": "string | undefined", "default": "undefined" }
+            }
+          ],
+          "events": [],
+          "js": {
+            "properties": [
+              {
+                "name": "href",
+                "description": "Defines the link target URI. Supports standard hyperlink behavior.\nIf a JavaScript action should be triggered,\nthis should not be set, but instead an event handler\nfor the `click` event should be registered.",
+                "value": { "type": "string | undefined" }
+              },
+              {
+                "name": "target",
+                "description": "Defines the component target.\n\n**Notes:**\n\n- `_self`\n- `_top`\n- `_blank`\n- `_parent`\n- `_search`\n\n**This property must only be used when the `href` property is set.**",
+                "value": { "type": "string | undefined" }
+              }
+            ],
+            "events": []
+          }
+        },
         {
           "name": "ui5-notification-list",
           "description": "### Overview\nThe `ui5-notification-list` web component represents\na container for `ui5-li-notification-group` and `ui5-li-notification`.\n\n### Keyboard Handling\n\n#### Basic Navigation\nThe `ui5-notification-list` provides advanced keyboard handling.\nWhen a list is focused the user can use the following keyboard\nshortcuts in order to perform a navigation:\n\n- [Up] or [Left] - Navigates up the items\n- [Down] or [Right] - Navigates down the items\n- [Home] - Navigates to first item\n- [End] - Navigates to the last item\n\n#### Fast Navigation\nThis component provides a build in fast navigation group which can be used via [F6] / [Shift] + [F6] / [Ctrl] + [Alt/Option] / [Down] or [Ctrl] + [Alt/Option] + [Up].\nIn order to use this functionality, you need to import the following module:\n`import \"@ui5/webcomponents-base/dist/features/F6Navigation.js\"`\n\n### ES6 Module Import\n\n`import \"@ui5/webcomponents-fiori/dist/NotificationList.js\";``\n---\n\n\n### **Events:**\n - **item-click** - Fired when an item is clicked.\n- **item-close** - Fired when the `Close` button of any item is clicked.\n- **item-toggle** - Fired when an item is toggled.\n\n### **Slots:**\n - **default** - Defines the items of the component.",
@@ -970,6 +1025,22 @@
             ]
           }
         },
+        {
+          "name": "ui5-notification-group-list",
+          "description": "Internal `ui5-li-notification-group-list` component,\nthat is used to support keyboard navigation of the notification group internal list.\n---\n",
+          "doc-url": "",
+          "attributes": [],
+          "events": [],
+          "js": { "properties": [], "events": [] }
+        },
+        {
+          "name": "ui5-notification-list-internal",
+          "description": "Internal `ui5-li-notification-list-list` component,\nthat is used to support keyboard navigation of the notification list internal list.\n---\n",
+          "doc-url": "",
+          "attributes": [],
+          "events": [],
+          "js": { "properties": [], "events": [] }
+        },
         {
           "name": "ui5-li-notification",
           "description": "### Overview\nThe `ui5-li-notification` is a type of list item, meant to display notifications.\n\nThe component has a rich set of various properties that allows the user to set `avatar`, `menu`, `titleText`, descriptive `content`\nand `footnotes` to fully describe a notification.\n\nThe user can:\n\n- display a `Close` button\n- can control whether the `titleText` and `description` should wrap or truncate\nand display a `ShowMore` button to switch between less and more information\n- add actions by using the `ui5-menu` component\n\n**Note:** Adding custom actions by using the `ui5-notification-action` component is deprecated as of version 2.0!\n\n### Usage\nThe component should be used inside a `ui5-notification-list`.\n\n### Keyboard Handling\n\n#### Basic Navigation\nThe user can use the following keyboard shortcuts to perform actions (such as select, delete):\n\n- [Enter] - select an item (trigger \"item-click\" event)\n- [Delete] - close an item (trigger \"item-close\" event)\n\n#### Fast Navigation\nThis component provides a fast navigation using the following keyboard shortcuts:\n\n- [Shift] + [Enter] - 'More'/'Less' link will be triggered\n- [Shift] + [F10] - 'Menu' (Actions) button will be triggered (clicked)\n\n### ES6 Module Import\n\n`import \"@ui5/webcomponents-fiori/dist/NotificationListItem.js\";`\n---\n\n\n### **Events:**\n - **close** - Fired when the `Close` button is pressed.\n\n### **Slots:**\n - **avatar** - Defines the avatar, displayed in the `ui5-li-notification`.\n\n**Note:** Consider using the `ui5-avatar` to display icons, initials or images.\n\n**Note:** In order to be complaint with the UX guidlines and for best experience,\nwe recommend using avatars with 2rem X 2rem in size (32px X 32px). In case you are using the `ui5-avatar`\nyou can set its `size` property to `XS` to get the required size - `<ui5-avatar size=\"XS\"></ui5-avatar>`.\n- **menu** - Defines the menu, displayed in the `ui5-li-notification`.\n\n**Note:** Use this for implementing actions.\n\n**Note:** Should be used instead `u5-notification-action`, which is deprecated as of version 2.0.\n- **footnotes** - Defines the elements, displayed in the footer of the of the component.\n- **default** - Defines the content of the `ui5-li-notification`,\nusually a description of the notification.\n\n**Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.\n\n### **CSS Parts:**\n - **title-text** - Used to style the titleText of the notification list item",
@@ -1269,6 +1340,11 @@
               "name": "accessible-description",
               "description": "Defines the accessible ARIA description of the field.",
               "value": { "type": "string | undefined", "default": "undefined" }
+            },
+            {
+              "name": "scope-value",
+              "description": "Defines the value of the component:\n\nApplications are responsible for setting the correct scope value.\n\n**Note:** If the given value does not match any existing scopes,\nno scope will be selected and the SearchField scope component will be displayed as empty.",
+              "value": { "type": "string | undefined", "default": "\"\"" }
             }
           ],
           "slots": [
@@ -1360,6 +1436,11 @@
                 "name": "accessible-description",
                 "description": "Defines the accessible ARIA description of the field.",
                 "value": { "type": "string | undefined" }
+              },
+              {
+                "name": "scope-value",
+                "description": "Defines the value of the component:\n\nApplications are responsible for setting the correct scope value.\n\n**Note:** If the given value does not match any existing scopes,\nno scope will be selected and the SearchField scope component will be displayed as empty.",
+                "value": { "type": "string | undefined" }
               }
             ],
             "events": [
@@ -1386,6 +1467,115 @@
             ]
           }
         },
+        {
+          "name": "ui5-search-field",
+          "description": "### Overview\n\nA `ui5-search-field` is an input field, used for user search.\n\nThe `ui5-search-field` 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\n### ES6 Module Import\n\n`import \"@ui5/webcomponents-fiori/dist/SearchField.js\";`\n---\n\n\n### **Events:**\n - **input** - Fired when typing in input or clear icon is pressed.\n- **scope-change** - Fired when the scope has changed.\n- **search** - Fired when the user has triggered search with Enter key or Search Button press.\n\n### **Slots:**\n - **scopes** - Defines the component scope options.\n- **filterButton** - Defines the filter button slot, used to display an additional filtering button.\nThis slot is intended for passing a `ui5-button` with a filter icon to provide extended filtering options.\n\n**Note:** Scope button and Filter button are mutually exclusive.",
+          "doc-url": "",
+          "attributes": [
+            {
+              "name": "show-clear-icon",
+              "description": "Defines whether the clear icon of the search will be shown.",
+              "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "value",
+              "description": "Defines the value of the component.\n\n**Note:** The property is updated upon typing.",
+              "value": { "type": "string", "default": "\"\"" }
+            },
+            {
+              "name": "placeholder",
+              "description": "Defines a short hint intended to aid the user with data entry when the\ncomponent has no value.",
+              "value": { "type": "string | undefined", "default": "undefined" }
+            },
+            {
+              "name": "accessible-name",
+              "description": "Defines the accessible ARIA name of the component.",
+              "value": { "type": "string | undefined", "default": "undefined" }
+            },
+            {
+              "name": "accessible-description",
+              "description": "Defines the accessible ARIA description of the field.",
+              "value": { "type": "string | undefined", "default": "undefined" }
+            },
+            {
+              "name": "scope-value",
+              "description": "Defines the value of the component:\n\nApplications are responsible for setting the correct scope value.\n\n**Note:** If the given value does not match any existing scopes,\nno scope will be selected and the SearchField scope component will be displayed as empty.",
+              "value": { "type": "string | undefined", "default": "\"\"" }
+            }
+          ],
+          "slots": [
+            {
+              "name": "scopes",
+              "description": "Defines the component scope options."
+            },
+            {
+              "name": "filterButton",
+              "description": "Defines the filter button slot, used to display an additional filtering button.\nThis slot is intended for passing a `ui5-button` with a filter icon to provide extended filtering options.\n\n**Note:** Scope button and Filter button are mutually exclusive."
+            }
+          ],
+          "events": [
+            {
+              "name": "input",
+              "description": "Fired when typing in input or clear icon is pressed."
+            },
+            {
+              "name": "scope-change",
+              "description": "Fired when the scope has changed."
+            },
+            {
+              "name": "search",
+              "description": "Fired when the user has triggered search with Enter key or Search Button press."
+            }
+          ],
+          "js": {
+            "properties": [
+              {
+                "name": "show-clear-icon",
+                "description": "Defines whether the clear icon of the search will be shown.",
+                "value": { "type": "boolean" }
+              },
+              {
+                "name": "value",
+                "description": "Defines the value of the component.\n\n**Note:** The property is updated upon typing.",
+                "value": { "type": "string" }
+              },
+              {
+                "name": "placeholder",
+                "description": "Defines a short hint intended to aid the user with data entry when the\ncomponent has no value.",
+                "value": { "type": "string | undefined" }
+              },
+              {
+                "name": "accessible-name",
+                "description": "Defines the accessible ARIA name of the component.",
+                "value": { "type": "string | undefined" }
+              },
+              {
+                "name": "accessible-description",
+                "description": "Defines the accessible ARIA description of the field.",
+                "value": { "type": "string | undefined" }
+              },
+              {
+                "name": "scope-value",
+                "description": "Defines the value of the component:\n\nApplications are responsible for setting the correct scope value.\n\n**Note:** If the given value does not match any existing scopes,\nno scope will be selected and the SearchField scope component will be displayed as empty.",
+                "value": { "type": "string | undefined" }
+              }
+            ],
+            "events": [
+              {
+                "name": "input",
+                "description": "Fired when typing in input or clear icon is pressed."
+              },
+              {
+                "name": "scope-change",
+                "description": "Fired when the scope has changed."
+              },
+              {
+                "name": "search",
+                "description": "Fired when the user has triggered search with Enter key or Search Button press."
+              }
+            ]
+          }
+        },
         {
           "name": "ui5-search-item",
           "description": "### Overview\n\nA `ui5-search-item` is a list item, used for displaying search suggestions\n\n### ES6 Module Import\n\n`import \"@ui5/webcomponents-fiori/dist/SearchItem.js\";`\n---\n\n\n### **Events:**\n - **delete** - Fired when delete button is pressed.\n\n### **Slots:**\n - **image** - **Note:** While the slot allows the option of setting a custom avatar, to comply with the\ndesign guidelines, use the `ui5-avatar` with size - XS.\n- **actions** - Defines the actionable elements.\nThis slot allows placing additional interactive elements (such as buttons, icons, or tags)\nnext to the delete button, providing flexible customization for various user actions.\n\n**Note:** While the slot is flexible, for consistency with design guidelines,\nit's recommended to use `ui5-button` with `Transparent` design or `ui5-icon` elements.",
@@ -1494,7 +1684,7 @@
           "attributes": [
             {
               "name": "items-to-show-count",
-              "description": "Specifies the number of additional items available to show.\nThis value replaces the placeholder (N) in the \"Show more (N)\" text.\nIf not set, the placeholder will remain as (N).",
+              "description": "Specifies the number of additional items available to show.\nIf no value is defined, the control shows \"Show more\" (without any counter).\nIf a number is provided, it displays \"Show more (N)\", where N is that number.",
               "value": { "type": "number | undefined", "default": "undefined" }
             },
             {
@@ -1513,7 +1703,7 @@
             "properties": [
               {
                 "name": "items-to-show-count",
-                "description": "Specifies the number of additional items available to show.\nThis value replaces the placeholder (N) in the \"Show more (N)\" text.\nIf not set, the placeholder will remain as (N).",
+                "description": "Specifies the number of additional items available to show.\nIf no value is defined, the control shows \"Show more\" (without any counter).\nIf a number is provided, it displays \"Show more (N)\", where N is that number.",
                 "value": { "type": "number | undefined" }
               },
               {
@@ -1574,9 +1764,9 @@
               "value": { "type": "string", "default": "\"\"" }
             },
             {
-              "name": "selected",
-              "description": "Indicates whether the item is selected",
-              "value": { "type": "boolean", "default": "false" }
+              "name": "value",
+              "description": "Defines the value of the `ui5-search-scope`.\nUsed for selection in Search scopes.",
+              "value": { "type": "string | undefined", "default": "undefined" }
             }
           ],
           "events": [],
@@ -1588,9 +1778,9 @@
                 "value": { "type": "string" }
               },
               {
-                "name": "selected",
-                "description": "Indicates whether the item is selected",
-                "value": { "type": "boolean" }
+                "name": "value",
+                "description": "Defines the value of the `ui5-search-scope`.\nUsed for selection in Search scopes.",
+                "value": { "type": "string | undefined" }
               }
             ],
             "events": []
@@ -2042,6 +2232,11 @@
               "name": "accessible-description",
               "description": "Defines the accessible ARIA description of the field.",
               "value": { "type": "string | undefined", "default": "undefined" }
+            },
+            {
+              "name": "scope-value",
+              "description": "Defines the value of the component:\n\nApplications are responsible for setting the correct scope value.\n\n**Note:** If the given value does not match any existing scopes,\nno scope will be selected and the SearchField scope component will be displayed as empty.",
+              "value": { "type": "string | undefined", "default": "\"\"" }
             }
           ],
           "slots": [
@@ -2138,6 +2333,11 @@
                 "name": "accessible-description",
                 "description": "Defines the accessible ARIA description of the field.",
                 "value": { "type": "string | undefined" }
+              },
+              {
+                "name": "scope-value",
+                "description": "Defines the value of the component:\n\nApplications are responsible for setting the correct scope value.\n\n**Note:** If the given value does not match any existing scopes,\nno scope will be selected and the SearchField scope component will be displayed as empty.",
+                "value": { "type": "string | undefined" }
               }
             ],
             "events": [
@@ -3428,6 +3628,136 @@
             ]
           }
         },
+        {
+          "name": "ui5-user-settings-appearance-view",
+          "description": "### Overview\n\nThe `ui5-user-settings-appearance-view` represents a view displayed in the `ui5-user-settings-item`.\n\n### ES6 Module Import\n`import \"@ui5/webcomponents-fiori/dist/UserSettingsAppearanceView.js\";`\n---\n\n\n### **Events:**\n - **selection-change** - Fired when an item is selected.\n\n### **Slots:**\n - **default** - Defines the items of the component.\n- **additionalContent** - Defines additional content displayed below the items list.",
+          "doc-url": "",
+          "attributes": [
+            {
+              "name": "text",
+              "description": "Defines the title text of the user settings view.",
+              "value": { "type": "string | undefined", "default": "undefined" }
+            },
+            {
+              "name": "selected",
+              "description": "Defines whether the view is selected. There can be just one selected view at a time.",
+              "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "secondary",
+              "description": "Indicates whether the view is secondary. It is relevant only if the view is used in `pages` slot of `ui5-user-settings-item`\nand controls the visibility of the back button.",
+              "value": { "type": "boolean", "default": "false" }
+            }
+          ],
+          "slots": [
+            {
+              "name": "default",
+              "description": "Defines the items of the component."
+            },
+            {
+              "name": "additionalContent",
+              "description": "Defines additional content displayed below the items list."
+            }
+          ],
+          "events": [
+            {
+              "name": "selection-change",
+              "description": "Fired when an item is selected."
+            }
+          ],
+          "js": {
+            "properties": [
+              {
+                "name": "text",
+                "description": "Defines the title text of the user settings view.",
+                "value": { "type": "string | undefined" }
+              },
+              {
+                "name": "selected",
+                "description": "Defines whether the view is selected. There can be just one selected view at a time.",
+                "value": { "type": "boolean" }
+              },
+              {
+                "name": "secondary",
+                "description": "Indicates whether the view is secondary. It is relevant only if the view is used in `pages` slot of `ui5-user-settings-item`\nand controls the visibility of the back button.",
+                "value": { "type": "boolean" }
+              }
+            ],
+            "events": [
+              {
+                "name": "selection-change",
+                "description": "Fired when an item is selected."
+              }
+            ]
+          }
+        },
+        {
+          "name": "ui5-user-settings-appearance-view-group",
+          "description": "### Overview\n\nThe `ui5-user-settings-appearance-view-group` is a special list item group used to group appearance view items.\n\nThis is the item to use inside a `ui5-user-settings-appearance-view`.\n\n### ES6 Module Import\n`import \"@ui5/webcomponents-fiori/dist/UserSettingsAppearanceViewGroup.js\";`\n---\n\n\n### **Slots:**\n - **default** - Defines the items of the <code>ui5-user-settings-appearance-view-group</code>.",
+          "doc-url": "",
+          "attributes": [],
+          "slots": [
+            {
+              "name": "default",
+              "description": "Defines the items of the <code>ui5-user-settings-appearance-view-group</code>."
+            }
+          ],
+          "events": [],
+          "js": { "properties": [], "events": [] }
+        },
+        {
+          "name": "ui5-user-settings-appearance-view-item",
+          "description": "### Overview\n\nThe `ui5-user-settings-appearance-view-item` represents a theme/appearance option item\nwithin the `ui5-user-settings-appearance-view`.\n\nIt displays a theme with an avatar icon, text label, and can be selected.\n\n### ES6 Module Import\n`import \"@ui5/webcomponents-fiori/dist/UserSettingsAppearanceViewItem.js\";`\n---\n",
+          "doc-url": "",
+          "attributes": [
+            {
+              "name": "item-key",
+              "description": "Defines the unique identifier of the item.",
+              "value": { "type": "string", "default": "\"\"" }
+            },
+            {
+              "name": "text",
+              "description": "Defines the text label displayed for the appearance item.",
+              "value": { "type": "string", "default": "\"\"" }
+            },
+            {
+              "name": "icon",
+              "description": "Defines the icon of the appearance item.",
+              "value": { "type": "string", "default": "\"product\"" }
+            },
+            {
+              "name": "color-scheme",
+              "description": "Defines the color scheme of the avatar.",
+              "value": { "type": "string", "default": "\"Accent7\"" }
+            }
+          ],
+          "events": [],
+          "js": {
+            "properties": [
+              {
+                "name": "item-key",
+                "description": "Defines the unique identifier of the item.",
+                "value": { "type": "string" }
+              },
+              {
+                "name": "text",
+                "description": "Defines the text label displayed for the appearance item.",
+                "value": { "type": "string" }
+              },
+              {
+                "name": "icon",
+                "description": "Defines the icon of the appearance item.",
+                "value": { "type": "string" }
+              },
+              {
+                "name": "color-scheme",
+                "description": "Defines the color scheme of the avatar.",
+                "value": { "type": "string" }
+              }
+            ],
+            "events": []
+          }
+        },
         {
           "name": "ui5-user-settings-dialog",
           "description": "### Overview\n\nThe `ui5-user-settings-dialog` is an SAP Fiori-specific web component used in the `ui5-user-menu`.\nIt allows the user to easily view information and settings for an account.\n\n### ES6 Module Import\n`import \"@ui5/webcomponents-fiori/dist/UserSettingsDialog.js\";`\n---\n\n\n### **Events:**\n - **selection-change** - Fired when an item is selected.\n- **open** - Fired when a settings dialog is open.\n- **before-close** - Fired before the settings dialog is closed.\n- **close** - Fired when a settings dialog is closed.\n\n### **Slots:**\n - **default** - Defines the user settings items.\n\n**Note:**  If no setting item is set as `selected`, the first one will be selected.\n- **fixedItems** - Defines the fixed user settings items.",
@@ -3903,6 +4233,14 @@
             ],
             "events": []
           }
+        },
+        {
+          "name": "ui5-wizard-tab",
+          "description": "### Overview\nPrivate component, used internally by the `ui5-wizard`\nto represent a \"step\" in the navigation header of the `ui5-wizard`.\n\n### Usage\n\n### ES6 Module Import\n\n`import \"@ui5/webcomponents/dist/WizardTab.js\";` (imported with <ui5-wizard>)\n---\n",
+          "doc-url": "",
+          "attributes": [],
+          "events": [],
+          "js": { "properties": [], "events": [] }
         }
       ]
     },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ui5/webcomponents-fiori",
-  "version": "0.0.0-df5b4199a",
+  "version": "0.0.0-e03cd01f3",
   "description": "UI5 Web Components: webcomponents.fiori",
   "ui5": {
     "webComponentsPackage": true
@@ -52,20 +52,20 @@
     "directory": "packages/fiori"
   },
   "dependencies": {
-    "@ui5/webcomponents": "0.0.0-df5b4199a",
-    "@ui5/webcomponents-base": "0.0.0-df5b4199a",
-    "@ui5/webcomponents-icons": "0.0.0-df5b4199a",
-    "@ui5/webcomponents-theming": "0.0.0-df5b4199a",
+    "@ui5/webcomponents": "0.0.0-e03cd01f3",
+    "@ui5/webcomponents-base": "0.0.0-e03cd01f3",
+    "@ui5/webcomponents-icons": "0.0.0-e03cd01f3",
+    "@ui5/webcomponents-theming": "0.0.0-e03cd01f3",
     "@zxing/library": "^0.21.3"
   },
   "devDependencies": {
     "@custom-elements-manifest/analyzer": "^0.10.10",
     "@ui5/cypress-internal": "0.1.0",
-    "@ui5/webcomponents-tools": "0.0.0-df5b4199a",
+    "@ui5/webcomponents-tools": "0.0.0-e03cd01f3",
     "cypress": "^15.3.0",
     "lit": "^2.0.0",
     "vite": "5.4.21",
     "yarn": "^1.22.22"
   },
-  "gitHead": "c07b41622cd8f0a2094b38233f6ad89f6cb4ee2b"
+  "gitHead": "f28ab61f9c4395563d4664b411455d7c28f47597"
 }

package/src/IllustratedMessageTemplate.tsx

@@ -5,7 +5,10 @@ export default function IllustratedMessageTemplate(this: IllustratedMessage) {
 	return (
 		<div class="ui5-illustrated-message-root">
 			<div class="ui5-illustrated-message-inner">
-				<div class="ui5-illustrated-message-illustration">
+				<div class="ui5-illustrated-message-illustration"
+					role={this.decorative ? "presentation" : "img"}
+					aria-hidden={this.decorative ? true : undefined}
+					aria-label={!this.decorative ? this.name : undefined}>
 					{renderIllustration.call(this)}
 				</div>
 				<div class="ui5-illustrated-message-text-and-actions-container">

package/src/SearchFieldTemplate.tsx

@@ -36,10 +36,12 @@ export default function SearchFieldTemplate(this: SearchField, options?: SearchF
 								onChange={this._handleScopeChange}
 								class="sapUiSizeCompact ui5-search-field-select"
 								accessibleName={this._translations.scope}
-								tooltip={this._translations.scope}>
+								tooltip={this._translations.scope}
+								value={this.scopeValue}
+							>
 								{this.scopes.map(scopeOption => (
 									<Option
-										selected={scopeOption.selected}
+										value={scopeOption.value}
 										data-ui5-stable={scopeOption.stableDomRef}
 										ref={this.captureRef.bind(scopeOption)}
 									>{scopeOption.text}
@@ -62,6 +64,8 @@ export default function SearchFieldTemplate(this: SearchField, options?: SearchF
 						role="searchbox"
 						aria-description={this.accessibleDescription}
 						aria-label={this.accessibleName || this._translations.searchFieldAriaLabel}
+						aria-autocomplete="both"
+						aria-controls="ui5-search-list"
 						value={this.value}
 						placeholder={this.placeholder}
 						data-sap-focus-ref

package/src/SearchPopoverTemplate.tsx

@@ -17,6 +17,7 @@ import type { JsxTemplate } from "@ui5/webcomponents-base/dist/index.js";
 export default function SearchPopoverTemplate(this: Search, headerTemplate?: JsxTemplate) {
 	return (
 		<ResponsivePopover
+			id="ui5-search-list"
 			hideArrow={true}
 			preventFocusRestore={true}
 			preventInitialFocus={!isPhone()}

package/src/UserMenuTemplate.tsx

@@ -29,7 +29,7 @@ export default function UserMenuTemplate(this: UserMenu) {
 			horizontalAlign="End"
 			tabindex={-1}
 			accessibleName={this.accessibleNameText}
-			aria-labelledby={this.accessibleNameText}
+			aria-label={this.accessibleNameText}
 			open={this.open}
 			opener={this.opener}
 			onClose={this._handlePopoverAfterClose}
@@ -94,13 +94,13 @@ export default function UserMenuTemplate(this: UserMenu) {
 function headerContent(this: UserMenu) {
 	return (<>
 		{this._selectedAccount &&
-			<div class="ui5-user-menu-selected-account" aria-labelledby={this._ariaLabelledByAccountInformationText}>
+			<div class="ui5-user-menu-selected-account" aria-label={this._ariaLabelledByAccountInformationText}>
 				<Avatar size="L" onClick={this._handleAvatarClick} initials={this._selectedAccount._initials} fallbackIcon={personPlaceholder} class="ui5-user-menu--selected-account-avatar" interactive>
 					{this._selectedAccount.avatarSrc &&
-						<img src={this._selectedAccount.avatarSrc}/>
+						<img src={this._selectedAccount.avatarSrc} title={this.showEditButton ? this._editAvatarTooltip : undefined	}/>
 					}
 					{this.showEditButton &&
-					<Tag slot="badge" wrappingType="None" design="Set1" colorScheme="5" title={this._editAvatarTooltip}>
+					<Tag slot="badge" wrappingType="None" design="Set1" colorScheme="5" >
 						<Icon slot="icon" name={edit}></Icon>
 					</Tag>
 					}
@@ -129,7 +129,7 @@ function headerContent(this: UserMenu) {
 
 function otherAccountsContent(this: UserMenu) {
 	return (<>
-		<Panel collapsed={true} class="ui5-user-menu-other-accounts" aria-labelledby={this._otherAccountsButtonText}>
+		<Panel collapsed={true} class="ui5-user-menu-other-accounts" aria-label={this._otherAccountsButtonText}>
 			<div slot="header" class="ui5-user-menu-account-header">
 				<Title slot="header" level="H4" wrapping-type="None">{this._otherAccountsButtonText} ({this._otherAccounts.length})</Title>
 				{this.showEditAccounts &&
@@ -147,15 +147,16 @@ function otherAccountsContent(this: UserMenu) {
 
 function otherAccountsList(this: UserMenu) {
 	return (<>
-		<List onItemClick={this._handleAccountSwitch} aria-labelledby={this._ariaLabelledByActions} loadingDelay={0}
+		<List onItemClick={this._handleAccountSwitch} aria-label={this._ariaLabelledByActions} loadingDelay={0}
 			  loading={this._otherAccounts.some(account => account.loading === true)}>
 			{this._otherAccounts.map((account, index) =>
 				<ListItemCustom
 					ref={this.captureRef.bind(account)}
-					aria-labelledby={account.titleText}
-					aria-possition={index + 1}
-					aria-setsize={this._otherAccounts.length}
-					aria-dectiption={this.getAccountDescriptionText(account)}
+					accessibilityAttributes={{
+						"ariaPosinset": index + 1,
+						"ariaSetsize": this._otherAccounts.length
+					}}
+					aria-label={account.titleText}
 				>
 					<div class="ui5-user-menu-other-accounts-content">
 						<Avatar slot="image" size="S" initials={account._initials} fallbackIcon={personPlaceholder}>

package/src/UserSettingsAppearanceViewItemTemplate.tsx

@@ -0,0 +1,25 @@
+import type UserSettingsAppearanceViewItem from "./UserSettingsAppearanceViewItem.js";
+import ListItemCustomTemplate from "@ui5/webcomponents/dist/ListItemCustomTemplate.js";
+import Avatar from "@ui5/webcomponents/dist/Avatar.js";
+import AvatarSize from "@ui5/webcomponents/dist/types/AvatarSize.js";
+
+export default function UserSettingsAppearanceViewItemTemplate(this: UserSettingsAppearanceViewItem) {
+	return ListItemCustomTemplate.call(this, {
+		listItemContent: listItemContent.bind(this),
+	});
+}
+
+function listItemContent(this: UserSettingsAppearanceViewItem) {
+	return (
+		<div class="list-item">
+			<div class="item-left">
+				{/* Two avatars are rendered for different content density modes - CSS controls visibility */}
+				<Avatar class="avatar-cozy" shape="Square" icon={this.icon} color-scheme={this.colorScheme} size={AvatarSize.S}></Avatar>
+				<Avatar class="avatar-compact" shape="Square" icon={this.icon} color-scheme={this.colorScheme} size={AvatarSize.XS}></Avatar>
+				<div class="item-texts">
+					<span class="item-title">{this.text}</span>
+				</div>
+			</div>
+		</div>
+	);
+}