fix: select placeholder jumping with label above (#5159)

nmerget · github-actions[bot] · web-flow · commit 7ed8d2225102 · 2025-10-08T08:10:42.000+02:00
* fix: select placeholder jumping with label above * auto update snapshots (#5161) Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> * fix: issue with cut placeholder --------- Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
diff --git a/.changeset/heavy-days-call.md b/.changeset/heavy-days-call.md
@@ -0,0 +1,5 @@
+---
+"@db-ux/core-components": patch
+---
+
+fix(select): jumping placeholder for label above
diff --git a/packages/components/src/styles/internal/_select-components.scss b/packages/components/src/styles/internal/_select-components.scss
@@ -23,6 +23,15 @@ $select-icon-padding: calc(
 	position: absolute;
 	inset-block-start: 0;
 	inset-inline-start: 0;
+	opacity: 0;
+
+	@media screen and (prefers-reduced-motion: no-preference) {
+		transition:
+			opacity #{variables.$db-transition-straight-emotional},
+			outline #{variables.$db-transition-duration-extra-fast},
+			border-color #{variables.$db-transition-straight-emotional},
+			background-color #{variables.$db-transition-straight-emotional};
+	}
 }
 
 %select-placeholder {

-Original file line number
+Diff line change
@@ @@ -0,0 +1,5 @@ @@
 +---
 +"@db-ux/core-components": patch
 +---
++
 +fix(select): jumping placeholder for label above