@ui5/webcomponents 2.14.0 → 2.15.0-rc.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ui5/webcomponents",
-  "version": "2.14.0",
+  "version": "2.15.0-rc.0",
   "description": "UI5 Web Components: webcomponents.main",
   "ui5": {
     "webComponentsPackage": true
@@ -50,24 +50,24 @@
   },
   "repository": {
     "type": "git",
-    "url": "https://github.com/SAP/ui5-webcomponents.git",
+    "url": "https://github.com/UI5/webcomponents.git",
     "directory": "packages/main"
   },
   "dependencies": {
-    "@ui5/webcomponents-base": "2.14.0",
-    "@ui5/webcomponents-icons": "2.14.0",
-    "@ui5/webcomponents-icons-business-suite": "2.14.0",
-    "@ui5/webcomponents-icons-tnt": "2.14.0",
-    "@ui5/webcomponents-localization": "2.14.0",
-    "@ui5/webcomponents-theming": "2.14.0"
+    "@ui5/webcomponents-base": "2.15.0-rc.0",
+    "@ui5/webcomponents-icons": "2.15.0-rc.0",
+    "@ui5/webcomponents-icons-business-suite": "2.15.0-rc.0",
+    "@ui5/webcomponents-icons-tnt": "2.15.0-rc.0",
+    "@ui5/webcomponents-localization": "2.15.0-rc.0",
+    "@ui5/webcomponents-theming": "2.15.0-rc.0"
   },
   "devDependencies": {
     "@ui5/cypress-internal": "0.0.0",
-    "@ui5/webcomponents-tools": "2.14.0",
-    "chromedriver": "^138.0.5",
+    "@ui5/webcomponents-tools": "2.15.0-rc.0",
+    "chromedriver": "^139.0.3",
     "jsdom": "^26.0.0",
     "lit": "^2.0.0",
     "vitest": "^3.0.2"
   },
-  "gitHead": "798113e3338ae2e3570cbee2ad0eb629d70445e4"
+  "gitHead": "033a6d621ee56640dda7dc853bfd29ac88c4ca25"
 }

package/src/CalendarHeaderTemplate.tsx

