@ui5/webcomponents 2.9.0-rc.1 → 2.9.0-rc.2

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

@@ -2404,11 +2404,6 @@
           "name": "open",
           "description": "Indicates whether the items picker is open.",
           "values": []
-        },
-        {
-          "name": "is-open",
-          "description": "Indicates whether the dropdown is open. True if the dropdown is open, false otherwise.",
-          "values": [{ "name": "any" }]
         }
       ],
       "references": []
@@ -3214,18 +3209,13 @@
     },
     {
       "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\n1. 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\n2. 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### Keyboard Handling\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`import \"@ui5/webcomponents/dist/Select\";`\n\n`import \"@ui5/webcomponents/dist/Option\";`\n`import \"@ui5/webcomponents/dist/OptionCustom\";`\n\n\n---\n\n\n\n\n### **Events:**\n - **change** - Fired when the selected option changes.\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- **close** - Fired after the component's dropdown menu closes.\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- **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- **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\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### 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\n\n\n\n### **Events:**\n - **change** - Fired when the selected option changes.\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- **close** - Fired after the component's dropdown menu closes.\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- **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- **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\n### **CSS Parts:**\n - **popover** - Used to style the popover element",
       "attributes": [
         {
           "name": "disabled",
           "description": "Defines whether the component is in disabled state.\n\n**Note:** A disabled component is noninteractive.",
           "values": []
         },
-        {
-          "name": "icon",
-          "description": "Defines the icon, displayed as graphical element within the component.\nThe SAP-icons font provides numerous options.\n\nExample:\nSee all the available icons within the [Icon Explorer](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html).\n\n**Note:** When using this property with a valid icon, Select will be rendered as icon only button and the label and the default arrow down won't be visible.",
-          "values": []
-        },
         {
           "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.",

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.9.0-rc.1",
+  "version": "2.9.0-rc.2",
   "description-markup": "markdown",
   "contributions": {
     "html": {
@@ -4964,11 +4964,6 @@
               "name": "open",
               "description": "Indicates whether the items picker is open.",
               "value": { "type": "boolean", "default": "false" }
-            },
-            {
-              "name": "is-open",
-              "description": "Indicates whether the dropdown is open. True if the dropdown is open, false otherwise.",
-              "value": { "type": "any", "default": "false" }
             }
           ],
           "slots": [
@@ -5087,11 +5082,6 @@
                 "name": "open",
                 "description": "Indicates whether the items picker is open.",
                 "value": { "type": "boolean" }
-              },
-              {
-                "name": "is-open",
-                "description": "Indicates whether the dropdown is open. True if the dropdown is open, false otherwise.",
-                "value": { "type": "any" }
               }
             ],
             "events": [
@@ -6795,7 +6785,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\n1. 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\n2. 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### Keyboard Handling\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`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- **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- **close** - Fired after the component's dropdown menu closes.\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- **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- **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\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### 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- **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- **close** - Fired after the component's dropdown menu closes.\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- **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- **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\n### **CSS Parts:**\n - **popover** - Used to style the popover element",
           "doc-url": "",
           "attributes": [
             {
@@ -6803,11 +6793,6 @@
               "description": "Defines whether the component is in disabled state.\n\n**Note:** A disabled component is noninteractive.",
               "value": { "type": "boolean", "default": "false" }
             },
-            {
-              "name": "icon",
-              "description": "Defines the icon, displayed as graphical element within the component.\nThe SAP-icons font provides numerous options.\n\nExample:\nSee all the available icons within the [Icon Explorer](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html).\n\n**Note:** When using this property with a valid icon, Select will be rendered as icon only button and the label and the default arrow down won't be visible.",
-              "value": { "type": "string | 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.",
@@ -6896,11 +6881,6 @@
                 "description": "Defines whether the component is in disabled state.\n\n**Note:** A disabled component is noninteractive.",
                 "value": { "type": "boolean" }
               },
-              {
-                "name": "icon",
-                "description": "Defines the icon, displayed as graphical element within the component.\nThe SAP-icons font provides numerous options.\n\nExample:\nSee all the available icons within the [Icon Explorer](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html).\n\n**Note:** When using this property with a valid icon, Select will be rendered as icon only button and the label and the default arrow down won't be visible.",
-                "value": { "type": "string | 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.",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ui5/webcomponents",
-  "version": "2.9.0-rc.1",
+  "version": "2.9.0-rc.2",
   "description": "UI5 Web Components: webcomponents.main",
   "ui5": {
     "webComponentsPackage": true
@@ -54,20 +54,20 @@
     "directory": "packages/main"
   },
   "dependencies": {
-    "@ui5/webcomponents-base": "2.9.0-rc.1",
-    "@ui5/webcomponents-icons": "2.9.0-rc.1",
-    "@ui5/webcomponents-icons-business-suite": "2.9.0-rc.1",
-    "@ui5/webcomponents-icons-tnt": "2.9.0-rc.1",
-    "@ui5/webcomponents-localization": "2.9.0-rc.1",
-    "@ui5/webcomponents-theming": "2.9.0-rc.1"
+    "@ui5/webcomponents-base": "2.9.0-rc.2",
+    "@ui5/webcomponents-icons": "2.9.0-rc.2",
+    "@ui5/webcomponents-icons-business-suite": "2.9.0-rc.2",
+    "@ui5/webcomponents-icons-tnt": "2.9.0-rc.2",
+    "@ui5/webcomponents-localization": "2.9.0-rc.2",
+    "@ui5/webcomponents-theming": "2.9.0-rc.2"
   },
   "devDependencies": {
     "@ui5/cypress-internal": "0.0.0",
-    "@ui5/webcomponents-tools": "2.9.0-rc.1",
+    "@ui5/webcomponents-tools": "2.9.0-rc.2",
     "chromedriver": "^133.0.0",
     "jsdom": "^26.0.0",
     "lit": "^2.0.0",
     "vitest": "^3.0.2"
   },
-  "gitHead": "028a680226a4eab512df2749f1cc94ce4bc5b535"
+  "gitHead": "17eb194560a6db21bab9da6eb69b599ac504fd78"
 }

package/src/BreadcrumbsPopoverTemplate.tsx

@@ -1,3 +1,4 @@
+import { isPhone } from "@ui5/webcomponents-base/dist/Device.js";
 import type Breadcrumbs from "./Breadcrumbs.js";
 import Button from "./Button.js";
 import List from "./List.js";
@@ -5,6 +6,10 @@ import ListItemStandard from "./ListItemStandard.js";
 import ResponsivePopover from "./ResponsivePopover.js";
 
 export default function BreadcrumbsPopoverTemplate(this: Breadcrumbs) {
+	const itemsToDisplay = isPhone()
+		? this._mobilePopoverItems
+		: this._overflowItemsData;
+
 	return (
 		<ResponsivePopover
 			class="ui5-breadcrumbs-popover"
@@ -21,7 +26,7 @@ export default function BreadcrumbsPopoverTemplate(this: Breadcrumbs) {
 				separators="None"
 				onSelectionChange={this._onOverflowListItemSelect}
 			>
-				{this._overflowItemsData.map(item =>
+				{itemsToDisplay.map(item =>
 					<ListItemStandard
 						id={`${item._id}-li`}
 						accessibleName={item.accessibleName}

package/src/InputTemplate.tsx

@@ -36,6 +36,7 @@ export default function InputTemplate(this: Input, hooks?: { preContent: Templat
 						placeholder={this._placeholder}
 						maxlength={this.maxlength}
 						role={this.accInfo.role}
+						enterkeyhint={this.hint}
 						aria-controls={this.accInfo.ariaControls}
 						aria-invalid={this.accInfo.ariaInvalid}
 						aria-haspopup={this.accInfo.ariaHasPopup}
@@ -63,6 +64,7 @@ export default function InputTemplate(this: Input, hooks?: { preContent: Templat
 						<div
 							tabindex={-1}
 							class="ui5-input-clear-icon-wrapper inputIcon"
+							part="clear-icon-wrapper"
 							onClick={this._clear}
 							onMouseDown={this._iconMouseDown}
 						>

package/src/i18n/messagebundle_ar.properties

@@ -67,6 +67,8 @@ CAROUSEL_PREVIOUS_ARROW_TEXT=الصفحة السابقة
 
 CAROUSEL_NEXT_ARROW_TEXT=الصفحة التالية
 
+CAROUSEL_ARIA_ROLE_DESCRIPTION=شريط التمرير
+
 COLORPALETTE_CONTAINER_LABEL=لوحة الألوان - الألوان المحددة مسبقًا
 
 COLORPALETTE_POPOVER_TITLE=لوحة الألوان

package/src/i18n/messagebundle_bg.properties

@@ -67,6 +67,8 @@ CAROUSEL_PREVIOUS_ARROW_TEXT=Предишна страница
 
 CAROUSEL_NEXT_ARROW_TEXT=Следваща страница
 
+CAROUSEL_ARIA_ROLE_DESCRIPTION=Карусел
+
 COLORPALETTE_CONTAINER_LABEL=Цветова палитра - предварително определени цветове
 
 COLORPALETTE_POPOVER_TITLE=Цветова палитра

package/src/i18n/messagebundle_ca.properties

@@ -67,6 +67,8 @@ CAROUSEL_PREVIOUS_ARROW_TEXT=Pàgina anterior
 
 CAROUSEL_NEXT_ARROW_TEXT=Pàgina següent
 
+CAROUSEL_ARIA_ROLE_DESCRIPTION=Carrusel
+
 COLORPALETTE_CONTAINER_LABEL=Paleta de colors - colors predefinits
 
 COLORPALETTE_POPOVER_TITLE=Paleta de colors

package/src/i18n/messagebundle_cnr.properties

@@ -67,6 +67,8 @@ CAROUSEL_PREVIOUS_ARROW_TEXT=Prethodna stranica
 
 CAROUSEL_NEXT_ARROW_TEXT=Sljedeća stranica
 
+CAROUSEL_ARIA_ROLE_DESCRIPTION=Karusel
+
 COLORPALETTE_CONTAINER_LABEL=Paleta boja - prethodno definisane boje
 
 COLORPALETTE_POPOVER_TITLE=Paleta boja

package/src/i18n/messagebundle_cs.properties

@@ -67,6 +67,8 @@ CAROUSEL_PREVIOUS_ARROW_TEXT=Předchozí strana
 
 CAROUSEL_NEXT_ARROW_TEXT=Následující strana
 
+CAROUSEL_ARIA_ROLE_DESCRIPTION=Karusel
+
 COLORPALETTE_CONTAINER_LABEL=Barevná paleta – předdefinované barvy
 
 COLORPALETTE_POPOVER_TITLE=Barevná paleta

package/src/i18n/messagebundle_cy.properties

@@ -67,6 +67,8 @@ CAROUSEL_PREVIOUS_ARROW_TEXT=Tudalen Flaenorol
 
 CAROUSEL_NEXT_ARROW_TEXT=Tudalen Nesaf
 
+CAROUSEL_ARIA_ROLE_DESCRIPTION=Carwsél
+
 COLORPALETTE_CONTAINER_LABEL=Palet Lliwiau - Lliwiau Parod
 
 COLORPALETTE_POPOVER_TITLE=Palet Lliwiau

package/src/i18n/messagebundle_da.properties

@@ -67,6 +67,8 @@ CAROUSEL_PREVIOUS_ARROW_TEXT=Forrige side
 
 CAROUSEL_NEXT_ARROW_TEXT=Næste side
 
+CAROUSEL_ARIA_ROLE_DESCRIPTION=Karrusel
+
 COLORPALETTE_CONTAINER_LABEL=Farvepalet - foruddefinerede farver
 
 COLORPALETTE_POPOVER_TITLE=Farvepalet

package/src/i18n/messagebundle_de.properties

@@ -67,6 +67,8 @@ CAROUSEL_PREVIOUS_ARROW_TEXT=Vorherige Seite
 
 CAROUSEL_NEXT_ARROW_TEXT=Nächste Seite
 
+CAROUSEL_ARIA_ROLE_DESCRIPTION=Karussell
+
 COLORPALETTE_CONTAINER_LABEL=Farbpalette - Vordefinierte Farben
 
 COLORPALETTE_POPOVER_TITLE=Farbpalette

package/src/i18n/messagebundle_el.properties

@@ -67,6 +67,8 @@ CAROUSEL_PREVIOUS_ARROW_TEXT=Προηγούμενη Σελίδα
 
 CAROUSEL_NEXT_ARROW_TEXT=Επόμενη Σελίδα
 
+CAROUSEL_ARIA_ROLE_DESCRIPTION=Carousel
+
 COLORPALETTE_CONTAINER_LABEL=Παλέτα Χρωμάτων - Προκαθορισμένα Χρώματα
 
 COLORPALETTE_POPOVER_TITLE=Παλέτα Χρωμάτων