Merge branch 'main' into select-dropdown-button-height

NakataCode · NakataCode · commit 10e66826e75f · 2026-04-20T10:40:42.000+03:00
diff --git a/packages/main/src/StepInput.ts b/packages/main/src/StepInput.ts
@@ -483,7 +483,7 @@ class StepInput extends UI5Element implements IFormInputElement {
 
 	_onButtonFocusOut() {
 		setTimeout(() => {
-			if (!this._inputFocused) {
+			if (!this._inputFocused && !this.shadowRoot!.activeElement) {
 				this.inputOuter.removeAttribute("focused");
 			}
 		}, 0);
@@ -507,13 +507,11 @@ class StepInput extends UI5Element implements IFormInputElement {
 	}
 
 	_onMouseWheel(e: WheelEvent) {
-		if (this.disabled || this.readonly) {
+		if (this.disabled || this.readonly || !this._isFocused) {
 			return;
 		}
 
-		if (this._isFocused) {
-			e.preventDefault();
-		}
+		e.preventDefault();
 
 		const isScrollUp = e.deltaY < 0;
 		const modifier = isScrollUp ? this.step : -this.step;
@@ -767,15 +765,25 @@ class StepInput extends UI5Element implements IFormInputElement {
 		return !Number.isNaN(parsedValue) && !/, {2,}/.test(typedValue);
 	}
 
-	_decSpin() {
+	_decSpin(e: MouseEvent) {
+		if (this._isFocused || this._decIconDisabled) {
+			e.preventDefault();
+		}
 		if (!this._decIconDisabled) {
 			this._spinValue(false, true);
+		} else {
+			this.input.focus();
 		}
 	}
 
-	_incSpin() {
+	_incSpin(e: MouseEvent) {
+		if (this._isFocused || this._incIconDisabled) {
+			e.preventDefault();
+		}
 		if (!this._incIconDisabled) {
 			this._spinValue(true, true);
+		} else {
+			this.input.focus();
 		}
 	}
 
diff --git a/packages/main/src/themes/StepInput.css b/packages/main/src/themes/StepInput.css
@@ -18,6 +18,7 @@
 	box-sizing: border-box;
 	height: var(--_ui5_input_height);
 	position: relative;
+	isolation: isolate;
 	margin: var(--_ui5_input_margin_top_bottom) 0;
 	min-width: var(--_ui5_step_input_min_width);
 	text-align: right;
@@ -99,7 +100,7 @@
 	pointer-events: none;
 	border-radius: var(--sapField_BorderCornerRadius);
 	border-style: var(--_ui5_input_error_warning_border_style);
-	z-index: 1;
+	z-index: 0;
 	border-width: 0px;
 }
 
diff --git a/packages/main/src/themes/sap_horizon/Select-parameters.css b/packages/main/src/themes/sap_horizon/Select-parameters.css
@@ -6,4 +6,6 @@
 	--_ui5_select_icon_wrapper_state_height: 100%;
 	--_ui5_input_icon_hover_bg: transparent;
 	--_ui5_select_bottom_border_gradient: linear-gradient(var(--sapField_BorderColor), var(--sapField_BorderColor)) bottom / 100% var(--sapField_BorderWidth) no-repeat;
+	--_ui5_input_focus_outline_color: var(--sapContent_FocusColor);
+	--_ui5_input_readonly_focus_border_radius: 0;
 }
diff --git a/packages/main/src/themes/sap_horizon_dark/Select-parameters.css b/packages/main/src/themes/sap_horizon_dark/Select-parameters.css
@@ -6,4 +6,6 @@
 	--_ui5_select_icon_wrapper_state_height: 100%;
 	--_ui5_input_icon_hover_bg: transparent;
 	--_ui5_select_bottom_border_gradient: linear-gradient(var(--sapField_BorderColor), var(--sapField_BorderColor)) bottom / 100% var(--sapField_BorderWidth) no-repeat;
+	--_ui5_input_focus_outline_color: var(--sapContent_FocusColor);
+	--_ui5_input_readonly_focus_border_radius: 0;
 }

Original file line number	Diff line number	Diff line change
`@@ -483,7 +483,7 @@ class StepInput extends UI5Element implements IFormInputElement {`
`483`	`483`
`484`	`484`	`_onButtonFocusOut() {`
`485`	`485`	`setTimeout(() => {`
`486`		`- if (!this._inputFocused) {`
	`486`	`+ if (!this._inputFocused && !this.shadowRoot!.activeElement) {`
`487`	`487`	`this.inputOuter.removeAttribute("focused");`
`488`	`488`	`}`
`489`	`489`	`}, 0);`
`@@ -507,13 +507,11 @@ class StepInput extends UI5Element implements IFormInputElement {`
`507`	`507`	`}`
`508`	`508`
`509`	`509`	`_onMouseWheel(e: WheelEvent) {`
`510`		`- if (this.disabled \|\| this.readonly) {`
	`510`	`+ if (this.disabled \|\| this.readonly \|\| !this._isFocused) {`
`511`	`511`	`return;`
`512`	`512`	`}`
`513`	`513`
`514`		`- if (this._isFocused) {`
`515`		`- e.preventDefault();`
`516`		`- }`
	`514`	`+ e.preventDefault();`
`517`	`515`
`518`	`516`	`const isScrollUp = e.deltaY < 0;`
`519`	`517`	`const modifier = isScrollUp ? this.step : -this.step;`
`@@ -767,15 +765,25 @@ class StepInput extends UI5Element implements IFormInputElement {`
`767`	`765`	`return !Number.isNaN(parsedValue) && !/, {2,}/.test(typedValue);`
`768`	`766`	`}`
`769`	`767`
`770`		`- _decSpin() {`
	`768`	`+ _decSpin(e: MouseEvent) {`
	`769`	`+ if (this._isFocused \|\| this._decIconDisabled) {`
	`770`	`+ e.preventDefault();`
	`771`	`+ }`
`771`	`772`	`if (!this._decIconDisabled) {`
`772`	`773`	`this._spinValue(false, true);`
	`774`	`+ } else {`
	`775`	`+ this.input.focus();`
`773`	`776`	`}`
`774`	`777`	`}`
`775`	`778`
`776`		`- _incSpin() {`
	`779`	`+ _incSpin(e: MouseEvent) {`
	`780`	`+ if (this._isFocused \|\| this._incIconDisabled) {`
	`781`	`+ e.preventDefault();`
	`782`	`+ }`
`777`	`783`	`if (!this._incIconDisabled) {`
`778`	`784`	`this._spinValue(true, true);`
	`785`	`+ } else {`
	`786`	`+ this.input.focus();`
`779`	`787`	`}`
`780`	`788`	`}`
`781`	`789`
Original file line number	Diff line number	Diff line change
`@@ -6,4 +6,6 @@`
`6`	`6`	`--_ui5_select_icon_wrapper_state_height: 100%;`
`7`	`7`	`--_ui5_input_icon_hover_bg: transparent;`
`8`	`8`	`--_ui5_select_bottom_border_gradient: linear-gradient(var(--sapField_BorderColor), var(--sapField_BorderColor)) bottom / 100% var(--sapField_BorderWidth) no-repeat;`
	`9`	`+ --_ui5_input_focus_outline_color: var(--sapContent_FocusColor);`
	`10`	`+ --_ui5_input_readonly_focus_border_radius: 0;`
`9`	`11`	`}`