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

package/src/themes/SliderBase.css

@@ -100,9 +100,7 @@
 	background: var(--_ui5_slider_handle_background);
 	border: var(--_ui5_slider_handle_border);
 	border-radius: var(--_ui5_slider_handle_border_radius);
-	margin-inline-start: calc(-1 * var(--_ui5_slider_handle_width) / 2);
-	top: var(--_ui5_slider_handle_top);
-	position: absolute;
+	position: relative;
 	outline: none;
 	height: var(--_ui5_slider_handle_height);
 	width: var(--_ui5_slider_handle_width);
@@ -148,13 +146,18 @@
 	border: var(--_ui5_slider_handle_focus_border);
 }
 
-.ui5-slider-tooltip {
+.ui5-slider-handle-container {
+	position: absolute;
+	margin-inline-start: calc(-1 * var(--_ui5_slider_handle_width) / 2);
+	top: var(--_ui5_slider_handle_top);
+}
+
+:host(:not([hidden])) .ui5-slider-handle-container .ui5-slider-tooltip {
 	display: flex;
+	font-family: var(--sapFontFamily);
 	justify-content: center;
 	align-items: center;
 	visibility: hidden;
-	pointer-events: none;
-	line-height: 1rem;
 	position: absolute;
 	left: 50%;
 	transform: translate(-50%);
@@ -171,6 +174,22 @@
 	box-sizing: var(--_ui5_slider_tooltip_border_box);
 }
 
+:host(:not([hidden])):host([editable-tooltip]) .ui5-slider-handle-container .ui5-slider-tooltip {
+	border: none;
+	background: none;
+	box-shadow: none;
+}
+
+:host([editable-tooltip]) .ui5-slider-tooltip {
+	padding: 0;
+	box-shadow: none;
+}
+
+.ui5-slider-tooltip [ui5-input] {
+	width: 100%;
+	text-align: center;
+}
+
 .ui5-slider-tooltip-value {
 	position: relative;
 	display: flex;
@@ -195,6 +214,7 @@
 	text-align: center;
 	display: inline-block;
 	color: var(--_ui5_slider_label_color);
+	font-family: var(--sapFontFamily);
 	font-size: var(--_ui5_slider_label_fontsize);
 	padding-top: 0;
 	box-sizing: border-box;
@@ -236,4 +256,4 @@
 	position: absolute;
 	border-radius: var(--_ui5_slider_handle_border_radius);
 	pointer-events: none;
-}
+}

package/src/themes/SplitButton.css

@@ -111,6 +111,24 @@
 	border-color: var(--sapContent_ContrastFocusColor);
 }
 
+:host([design="Emphasized"][desktop]) .ui5-split-button-root:focus-within .ui5-split-text-button[active]::part(button):after,
+:host([design="Emphasized"]) .ui5-split-button-root:focus-visible .ui5-split-text-button[active]::part(button):after {
+	content: "";
+	position: absolute;
+	box-sizing: border-box;
+	left: 0.0625rem;
+	top: 0.0625rem;
+	right: 0.0625rem;
+	bottom: 0.0625rem;
+	border: var(--_ui5_split_button_focused_border);
+	border-radius: var(--_ui5_split_button_focused_border_radius);
+}
+
+:host([design="Emphasized"][desktop]) .ui5-split-button-root:has(.ui5-split-text-button[active]):after,
+:host([design="Emphasized"]) .ui5-split-button-root:has(.ui5-split-text-button[active]):after {
+	border-color: transparent;
+}
+
 .ui5-split-button-root {
 	display: inline-flex;
 	position: relative;

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

@@ -344,7 +344,7 @@
 
 	/* Slider */
 	--_ui5_slider_handle_height: 1.25rem;
-	--_ui5_slider_handle_width: 1.25rem;
+	--_ui5_slider_handle_width: 1.5rem;
 	--_ui5_slider_handle_top: -.5rem;
 	--_ui5_slider_tooltip_height: 1rem;
 	--_ui5_slider_tooltip_padding: 0.25rem;

package/src/themes/sap_fiori_3/SliderBase-parameters.css

@@ -15,3 +15,10 @@
 	--_ui5_slider_handle_box_sizing: border-box;
 	--_ui5_slider_tickmark_top: -.34375rem;
 }
