@ui5/webcomponents 2.26.0 → 2.27.0-rc.1

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",
-  "version": "2.26.0",
+  "version": "2.27.0-rc.1",
   "description-markup": "markdown",
   "contributions": {
     "html": {
@@ -2261,7 +2261,7 @@
             },
             {
               "name": "header-text",
-              "description": "Defines the header text of the <code>ui5-li-group</code>.",
+              "description": "Defines the header text of the group.",
               "value": { "type": "string | undefined", "default": "undefined" }
             },
             {
@@ -2302,7 +2302,7 @@
               },
               {
                 "name": "header-text",
-                "description": "Defines the header text of the <code>ui5-li-group</code>.",
+                "description": "Defines the header text of the group.",
                 "value": { "type": "string | undefined" }
               },
               {
@@ -2325,7 +2325,7 @@
         },
         {
           "name": "ui5-date-picker",
-          "description": "### Overview\n\nThe `ui5-date-picker` component provides an input field with assigned calendar which opens on user action.\nThe `ui5-date-picker` allows users to select a localized date using touch,\nmouse, or keyboard input. It consists of two parts: the date input field and the\ndate picker.\n\n### Usage\n\nThe user can enter a date by:\n\n- Using the calendar that opens in a popup\n- Typing it in directly in the input field\n\nWhen the user makes an entry and presses the enter key, the calendar shows the corresponding date.\nWhen the user directly triggers the calendar display, the actual date is displayed.\n\n### Formatting\n\nIf a date is entered by typing it into\nthe input field, it must fit to the used date format.\n\nSupported format options are pattern-based on Unicode LDML Date Format notation.\nFor more information, see [UTS #35: Unicode Locale Data Markup Language](https://unicode.org/reports/tr35/tr35-dates.html#Date_Field_Symbol_Table).\n\nFor example, if the valueFormat is \"yyyy-MM-dd\", the displayFormat is \"MMM d, y\", and the used locale is English, a valid value string is \"2015-07-30\", which leads to an output of \"Jul 30, 2015\".\nIf no placeholder is set to the DatePicker, the used displayFormat is displayed as a placeholder. If another placeholder is needed, it must be set.\n\n### Keyboard Handling\nThe `ui5-date-picker` provides advanced keyboard handling.\nIf the `ui5-date-picker` is focused,\nyou can open or close the drop-down by pressing [F4], [Alt] + [Up] or [Alt] + [Down] keys.\nOnce the drop-down is opened, you can use the [Up], [Down], [Left] or [Right] arrow keys\nto navigate through the dates and select one by pressing the `Space` or `Enter` keys. Moreover you can\nuse TAB to reach the buttons for changing month and year.\n\nIf the `ui5-date-picker` input field is focused and its corresponding picker dialog is not opened,\nthen users can increment or decrement the date referenced by `dateValue` property\nby using the following shortcuts:\n\n- [Page Down] - Decrements the corresponding day of the month by one\n- [Shift] + [Page Down] - Decrements the corresponding month by one\n- [Shift] + [Ctrl] + [Page Down] - Decrements the corresponding year by one\n- [Page Up] - Increments the corresponding day of the month by one\n- [Shift] + [Page Up] - Increments the corresponding month by one\n- [Shift] + [Ctrl] + [Page Up] - Increments the corresponding year by one\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/DatePicker.js\";`\n---\n\n\n### **Events:**\n - **change** - Fired when the input operation has finished by pressing Enter or on focusout.\n- **close** - Fired after the component's picker is closed.\n- **input** - Fired when the value of the component is changed at each key stroke.\n- **open** - Fired after the component's picker is opened.\n- **value-state-change** - Fired before the value state of the component is updated internally.\nThe event is preventable, meaning that if it's default action is\nprevented, the component will not update the value state.\n\n### **Methods:**\n - **formatValue(date: _Date_): _string_** - Formats a Java Script date object into a string representing a locale date\naccording to the `formatPattern` property of the DatePicker instance\n- **isInValidRange(value: _string_): _boolean_** - Checks if a date is between the minimum and maximum date.\n- **isValid(value: _string_): _boolean_** - @deprecated Use isValidValue or isValidDisplayValue instead - Checks if a value is valid against the current date format of the DatePicker.\n- **isValidDisplayValue(value: _string_): _boolean_** - Checks if a value is valid against the current date format of the DatePicker.\n- **isValidValue(value: _string_): _boolean_** - Checks if a value is valid against the current date format of the DatePicker.\n\n### **Slots:**\n - **valueStateMessage** - Defines the value state message that will be displayed as pop up under the component.\n\n**Note:** If not specified, a default text (in the respective language) will be displayed.\n\n**Note:** The `valueStateMessage` would be displayed,\nwhen the component is in `Information`, `Critical` or `Negative` value state.\n\n### **CSS Parts:**\n - **input** - Used to style the input element. This part is forwarded to the underlying ui5-input element.",
+          "description": "### Overview\n\nThe `ui5-date-picker` component provides an input field with assigned calendar which opens on user action.\nThe `ui5-date-picker` allows users to select a localized date using touch,\nmouse, or keyboard input. It consists of two parts: the date input field and the\ndate picker.\n\n### Usage\n\nThe user can enter a date by:\n\n- Using the calendar that opens in a popup\n- Typing it in directly in the input field\n\nWhen the user makes an entry and presses the enter key, the calendar shows the corresponding date.\nWhen the user directly triggers the calendar display, the actual date is displayed.\n\n### Formatting\n\nIf a date is entered by typing it into\nthe input field, it must fit to the used date format.\n\nSupported format options are pattern-based on Unicode LDML Date Format notation.\nFor more information, see [UTS #35: Unicode Locale Data Markup Language](https://unicode.org/reports/tr35/tr35-dates.html#Date_Field_Symbol_Table).\n\nFor example, if the valueFormat is \"yyyy-MM-dd\", the displayFormat is \"MMM d, y\", and the used locale is English, a valid value string is \"2015-07-30\", which leads to an output of \"Jul 30, 2015\".\nIf no placeholder is set to the DatePicker, the used displayFormat is displayed as a placeholder. If another placeholder is needed, it must be set.\n\n### Relative date input\n\nThe input field also accepts locale-aware relative date expressions sourced from the Unicode CLDR.\nThe following expressions are supported in English:\n\n- Day: \"today\", \"yesterday\", \"tomorrow\", \"in N days\", \"N days ago\"\n- Week: \"this week\", \"last week\", \"next week\", \"in N weeks\", \"N weeks ago\"\n- Month: \"this month\", \"last month\", \"next month\", \"in N months\", \"N months ago\"\n- Year: \"this year\", \"last year\", \"next year\", \"in N years\", \"N years ago\"\n\nThe recognized expressions are locale-specific — the equivalent terms in the user's language are used (for example, \"heute\" in German, \"bugün\" in Turkish).\nWeek, month, and year expressions resolve to an offset from today (for example, \"next week\" = today + 7 days).\nFor the full list of supported fields and patterns, see [CLDR Date Fields](https://unicode.org/reports/tr35/tr35-dates.html#Calendar_Fields).\n\n### Keyboard Handling\nThe `ui5-date-picker` provides advanced keyboard handling.\nIf the `ui5-date-picker` is focused,\nyou can open or close the drop-down by pressing [F4], [Alt] + [Up] or [Alt] + [Down] keys.\nOnce the drop-down is opened, you can use the [Up], [Down], [Left] or [Right] arrow keys\nto navigate through the dates and select one by pressing the `Space` or `Enter` keys. Moreover you can\nuse TAB to reach the buttons for changing month and year.\n\nIf the `ui5-date-picker` input field is focused and its corresponding picker dialog is not opened,\nthen users can increment or decrement the date referenced by `dateValue` property\nby using the following shortcuts:\n\n- [Page Down] - Decrements the corresponding day of the month by one\n- [Shift] + [Page Down] - Decrements the corresponding month by one\n- [Shift] + [Ctrl] + [Page Down] - Decrements the corresponding year by one\n- [Page Up] - Increments the corresponding day of the month by one\n- [Shift] + [Page Up] - Increments the corresponding month by one\n- [Shift] + [Ctrl] + [Page Up] - Increments the corresponding year by one\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/DatePicker.js\";`\n---\n\n\n### **Events:**\n - **change** - Fired when the input operation has finished by pressing Enter or on focusout.\n- **close** - Fired after the component's picker is closed.\n- **input** - Fired when the value of the component is changed at each key stroke.\n- **open** - Fired after the component's picker is opened.\n- **value-state-change** - Fired before the value state of the component is updated internally.\nThe event is preventable, meaning that if it's default action is\nprevented, the component will not update the value state.\n\n### **Methods:**\n - **formatValue(date: _Date_): _string_** - Formats a Java Script date object into a string representing a locale date\naccording to the `formatPattern` property of the DatePicker instance\n- **isInValidRange(value: _string_): _boolean_** - Checks if a date is between the minimum and maximum date.\n- **isValid(value: _string_): _boolean_** - @deprecated Use isValidValue or isValidDisplayValue instead - Checks if a value is valid against the current date format of the DatePicker.\n- **isValidDisplayValue(value: _string_): _boolean_** - Checks if a value is valid against the current date format of the DatePicker.\n- **isValidValue(value: _string_): _boolean_** - Checks if a value is valid against the current date format of the DatePicker.\n\n### **Slots:**\n - **valueStateMessage** - Defines the value state message that will be displayed as pop up under the component.\n\n**Note:** If not specified, a default text (in the respective language) will be displayed.\n\n**Note:** The `valueStateMessage` would be displayed,\nwhen the component is in `Information`, `Critical` or `Negative` value state.\n\n### **CSS Parts:**\n - **input** - Used to style the input element. This part is forwarded to the underlying ui5-input element.",
           "doc-url": "",
           "attributes": [
             {
@@ -5537,7 +5537,7 @@
             },
             {
               "name": "type",
-              "description": "Defines the visual indication and behavior of the list items.\nAvailable options are `Active` (by default), `Inactive`, `InactiveSelectable`, `Detail` and `Navigation`.\n\n**Note:** When set to `Active` or `Navigation`, the item will provide visual response upon press and hover,\nwhile with type `Inactive`, `InactiveSelectable` and `Detail` - will not.\n\n**Note:** `InactiveSelectable` behaves like `Inactive` but allows selection (checkbox/radio) to be toggled\nwhen the list has a selection mode. The `item-click` event is not fired for this type.",
+              "description": "Defines the visual indication and behavior of the list items.\nAvailable options are `Active` (by default), `Inactive`, `InactiveSelectable`, `Detail` and `Navigation`.\n\n**Note:** When set to `Active` or `Navigation`, the item will provide visual response upon press and hover,\nwhile with type `Inactive`, `InactiveSelectable` and `Detail` - will not.\n\n**Note:** `InactiveSelectable` behaves like `Inactive` but allows selection to be toggled\nvia the checkbox (Multi mode) or radio button (Single modes) when the list has a selection mode.\nClicking the item body or pressing Space/Enter does not trigger selection — only interacting\nwith the selection component directly does. The `item-click` event is not fired for this type.",
               "value": {
                 "type": "\"Navigation\" | \"Inactive\" | \"InactiveSelectable\" | \"Active\" | \"Detail\"",
                 "default": "\"Active\""
@@ -5612,7 +5612,7 @@
               },
               {
                 "name": "type",
-                "description": "Defines the visual indication and behavior of the list items.\nAvailable options are `Active` (by default), `Inactive`, `InactiveSelectable`, `Detail` and `Navigation`.\n\n**Note:** When set to `Active` or `Navigation`, the item will provide visual response upon press and hover,\nwhile with type `Inactive`, `InactiveSelectable` and `Detail` - will not.\n\n**Note:** `InactiveSelectable` behaves like `Inactive` but allows selection (checkbox/radio) to be toggled\nwhen the list has a selection mode. The `item-click` event is not fired for this type.",
+                "description": "Defines the visual indication and behavior of the list items.\nAvailable options are `Active` (by default), `Inactive`, `InactiveSelectable`, `Detail` and `Navigation`.\n\n**Note:** When set to `Active` or `Navigation`, the item will provide visual response upon press and hover,\nwhile with type `Inactive`, `InactiveSelectable` and `Detail` - will not.\n\n**Note:** `InactiveSelectable` behaves like `Inactive` but allows selection to be toggled\nvia the checkbox (Multi mode) or radio button (Single modes) when the list has a selection mode.\nClicking the item body or pressing Space/Enter does not trigger selection — only interacting\nwith the selection component directly does. The `item-click` event is not fired for this type.",
                 "value": {
                   "type": "\"Navigation\" | \"Inactive\" | \"InactiveSelectable\" | \"Active\" | \"Detail\""
                 }
@@ -5632,7 +5632,7 @@
         },
         {
           "name": "ui5-li-group",
-          "description": "### Overview\nThe `ui5-li-group` is a special list item, used only to create groups of list items.\n\nThis is the item to use inside a `ui5-list`.\n\n### ES6 Module Import\n`import \"@ui5/webcomponents/dist/ListItemGroup.js\";`\n---\n\n\n### **Events:**\n - **move** - Fired when a movable list item is dropped onto a drop target.\n\n**Note:** `move` event is fired only if there was a preceding `move-over` with prevented default action.\n- **move-over** - Fired when a movable list item is moved over a potential drop target during a dragging operation.\n\nIf the new position is valid, prevent the default action of the event using `preventDefault()`.\n\n### **Slots:**\n - **default** - Defines the items of the <code>ui5-li-group</code>.\n- **header** - Defines the header of the component.\n\n**Note:** Using this slot, the default header text of group and the value of `headerText` property will be overwritten.\n\n### **CSS Parts:**\n - **header** - Used to style the header item of the group\n- **title** - Used to style the title of the group header",
+          "description": "### Overview\nThe `ui5-li-group` is a special list item, used only to create groups of list items.\n\nThis is the item to use inside a `ui5-list`.\n\n### ES6 Module Import\n`import \"@ui5/webcomponents/dist/ListItemGroup.js\";`\n---\n\n\n### **Events:**\n - **move** - Fired when a movable list item is dropped onto a drop target.\n\n**Note:** `move` event is fired only if there was a preceding `move-over` with prevented default action.\n- **move-over** - Fired when a movable list item is moved over a potential drop target during a dragging operation.\n\nIf the new position is valid, prevent the default action of the event using `preventDefault()`.\n\n### **Slots:**\n - **default** - Defines the items of the group.\n- **header** - Defines the header of the component.\n\n**Note:** Using this slot, the default header text of group and the value of `headerText` property will be overwritten.\n\n### **CSS Parts:**\n - **header** - Used to style the header item of the group\n- **title** - Used to style the title of the group header",
           "doc-url": "",
           "attributes": [
             {
@@ -5642,7 +5642,7 @@
             },
             {
               "name": "header-text",
-              "description": "Defines the header text of the <code>ui5-li-group</code>.",
+              "description": "Defines the header text of the group.",
               "value": { "type": "string | undefined", "default": "undefined" }
             },
             {
@@ -5657,7 +5657,7 @@
           "slots": [
             {
               "name": "default",
-              "description": "Defines the items of the <code>ui5-li-group</code>."
+              "description": "Defines the items of the group."
             },
             {
               "name": "header",
@@ -5683,7 +5683,7 @@
               },
               {
                 "name": "header-text",
-                "description": "Defines the header text of the <code>ui5-li-group</code>.",
+                "description": "Defines the header text of the group.",
                 "value": { "type": "string | undefined" }
               },
               {
@@ -5845,7 +5845,7 @@
             },
             {
               "name": "type",
-              "description": "Defines the visual indication and behavior of the list items.\nAvailable options are `Active` (by default), `Inactive`, `InactiveSelectable`, `Detail` and `Navigation`.\n\n**Note:** When set to `Active` or `Navigation`, the item will provide visual response upon press and hover,\nwhile with type `Inactive`, `InactiveSelectable` and `Detail` - will not.\n\n**Note:** `InactiveSelectable` behaves like `Inactive` but allows selection (checkbox/radio) to be toggled\nwhen the list has a selection mode. The `item-click` event is not fired for this type.",
+              "description": "Defines the visual indication and behavior of the list items.\nAvailable options are `Active` (by default), `Inactive`, `InactiveSelectable`, `Detail` and `Navigation`.\n\n**Note:** When set to `Active` or `Navigation`, the item will provide visual response upon press and hover,\nwhile with type `Inactive`, `InactiveSelectable` and `Detail` - will not.\n\n**Note:** `InactiveSelectable` behaves like `Inactive` but allows selection to be toggled\nvia the checkbox (Multi mode) or radio button (Single modes) when the list has a selection mode.\nClicking the item body or pressing Space/Enter does not trigger selection — only interacting\nwith the selection component directly does. The `item-click` event is not fired for this type.",
               "value": {
                 "type": "\"Navigation\" | \"Inactive\" | \"InactiveSelectable\" | \"Active\" | \"Detail\"",
                 "default": "\"Active\""
@@ -5964,7 +5964,7 @@
               },
               {
                 "name": "type",
-                "description": "Defines the visual indication and behavior of the list items.\nAvailable options are `Active` (by default), `Inactive`, `InactiveSelectable`, `Detail` and `Navigation`.\n\n**Note:** When set to `Active` or `Navigation`, the item will provide visual response upon press and hover,\nwhile with type `Inactive`, `InactiveSelectable` and `Detail` - will not.\n\n**Note:** `InactiveSelectable` behaves like `Inactive` but allows selection (checkbox/radio) to be toggled\nwhen the list has a selection mode. The `item-click` event is not fired for this type.",
+                "description": "Defines the visual indication and behavior of the list items.\nAvailable options are `Active` (by default), `Inactive`, `InactiveSelectable`, `Detail` and `Navigation`.\n\n**Note:** When set to `Active` or `Navigation`, the item will provide visual response upon press and hover,\nwhile with type `Inactive`, `InactiveSelectable` and `Detail` - will not.\n\n**Note:** `InactiveSelectable` behaves like `Inactive` but allows selection to be toggled\nvia the checkbox (Multi mode) or radio button (Single modes) when the list has a selection mode.\nClicking the item body or pressing Space/Enter does not trigger selection — only interacting\nwith the selection component directly does. The `item-click` event is not fired for this type.",
                 "value": {
                   "type": "\"Navigation\" | \"Inactive\" | \"InactiveSelectable\" | \"Active\" | \"Detail\""
                 }
@@ -6214,7 +6214,7 @@
             },
             {
               "name": "type",
-              "description": "Defines the visual indication and behavior of the list items.\nAvailable options are `Active` (by default), `Inactive`, `InactiveSelectable`, `Detail` and `Navigation`.\n\n**Note:** When set to `Active` or `Navigation`, the item will provide visual response upon press and hover,\nwhile with type `Inactive`, `InactiveSelectable` and `Detail` - will not.\n\n**Note:** `InactiveSelectable` behaves like `Inactive` but allows selection (checkbox/radio) to be toggled\nwhen the list has a selection mode. The `item-click` event is not fired for this type.",
+              "description": "Defines the visual indication and behavior of the list items.\nAvailable options are `Active` (by default), `Inactive`, `InactiveSelectable`, `Detail` and `Navigation`.\n\n**Note:** When set to `Active` or `Navigation`, the item will provide visual response upon press and hover,\nwhile with type `Inactive`, `InactiveSelectable` and `Detail` - will not.\n\n**Note:** `InactiveSelectable` behaves like `Inactive` but allows selection to be toggled\nvia the checkbox (Multi mode) or radio button (Single modes) when the list has a selection mode.\nClicking the item body or pressing Space/Enter does not trigger selection — only interacting\nwith the selection component directly does. The `item-click` event is not fired for this type.",
               "value": {
                 "type": "\"Navigation\" | \"Inactive\" | \"InactiveSelectable\" | \"Active\" | \"Detail\"",
                 "default": "\"Active\""
@@ -6340,7 +6340,7 @@
               },
               {
                 "name": "type",
-                "description": "Defines the visual indication and behavior of the list items.\nAvailable options are `Active` (by default), `Inactive`, `InactiveSelectable`, `Detail` and `Navigation`.\n\n**Note:** When set to `Active` or `Navigation`, the item will provide visual response upon press and hover,\nwhile with type `Inactive`, `InactiveSelectable` and `Detail` - will not.\n\n**Note:** `InactiveSelectable` behaves like `Inactive` but allows selection (checkbox/radio) to be toggled\nwhen the list has a selection mode. The `item-click` event is not fired for this type.",
+                "description": "Defines the visual indication and behavior of the list items.\nAvailable options are `Active` (by default), `Inactive`, `InactiveSelectable`, `Detail` and `Navigation`.\n\n**Note:** When set to `Active` or `Navigation`, the item will provide visual response upon press and hover,\nwhile with type `Inactive`, `InactiveSelectable` and `Detail` - will not.\n\n**Note:** `InactiveSelectable` behaves like `Inactive` but allows selection to be toggled\nvia the checkbox (Multi mode) or radio button (Single modes) when the list has a selection mode.\nClicking the item body or pressing Space/Enter does not trigger selection — only interacting\nwith the selection component directly does. The `item-click` event is not fired for this type.",
                 "value": {
                   "type": "\"Navigation\" | \"Inactive\" | \"InactiveSelectable\" | \"Active\" | \"Detail\""
                 }
@@ -6985,7 +6985,7 @@
             },
             {
               "name": "header-text",
-              "description": "Defines the header text of the <code>ui5-li-group</code>.",
+              "description": "Defines the header text of the group.",
               "value": { "type": "string | undefined", "default": "undefined" }
             },
             {
@@ -7026,7 +7026,7 @@
               },
               {
                 "name": "header-text",
-                "description": "Defines the header text of the <code>ui5-li-group</code>.",
+                "description": "Defines the header text of the group.",
                 "value": { "type": "string | undefined" }
               },
               {
@@ -7349,6 +7349,186 @@
             ]
           }
         },
+        {
+          "name": "ui5-number-input",
+          "description": "### Overview\n\nThe `ui5-number-input` component is a numeric input field. It allows users to enter, edit and select numeric values.\n\n### Usage\n\nThe default step is 1 but the app developer can set a different one.\n\nApp developers can set a maximum and minimum value for `ui5-number-input`.\nThe increase/decrease button and the up/down keyboard navigation become disabled when\nthe value reaches the max/min or a new value is entered from the input which is greater/less than the max/min.\n\n#### When to use:\n\n- To enter or adjust numeric values.\n- To adjust values for a specific step.\n\n#### When not to use:\n\n- To enter a static number (for example, postal code, phone number, or ID). In this case,\nuse the regular `ui5-input` instead.\n- To enter dates and times. In this case, use date/time related components instead.\n\n### ES6 Module Import\n\n`import \"@ui5/webcomponents/dist/NumberInput.js\";`\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.\n- **value-state-change** - Fired before the value state of the component is updated internally.\nThe event is preventable, meaning that if its default action is\nprevented, the component will not update the value state.\n\n### **Slots:**\n - **valueStateMessage** - Defines the value state message that will be displayed as pop up under the component.\n\n**Note:** If not specified, a default text (in the respective language) will be displayed.\n\n**Note:** The `valueStateMessage` would be displayed,\nwhen the component is in `Information`, `Critical` or `Negative` value state.",
+          "doc-url": "",
+          "attributes": [
+            {
+              "name": "accessible-name",
+              "description": "Defines the accessible ARIA name of the component.",
+              "value": { "type": "string | undefined", "default": "undefined" }
+            },
+            {
+              "name": "accessible-name-ref",
+              "description": "Receives ID (or many IDs) of the elements that label the component.",
+              "value": { "type": "string | undefined", "default": "undefined" }
+            },
+            {
+              "name": "disabled",
+              "description": "Determines whether the component is displayed as disabled.",
+              "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "max",
+              "description": "Defines a maximum value of the component.",
+              "value": { "type": "number | undefined", "default": "undefined" }
+            },
+            {
+              "name": "min",
+              "description": "Defines a minimum value of the component.",
+              "value": { "type": "number | undefined", "default": "undefined" }
+            },
+            {
+              "name": "name",
+              "description": "Determines the name by which the component will be identified upon submission in an HTML form.\n\n**Note:** This property is only applicable within the context of an HTML Form element.",
+              "value": { "type": "string | undefined", "default": "undefined" }
+            },
+            {
+              "name": "placeholder",
+              "description": "Defines a short hint, intended to aid the user with data entry when the\ncomponent has no value.\n\n**Note:** When no placeholder is set, the format pattern is displayed as a placeholder.\nPassing an empty string as the value of this property will make the component appear empty - without placeholder or format pattern.",
+              "value": { "type": "string | undefined", "default": "undefined" }
+            },
+            {
+              "name": "readonly",
+              "description": "Determines whether the component is displayed as read-only.",
+              "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "required",
+              "description": "Defines whether the component is required.",
+              "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "step",
+              "description": "Defines a step of increasing/decreasing the value of the component.",
+              "value": { "type": "number", "default": "1" }
+            },
+            {
+              "name": "value",
+              "description": "Defines a value of the component.",
+              "value": { "type": "number", "default": "0" }
+            },
+            {
+              "name": "value-precision",
+              "description": "Determines the number of digits after the decimal point of the component.",
+              "value": { "type": "number", "default": "0" }
+            },
+            {
+              "name": "value-state",
+              "description": "Defines the value state of the component.",
+              "value": {
+                "type": "\"None\" | \"Positive\" | \"Critical\" | \"Negative\" | \"Information\"",
+                "default": "\"None\""
+              }
+            }
+          ],
+          "slots": [
+            {
+              "name": "valueStateMessage",
+              "description": "Defines the value state message that will be displayed as pop up under the component.\n\n**Note:** If not specified, a default text (in the respective language) will be displayed.\n\n**Note:** The `valueStateMessage` would be displayed,\nwhen the component is in `Information`, `Critical` or `Negative` value state."
+            }
+          ],
+          "events": [
+            {
+              "name": "change",
+              "description": "Fired when the input operation has finished by pressing Enter or on focusout."
+            },
+            {
+              "name": "input",
+              "description": "Fired when the value of the component changes at each keystroke."
+            },
+            {
+              "name": "value-state-change",
+              "description": "Fired before the value state of the component is updated internally.\nThe event is preventable, meaning that if its default action is\nprevented, the component will not update the value state."
+            }
+          ],
+          "js": {
+            "properties": [
+              {
+                "name": "accessible-name",
+                "description": "Defines the accessible ARIA name of the component.",
+                "value": { "type": "string | undefined" }
+              },
+              {
+                "name": "accessible-name-ref",
+                "description": "Receives ID (or many IDs) of the elements that label the component.",
+                "value": { "type": "string | undefined" }
+              },
+              {
+                "name": "disabled",
+                "description": "Determines whether the component is displayed as disabled.",
+                "value": { "type": "boolean" }
+              },
+              {
+                "name": "max",
+                "description": "Defines a maximum value of the component.",
+                "value": { "type": "number | undefined" }
+              },
+              {
+                "name": "min",
+                "description": "Defines a minimum value of the component.",
+                "value": { "type": "number | undefined" }
+              },
+              {
+                "name": "name",
+                "description": "Determines the name by which the component will be identified upon submission in an HTML form.\n\n**Note:** This property is only applicable within the context of an HTML Form element.",
+                "value": { "type": "string | undefined" }
+              },
+              {
+                "name": "placeholder",
+                "description": "Defines a short hint, intended to aid the user with data entry when the\ncomponent has no value.\n\n**Note:** When no placeholder is set, the format pattern is displayed as a placeholder.\nPassing an empty string as the value of this property will make the component appear empty - without placeholder or format pattern.",
+                "value": { "type": "string | undefined" }
+              },
+              {
+                "name": "readonly",
+                "description": "Determines whether the component is displayed as read-only.",
+                "value": { "type": "boolean" }
+              },
+              {
+                "name": "required",
+                "description": "Defines whether the component is required.",
+                "value": { "type": "boolean" }
+              },
+              {
+                "name": "step",
+                "description": "Defines a step of increasing/decreasing the value of the component.",
+                "value": { "type": "number" }
+              },
+              {
+                "name": "value",
+                "description": "Defines a value of the component.",
+                "value": { "type": "number" }
+              },
+              {
+                "name": "value-precision",
+                "description": "Determines the number of digits after the decimal point of the component.",
+                "value": { "type": "number" }
+              },
+              {
+                "name": "value-state",
+                "description": "Defines the value state of the component.",
+                "value": {
+                  "type": "\"None\" | \"Positive\" | \"Critical\" | \"Negative\" | \"Information\""
+                }
+              }
+            ],
+            "events": [
+              {
+                "name": "change",
+                "description": "Fired when the input operation has finished by pressing Enter or on focusout."
+              },
+              {
+                "name": "input",
+                "description": "Fired when the value of the component changes at each keystroke."
+              },
+              {
+                "name": "value-state-change",
+                "description": "Fired before the value state of the component is updated internally.\nThe event is preventable, meaning that if its default action is\nprevented, the component will not update the value state."
+              }
+            ]
+          }
+        },
         {
           "name": "ui5-option",
           "description": "### Overview\n\nThe `ui5-option` component defines the content of an option in the `ui5-select`.\n\n### ES6 Module Import\n\n`import \"@ui5/webcomponents/dist/Option.js\";`\n---\n\n\n### **Events:**\n - **click** - 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`.\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.",
@@ -7497,6 +7677,35 @@
             ]
           }
         },
+        {
+          "name": "ui5-option-group",
+          "description": "### Overview\n\nThe `ui5-option-group` component is used to group options within a `ui5-select`.\n\n### ES6 Module Import\n\n`import \"@ui5/webcomponents/dist/OptionGroup.js\";`\n---\n\n\n### **Slots:**\n - **default** - Defines the options of the group.\n\n**Note:** Use the `ui5-option` component to define the desired options.",
+          "doc-url": "",
+          "attributes": [
+            {
+              "name": "header-text",
+              "description": "Defines the header text of the group.",
+              "value": { "type": "string | undefined", "default": "undefined" }
+            }
+          ],
+          "slots": [
+            {
+              "name": "default",
+              "description": "Defines the options of the group.\n\n**Note:** Use the `ui5-option` component to define the desired options."
+            }
+          ],
+          "events": [],
+          "js": {
+            "properties": [
+              {
+                "name": "header-text",
+                "description": "Defines the header text of the group.",
+                "value": { "type": "string | undefined" }
+              }
+            ],
+            "events": []
+          }
+        },
         {
           "name": "ui5-panel",
           "description": "### Overview\n\nThe `ui5-panel` component is a container which has a header and a\ncontent area and is used\nfor grouping and displaying information. It can be collapsed to save space on the screen.\n\n### Guidelines:\n\n- Nesting two or more panels is not recommended.\n- Do not stack too many panels on one page.\n\n### Structure\nThe panel's header area consists of a title bar with a header text or custom header.\n\nThe header is clickable and can be used to toggle between the expanded and collapsed state. It includes an icon which rotates depending on the state.\n\nThe custom header can be set through the `header` slot and it may contain arbitraray content, such as: title, buttons or any other HTML elements.\n\nThe content area can contain an arbitrary set of controls.\n\n**Note:** The custom header is not clickable out of the box, but in this case the icon is interactive and allows to show/hide the content area.\n\n### Responsive Behavior\n\n- If the width of the panel is set to 100% (default), the panel and its children are\nresized responsively,\ndepending on its parent container.\n- If the panel has a fixed height, it will take up the space even if the panel is\ncollapsed.\n- When the panel is expandable (the `fixed` property is set to `false`),\nan arrow icon (pointing to the right) appears in front of the header.\n- When the animation is activated, expand/collapse uses a smooth animation to open or\nclose the content area.\n- When the panel expands/collapses, the arrow icon rotates 90 degrees\nclockwise/counter-clockwise.\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/Panel.js\";`\n---\n\n\n### **Events:**\n - **toggle** - Fired when the component is expanded/collapsed by user interaction.\n\n### **Slots:**\n - **default** - Defines the content of the component. The content is visible only when the component is expanded.\n- **header** - Defines the component header area.\n\n**Note:** When a header is provided, the `headerText` property is ignored.\n\n### **CSS Parts:**\n - **content** - Used to style the wrapper of the content.\n- **header** - Used to style the header.\n- **header-wrapper** - Used to style the outermost header wrapper, useful for adjusting sticky header position.",
@@ -8862,7 +9071,7 @@
         },
         {
           "name": "ui5-select",
-          "description": "### Overview\n\nThe `ui5-select` component is used to create a drop-down list.\n\n### Usage\n\nThere are two main usages of the `ui5-select>`.\n\n- With Option (`ui5-option`) web component:\n\nThe available options of the Select are defined by using the Option component.\nThe Option comes with predefined design and layout, including `icon`, `text` and `additional-text`.\n\n- With OptionCustom (`ui5-option-custom`) web component.\n\nOptions with custom content are defined by using the OptionCustom component.\nThe OptionCustom component comes with no predefined layout and it expects consumers to define it.\n\n### Selection\n\nThe options can be selected via user interaction (click or with the use of the Space and Enter keys)\nand programmatically - the Select component supports two distinct selection APIs, though mixing them is not supported:\n- The \"value\" property of the Select component\n- The \"selected\" property on individual options\n\n**Note:** If the \"value\" property is set but does not match any option,\nno option will be selected and the Select component will be displayed as empty.\n\n**Note:** when both \"value\" and \"selected\" are both used (although discouraged),\nthe \"value\" property will take precedence.\n\n### Keyboard Handling\n\nThe `ui5-select` provides advanced keyboard handling.\n\n- [F4] / [Alt] + [Up] / [Alt] + [Down] / [Space] or [Enter] - Opens/closes the drop-down.\n- [Up] or [Down] - If the drop-down is closed - changes selection to the next or the previous option. If the drop-down is opened - moves focus to the next or the previous option.\n- [Space], [Enter] - If the drop-down is opened - selects the focused option.\n- [Escape] - Closes the drop-down without changing the selection.\n- [Home] - Navigates to first option\n- [End] - Navigates to the last option\n\n### ES6 Module Import\n\n`import \"@ui5/webcomponents/dist/Select\";`\n\n`import \"@ui5/webcomponents/dist/Option\";`\n`import \"@ui5/webcomponents/dist/OptionCustom\";`\n---\n\n\n### **Events:**\n - **change** - Fired when the selected option changes.\n- **close** - Fired after the component's dropdown menu closes.\n- **live-change** - Fired when the user navigates through the options, but the selection is not finalized,\nor when pressing the ESC key to revert the current selection.\n- **open** - Fired after the component's dropdown menu opens.\n\n### **Slots:**\n - **default** - Defines the component options.\n\n**Note:** Only one selected option is allowed.\nIf more than one option is defined as selected, the last one would be considered as the selected one.\n\n**Note:** Use the `ui5-option` component to define the desired options.\n- **label** - Defines the HTML element that will be displayed in the component input part,\nrepresenting the selected option.\n\n**Note:** If not specified and `ui5-option-custom` is used,\neither the option's `display-text` or its textContent will be displayed.\n\n**Note:** If not specified and `ui5-option` is used,\nthe option's textContent will be displayed.\n- **valueStateMessage** - Defines the value state message that will be displayed as pop up under the component.\n\n**Note:** If not specified, a default text (in the respective language) will be displayed.\n\n**Note:** The `valueStateMessage` would be displayed,\nwhen the component is in `Information`, `Critical` or `Negative` value state.\n\n**Note:** If the component has `suggestionItems`,\nthe `valueStateMessage` would be displayed as part of the same popover, if used on desktop, or dialog - on phone.\n\n### **CSS Parts:**\n - **popover** - Used to style the popover element",
+          "description": "### Overview\n\nThe `ui5-select` component is used to create a drop-down list.\n\n### Usage\n\nThere are two main usages of the `ui5-select>`.\n\n- With Option (`ui5-option`) web component:\n\nThe available options of the Select are defined by using the Option component.\nThe Option comes with predefined design and layout, including `icon`, `text` and `additional-text`.\n\n- With OptionCustom (`ui5-option-custom`) web component.\n\nOptions with custom content are defined by using the OptionCustom component.\nThe OptionCustom component comes with no predefined layout and it expects consumers to define it.\n\n### Selection\n\nThe options can be selected via user interaction (click or with the use of the Space and Enter keys)\nand programmatically - the Select component supports two distinct selection APIs, though mixing them is not supported:\n- The \"value\" property of the Select component\n- The \"selected\" property on individual options\n\n**Note:** If the \"value\" property is set but does not match any option,\nno option will be selected and the Select component will be displayed as empty.\n\n**Note:** when both \"value\" and \"selected\" are both used (although discouraged),\nthe \"value\" property will take precedence.\n\n### Keyboard Handling\n\nThe `ui5-select` provides advanced keyboard handling.\n\n- [F4] / [Alt] + [Up] / [Alt] + [Down] / [Space] or [Enter] - Opens/closes the drop-down.\n- [Up] or [Down] - If the drop-down is closed - changes selection to the next or the previous option. If the drop-down is opened - moves focus to the next or the previous option.\n- [Space], [Enter] - If the drop-down is opened - selects the focused option.\n- [Escape] - Closes the drop-down without changing the selection.\n- [Home] - Navigates to first option\n- [End] - Navigates to the last option\n\n### ES6 Module Import\n\n`import \"@ui5/webcomponents/dist/Select\";`\n\n`import \"@ui5/webcomponents/dist/Option\";`\n`import \"@ui5/webcomponents/dist/OptionCustom\";`\n---\n\n\n### **Events:**\n - **change** - Fired when the selected option changes.\n- **close** - Fired after the component's dropdown menu closes.\n- **live-change** - Fired when the user navigates through the options, but the selection is not finalized,\nor when pressing the ESC key to revert the current selection.\n- **open** - Fired after the component's dropdown menu opens.\n\n### **Slots:**\n - **default** - Defines the component options.\n\n**Note:** Only one selected option is allowed.\nIf more than one option is defined as selected, the last one would be considered as the selected one.\n\n**Note:** Use the `ui5-option` component to define the desired options.\nUse the `ui5-option-group` component to group options.\n- **label** - Defines the HTML element that will be displayed in the component input part,\nrepresenting the selected option.\n\n**Note:** If not specified and `ui5-option-custom` is used,\neither the option's `display-text` or its textContent will be displayed.\n\n**Note:** If not specified and `ui5-option` is used,\nthe option's textContent will be displayed.\n- **valueStateMessage** - Defines the value state message that will be displayed as pop up under the component.\n\n**Note:** If not specified, a default text (in the respective language) will be displayed.\n\n**Note:** The `valueStateMessage` would be displayed,\nwhen the component is in `Information`, `Critical` or `Negative` value state.\n\n**Note:** If the component has `suggestionItems`,\nthe `valueStateMessage` would be displayed as part of the same popover, if used on desktop, or dialog - on phone.\n\n### **CSS Parts:**\n - **popover** - Used to style the popover element",
           "doc-url": "",
           "attributes": [
             {
@@ -8940,7 +9149,7 @@
           "slots": [
             {
               "name": "default",
-              "description": "Defines the component options.\n\n**Note:** Only one selected option is allowed.\nIf more than one option is defined as selected, the last one would be considered as the selected one.\n\n**Note:** Use the `ui5-option` component to define the desired options."
+              "description": "Defines the component options.\n\n**Note:** Only one selected option is allowed.\nIf more than one option is defined as selected, the last one would be considered as the selected one.\n\n**Note:** Use the `ui5-option` component to define the desired options.\nUse the `ui5-option-group` component to group options."
             },
             {
               "name": "label",
@@ -9271,7 +9480,7 @@
           "attributes": [
             {
               "name": "accessibility-attributes",
-              "description": "Defines the additional accessibility attributes that will be applied to the component.\nThe `accessibilityAttributes` property accepts an object with the following optional fields:\n\n- **root**: Attributes that will be applied to the main (text) button.\n  - **hasPopup**: Indicates the presence and type of popup triggered by the button.\n    Accepts string values: `\"dialog\"`, `\"grid\"`, `\"listbox\"`, `\"menu\"`, or `\"tree\"`.\n  - **roleDescription**: Provides a human-readable description for the role of the button.\n    Accepts any string value.\n  - **title**: Specifies a tooltip or description for screen readers.\n    Accepts any string value.\n\t- **ariaKeyShortcuts**: Defines keyboard shortcuts that activate or give focus to the button.\n\n- **arrowButton**: Attributes applied specifically to the arrow (split) button.\n  - **hasPopup**: Indicates the presence and type of popup triggered by the arrow button.\n    Accepts string values: `\"dialog\"`, `\"grid\"`, `\"listbox\"`, `\"menu\"`, or `\"tree\"`.\n  - **expanded**: Indicates whether the popup triggered by the arrow button is currently expanded.\n    Accepts boolean values: `true` or `false`.",
+              "description": "Defines the additional accessibility attributes that will be applied to the component.\nThe `accessibilityAttributes` property accepts an object with the following optional fields:\n\n- **root**: Attributes that will be applied to the main (text) button.\n  - **hasPopup**: Indicates the presence and type of popup triggered by the button.\n    Accepts string values: `\"dialog\"`, `\"grid\"`, `\"listbox\"`, `\"menu\"`, or `\"tree\"`.\n  - **title**: Specifies a tooltip or description for screen readers.\n    Accepts any string value.\n\t- **ariaKeyShortcuts**: Defines keyboard shortcuts that activate or give focus to the button.\n\n- **arrowButton**: Attributes applied specifically to the arrow (split) button.\n  - **hasPopup**: Indicates the presence and type of popup triggered by the arrow button.\n    Accepts string values: `\"dialog\"`, `\"grid\"`, `\"listbox\"`, `\"menu\"`, or `\"tree\"`.\n  - **expanded**: Indicates whether the popup triggered by the arrow button is currently expanded.\n    Accepts boolean values: `true` or `false`.",
               "value": {
                 "type": "SplitButtonAccessibilityAttributes",
                 "default": "{}"
@@ -9326,7 +9535,7 @@
             "properties": [
               {
                 "name": "accessibility-attributes",
-                "description": "Defines the additional accessibility attributes that will be applied to the component.\nThe `accessibilityAttributes` property accepts an object with the following optional fields:\n\n- **root**: Attributes that will be applied to the main (text) button.\n  - **hasPopup**: Indicates the presence and type of popup triggered by the button.\n    Accepts string values: `\"dialog\"`, `\"grid\"`, `\"listbox\"`, `\"menu\"`, or `\"tree\"`.\n  - **roleDescription**: Provides a human-readable description for the role of the button.\n    Accepts any string value.\n  - **title**: Specifies a tooltip or description for screen readers.\n    Accepts any string value.\n\t- **ariaKeyShortcuts**: Defines keyboard shortcuts that activate or give focus to the button.\n\n- **arrowButton**: Attributes applied specifically to the arrow (split) button.\n  - **hasPopup**: Indicates the presence and type of popup triggered by the arrow button.\n    Accepts string values: `\"dialog\"`, `\"grid\"`, `\"listbox\"`, `\"menu\"`, or `\"tree\"`.\n  - **expanded**: Indicates whether the popup triggered by the arrow button is currently expanded.\n    Accepts boolean values: `true` or `false`.",
+                "description": "Defines the additional accessibility attributes that will be applied to the component.\nThe `accessibilityAttributes` property accepts an object with the following optional fields:\n\n- **root**: Attributes that will be applied to the main (text) button.\n  - **hasPopup**: Indicates the presence and type of popup triggered by the button.\n    Accepts string values: `\"dialog\"`, `\"grid\"`, `\"listbox\"`, `\"menu\"`, or `\"tree\"`.\n  - **title**: Specifies a tooltip or description for screen readers.\n    Accepts any string value.\n\t- **ariaKeyShortcuts**: Defines keyboard shortcuts that activate or give focus to the button.\n\n- **arrowButton**: Attributes applied specifically to the arrow (split) button.\n  - **hasPopup**: Indicates the presence and type of popup triggered by the arrow button.\n    Accepts string values: `\"dialog\"`, `\"grid\"`, `\"listbox\"`, `\"menu\"`, or `\"tree\"`.\n  - **expanded**: Indicates whether the popup triggered by the arrow button is currently expanded.\n    Accepts boolean values: `true` or `false`.",
                 "value": { "type": "SplitButtonAccessibilityAttributes" }
               },
               {
@@ -9371,7 +9580,7 @@
         },
         {
           "name": "ui5-step-input",
-          "description": "### Overview\n\nThe `ui5-step-input` consists of an input field and buttons with icons to increase/decrease the value\nwith the predefined step.\n\nThe user can change the value of the component by pressing the increase/decrease buttons,\nby typing a number directly, by using the keyboard up/down and page up/down,\nor by using the mouse scroll wheel. Decimal values are supported.\n\n### Usage\n\nThe default step is 1 but the app developer can set a different one.\n\nApp developers can set a maximum and minimum value for the `StepInput`.\nThe increase/decrease button and the up/down keyboard navigation become disabled when\nthe value reaches the max/min or a new value is entered from the input which is greater/less than the max/min.\n\n#### When to use:\n\n- To adjust amounts, quantities, or other values quickly.\n- To adjust values for a specific step.\n\n#### When not to use:\n\n- To enter a static number (for example, postal code, phone number, or ID). In this case,\nuse the regular `ui5-input` instead.\n- To display a value that rarely needs to be adjusted and does not pertain to a particular step.\nIn this case, use the regular `ui5-input` instead.\n- To enter dates and times. In this case, use date/time related components instead.\n\n### ES6 Module Import\n\n`import \"@ui5/webcomponents/dist/StepInput.js\";`\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.\n- **value-state-change** - Fired before the value state of the component is updated internally.\nThe event is preventable, meaning that if it's default action is\nprevented, the component will not update the value state.\n\n### **Slots:**\n - **valueStateMessage** - Defines the value state message that will be displayed as pop up under the component.\n\n**Note:** If not specified, a default text (in the respective language) will be displayed.\n\n**Note:** The `valueStateMessage` would be displayed,\nwhen the component is in `Information`, `Critical` or `Negative` value state.",
+          "description": "### Overview\n\nThe `ui5-step-input` consists of an input field and buttons with icons to increase/decrease the value\nwith the predefined step.\n\nThe user can change the value of the component by pressing the increase/decrease buttons,\nby typing a number directly, by using the keyboard up/down and page up/down,\nor by using the mouse scroll wheel. Decimal values are supported.\n\n### Usage\n\nThe default step is 1 but the app developer can set a different one.\n\nApp developers can set a maximum and minimum value for the `StepInput`.\nThe increase/decrease button and the up/down keyboard navigation become disabled when\nthe value reaches the max/min or a new value is entered from the input which is greater/less than the max/min.\n\n#### When to use:\n\n- To adjust amounts, quantities, or other values quickly.\n- To adjust values for a specific step.\n\n#### When not to use:\n\n- To enter a static number (for example, postal code, phone number, or ID). In this case,\nuse the regular `ui5-input` instead.\n- To display a value that rarely needs to be adjusted and does not pertain to a particular step.\nIn this case, use the regular `ui5-input` instead.\n- To enter dates and times. In this case, use date/time related components instead.\n\n### ES6 Module Import\n\n`import \"@ui5/webcomponents/dist/StepInput.js\";`\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.\n- **value-state-change** - Fired before the value state of the component is updated internally.\nThe event is preventable, meaning that if it's default action is\nprevented, the component will not update the value state.\n\n### **Slots:**\n - **valueStateMessage** - Defines the value state message that will be displayed as pop up under the component.",
           "doc-url": "",
           "attributes": [
             {
@@ -9401,12 +9610,12 @@
             },
             {
               "name": "name",
-              "description": "Determines the name by which the component will be identified upon submission in an HTML form.\n\n**Note:** This property is only applicable within the context of an HTML Form element.",
+              "description": "Determines the name by which the component will be identified upon submission in an HTML form.",
               "value": { "type": "string | undefined", "default": "undefined" }
             },
             {
               "name": "placeholder",
-              "description": "Defines a short hint, intended to aid the user with data entry when the\ncomponent has no value.\n\n**Note:** When no placeholder is set, the format pattern is displayed as a placeholder.\nPassing an empty string as the value of this property will make the component appear empty - without placeholder or format pattern.",
+              "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" }
             },
             {
@@ -9446,7 +9655,7 @@
           "slots": [
             {
               "name": "valueStateMessage",
-              "description": "Defines the value state message that will be displayed as pop up under the component.\n\n**Note:** If not specified, a default text (in the respective language) will be displayed.\n\n**Note:** The `valueStateMessage` would be displayed,\nwhen the component is in `Information`, `Critical` or `Negative` value state."
+              "description": "Defines the value state message that will be displayed as pop up under the component."
             }
           ],
           "events": [
@@ -9492,12 +9701,12 @@
               },
               {
                 "name": "name",
-                "description": "Determines the name by which the component will be identified upon submission in an HTML form.\n\n**Note:** This property is only applicable within the context of an HTML Form element.",
+                "description": "Determines the name by which the component will be identified upon submission in an HTML form.",
                 "value": { "type": "string | undefined" }
               },
               {
                 "name": "placeholder",
-                "description": "Defines a short hint, intended to aid the user with data entry when the\ncomponent has no value.\n\n**Note:** When no placeholder is set, the format pattern is displayed as a placeholder.\nPassing an empty string as the value of this property will make the component appear empty - without placeholder or format pattern.",
+                "description": "Defines a short hint, intended to aid the user with data entry when the\ncomponent has no value.",
                 "value": { "type": "string | undefined" }
               },
               {
@@ -9643,7 +9852,7 @@
             },
             {
               "name": "header-text",
-              "description": "Defines the header text of the <code>ui5-li-group</code>.",
+              "description": "Defines the header text of the group.",
               "value": { "type": "string | undefined", "default": "undefined" }
             },
             {
@@ -9684,7 +9893,7 @@
               },
               {
                 "name": "header-text",
-                "description": "Defines the header text of the <code>ui5-li-group</code>.",
+                "description": "Defines the header text of the group.",
                 "value": { "type": "string | undefined" }
               },
               {
@@ -9794,7 +10003,7 @@
             },
             {
               "name": "type",
-              "description": "Defines the visual indication and behavior of the list items.\nAvailable options are `Active` (by default), `Inactive`, `InactiveSelectable`, `Detail` and `Navigation`.\n\n**Note:** When set to `Active` or `Navigation`, the item will provide visual response upon press and hover,\nwhile with type `Inactive`, `InactiveSelectable` and `Detail` - will not.\n\n**Note:** `InactiveSelectable` behaves like `Inactive` but allows selection (checkbox/radio) to be toggled\nwhen the list has a selection mode. The `item-click` event is not fired for this type.",
+              "description": "Defines the visual indication and behavior of the list items.\nAvailable options are `Active` (by default), `Inactive`, `InactiveSelectable`, `Detail` and `Navigation`.\n\n**Note:** When set to `Active` or `Navigation`, the item will provide visual response upon press and hover,\nwhile with type `Inactive`, `InactiveSelectable` and `Detail` - will not.\n\n**Note:** `InactiveSelectable` behaves like `Inactive` but allows selection to be toggled\nvia the checkbox (Multi mode) or radio button (Single modes) when the list has a selection mode.\nClicking the item body or pressing Space/Enter does not trigger selection — only interacting\nwith the selection component directly does. The `item-click` event is not fired for this type.",
               "value": {
                 "type": "\"Navigation\" | \"Inactive\" | \"InactiveSelectable\" | \"Active\" | \"Detail\"",
                 "default": "\"Active\""
@@ -9917,7 +10126,7 @@
               },
               {
                 "name": "type",
-                "description": "Defines the visual indication and behavior of the list items.\nAvailable options are `Active` (by default), `Inactive`, `InactiveSelectable`, `Detail` and `Navigation`.\n\n**Note:** When set to `Active` or `Navigation`, the item will provide visual response upon press and hover,\nwhile with type `Inactive`, `InactiveSelectable` and `Detail` - will not.\n\n**Note:** `InactiveSelectable` behaves like `Inactive` but allows selection (checkbox/radio) to be toggled\nwhen the list has a selection mode. The `item-click` event is not fired for this type.",
+                "description": "Defines the visual indication and behavior of the list items.\nAvailable options are `Active` (by default), `Inactive`, `InactiveSelectable`, `Detail` and `Navigation`.\n\n**Note:** When set to `Active` or `Navigation`, the item will provide visual response upon press and hover,\nwhile with type `Inactive`, `InactiveSelectable` and `Detail` - will not.\n\n**Note:** `InactiveSelectable` behaves like `Inactive` but allows selection to be toggled\nvia the checkbox (Multi mode) or radio button (Single modes) when the list has a selection mode.\nClicking the item body or pressing Space/Enter does not trigger selection — only interacting\nwith the selection component directly does. The `item-click` event is not fired for this type.",
                 "value": {
                   "type": "\"Navigation\" | \"Inactive\" | \"InactiveSelectable\" | \"Active\" | \"Detail\""
                 }
@@ -12610,6 +12819,11 @@
                 "default": "{}"
               }
             },
+            {
+              "name": "accessible-description",
+              "description": "Defines the accessible description of the component.",
+              "value": { "type": "string | undefined", "default": "undefined" }
+            },
             {
               "name": "accessible-name",
               "description": "Defines the accessible ARIA name of the component.",
@@ -12620,6 +12834,14 @@
               "description": "Receives id(or many ids) of the elements that label the component.",
               "value": { "type": "string | undefined", "default": "undefined" }
             },
+            {
+              "name": "accessible-role",
+              "description": "Defines the ARIA role of the component.\n\n**Note:** Use `ButtonAccessibleRole.Link` role only with a press handler that performs navigation.\nIn all other scenarios the default button semantics are recommended.",
+              "value": {
+                "type": "\"Button\" | \"Link\"",
+                "default": "\"Button\""
+              }
+            },
             {
               "name": "design",
               "description": "Defines the action design.",
@@ -12690,6 +12912,11 @@
                 "description": "Defines the additional accessibility attributes that will be applied to the component.\n\nThe following fields are supported:\n\n- **expanded**: Indicates whether the button, or another grouping element it controls, is currently expanded or collapsed.\nAccepts the following string values: `true` or `false`\n\n- **hasPopup**: Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by the button.\nAccepts the following string values: `dialog`, `grid`, `listbox`, `menu` or `tree`.\n\n- **controls**: Identifies the element (or elements) whose contents or presence are controlled by the button element.\nAccepts a lowercase string value.",
                 "value": { "type": "ButtonAccessibilityAttributes" }
               },
+              {
+                "name": "accessible-description",
+                "description": "Defines the accessible description of the component.",
+                "value": { "type": "string | undefined" }
+              },
               {
                 "name": "accessible-name",
                 "description": "Defines the accessible ARIA name of the component.",
@@ -12700,6 +12927,11 @@
                 "description": "Receives id(or many ids) of the elements that label the component.",
                 "value": { "type": "string | undefined" }
               },
+              {
+                "name": "accessible-role",
+                "description": "Defines the ARIA role of the component.\n\n**Note:** Use `ButtonAccessibleRole.Link` role only with a press handler that performs navigation.\nIn all other scenarios the default button semantics are recommended.",
+                "value": { "type": "\"Button\" | \"Link\"" }
+              },
               {
                 "name": "design",
                 "description": "Defines the action design.",
@@ -13336,7 +13568,7 @@
             },
             {
               "name": "type",
-              "description": "Defines the visual indication and behavior of the list items.\nAvailable options are `Active` (by default), `Inactive`, `InactiveSelectable`, `Detail` and `Navigation`.\n\n**Note:** When set to `Active` or `Navigation`, the item will provide visual response upon press and hover,\nwhile with type `Inactive`, `InactiveSelectable` and `Detail` - will not.\n\n**Note:** `InactiveSelectable` behaves like `Inactive` but allows selection (checkbox/radio) to be toggled\nwhen the list has a selection mode. The `item-click` event is not fired for this type.",
+              "description": "Defines the visual indication and behavior of the list items.\nAvailable options are `Active` (by default), `Inactive`, `InactiveSelectable`, `Detail` and `Navigation`.\n\n**Note:** When set to `Active` or `Navigation`, the item will provide visual response upon press and hover,\nwhile with type `Inactive`, `InactiveSelectable` and `Detail` - will not.\n\n**Note:** `InactiveSelectable` behaves like `Inactive` but allows selection to be toggled\nvia the checkbox (Multi mode) or radio button (Single modes) when the list has a selection mode.\nClicking the item body or pressing Space/Enter does not trigger selection — only interacting\nwith the selection component directly does. The `item-click` event is not fired for this type.",
               "value": {
                 "type": "\"Navigation\" | \"Inactive\" | \"InactiveSelectable\" | \"Active\" | \"Detail\"",
                 "default": "\"Active\""
@@ -13452,7 +13684,7 @@
               },
               {
                 "name": "type",
-                "description": "Defines the visual indication and behavior of the list items.\nAvailable options are `Active` (by default), `Inactive`, `InactiveSelectable`, `Detail` and `Navigation`.\n\n**Note:** When set to `Active` or `Navigation`, the item will provide visual response upon press and hover,\nwhile with type `Inactive`, `InactiveSelectable` and `Detail` - will not.\n\n**Note:** `InactiveSelectable` behaves like `Inactive` but allows selection (checkbox/radio) to be toggled\nwhen the list has a selection mode. The `item-click` event is not fired for this type.",
+                "description": "Defines the visual indication and behavior of the list items.\nAvailable options are `Active` (by default), `Inactive`, `InactiveSelectable`, `Detail` and `Navigation`.\n\n**Note:** When set to `Active` or `Navigation`, the item will provide visual response upon press and hover,\nwhile with type `Inactive`, `InactiveSelectable` and `Detail` - will not.\n\n**Note:** `InactiveSelectable` behaves like `Inactive` but allows selection to be toggled\nvia the checkbox (Multi mode) or radio button (Single modes) when the list has a selection mode.\nClicking the item body or pressing Space/Enter does not trigger selection — only interacting\nwith the selection component directly does. The `item-click` event is not fired for this type.",
                 "value": {
                   "type": "\"Navigation\" | \"Inactive\" | \"InactiveSelectable\" | \"Active\" | \"Detail\""
                 }
@@ -13559,7 +13791,7 @@
             },
             {
               "name": "type",
-              "description": "Defines the visual indication and behavior of the list items.\nAvailable options are `Active` (by default), `Inactive`, `InactiveSelectable`, `Detail` and `Navigation`.\n\n**Note:** When set to `Active` or `Navigation`, the item will provide visual response upon press and hover,\nwhile with type `Inactive`, `InactiveSelectable` and `Detail` - will not.\n\n**Note:** `InactiveSelectable` behaves like `Inactive` but allows selection (checkbox/radio) to be toggled\nwhen the list has a selection mode. The `item-click` event is not fired for this type.",
+              "description": "Defines the visual indication and behavior of the list items.\nAvailable options are `Active` (by default), `Inactive`, `InactiveSelectable`, `Detail` and `Navigation`.\n\n**Note:** When set to `Active` or `Navigation`, the item will provide visual response upon press and hover,\nwhile with type `Inactive`, `InactiveSelectable` and `Detail` - will not.\n\n**Note:** `InactiveSelectable` behaves like `Inactive` but allows selection to be toggled\nvia the checkbox (Multi mode) or radio button (Single modes) when the list has a selection mode.\nClicking the item body or pressing Space/Enter does not trigger selection — only interacting\nwith the selection component directly does. The `item-click` event is not fired for this type.",
               "value": {
                 "type": "\"Navigation\" | \"Inactive\" | \"InactiveSelectable\" | \"Active\" | \"Detail\"",
                 "default": "\"Active\""
@@ -13674,7 +13906,7 @@
               },
               {
                 "name": "type",
-                "description": "Defines the visual indication and behavior of the list items.\nAvailable options are `Active` (by default), `Inactive`, `InactiveSelectable`, `Detail` and `Navigation`.\n\n**Note:** When set to `Active` or `Navigation`, the item will provide visual response upon press and hover,\nwhile with type `Inactive`, `InactiveSelectable` and `Detail` - will not.\n\n**Note:** `InactiveSelectable` behaves like `Inactive` but allows selection (checkbox/radio) to be toggled\nwhen the list has a selection mode. The `item-click` event is not fired for this type.",
+                "description": "Defines the visual indication and behavior of the list items.\nAvailable options are `Active` (by default), `Inactive`, `InactiveSelectable`, `Detail` and `Navigation`.\n\n**Note:** When set to `Active` or `Navigation`, the item will provide visual response upon press and hover,\nwhile with type `Inactive`, `InactiveSelectable` and `Detail` - will not.\n\n**Note:** `InactiveSelectable` behaves like `Inactive` but allows selection to be toggled\nvia the checkbox (Multi mode) or radio button (Single modes) when the list has a selection mode.\nClicking the item body or pressing Space/Enter does not trigger selection — only interacting\nwith the selection component directly does. The `item-click` event is not fired for this type.",
                 "value": {
                   "type": "\"Navigation\" | \"Inactive\" | \"InactiveSelectable\" | \"Active\" | \"Detail\""
                 }