@ui5/webcomponents 2.0.0-rc.6 → 2.0.0

package/dist/types/{ListSeparators.js → ListSeparator.js}

@@ -1,25 +1,26 @@
 /**
  * Different types of list items separators.
  * @public
+ * @since 2.0.0
  */
-var ListSeparators;
-(function (ListSeparators) {
+var ListSeparator;
+(function (ListSeparator) {
     /**
      * Separators between the items including the last and the first one.
      * @public
      */
-    ListSeparators["All"] = "All";
+    ListSeparator["All"] = "All";
     /**
      * Separators between the items.
      * Note: This enumeration depends on the theme.
      * @public
      */
-    ListSeparators["Inner"] = "Inner";
+    ListSeparator["Inner"] = "Inner";
     /**
      * No item separators.
      * @public
      */
-    ListSeparators["None"] = "None";
-})(ListSeparators || (ListSeparators = {}));
-export default ListSeparators;
-//# sourceMappingURL=ListSeparators.js.map
+    ListSeparator["None"] = "None";
+})(ListSeparator || (ListSeparator = {}));
+export default ListSeparator;
+//# sourceMappingURL=ListSeparator.js.map

package/dist/types/ListSeparator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListSeparator.js","sourceRoot":"","sources":["../../src/types/ListSeparator.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,IAAK,aAiBJ;AAjBD,WAAK,aAAa;IACjB;;;OAGG;IACH,4BAAW,CAAA;IACX;;;;OAIG;IACH,gCAAe,CAAA;IACf;;;OAGG;IACH,8BAAa,CAAA;AACd,CAAC,EAjBI,aAAa,KAAb,aAAa,QAiBjB;AAED,eAAe,aAAa,CAAC","sourcesContent":["/**\n * Different types of list items separators.\n * @public\n * @since 2.0.0\n */\nenum ListSeparator {\n\t/**\n\t * Separators between the items including the last and the first one.\n\t * @public\n\t */\n\tAll = \"All\",\n\t/**\n\t * Separators between the items.\n\t * Note: This enumeration depends on the theme.\n\t * @public\n\t */\n\tInner = \"Inner\",\n\t/**\n\t * No item separators.\n\t * @public\n\t */\n\tNone = \"None\",\n}\n\nexport default ListSeparator;\n"]}

package/dist/vscode.html-custom-data.json

