fix(SelectInputV2): description in row should be baseline aligned (#3858

)
scaleway · Jun 10, 2024 · 36f2ef2 · 36f2ef2
1 parent 0531578
commit 36f2ef2
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 9 deletions.
diff --git a/.changeset/late-phones-smoke.md b/.changeset/late-phones-smoke.md
@@ -0,0 +1,5 @@
+---
+"@ultraviolet/ui": patch
+---
+
+Fix `<SelectInputV2 />` when description is in row mode it should be aligned on baseline instead of normal
diff --git a/packages/ui/src/components/SelectInputV2/DropdownOption.tsx b/packages/ui/src/components/SelectInputV2/DropdownOption.tsx
@@ -60,7 +60,7 @@ export const DisplayOption = ({
           alignItems="baseline"
           data-testid={`option-stack-${option.value}`}
         >
-          <Stack gap={0.5} direction="row">
+          <Stack gap={0.5} direction="row" alignItems="baseline">
             <Text as="span" variant="body" placement="left">
               {option.label}
             </Text>

diff --git a/packages/ui/src/components/SelectInputV2/__tests__/__snapshots__/index.test.tsx.snap b/packages/ui/src/components/SelectInputV2/__tests__/__snapshots__/index.test.tsx.snap
@@ -15004,10 +15004,10 @@ exports[`SelectInputV2 > renders correctly with label on the right and optional
   -webkit-flex-direction: row;
   -ms-flex-direction: row;
   flex-direction: row;
-  -webkit-align-items: normal;
-  -webkit-box-align: normal;
-  -ms-flex-align: normal;
-  align-items: normal;
+  -webkit-align-items: baseline;
+  -webkit-box-align: baseline;
+  -ms-flex-align: baseline;
+  align-items: baseline;
   -webkit-box-pack: normal;
   -ms-flex-pack: normal;
   -webkit-justify-content: normal;
@@ -16138,10 +16138,10 @@ exports[`SelectInputV2 > renders correctly with label on the right and optional
   -webkit-flex-direction: row;
   -ms-flex-direction: row;
   flex-direction: row;
-  -webkit-align-items: normal;
-  -webkit-box-align: normal;
-  -ms-flex-align: normal;
-  align-items: normal;
+  -webkit-align-items: baseline;
+  -webkit-box-align: baseline;
+  -ms-flex-align: baseline;
+  align-items: baseline;
   -webkit-box-pack: normal;
   -ms-flex-pack: normal;
   -webkit-justify-content: normal;