@ui5/webcomponents 2.2.0-rc.0 → 2.2.0-rc.2

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

@@ -1329,7 +1329,7 @@
     },
     {
       "name": "ui5-file-uploader",
-      "description": "### Overview\n\nThe `ui5-file-uploader` opens a file explorer dialog and enables users to upload files.\nThe component consists of input field, but you can provide an HTML element by your choice\nto trigger the file upload, by using the default slot.\nFurthermore, you can set the property \"hideInput\" to \"true\" to hide the input field.\n\nTo get all selected files, you can simply use the read-only \"files\" property.\nTo restrict the types of files the user can select, you can use the \"accept\" property.\n\nAnd, similar to all input based components, the FileUploader supports \"valueState\", \"placeholder\", \"name\", and \"disabled\" properties.\n\nFor the `ui5-file-uploader`\n### ES6 Module Import\n\n`import \"@ui5/webcomponents/dist/FileUploader.js\";`\n\n\n---\n\n\n\n\n### **Events:**\n - **change** - Event is fired when the value of the file path has been changed.\n\n**Note:** Keep in mind that because of the HTML input element of type file, the event is also fired in Chrome browser when the Cancel button of the uploads window is pressed.\n\n### **Slots:**\n - **default** - By default the component contains a single input field. With this slot you can pass any content that you wish to add. See the samples for more information.\n\n**Note:** If no content is provided in this slot, the component will only consist of an input field and will not be interactable using the keyboard.\nAlso it is not recommended to use any non-interactable components, as it may lead to poor accessibility experience.\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-file-uploader` opens a file explorer dialog and enables users to upload files.\nThe component consists of input field, but you can provide an HTML element by your choice\nto trigger the file upload, by using the default slot.\nFurthermore, you can set the property \"hideInput\" to \"true\" to hide the input field.\n\nTo get all selected files, you can simply use the read-only \"files\" property.\nTo restrict the types of files the user can select, you can use the \"accept\" property.\n\nAnd, similar to all input based components, the FileUploader supports \"valueState\", \"placeholder\", \"name\", and \"disabled\" properties.\n\nFor the `ui5-file-uploader`\n### ES6 Module Import\n\n`import \"@ui5/webcomponents/dist/FileUploader.js\";`\n\n\n---\n\n\n\n\n### **Events:**\n - **change** - Event is fired when the value of the file path has been changed.\n\n**Note:** Keep in mind that because of the HTML input element of type file, the event is also fired in Chrome browser when the Cancel button of the uploads window is pressed.\n- **fileSizeExceeded** - Event is fired when the size of a file is above the `maxFileSize` property value.\n\n### **Slots:**\n - **default** - By default the component contains a single input field. With this slot you can pass any content that you wish to add. See the samples for more information.\n\n**Note:** If no content is provided in this slot, the component will only consist of an input field and will not be interactable using the keyboard.\nAlso it is not recommended to use any non-interactable components, as it may lead to poor accessibility experience.\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.",
       "attributes": [
         {
           "name": "accept",
@@ -1366,6 +1366,11 @@
           "description": "Defines the name/names of the file/files to upload.",
           "values": []
         },
+        {
+          "name": "max-file-size",
+          "description": "Defines the maximum file size in megabytes which prevents the upload if at least one file exceeds it.",
+          "values": []
+        },
         {
           "name": "value-state",
           "description": "Defines the value state of the component.",
@@ -1488,7 +1493,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 \"Negative\" or \"Critical\", 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- **select** - Fired when some text 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`, `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.",
+      "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 \"Negative\" or \"Critical\", 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- **select** - Fired when some text 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`, `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 - **root** - Used to style the root DOM element of the Input component\n- **input** - Used to style the native input element\n- **clear-icon** - Used to style the clear icon, which can be pressed to clear user input text",
       "attributes": [
         {
           "name": "disabled",
@@ -3635,7 +3640,7 @@
       "attributes": [
         {
           "name": "sticky",
-          "description": "Sticks the `ui5-table-header-row` to the top of a table.\n\nNote: If used in combination with overflowMode \"Scroll\", the table needs a defined height\nor needs to be inside of a container with a defined height for the sticky header to work as expected.",
+          "description": "Sticks the `ui5-table-header-row` to the top of a table.\n\nNote: If used in combination with overflowMode \"Scroll\", the table needs a defined height for the sticky header to work as expected.",
           "values": []
         }
       ],

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.2.0-rc.0",
+  "version": "2.2.0-rc.2",
   "description-markup": "markdown",
   "contributions": {
     "html": {
@@ -2697,7 +2697,7 @@
         },
         {
           "name": "ui5-file-uploader",
-          "description": "### Overview\n\nThe `ui5-file-uploader` opens a file explorer dialog and enables users to upload files.\nThe component consists of input field, but you can provide an HTML element by your choice\nto trigger the file upload, by using the default slot.\nFurthermore, you can set the property \"hideInput\" to \"true\" to hide the input field.\n\nTo get all selected files, you can simply use the read-only \"files\" property.\nTo restrict the types of files the user can select, you can use the \"accept\" property.\n\nAnd, similar to all input based components, the FileUploader supports \"valueState\", \"placeholder\", \"name\", and \"disabled\" properties.\n\nFor the `ui5-file-uploader`\n### ES6 Module Import\n\n`import \"@ui5/webcomponents/dist/FileUploader.js\";`\n---\n\n\n### **Events:**\n - **change** - Event is fired when the value of the file path has been changed.\n\n**Note:** Keep in mind that because of the HTML input element of type file, the event is also fired in Chrome browser when the Cancel button of the uploads window is pressed.\n\n### **Slots:**\n - **default** - By default the component contains a single input field. With this slot you can pass any content that you wish to add. See the samples for more information.\n\n**Note:** If no content is provided in this slot, the component will only consist of an input field and will not be interactable using the keyboard.\nAlso it is not recommended to use any non-interactable components, as it may lead to poor accessibility experience.\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-file-uploader` opens a file explorer dialog and enables users to upload files.\nThe component consists of input field, but you can provide an HTML element by your choice\nto trigger the file upload, by using the default slot.\nFurthermore, you can set the property \"hideInput\" to \"true\" to hide the input field.\n\nTo get all selected files, you can simply use the read-only \"files\" property.\nTo restrict the types of files the user can select, you can use the \"accept\" property.\n\nAnd, similar to all input based components, the FileUploader supports \"valueState\", \"placeholder\", \"name\", and \"disabled\" properties.\n\nFor the `ui5-file-uploader`\n### ES6 Module Import\n\n`import \"@ui5/webcomponents/dist/FileUploader.js\";`\n---\n\n\n### **Events:**\n - **change** - Event is fired when the value of the file path has been changed.\n\n**Note:** Keep in mind that because of the HTML input element of type file, the event is also fired in Chrome browser when the Cancel button of the uploads window is pressed.\n- **fileSizeExceeded** - Event is fired when the size of a file is above the `maxFileSize` property value.\n\n### **Slots:**\n - **default** - By default the component contains a single input field. With this slot you can pass any content that you wish to add. See the samples for more information.\n\n**Note:** If no content is provided in this slot, the component will only consist of an input field and will not be interactable using the keyboard.\nAlso it is not recommended to use any non-interactable components, as it may lead to poor accessibility experience.\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": [
             {
@@ -2735,6 +2735,11 @@
               "description": "Defines the name/names of the file/files to upload.",
               "value": { "type": "string", "default": "\"\"" }
             },
+            {
+              "name": "max-file-size",
+              "description": "Defines the maximum file size in megabytes which prevents the upload if at least one file exceeds it.",
+              "value": { "type": "number | undefined", "default": "undefined" }
+            },
             {
               "name": "value-state",
               "description": "Defines the value state of the component.",
@@ -2763,6 +2768,10 @@
             {
               "name": "change",
               "description": "Event is fired when the value of the file path has been changed.\n\n**Note:** Keep in mind that because of the HTML input element of type file, the event is also fired in Chrome browser when the Cancel button of the uploads window is pressed."
+            },
+            {
+              "name": "fileSizeExceeded",
+              "description": "Event is fired when the size of a file is above the `maxFileSize` property value."
             }
           ],
           "js": {
@@ -2802,6 +2811,11 @@
                 "description": "Defines the name/names of the file/files to upload.",
                 "value": { "type": "string" }
               },
+              {
+                "name": "max-file-size",
+                "description": "Defines the maximum file size in megabytes which prevents the upload if at least one file exceeds it.",
+                "value": { "type": "number | undefined" }
+              },
               {
                 "name": "value-state",
                 "description": "Defines the value state of the component.",
@@ -2819,6 +2833,10 @@
               {
                 "name": "change",
                 "description": "Event is fired when the value of the file path has been changed.\n\n**Note:** Keep in mind that because of the HTML input element of type file, the event is also fired in Chrome browser when the Cancel button of the uploads window is pressed."
+              },
+              {
+                "name": "fileSizeExceeded",
+                "description": "Event is fired when the size of a file is above the `maxFileSize` property value."
               }
             ]
           }
@@ -3036,7 +3054,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 \"Negative\" or \"Critical\", 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### **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- **select** - Fired when some text 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`, `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.",
+          "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 \"Negative\" or \"Critical\", 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### **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- **select** - Fired when some text 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`, `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 - **root** - Used to style the root DOM element of the Input component\n- **input** - Used to style the native input element\n- **clear-icon** - Used to style the clear icon, which can be pressed to clear user input text",
           "doc-url": "",
           "attributes": [
             {
@@ -7611,7 +7629,7 @@
           "attributes": [
             {
               "name": "sticky",
-              "description": "Sticks the `ui5-table-header-row` to the top of a table.\n\nNote: If used in combination with overflowMode \"Scroll\", the table needs a defined height\nor needs to be inside of a container with a defined height for the sticky header to work as expected.",
+              "description": "Sticks the `ui5-table-header-row` to the top of a table.\n\nNote: If used in combination with overflowMode \"Scroll\", the table needs a defined height for the sticky header to work as expected.",
               "value": { "type": "boolean", "default": "false" }
             }
           ],
@@ -7626,7 +7644,7 @@
             "properties": [
               {
                 "name": "sticky",
-                "description": "Sticks the `ui5-table-header-row` to the top of a table.\n\nNote: If used in combination with overflowMode \"Scroll\", the table needs a defined height\nor needs to be inside of a container with a defined height for the sticky header to work as expected.",
+                "description": "Sticks the `ui5-table-header-row` to the top of a table.\n\nNote: If used in combination with overflowMode \"Scroll\", the table needs a defined height for the sticky header to work as expected.",
                 "value": { "type": "boolean" }
               }
             ],
@@ -9736,6 +9754,18 @@
           "name": "part(root)",
           "description": "Used to style the outermost wrapper of the `ui5-icon`."
         },
+        {
+          "name": "part(root)",
+          "description": "Used to style the root DOM element of the Input component"
+        },
+        {
+          "name": "part(input)",
+          "description": "Used to style the native input element"
+        },
+        {
+          "name": "part(clear-icon)",
+          "description": "Used to style the clear icon, which can be pressed to clear user input text"
+        },
         {
           "name": "part(icon)",
           "description": "Used to style the provided icon within the link"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ui5/webcomponents",
-  "version": "2.2.0-rc.0",
+  "version": "2.2.0-rc.2",
   "description": "UI5 Web Components: webcomponents.main",
   "ui5": {
     "webComponentsPackage": true
@@ -50,16 +50,16 @@
     "directory": "packages/main"
   },
   "dependencies": {
-    "@ui5/webcomponents-base": "2.2.0-rc.0",
-    "@ui5/webcomponents-icons": "2.2.0-rc.0",
-    "@ui5/webcomponents-icons-business-suite": "2.2.0-rc.0",
-    "@ui5/webcomponents-icons-tnt": "2.2.0-rc.0",
-    "@ui5/webcomponents-localization": "2.2.0-rc.0",
-    "@ui5/webcomponents-theming": "2.2.0-rc.0"
+    "@ui5/webcomponents-base": "2.2.0-rc.2",
+    "@ui5/webcomponents-icons": "2.2.0-rc.2",
+    "@ui5/webcomponents-icons-business-suite": "2.2.0-rc.2",
+    "@ui5/webcomponents-icons-tnt": "2.2.0-rc.2",
+    "@ui5/webcomponents-localization": "2.2.0-rc.2",
+    "@ui5/webcomponents-theming": "2.2.0-rc.2"
   },
   "devDependencies": {
-    "@ui5/webcomponents-tools": "2.2.0-rc.0",
+    "@ui5/webcomponents-tools": "2.2.0-rc.2",
     "chromedriver": "^126.0.0"
   },
-  "gitHead": "8955aa596143ba93da03d4e6cf2bd547993c59c2"
+  "gitHead": "2c1b6c66d0abba9532115b63acd68c81e62acf66"
 }

package/src/Breadcrumbs.hbs

@@ -29,12 +29,27 @@
 				wrapping-type="None">
 				{{this.innerText}}
 			</ui5-link>
-
-			{{#unless this._isCurrentPageItem}}
+			{{#if this._needsSeparator}}
 				<span class="ui5-breadcrumbs-separator" aria-hidden="true"></span>
-			{{/unless}}
+			{{/if}}
 		</li>
 		{{/each}}
+		{{#unless _endsWithCurrentLinkItem }}
+			{{#if _endsWithCurrentLocation}}
+				<li class="ui5-breadcrumbs-current-location" @click="{{../_onLabelPress}}">
+
+					<span aria-current="page"
+						aria-label="{{_currentLocationAccName}}"
+						role="link"
+						id="{{this._id}}-labelWrapper">
+
+						<ui5-label>
+							{{_currentLocationText}}
+						</ui5-label>
+					</span>
+				</li>
+			{{/if}}
+		{{/unless}}
 	</ol>
 </nav>
 

package/src/ComboBox.hbs

@@ -24,6 +24,7 @@
 		aria-describedby="value-state-description"
 		aria-label="{{ariaLabelText}}"
 		aria-required="{{required}}"
+		aria-controls="{{responsivePopoverId}}"
 		autocomplete="off"
 		data-sap-focus-ref
 	/>

package/src/ComboBoxPopover.hbs

@@ -13,6 +13,7 @@
 	@keydown={{_handlePopoverKeydown}}
 	@focusout={{_handlePopoverFocusout}}
 	accessible-name="{{_popupLabel}}"
+	id="{{responsivePopoverId}}"
 	.open={{open}}
 	.opener={{this}}
 >

package/src/Input.hbs

@@ -1,5 +1,6 @@
 <div
 	class="ui5-input-root ui5-input-focusable-element"
+	part="root"
 	@focusin="{{_onfocusin}}"
 	@focusout="{{_onfocusout}}"
 >
@@ -8,6 +9,7 @@
 
 		<input
 			id="inner"
+			part="input"
 			class="ui5-input-inner"
 			style="{{styles.innerInput}}"
 			type="{{inputType}}"
@@ -44,7 +46,7 @@
 
 		{{#if _effectiveShowClearIcon}}
 			<div @click={{_clear}} @mousedown={{_iconMouseDown}} class="ui5-input-clear-icon-wrapper inputIcon" tabindex="-1">
-				<ui5-icon tabindex="-1" class="ui5-input-clear-icon" name="decline" accessible-name="{{clearIconAccessibleName}}"></ui5-icon>
+				<ui5-icon part="clear-icon" tabindex="-1" class="ui5-input-clear-icon" name="decline" accessible-name="{{clearIconAccessibleName}}"></ui5-icon>
 			</div>
 		{{/if}}
 

package/src/List.hbs

@@ -48,7 +48,7 @@
 			<slot></slot>
 
 			{{#if showNoDataText}}
-				<li id="{{_id}}-nodata" class="ui5-list-nodata">
+				<li tabindex="0" id="{{_id}}-nodata" class="ui5-list-nodata">
 					<div id="{{_id}}-nodata-text" class="ui5-list-nodata-text">
 						{{noDataText}}
 					</div>

package/src/MultiComboBox.hbs

@@ -76,6 +76,7 @@
 		aria-describedby="{{ariaDescribedByText}}"
 		aria-required="{{required}}"
 		aria-label="{{ariaLabelText}}"
+		aria-controls="{{responsivePopoverId}}"
 		autocomplete="off"
 		data-sap-focus-ref
 	/>

package/src/MultiComboBoxPopover.hbs

@@ -2,6 +2,7 @@
 	placement="Bottom"
 	horizontal-align="Start"
 	class="{{classes.popover}}"
+	id="{{responsivePopoverId}}"
 	hide-arrow
 	prevent-initial-focus
 	style="{{styles.suggestionsPopover}}"

package/src/MultiInput.hbs

@@ -27,6 +27,7 @@
 			@mouseup={{valueHelpMouseUp}}
 			class="inputIcon"
 			name="value-help"
+			accessible-name="{{valueHelpLabel}}"
 		></ui5-icon>
 	{{/if}}
 {{/inline}}

package/src/RangeSlider.hbs

@@ -43,7 +43,7 @@
 		aria-labelledby="{{_ariaLabelledByStartHandleRefs}}"
 		aria-disabled="{{_ariaDisabled}}"
 	>
-		<ui5-icon name="direction-arrows" slider-icon></ui5-icon>
+		<ui5-icon name="direction-arrows" mode="Decorative" slider-icon></ui5-icon>
 
 		{{#if showTooltip}}
 			<div class="ui5-slider-tooltip ui5-slider-tooltip--start" style="{{styles.tooltip}}">
@@ -66,7 +66,7 @@
 		aria-labelledby="{{_ariaLabelledByEndHandleRefs}}"
 		aria-disabled="{{_ariaDisabled}}"
 	>
-		<ui5-icon name="direction-arrows" slider-icon></ui5-icon>
+		<ui5-icon name="direction-arrows" mode="Decorative" slider-icon></ui5-icon>
 
 		{{#if showTooltip}}
 			<div class="ui5-slider-tooltip ui5-slider-tooltip--end" style="{{styles.tooltip}}">

package/src/Slider.hbs

@@ -32,7 +32,7 @@
 		data-sap-focus-ref
 		part="handle"
 	>
-			<ui5-icon name="direction-arrows" part="icon-slider" slider-icon></ui5-icon>
+			<ui5-icon mode="Decorative" "direction-arrows" part="icon-slider" slider-icon></ui5-icon>
 		{{#if showTooltip}}
 			<div class="ui5-slider-tooltip" style="{{styles.tooltip}}">
 				<span class="ui5-slider-tooltip-value">{{tooltipValue}}</span>

package/src/TimePickerPopover.hbs

@@ -29,7 +29,7 @@
 	</div>
 </ui5-responsive-popover>
 
-{{#if _isPhone}}
+{{#if _isMobileDevice}}
 <ui5-popover
 	id="{{_id}}-popover"
 	class="ui5-time-picker-inputs-popover"

package/src/i18n/messagebundle.properties

@@ -279,6 +279,9 @@ MULTIINPUT_ROLEDESCRIPTION_TEXT=Multi Value Input
 #XFLD: Token number indicator which is used to show more tokens
 MULTIINPUT_SHOW_MORE_TOKENS={0} more
 
+#XACT: ARIA announcement for value help
+MULTIINPUT_VALUE_HELP_LABEL=Show Value Help
+
 #XTOL: Tooltip for panel expand title
 PANEL_ICON=Expand/Collapse
 

package/src/themes/Breadcrumbs.css

@@ -22,6 +22,19 @@
     display: inline;
 }
 
+.ui5-breadcrumbs-current-location {
+    min-width: 1%;
+    flex: 1 1 auto;
+    /* Fix extra height in ul -> li element */
+    font-size: 0;
+    align-self: center;
+}
+
+.ui5-breadcrumbs-current-location > span:focus {
+    outline: var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--sapContent_FocusColor);
+    border-radius: var(--_ui5_breadcrumbs_current_location_focus_border_radius);
+}
+
 .ui5-breadcrumbs-dropdown-arrow-link-wrapper[hidden] {
     display: none
 }

package/src/themes/DayPicker.css

@@ -107,7 +107,7 @@
 	height: 100%;
 }
 
-.ui5-dp-item.ui5-dp-item--weeekend {
+.ui5-dp-item.ui5-dp-item--weekend {
 	background: var(--sapLegend_NonWorkingBackground);
 }
 
@@ -117,7 +117,7 @@
 }
 
 
-.ui5-dp-item.ui5-dp-item--weeekend:hover {
+.ui5-dp-item.ui5-dp-item--weekend:hover {
 	background: var(--sapList_Hover_Background);
 	filter: var(--_ui5_daypicker_item_weeekend_filter);
 }
@@ -129,7 +129,7 @@
 }
 
 .ui5-dp-item.ui5-dp-item--othermonth:hover,
-.ui5-dp-item.ui5-dp-item--weeekend.ui5-dp-item--othermonth:hover {
+.ui5-dp-item.ui5-dp-item--weekend.ui5-dp-item--othermonth:hover {
 	color: var(--_ui5_daypicker_item_othermonth_hover_color);
 	background: var(--sapList_Hover_Background);
 }
@@ -328,6 +328,11 @@
 	border-block-start: var(--_ui5_daypicker_special_day_border_top);
 }
 
+.ui5-dp-specialday.NonWorking,
+.ui5-dp-specialday.Working {
+	border-block-start: none;
+}
+
 .ui5-dp-item--selected .ui5-dp-specialday {
 	width: var(--_ui5_daypicker_selected_item_special_day_width);
 }

package/src/themes/Dialog.css

@@ -152,6 +152,7 @@
 
 :host::backdrop {
 	background-color: var(--_ui5_popup_block_layer_background);
+	opacity: var(--_ui5_dialog_block_layer_opacity);
 }
 
 .ui5-block-layer {

package/src/themes/List.css

@@ -86,11 +86,21 @@
 	background-color: var(--sapList_Background);
 	border-bottom: 1px solid var(--sapList_BorderColor);
 	padding: 0 1rem !important;
+	outline: none;
 	height: var(--_ui5_list_no_data_height);
 	font-size: var(--_ui5_list_no_data_font_size);
 	font-family: "72override", var(--sapFontFamily);
 }
 
+.ui5-list-nodata:focus::after {
+	content: "";
+	border: var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--sapContent_FocusColor);
+	position: absolute;
+	inset: 0.125rem;
+	pointer-events: none;
+	top: calc(50% + 0.125rem);
+}
+
 .ui5-list-nodata-text {
 	overflow: hidden;
 	text-overflow: ellipsis;

package/src/themes/SplitButton.css

@@ -209,7 +209,6 @@
 .ui5-split-arrow-button {
 	border-start-start-radius: var(--_ui5_split_button_hover_border_radius);
 	border-end-start-radius: var(--_ui5_split_button_hover_border_radius);
-	width: 2.25rem;
 	border-color: var(--_ui5_split_text_button_border_color);
 	background-color: var(--_ui5_split_text_button_background_color);
 	position: relative;

package/src/themes/TimePicker.css

@@ -12,7 +12,7 @@
 
 :host {
 	min-width: calc(var(--_ui5_input_min_width) + var(--_ui5_input_icon_width));
-	height: var(--sapElement_Height);
+	height: var(--_ui5_input_height);
 	color: var(--sapField_TextColor);
 	background-color: var(--sapField_Background);
 	border-radius: var(--_ui5-time_picker_border_radius);

package/src/themes/base/Dialog-parameters.css

@@ -9,4 +9,5 @@
 	--_ui5_dialog_header_success_state_icon_color: var(--sapPositiveElementColor);
 	--_ui5_dialog_header_warning_state_icon_color: var(--sapCriticalElementColor);
 	--_ui5_dialog_header_state_line_height: 0.0625rem;
+	--_ui5_dialog_block_layer_opacity: 0.2;
 }

package/src/themes/base/PopupBlockLayer-parameters.css

@@ -1,3 +1,3 @@
 :root {
-	--_ui5_popup_block_layer_background: color-mix(in oklch, transparent, var(--sapBlockLayer_Background) 60%);
+	--_ui5_popup_block_layer_background: var(--sapBlockLayer_Background);
 }

package/src/themes/sap_fiori_3_hcb/Dialog-parameters.css

@@ -2,4 +2,5 @@
 
 :root {
 	--_ui5_dialog_header_state_line_height: 0.125rem;
+	--_ui5_dialog_block_layer_opacity: 0.3;
 }

package/src/themes/sap_fiori_3_hcw/Dialog-parameters.css

@@ -2,4 +2,5 @@
 
 :root {
 	--_ui5_dialog_header_state_line_height: 0.125rem;
+	--_ui5_dialog_block_layer_opacity: 0.3;
 }

package/src/themes/sap_horizon/Dialog-parameters.css

@@ -6,4 +6,4 @@
 	--_ui5_dialog_header_focus_left_offset: 1px;
 	--_ui5_dialog_header_focus_right_offset: 1px;
 	--_ui5_dialog_header_border_radius: var(--sapElement_BorderCornerRadius);
-}
+}

package/src/themes/sap_horizon_hcb/Dialog-parameters.css

@@ -2,4 +2,5 @@
 
 :root {
 	--_ui5_dialog_header_state_line_height: 0.125rem;
+	--_ui5_dialog_block_layer_opacity: 0.3;
 }

package/src/themes/sap_horizon_hcw/Dialog-parameters.css

@@ -2,4 +2,5 @@
 
 :root {
 	--_ui5_dialog_header_state_line_height: 0.125rem;
+	--_ui5_dialog_block_layer_opacity: 0.3;
 }