@@ -16,7 +16,6 @@ export default function CalendarTemplate(this: Calendar) {
 				part="calendar-header-arrow-button"
 				role="button"
 				onMouseDown={this.onPrevButtonClick}
-				title={this.headerPreviousButtonText}
 			>
 				<Icon class="ui5-calheader-arrowicon" name={slimArowLeft}/>
 			</div>
@@ -30,6 +29,9 @@ export default function CalendarTemplate(this: Calendar) {
 					tabindex={0}
 					role="button"
 					aria-label={this.accInfo.ariaLabelMonthButton}
+					aria-description={this.accInfo.ariaLabelMonthButton}
+					title={this.accInfo.tooltipMonthButton}
+					aria-keyshortcuts={this.accInfo.keyShortcutMonthButton}
 					onClick={this.onHeaderShowMonthPress}
 					onKeyDown={this.onMonthButtonKeyDown}
 					onKeyUp={this.onMonthButtonKeyUp}
@@ -47,9 +49,13 @@ export default function CalendarTemplate(this: Calendar) {
 					hidden={this._isHeaderYearButtonHidden}
 					tabindex={0}
 					role="button"
+					aria-label={this.accInfo.ariaLabelYearButton}
+					aria-description={this.accInfo.ariaLabelYearButton}
 					onClick={this.onHeaderShowYearPress}
 					onKeyDown={this.onYearButtonKeyDown}
 					onKeyUp={this.onYearButtonKeyUp}
+					title={this.accInfo.tooltipYearButton}
+					aria-keyshortcuts={this.accInfo.keyShortcutYearButton}
 				>
 					<span>{this._headerYearButtonText}</span>
 					{this.hasSecondaryCalendarType &&
@@ -63,6 +69,10 @@ export default function CalendarTemplate(this: Calendar) {
 					hidden={this._isHeaderYearRangeButtonHidden}
 					tabindex={0}
 					role="button"
+					aria-label={this.accInfo.ariaLabelYearRangeButton}
+					aria-description={this.accInfo.ariaLabelYearRangeButton}
+					title={this.accInfo.tooltipYearRangeButton}
+					aria-keyshortcuts={this.accInfo.keyShortcutYearRangeButton}
 					onClick={this.onHeaderShowYearRangePress}
 					onKeyDown={this.onYearRangeButtonKeyDown}
 					onKeyUp={this.onYearRangeButtonKeyUp}
@@ -83,7 +93,6 @@ export default function CalendarTemplate(this: Calendar) {
 				part="calendar-header-arrow-button"
 				role="button"
 				onMouseDown={this.onNextButtonClick}
-				title={this.headerNextButtonText}
 			>
 				<Icon class="ui5-calheader-arrowicon" name={slimArowRight}/>
 			</div>

package/src/ListTemplate.tsx

@@ -29,7 +29,10 @@ export default function ListTemplate(this: List) {
 				active={this.showBusyIndicatorOverlay}
 				class="ui5-list-busy-indicator"
 			>
+
 				<div class="ui5-list-scroll-container">
+					<span tabindex={-1} aria-hidden="true" class="ui5-list-start-marker"></span>
+
 					{this.header.length > 0 && <slot name="header" />}
 
 					{this.shouldRenderH1 &&

package/src/TabContainerTemplate.tsx

@@ -73,7 +73,6 @@ export default function TabContainerTemplate(this: TabContainer, injectedPartial
 						<Button
 							endIcon={this.overflowMenuIcon}
 							data-ui5-stable="overflow-start"
-							tabindex={ -1 }
 							tooltip={this.overflowMenuTitle}
 							accessibilityAttributes={this.overflowBtnAccessibilityAttributes}
 						>
@@ -108,7 +107,6 @@ export default function TabContainerTemplate(this: TabContainer, injectedPartial
 						<Button
 							endIcon={this.overflowMenuIcon}
 							data-ui5-stable="overflow-end"
-							tabindex={ -1 }
 							tooltip={this.overflowMenuTitle}
 							accessibilityAttributes={this.overflowBtnAccessibilityAttributes}
 						>

package/src/ToolbarSelectTemplate.tsx

@@ -7,6 +7,7 @@ export default function ToolbarSelectTemplate(this: ToolbarSelect) {
 		<Select
 			class={this.classes.root}
 			style={this.styles}
+			value={this.value}
 			data-ui5-external-action-item-id={this._id}
 			valueState={this.valueState}
 			disabled={this.disabled}
@@ -17,6 +18,10 @@ export default function ToolbarSelectTemplate(this: ToolbarSelect) {
 			onOpen={(...args) => this.onOpen(...args)}
 			onChange={(...args) => this.onChange(...args)}
 		>
+			{this.hasCustomLabel &&
+				<slot name="label" slot="label">
+				</slot>
+			}
 			{this.options.map((option, index) => (
 				<Option
 					selected={option.selected}
@@ -25,6 +30,5 @@ export default function ToolbarSelectTemplate(this: ToolbarSelect) {
 					{option.textContent}
 				</Option>
 			))}
-		</Select>
-	);
+		</Select>);
 }

package/src/i18n/messagebundle.properties

@@ -592,11 +592,32 @@ VALUE_STATE_LINKS=To go to the first link, press Ctrl+Alt+F8. To move to the nex
 #XACT: ARIA announcement for keyboard shortcut to value state multiple links on Mac
 VALUE_STATE_LINKS_MAC=To go to the first link, press Cmd+Option+F8. To move to the next link, use Tab
 
-#XBUT: Tooltip text for 'Next' button in the Calendar Header
-CALENDAR_HEADER_NEXT_BUTTON = Next
+#XACT: ARIA label for month button in the Calendar Header
+CALENDAR_HEADER_MONTH_BUTTON = Month {0}
 
-#XBUT: Tooltip text for 'Previous' button in the Calendar Header
-CALENDAR_HEADER_PREVIOUS_BUTTON = Previous
+#XACT: ARIA label for year button in the Calendar Header
+CALENDAR_HEADER_YEAR_BUTTON = Year {0}
+
+#XACT: ARIA label for year range button in the Calendar Header
+CALENDAR_HEADER_YEAR_RANGE_BUTTON = Year range from {0} to {1}
+
+#XACT: Keyboard shortcut for month button in the Calendar Header
+CALENDAR_HEADER_MONTH_BUTTON_SHORTCUT = F4
+
+#XACT: Keyboard shortcut for year button in the Calendar Header
+CALENDAR_HEADER_YEAR_BUTTON_SHORTCUT = Shift + F4
+
+#XACT: Keyboard shortcut for year range button in the Calendar Header
+CALENDAR_HEADER_YEAR_RANGE_BUTTON_SHORTCUT = Shift + F4
+
+#XACT: ARIA label for day picker selected range start
+DAY_PICKER_SELECTED_RANGE_START = {0} First date of range
+
+#XACT: ARIA label for day picker selected range between dates
+DAY_PICKER_SELECTED_RANGE_BETWEEN = {0} in a selected range
+
+#XACT: ARIA label for day picker selected range end
+DAY_PICKER_SELECTED_RANGE_END = {0} Last date of range
 
 #XBUT: Text for 'Week number' in the DayPicker
 DAY_PICKER_WEEK_NUMBER_TEXT = Week number

package/src/themes/TextArea.css

@@ -140,7 +140,7 @@
 :host([growing]) .ui5-textarea-inner {
 	box-sizing: border-box;
 	height: calc(100% - (2 * var(--_ui5_textarea_wrapper_padding)));
-	width: calc(100% - (2 * var(--_ui5_textarea_wrapper_padding)));
+	width: var(--_ui5_textarea_inner_width, calc(100% - (2 * var(--_ui5_textarea_wrapper_padding))));
 	position: absolute;
 }
 

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

@@ -27,6 +27,7 @@
 	--_ui5_textarea_success_wrapper_padding: 0;
 	--_ui5_textarea_warning_error_wrapper_padding: 0;
 	--_ui5_textarea_information_wrapper_padding: 0;
+	--_ui5_textarea_inner_width: 100%;
 	--_ui5_textarea_padding_right_and_left: 0.5625rem;
 	--_ui5_textarea_padding_right_and_left_error_warning: 0.5rem;
 	--_ui5_textarea_padding_right_and_left_information: 0.5rem;

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

@@ -19,6 +19,7 @@
 	--_ui5_textarea_padding_right_and_left: 0.5rem;
 	--_ui5_textarea_padding_right_and_left_information: 0.5625rem;
 	--_ui5_textarea_padding_right_and_left_readonly: 0.5rem;
+	--_ui5_textarea_inner_width: 100%;
 }
 
 [data-ui5-compact-size],

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

@@ -19,6 +19,7 @@
 	--_ui5_textarea_padding_right_and_left: 0.5rem;
 	--_ui5_textarea_padding_right_and_left_information: 0.5625rem;
 	--_ui5_textarea_padding_right_and_left_readonly: 0.5rem;
+	--_ui5_textarea_inner_width: 100%;
 }
 
 [data-ui5-compact-size],

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

@@ -20,6 +20,7 @@
 	--_ui5_textarea_success_wrapper_padding: 0.0625rem;
 	--_ui5_textarea_warning_error_wrapper_padding:  0.0625rem 0.0625rem 0.125rem 0.0625rem;
 	--_ui5_textarea_information_wrapper_padding: 0.0625rem 0.0625rem 0.125rem 0.0625rem;
+	--_ui5_textarea_inner_width: calc(100% - (2 * var(--_ui5_textarea_wrapper_padding)));
 	--_ui5_textarea_padding_top: 0.5rem;
 	--_ui5_textarea_padding_bottom: 0.4375rem;
 	--_ui5_textarea_padding_bottom_readonly: 0.375rem;

package/src/themes/sap_horizon_dark/TextArea-parameters.css

@@ -20,6 +20,7 @@
 	--_ui5_textarea_success_wrapper_padding: 0.0625rem;
 	--_ui5_textarea_warning_error_wrapper_padding:  0.0625rem 0.0625rem 0.125rem 0.0625rem;
 	--_ui5_textarea_information_wrapper_padding: 0.0625rem 0.0625rem 0.125rem 0.0625rem;
+	--_ui5_textarea_inner_width: calc(100% - (2 * var(--_ui5_textarea_wrapper_padding)));
 	--_ui5_textarea_padding_top: 0.5rem;
 	--_ui5_textarea_padding_bottom: 0.4375rem;
 	--_ui5_textarea_padding_bottom_readonly: 0.375rem;

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

@@ -23,6 +23,7 @@
 	--_ui5_textarea_padding_right_and_left: 0.5rem;
 	--_ui5_textarea_padding_right_and_left_information: 0.5625rem;
 	--_ui5_textarea_padding_right_and_left_readonly: 0.5rem;
+	--_ui5_textarea_inner_width: 100%;
 }
 
 [data-ui5-compact-size],

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

@@ -23,6 +23,7 @@
 	--_ui5_textarea_padding_right_and_left: 0.5rem;
 	--_ui5_textarea_padding_right_and_left_information: 0.5625rem;
 	--_ui5_textarea_padding_right_and_left_readonly: 0.5rem;
+	--_ui5_textarea_inner_width: 100%;
 }
 
 [data-ui5-compact-size],