+
+[data-ui5-compact-size],
+.ui5-content-density-compact,
+.sapUiSizeCompact {
+--_ui5_slider_handle_width: 1.25rem;
+--_ui5_slider_handle_height: 1.25rem;
+}

package/src/themes/sap_fiori_3/sizes-parameters.css

@@ -15,4 +15,8 @@
 
 	/* Timeline Group Item */
 	--_ui5_timeline_tlgi_root_horizontal_height: 20.90625rem;
+
+	/* Slider, Range Slider */
+	--_ui5_slider_handle_width: 1.25rem;
+	--_ui5_slider_handle_height: 1.25rem;
 }

package/src/themes/sap_fiori_3_dark/SliderBase-parameters.css

@@ -4,4 +4,11 @@
 	--_ui5_slider_inner_min_width: 4rem;
 	--_ui5_range_slider_handle_background: transparent;
 	--_ui5_range_slider_root_hover_handle_bg: transparent;
+}
+
+[data-ui5-compact-size],
+.ui5-content-density-compact,
+.sapUiSizeCompact {
+--_ui5_slider_handle_width: 1.25rem;
+--_ui5_slider_handle_height: 1.25rem;
 }

package/src/themes/sap_fiori_3_dark/sizes-parameters.css

@@ -12,4 +12,8 @@
     --_ui5_timeline_tli_indicator_after_height: 50%;
     --_ui5_timeline_tli_indicator_after_top: -50%;
     --_ui5_timeline_tli_horizontal_indicator_after_width: calc(100% - 1rem);
+
+    /* Slider, Range Slider */
+	--_ui5_slider_handle_width: 1.25rem;
+	--_ui5_slider_handle_height: 1.25rem;
 }

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

@@ -1,4 +1,10 @@
 @import "../base/sizes-parameters.css";
+:root {
+	/* Slider, Range Slider */
+	--_ui5_slider_handle_width: 1.25rem;
+	--_ui5_slider_handle_height: 1.25rem;
+	--_ui5_slider_handle_top: -0.5rem;
+}
 
 [data-ui5-compact-size],
 .ui5-content-density-compact,

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

@@ -1,4 +1,10 @@
 @import "../base/sizes-parameters.css";
+:root {
+	/* Slider, Range Slider */
+	--_ui5_slider_handle_width: 1.25rem;
+	--_ui5_slider_handle_height: 1.25rem;
+	--_ui5_slider_handle_top: -0.5rem;
+}
 
 [data-ui5-compact-size],
 .ui5-content-density-compact,

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

@@ -20,7 +20,7 @@
 	--_ui5_range_slider_handle_active_background: var(--sapSlider_Active_RangeHandleBackground);
 	--_ui5_slider_inner_height: 0.25rem;
 	--_ui5_slider_progress_border: solid 0.0625rem var(--sapContent_MeasureIndicatorColor);
-	--_ui5_slider_progress_border_radius: 0.375rem;
+	--_ui5_slider_progress_border_radius: 0.25rem;
 	--_ui5_slider_progress_background: var(--sapSlider_Selected_Background);
 	--_ui5_slider_progress_container_background: var(--sapSlider_Background);
 	--_ui5_slider_progress_container_dot_display: block;

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

@@ -20,7 +20,7 @@
 	--_ui5_range_slider_handle_active_background: var(--sapSlider_Active_RangeHandleBackground);
 	--_ui5_slider_inner_height: 0.25rem;
 	--_ui5_slider_progress_border: solid 0.0625rem var(--sapContent_MeasureIndicatorColor);
-	--_ui5_slider_progress_border_radius: 0.375rem;
+	--_ui5_slider_progress_border_radius: 0.25rem;
 	--_ui5_slider_progress_background: var(--sapSlider_Selected_Background);
 	--_ui5_slider_progress_container_background: var(--sapSlider_Background);
 	--_ui5_slider_progress_container_dot_display: block;

package/tsconfig.json

@@ -10,6 +10,8 @@
 		"composite": true,
 		"rootDir": "src",
 		"tsBuildInfoFile": "dist/.tsbuildinfo",
+		"module": "NodeNext",
+		"moduleResolution": "NodeNext",
 		"verbatimModuleSyntax": true,
 		"paths": {
 			"@ui5/webcomponents-base/dist/*": [