@@ -258,7 +258,7 @@
     },
     {
       "name": "ui5-calendar",
-      "description": "### Overview\n\nThe `ui5-calendar` component allows users to select one or more dates.\n\nCurrently selected dates are represented with instances of `ui5-date` as\nchildren of the `ui5-calendar`. The value property of each `ui5-date` must be a\ndate string, correctly formatted according to the `ui5-calendar`'s `formatPattern` property.\nWhenever the user changes the date selection, `ui5-calendar` will automatically create/remove instances\nof `ui5-date` in itself, unless you prevent this behavior by calling `preventDefault()` for the\n`selection-change` event. This is useful if you want to control the selected dates externally.\n\n### Usage\n\nThe user can navigate to a particular date by:\n\n- Pressing over a month inside the months view\n- Pressing over an year inside the years view\n\nThe user can confirm a date selection by pressing over a date inside the days view.\n\n### Keyboard Handling\nThe `ui5-calendar` provides advanced keyboard handling.\nWhen a picker is showed and focused the user can use the following keyboard\nshortcuts in order to perform a navigation:\n\n- Day picker:\n\n- [F4] - Shows month picker\n- [Shift] + [F4] - Shows year picker\n- [Page Up] - Navigate to the previous month\n- [Page Down] - Navigate to the next month\n- [Shift] + [Page Up] - Navigate to the previous year\n- [Shift] + [Page Down] - Navigate to the next year\n- [Ctrl] + [Shift] + [Page Up] - Navigate ten years backwards\n- [Ctrl] + [Shift] + [Page Down] - Navigate ten years forwards\n- [Home] - Navigate to the first day of the week\n- [End] - Navigate to the last day of the week\n- [Ctrl] + [Home] - Navigate to the first day of the month\n- [Ctrl] + [End] - Navigate to the last day of the month\n\n- Month picker:\n\n- [Page Up] - Navigate to the previous year\n- [Page Down] - Navigate to the next year\n- [Home] - Navigate to the first month of the current row\n- [End] - Navigate to the last month of the current row\n- [Ctrl] + [Home] - Navigate to the first month of the current year\n- [Ctrl] + [End] - Navigate to the last month of the year\n\n- Year picker:\n\n- [Page Up] - Navigate to the previous year range\n- [Page Down] - Navigate the next year range\n- [Home] - Navigate to the first year of the current row\n- [End] - Navigate to the last year of the current row\n- [Ctrl] + [Home] - Navigate to the first year of the current year range\n- [Ctrl] + [End] - Navigate to the last year of the current year range\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### Calendar types\nThe component supports several calendar types - Gregorian, Buddhist, Islamic, Japanese and Persian.\nBy default the Gregorian Calendar is used. In order to use the Buddhist, Islamic, Japanese or Persian calendar,\nyou need to set the `primaryCalendarType` property and import one or more of the following modules:\n\n`import \"@ui5/webcomponents-localization/dist/features/calendar/Buddhist.js\";`\n\n`import \"@ui5/webcomponents-localization/dist/features/calendar/Islamic.js\";`\n\n`import \"@ui5/webcomponents-localization/dist/features/calendar/Japanese.js\";`\n\n`import \"@ui5/webcomponents-localization/dist/features/calendar/Persian.js\";`\n\nOr, you can use the global configuration and set the `calendarType` key:\n\n```html\n<script data-id=\"sap-ui-config\" type=\"application/json\">\n\t{\n\t\t\"calendarType\": \"Japanese\"\n\t}\n</script>\n```\n\n### ES6 Module Import\n\n`import \"@ui5/webcomponents/dist/Calendar.js\";`\n\n\n---\n\n\n\n\n### **Events:**\n - **selection-change** - Fired when the selected dates change.\n\n**Note:** If you call `preventDefault()` for this event, the component will not\ncreate instances of `ui5-date` for the newly selected dates. In that case you should do this manually.\n\n### **Slots:**\n - **calendarLegend** - Defines the calendar legend of the component.\n- **default** - Defines the selected date or dates (depending on the `selectionMode` property)\nfor this calendar as instances of `ui5-date`.\n- **specialDates** - Defines the special dates, visually emphasized in the calendar.",
+      "description": "### Overview\n\nThe `ui5-calendar` component allows users to select one or more dates.\n\nCurrently selected dates are represented with instances of `ui5-date` as\nchildren of the `ui5-calendar`. The value property of each `ui5-date` must be a\ndate string, correctly formatted according to the `ui5-calendar`'s `formatPattern` property.\nWhenever the user changes the date selection, `ui5-calendar` will automatically create/remove instances\nof `ui5-date` in itself, unless you prevent this behavior by calling `preventDefault()` for the\n`selection-change` event. This is useful if you want to control the selected dates externally.\n\n### Usage\n\nThe user can navigate to a particular date by:\n\n- Pressing over a month inside the months view\n- Pressing over an year inside the years view\n\nThe user can confirm a date selection by pressing over a date inside the days view.\n\n### Keyboard Handling\nThe `ui5-calendar` provides advanced keyboard handling.\nWhen a picker is showed and focused the user can use the following keyboard\nshortcuts in order to perform a navigation:\n\n- Day picker:\n\n- [F4] - Shows month picker\n- [Shift] + [F4] - Shows year picker\n- [Page Up] - Navigate to the previous month\n- [Page Down] - Navigate to the next month\n- [Shift] + [Page Up] - Navigate to the previous year\n- [Shift] + [Page Down] - Navigate to the next year\n- [Ctrl] + [Shift] + [Page Up] - Navigate ten years backwards\n- [Ctrl] + [Shift] + [Page Down] - Navigate ten years forwards\n- [Home] - Navigate to the first day of the week\n- [End] - Navigate to the last day of the week\n- [Ctrl] + [Home] - Navigate to the first day of the month\n- [Ctrl] + [End] - Navigate to the last day of the month\n\n- Month picker:\n\n- [Page Up] - Navigate to the previous year\n- [Page Down] - Navigate to the next year\n- [Home] - Navigate to the first month of the current row\n- [End] - Navigate to the last month of the current row\n- [Ctrl] + [Home] - Navigate to the first month of the current year\n- [Ctrl] + [End] - Navigate to the last month of the year\n\n- Year picker:\n\n- [Page Up] - Navigate to the previous year range\n- [Page Down] - Navigate the next year range\n- [Home] - Navigate to the first year of the current row\n- [End] - Navigate to the last year of the current row\n- [Ctrl] + [Home] - Navigate to the first year of the current year range\n- [Ctrl] + [End] - Navigate to the last year of the current year range\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### Calendar types\nThe component supports several calendar types - Gregorian, Buddhist, Islamic, Japanese and Persian.\nBy default the Gregorian Calendar is used. In order to use the Buddhist, Islamic, Japanese or Persian calendar,\nyou need to set the `primaryCalendarType` property and import one or more of the following modules:\n\n`import \"@ui5/webcomponents-localization/dist/features/calendar/Buddhist.js\";`\n\n`import \"@ui5/webcomponents-localization/dist/features/calendar/Islamic.js\";`\n\n`import \"@ui5/webcomponents-localization/dist/features/calendar/Japanese.js\";`\n\n`import \"@ui5/webcomponents-localization/dist/features/calendar/Persian.js\";`\n\nOr, you can use the global configuration and set the `calendarType` key:\n\n```html\n<script data-id=\"sap-ui-config\" type=\"application/json\">\n\t{\n\t\t\"calendarType\": \"Japanese\"\n\t}\n</script>\n```\n\n### ES6 Module Import\n\n`import \"@ui5/webcomponents/dist/Calendar.js\";`\n\n\n---\n\n\n\n\n### **Events:**\n - **selection-change** - Fired when the selected dates change.\n\n**Note:** If you call `preventDefault()` for this event, the component will not\ncreate instances of `ui5-date` for the newly selected dates. In that case you should do this manually.\n\n### **Slots:**\n - **calendarLegend** - Defines the calendar legend of the component.\n- **default** - Defines the selected date or dates (depending on the `selectionMode` property)\nfor this calendar as instances of `ui5-date` or `ui5-date-range`.\nUse `ui5-date` for single or multiple selection, and `ui5-date-range` for range selection.\n- **specialDates** - Defines the special dates, visually emphasized in the calendar.",
       "attributes": [
         {
           "name": "selection-mode",
@@ -536,17 +536,25 @@
         {
           "name": "background-design",
           "description": "Defines the carousel's background design.",
-          "values": [{ "name": "BackgroundDesign" }]
+          "values": [
+            { "name": "Transparent" },
+            { "name": "Solid" },
+            { "name": "Translucent" }
+          ]
         },
         {
           "name": "page-indicator-background-design",
           "description": "Defines the page indicator background design.",
-          "values": [{ "name": "BackgroundDesign" }]
+          "values": [
+            { "name": "Transparent" },
+            { "name": "Solid" },
+            { "name": "Translucent" }
+          ]
         },
         {
           "name": "page-indicator-border-design",
           "description": "Defines the page indicator border design.",
-          "values": [{ "name": "BorderDesign" }]
+          "values": [{ "name": "None" }, { "name": "Solid" }]
         },
         {
           "name": "arrows-placement",
@@ -816,7 +824,7 @@
       "description": "The `ui5-cb-group-item` is type of suggestion item,\nthat can be used to split the `ui5-combobox` suggestions into groups.\n\n\n---\n\n\n\n\n### **Slots:**\n - **default** - Defines the items of the <code>ui5-cb-item-group</code>.",
       "attributes": [
         {
-          "name": "text",
+          "name": "header-text",
           "description": "Defines the text of the component.",
           "values": []
         }
@@ -1455,7 +1463,7 @@
     },
     {
       "name": "ui5-input",
-      "description": "### Overview\n\nThe `ui5-input` component allows the user to enter and edit text or numeric values in one line.\n\nAdditionally, you can provide `suggestionItems`,\nthat are displayed in a popover right under the input.\n\nThe text field can be editable or read-only (`readonly` property),\nand it can be enabled or disabled (`disabled` property).\nTo visualize semantic states, such as \"error\" or \"warning\", the `valueState` property is provided.\nWhen the user makes changes to the text, the change event is fired,\nwhich enables you to react on any text change.\n\n**Note:** If you are using the `ui5-input` as a single npm module,\ndon't forget to import the `InputSuggestions` module from\n\"@ui5/webcomponents/dist/features/InputSuggestions.js\"\nto enable the suggestions functionality.\n\n### Keyboard Handling\nThe `ui5-input` provides the following keyboard shortcuts:\n\n- [Escape] - Closes the suggestion list, if open. If closed or not enabled, cancels changes and reverts to the value which the Input field had when it got the focus.\n- [Enter] or [Return] - If suggestion list is open takes over the current matching item and closes it. If value state or group header is focused, does nothing.\n- [Down] - Focuses the next matching item in the suggestion list. Selection-change event is fired.\n- [Up] - Focuses the previous matching item in the suggestion list. Selection-change event is fired.\n- [Home] - If focus is in the text input, moves caret before the first character. If focus is in the list, highlights the first item and updates the input accordingly.\n- [End] - If focus is in the text input, moves caret after the last character. If focus is in the list, highlights the last item and updates the input accordingly.\n- [Page Up] - If focus is in the list, moves highlight up by page size (10 items by default). If focus is in the input, does nothing.\n- [Page Down] - If focus is in the list, moves highlight down by page size (10 items by default). If focus is in the input, does nothing.\n\n### ES6 Module Import\n\n`import \"@ui5/webcomponents/dist/Input.js\";`\n\n`import \"@ui5/webcomponents/dist/features/InputSuggestions.js\";` (optional - for input suggestions support)\n\n\n---\n\n\n\n\n### **Events:**\n - **change** - Fired when the input operation has finished by pressing Enter or on focusout.\n- **input** - Fired when the value of the component changes at each keystroke,\nand when a suggestion item has been selected.\n- **selection-change** - Fired when the user navigates to a suggestion item via the ARROW keys,\nas a preview, before the final selection.\n- **open** - Fired when the suggestions picker is open.\n- **close** - Fired when the suggestions picker is closed.\n\n### **Slots:**\n - **default** - Defines the suggestion items.\n\n**Note:** The suggestions would be displayed only if the `showSuggestions`\nproperty is set to `true`.\n\n**Note:** The `<ui5-suggestion-item>` and `<ui5-suggestion-group-item>` are recommended to be used as suggestion items.\n\n**Note:** Importing the Input Suggestions Support feature:\n\n`import \"@ui5/webcomponents/dist/features/InputSuggestions.js\";`\n\nautomatically imports the `<ui5-suggestion-item>` and `<ui5-suggestion-group-item>` for your convenience.\n- **icon** - Defines the icon to be displayed in the component.\n- **valueStateMessage** - Defines the value state message that will be displayed as pop up under the component.\nThe value state message slot should contain only one root element.\n\n**Note:** If not specified, a default text (in the respective language) will be displayed.\n\n**Note:** The `valueStateMessage` would be displayed,\nwhen the component is in `Information`, `Warning` or `Error` value state.\n\n**Note:** If the component has `suggestionItems`,\nthe `valueStateMessage` would be displayed as part of the same popover, if used on desktop, or dialog - on phone.",
+      "description": "### Overview\n\nThe `ui5-input` component allows the user to enter and edit text or numeric values in one line.\n\nAdditionally, you can provide `suggestionItems`,\nthat are displayed in a popover right under the input.\n\nThe text field can be editable or read-only (`readonly` property),\nand it can be enabled or disabled (`disabled` property).\nTo visualize semantic states, such as \"error\" or \"warning\", the `valueState` property is provided.\nWhen the user makes changes to the text, the change event is fired,\nwhich enables you to react on any text change.\n\n**Note:** If you are using the `ui5-input` as a single npm module,\ndon't forget to import the `InputSuggestions` module from\n\"@ui5/webcomponents/dist/features/InputSuggestions.js\"\nto enable the suggestions functionality.\n\n### Keyboard Handling\nThe `ui5-input` provides the following keyboard shortcuts:\n\n- [Escape] - Closes the suggestion list, if open. If closed or not enabled, cancels changes and reverts to the value which the Input field had when it got the focus.\n- [Enter] or [Return] - If suggestion list is open takes over the current matching item and closes it. If value state or group header is focused, does nothing.\n- [Down] - Focuses the next matching item in the suggestion list. Selection-change event is fired.\n- [Up] - Focuses the previous matching item in the suggestion list. Selection-change event is fired.\n- [Home] - If focus is in the text input, moves caret before the first character. If focus is in the list, highlights the first item and updates the input accordingly.\n- [End] - If focus is in the text input, moves caret after the last character. If focus is in the list, highlights the last item and updates the input accordingly.\n- [Page Up] - If focus is in the list, moves highlight up by page size (10 items by default). If focus is in the input, does nothing.\n- [Page Down] - If focus is in the list, moves highlight down by page size (10 items by default). If focus is in the input, does nothing.\n\n### ES6 Module Import\n\n`import \"@ui5/webcomponents/dist/Input.js\";`\n\n`import \"@ui5/webcomponents/dist/features/InputSuggestions.js\";` (optional - for input suggestions support)\n\n\n---\n\n\n\n\n### **Events:**\n - **change** - Fired when the input operation has finished by pressing Enter or on focusout.\n- **input** - Fired when the value of the component changes at each keystroke,\nand when a suggestion item has been selected.\n- **selection-change** - Fired when the user navigates to a suggestion item via the ARROW keys,\nas a preview, before the final selection.\n- **open** - Fired when the suggestions picker is open.\n- **close** - Fired when the suggestions picker is closed.\n\n### **Slots:**\n - **default** - Defines the suggestion items.\n\n**Note:** The suggestions would be displayed only if the `showSuggestions`\nproperty is set to `true`.\n\n**Note:** The `<ui5-suggestion-item>`, `<ui5-suggestion-item-group>` and `ui5-suggestion-item-custom` are recommended to be used as suggestion items.\n\n**Note:** Importing the Input Suggestions Support feature:\n\n`import \"@ui5/webcomponents/dist/features/InputSuggestions.js\";`\n\nautomatically imports the `<ui5-suggestion-item>` and `<ui5-suggestion-item-group>` for your convenience.\n- **icon** - Defines the icon to be displayed in the component.\n- **valueStateMessage** - Defines the value state message that will be displayed as pop up under the component.\nThe value state message slot should contain only one root element.\n\n**Note:** If not specified, a default text (in the respective language) will be displayed.\n\n**Note:** The `valueStateMessage` would be displayed,\nwhen the component is in `Information`, `Warning` or `Error` value state.\n\n**Note:** If the component has `suggestionItems`,\nthe `valueStateMessage` would be displayed as part of the same popover, if used on desktop, or dialog - on phone.",
       "attributes": [
         {
           "name": "disabled",
@@ -1782,13 +1790,7 @@
     {
       "name": "list-item-base",
       "description": "A class to serve as a foundation\nfor the `ListItem` and `ListItemGroupHeader` classes.\n\n\n---\n\n\n",
-      "attributes": [
-        {
-          "name": "selected",
-          "description": "Defines the selected state of the component.",
-          "values": []
-        }
-      ],
+      "attributes": [],
       "references": []
     },
     {
@@ -1863,7 +1865,7 @@
     },
     {
       "name": "ui5-li",
-      "description": "The `ui5-li` represents the simplest type of item for a `ui5-list`.\n\nThis is a list item,\nproviding the most common use cases such as `text`,\n`image` and `icon`.\n\n\n---\n\n\n\n\n### **Events:**\n - **detail-click** - Fired when the user clicks on the detail button when type is `Detail`.\n\n### **Slots:**\n - **default** - Defines the text of the component.\n\n**Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.\n- **imageContent** - **Note:** While the slot allows option for setting custom avatar, to match the\ndesign guidelines, please use the `ui5-avatar` with it's default size - S.\n\n**Note:** If bigger `ui5-avatar` needs to be used, then the size of the\n`ui5-li` should be customized in order to fit.\n\n### **CSS Parts:**\n - **title** - Used to style the title of the list item\n- **description** - Used to style the description of the list item\n- **additional-text** - Used to style the additionalText of the list item\n- **icon** - Used to style the icon of the list item\n- **native-li** - Used to style the main li tag of the list item\n- **content** - Used to style the content area of the list item\n- **detail-button** - Used to style the button rendered when the list item is of type detail\n- **delete-button** - Used to style the button rendered when the list item is in delete mode\n- **radio** - Used to style the radio button rendered when the list item is in single selection mode\n- **checkbox** - Used to style the checkbox rendered when the list item is in multiple selection mode",
+      "description": "The `ui5-li` represents the simplest type of item for a `ui5-list`.\n\nThis is a list item,\nproviding the most common use cases such as `text`,\n`image` and `icon`.\n\n\n---\n\n\n\n\n### **Events:**\n - **detail-click** - Fired when the user clicks on the detail button when type is `Detail`.\n\n### **Slots:**\n - **default** - Defines the text of the component.\n\n**Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.\n- **image** - **Note:** While the slot allows option for setting custom avatar, to match the\ndesign guidelines, please use the `ui5-avatar` with it's default size - S.\n\n**Note:** If bigger `ui5-avatar` needs to be used, then the size of the\n`ui5-li` should be customized in order to fit.\n\n### **CSS Parts:**\n - **title** - Used to style the title of the list item\n- **description** - Used to style the description of the list item\n- **additional-text** - Used to style the additionalText of the list item\n- **icon** - Used to style the icon of the list item\n- **native-li** - Used to style the main li tag of the list item\n- **content** - Used to style the content area of the list item\n- **detail-button** - Used to style the button rendered when the list item is of type detail\n- **delete-button** - Used to style the button rendered when the list item is in delete mode\n- **radio** - Used to style the radio button rendered when the list item is in single selection mode\n- **checkbox** - Used to style the checkbox rendered when the list item is in multiple selection mode",
       "attributes": [
         {
           "name": "description",
@@ -1877,12 +1879,7 @@
         },
         {
           "name": "icon-end",
-          "description": "Defines whether the `icon` should be displayed in the beginning of the list item or in the end.\n\n**Note:** If `image` is set, the `icon` would be displayed after the `image`.",
-          "values": []
-        },
-        {
-          "name": "image",
-          "description": "Defines the `image` source URI.\n\n**Note:** The `image` would be displayed in the beginning of the list item.",
+          "description": "Defines whether the `icon` should be displayed in the beginning of the list item or in the end.",
           "values": []
         },
         {
@@ -1952,7 +1949,7 @@
     },
     {
       "name": "ui5-menu",
-      "description": "### Overview\n\n`ui5-menu` component represents a hierarchical menu structure.\n\n### Usage\n\n`ui5-menu` contains `ui5-menu-item` components.\nAn arbitrary hierarchy structure can be represented by recursively nesting menu items.\n\n### Keyboard Handling\n\nThe `ui5-menu` provides advanced keyboard handling.\nThe user can use the following keyboard shortcuts in order to navigate trough the tree:\n\n- `Arrow Up` / `Arrow Down` - Navigates up and down the menu items that are currently visible.\n- `Arrow Right`, `Space` or `Enter` - Opens a sub-menu if there are menu items nested\nin the currently clicked menu item.\n- `Arrow Left` or `Escape` - Closes the currently opened sub-menu.\n\nNote: if the text ditrection is set to Right-to-left (RTL), `Arrow Right` and `Arrow Left` functionality is swapped.\n\n### ES6 Module Import\n\n`import \"@ui5/webcomponents/dist/Menu.js\";`\n\n\n---\n\n\n\n\n### **Events:**\n - **item-click** - Fired when an item is being clicked.\n\n**Note:** Since 1.17.0 the event is preventable, allowing the menu to remain open after an item is pressed.\n- **before-open** - Fired before the menu is opened. This event can be cancelled, which will prevent the menu from opening. **This event does not bubble.**\n\n**Note:** Since 1.14.0 the event is also fired before a sub-menu opens.\n- **open** - Fired after the menu is opened. **This event does not bubble.**\n- **before-close** - Fired before the menu is closed. This event can be cancelled, which will prevent the menu from closing. **This event does not bubble.**\n- **close** - Fired after the menu is closed. **This event does not bubble.**\n\n### **Slots:**\n - **default** - Defines the items of this component.\n\n**Note:** Use `ui5-menu-item` for the intended design.",
+      "description": "### Overview\n\n`ui5-menu` component represents a hierarchical menu structure.\n\n### Structure\n\nThe `ui5-menu` can hold two types of entities:\n\n- `ui5-menu-item` components\n- `ui5-menu-separator` - used to separate menu items with a line\n\nAn arbitrary hierarchy structure can be represented by recursively nesting menu items.\n\n### Keyboard Handling\n\nThe `ui5-menu` provides advanced keyboard handling.\nThe user can use the following keyboard shortcuts in order to navigate trough the tree:\n\n- `Arrow Up` / `Arrow Down` - Navigates up and down the menu items that are currently visible.\n- `Arrow Right`, `Space` or `Enter` - Opens a sub-menu if there are menu items nested\nin the currently clicked menu item.\n- `Arrow Left` or `Escape` - Closes the currently opened sub-menu.\n\nNote: if the text ditrection is set to Right-to-left (RTL), `Arrow Right` and `Arrow Left` functionality is swapped.\n\n### ES6 Module Import\n\n`import \"@ui5/webcomponents/dist/Menu.js\";`\n\n\n---\n\n\n\n\n### **Events:**\n - **item-click** - Fired when an item is being clicked.\n\n**Note:** Since 1.17.0 the event is preventable, allowing the menu to remain open after an item is pressed.\n- **before-open** - Fired before the menu is opened. This event can be cancelled, which will prevent the menu from opening. **This event does not bubble.**\n\n**Note:** Since 1.14.0 the event is also fired before a sub-menu opens.\n- **open** - Fired after the menu is opened. **This event does not bubble.**\n- **before-close** - Fired before the menu is closed. This event can be cancelled, which will prevent the menu from closing. **This event does not bubble.**\n- **close** - Fired after the menu is closed. **This event does not bubble.**\n\n### **Slots:**\n - **default** - Defines the items of this component.\n\n**Note:** Use `ui5-menu-item` and `ui5-menu-separator` for their intended design.",
       "attributes": [
         {
           "name": "header-text",
@@ -1984,7 +1981,7 @@
     },
     {
       "name": "ui5-menu-item",
-      "description": "### Overview\n\n`ui5-menu-item` is the item to use inside a `ui5-menu`.\nAn arbitrary hierarchy structure can be represented by recursively nesting menu items.\n\n### Usage\n\n`ui5-menu-item` represents a node in a `ui5-menu`. The menu itself is rendered as a list,\nand each `ui5-menu-item` is represented by a list item in that list. Therefore, you should only use\n`ui5-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/dist/MenuItem.js\";`\n\n\n---\n\n\n\n\n### **Events:**\n - **detail-click** - Fired when the user clicks on the detail button when type is `Detail`.\n\n### **Slots:**\n - **default** - Defines the items of this component.\n\n**Note:** If there are items added to this slot, an arrow will be displayed at the end\nof the item in order to indicate that there are items added. In that case components added\nto `endContent` slot or `additionalText` content will not be displayed.\n\nThe priority of what will be displayed at the end of the menu item is as follows:\nsub-menu arrow (if there are items added in `items` slot) -> components added in `endContent` -> text set to `additionalText`.\n- **endContent** - Defines the components that should be displayed at the end of the menu item.\n\n**Note:** It is highly recommended to slot only components of type `ui5-button`,`ui5-link`\nor `ui5-icon` in order to preserve the intended design. If there are components added to this slot,\nand there is text set in `additionalText`, it will not be displayed. If there are items added to `items` slot,\nnether `additionalText` nor components added to this slot would be displayed.\n\nThe priority of what will be displayed at the end of the menu item is as follows:\nsub-menu arrow (if there are items added in `items` slot) -> components added in `endContent` -> text set to `additionalText`.",
+      "description": "### Overview\n\n`ui5-menu-item` is the item to use inside a `ui5-menu`.\nAn arbitrary hierarchy structure can be represented by recursively nesting menu items.\n\n### Usage\n\n`ui5-menu-item` represents a node in a `ui5-menu`. The menu itself is rendered as a list,\nand each `ui5-menu-item` is represented by a list item in that list. Therefore, you should only use\n`ui5-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/dist/MenuItem.js\";`\n\n\n---\n\n\n\n\n### **Events:**\n - **detail-click** - Fired when the user clicks on the detail button when type is `Detail`.\n\n### **Slots:**\n - **default** - Defines the items of this component.\n\n**Note:** The slot can hold `ui5-menu-item` and `ui5-menu-separator` items.\n\nIf there are items added to this slot, an arrow will be displayed at the end\nof the item in order to indicate that there are items added. In that case components added\nto `endContent` slot or `additionalText` content will not be displayed.\n\nThe priority of what will be displayed at the end of the menu item is as follows:\nsub-menu arrow (if there are items added in `items` slot) -> components added in `endContent` -> text set to `additionalText`.\n- **endContent** - Defines the components that should be displayed at the end of the menu item.\n\n**Note:** It is highly recommended to slot only components of type `ui5-button`,`ui5-link`\nor `ui5-icon` in order to preserve the intended design. If there are components added to this slot,\nand there is text set in `additionalText`, it will not be displayed. If there are items added to `items` slot,\nnether `additionalText` nor components added to this slot would be displayed.\n\nThe priority of what will be displayed at the end of the menu item is as follows:\nsub-menu arrow (if there are items added in `items` slot) -> components added in `endContent` -> text set to `additionalText`.",
       "attributes": [
         {
           "name": "text",
@@ -2001,11 +1998,6 @@
           "description": "Defines the icon to be displayed as graphical element within the component.\nThe SAP-icons font provides numerous options.\n\n**Example:**\n\nSee all the available icons in the [Icon Explorer](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html).",
           "values": []
         },
-        {
-          "name": "starts-section",
-          "description": "Defines whether a visual separator should be rendered before the item.",
-          "values": []
-        },
         {
           "name": "disabled",
           "description": "Defines whether `ui5-menu-item` is in disabled state.\n\n**Note:** A disabled `ui5-menu-item` is noninteractive.",
@@ -2065,6 +2057,12 @@
       ],
       "references": []
     },
+    {
+      "name": "ui5-menu-separator",
+      "description": "The `ui5-menu-separator` represents a horizontal line to separate menu items inside a `ui5-menu`.\n\n\n---\n\n\n",
+      "attributes": [],
+      "references": []
+    },
     {
       "name": "ui5-message-strip",
       "description": "### Overview\n\nThe `ui5-message-strip` component enables the embedding of app-related messages.\nIt displays 4 designs of messages, each with corresponding semantic color and icon: Information, Positive, Critical and Negative.\nEach message can have a Close button, so that it can be removed from the UI, if needed.\n\n### Usage\n\nFor the `ui5-message-strip` component, you can define whether it displays\nan icon in the beginning and a close button. Moreover, its size and background\ncan be controlled with CSS.\n\n### Keyboard Handling\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/dist/MessageStrip.js\";`\n\n\n---\n\n\n\n\n### **Events:**\n - **close** - Fired when the close button is pressed either with a\nclick/tap or by using the Enter or Space key.\n\n### **Slots:**\n - **default** - Defines the text of the component.\n\n**Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.\n- **icon** - Defines the content to be displayed as graphical element within the component.\n\n**Note:** If no icon is given, the default icon for the component type will be used.\nThe SAP-icons font provides numerous options.\n\nSee all the available icons in the [Icon Explorer](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html).",
@@ -2219,7 +2217,7 @@
       "description": "The `ui5-mcb-item-group` is type of suggestion item,\nthat can be used to split the `ui5-multi-combobox` suggestions into groups.\n\n\n---\n\n\n\n\n### **Slots:**\n - **default** - Defines the items of the <code>ui5-mcb-item-group</code>.",
       "attributes": [
         {
-          "name": "text",
+          "name": "header-text",
           "description": "Defines the text of the component.",
           "values": []
         }
@@ -3137,6 +3135,11 @@
       "name": "ui5-special-date",
       "description": "### Overview\n\nThe `ui5-special-date` component defines a special calendar date to be used inside `ui5-calendar`,\nwhich is visually distinguished from the rest of the dates.\n\n\n---\n\n\n",
       "attributes": [
+        {
+          "name": "value",
+          "description": "The date formatted according to the `formatPattern` property\nof the `ui5-calendar` that hosts the component.",
+          "values": []
+        },
         {
           "name": "type",
           "description": "Defines the type of the special date.",
@@ -3160,11 +3163,6 @@
             { "name": "... 8 more ..." },
             { "name": "Type20" }
           ]
-        },
-        {
-          "name": "value",
-          "description": "The date formatted according to the `formatPattern` property\nof the `ui5-calendar` that hosts the component.",
-          "values": []
         }
       ],
       "references": []
@@ -3287,71 +3285,47 @@
       "references": []
     },
     {
-      "name": "ui5-suggestion-group-item",
-      "description": "The `ui5-suggestion-group-item` is type of suggestion item,\nthat can be used to split the `ui5-input` suggestions into groups.\n\n\n---\n\n\n",
+      "name": "ui5-suggestion-item",
+      "description": "The `ui5-suggestion-item` represents the suggestion item of the `ui5-input`.\n\n\n---\n\n\n",
       "attributes": [
         {
           "name": "text",
-          "description": "Defines the text of the `ui5-suggestion-group-item`.",
+          "description": "Defines the text of the component.",
+          "values": []
+        },
+        {
+          "name": "additional-text",
+          "description": "Defines the `additionalText`, displayed in the end of the item.",
           "values": []
         }
       ],
       "references": []
     },
     {
-      "name": "ui5-suggestion-item",
-      "description": "The `ui5-suggestion-item` represents the suggestion item of the `ui5-input`.\n\n\n---\n\n\n",
+      "name": "ui5-suggestion-item-custom",
+      "description": "The `ui5-suggestion-item-custom` is type of suggestion item,\nthat can be used to place suggestion items with custom content in the input.\nThe text property is considered only for autocomplete.\nIn case the user needs highlighting functionality, check \"@ui5/webcomponents-base/dist/util/generateHighlightedMarkup.js\"\n\n\n---\n\n\n\n\n### **Slots:**\n - **default** - Defines the content of the component.",
       "attributes": [
         {
           "name": "text",
-          "description": "Defines the text of the component.",
-          "values": []
-        },
-        {
-          "name": "type",
-          "description": "Defines the visual indication and behavior of the item.\nAvailable options are `Active` (by default), `Inactive` and `Detail`.\n\n**Note:** When set to `Active`, the item will provide visual response upon press and hover,\nwhile when `Inactive` or `Detail` - will not.",
-          "values": [
-            { "name": "Navigation" },
-            { "name": "Inactive" },
-            { "name": "Active" },
-            { "name": "Detail" }
-          ]
-        },
-        {
-          "name": "description",
-          "description": "Defines the description displayed right under the item text, if such is present.",
+          "description": "Defines the text of the `ui5-suggestion-item-custom`.\n**Note:** The text property is considered only for autocomplete.",
           "values": []
-        },
-        {
-          "name": "icon",
-          "description": "Defines the `icon` source URI.\n\n**Note:**\nSAP-icons font provides numerous built-in icons. To find all the available icons, see the\n[Icon Explorer](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html).",
-          "values": []
-        },
-        {
-          "name": "icon-end",
-          "description": "Defines whether the `icon` should be displayed in the beginning of the item or in the end.\n\n**Note:** If `image` is set, the `icon` would be displayed after the `image`.",
-          "values": []
-        },
+        }
+      ],
+      "references": []
+    },
+    {
+      "name": "ui5-suggestion-item-group",
+      "description": "The `ui5-suggestion-item-group` is type of suggestion item,\nthat can be used to split the `ui5-input` suggestions into groups.\n\n\n---\n\n\n\n\n### **Slots:**\n - **default** - Defines the items of the <code>ui5-suggestion-item-group</code>.",
+      "attributes": [
         {
-          "name": "image",
-          "description": "Defines the `image` source URI.\n\n**Note:** The `image` would be displayed in the beginning of the item.",
+          "name": "header-text",
+          "description": "Defines the header text of the <code>ui5-li-group</code>.",
           "values": []
         },
         {
-          "name": "additional-text",
-          "description": "Defines the `additionalText`, displayed in the end of the item.",
+          "name": "header-accessible-name",
+          "description": "Defines the accessible name of the header.",
           "values": []
-        },
-        {
-          "name": "additional-text-state",
-          "description": "Defines the state of the `additionalText`.",
-          "values": [
-            { "name": "Positive" },
-            { "name": "Negative" },
-            { "name": "None" },
-            { "name": "Critical" },
-            { "name": "Information" }
-          ]
         }
       ],
       "references": []
@@ -3535,6 +3509,11 @@
           "name": "loading",
           "description": "Defines if the loading indicator should be shown.\n\n<b>Note:</b> When the component is loading, it is non-interactive.",
           "values": []
+        },
+        {
+          "name": "loading-delay",
+          "description": "Defines the delay in milliseconds, after which the loading indicator will show up for this component.",
+          "values": []
         }
       ],
       "references": []
@@ -3625,6 +3604,11 @@
           "name": "interactive",
           "description": "Defines the interactive state of the row.",
           "values": []
+        },
+        {
+          "name": "navigated",
+          "description": "Defines the navigated state of the row.",
+          "values": []
         }
       ],
       "references": []