more

pinterest · Oct 18, 2024 · 240e944 · 240e944
1 parent d536bd4
commit 240e944
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 7 deletions.
diff --git a/packages/gestalt/src/SelectList.tsx b/packages/gestalt/src/SelectList.tsx
@@ -133,8 +133,8 @@ function SelectList({
     formElement.base,
     size === 'md' ? layout.medium : layout.large,
     {
-      [styles.placeholder]: !disabled && !value,
-      [styles.selected]: !disabled && !!value,
+      [styles.placeholder]: !disabled && placeholder && !value,
+      [styles.selected]: (!disabled && placeholder && value) || (!disabled && !placeholder),
       [styles.enabled]: !disabled,
       [formElement.md]: size === 'md',
       [formElement.lg]: size === 'lg',

diff --git a/packages/gestalt/src/SelectList/VRSelectList.tsx b/packages/gestalt/src/SelectList/VRSelectList.tsx
@@ -152,8 +152,9 @@ const SelectListWithForwardRef = forwardRef<HTMLSelectElement, Props>(function I
           aria-describedby={focused ? ariaDescribedby : undefined}
           aria-invalid={hasErrorMessage ? 'true' : 'false'}
           className={classnames(styles.input, typographyStyle.truncate, {
-            [styles.placeholderText]: !disabled && !value,
-            [styles.enabledText]: !disabled && !!value,
+            [styles.placeholderText]: !disabled && placeholder && !value,
+            [styles.enabledText]:
+              (!disabled && placeholder && value) || (!disabled && !placeholder),
             [styles.enabledBorder]: !disabled && !hasErrorMessage,
             [styles.errorBorder]: !disabled && hasErrorMessage,
             [styles.disabledText]: disabled,

diff --git a/packages/gestalt/src/__snapshots__/SelectList.test.tsx.snap b/packages/gestalt/src/__snapshots__/SelectList.test.tsx.snap
@@ -52,7 +52,7 @@ exports[`SelectList renders an option group 1`] = `
     </div>
     <select
       aria-invalid="false"
-      className="select base medium placeholder enabled md normal"
+      className="select base medium selected enabled md normal"
       disabled={false}
       id="optionGroup"
       onBlur={[Function]}
@@ -145,7 +145,7 @@ exports[`SelectList renders with a hidden label 1`] = `
     </div>
     <select
       aria-invalid="false"
-      className="select base medium placeholder enabled md normal"
+      className="select base medium selected enabled md normal"
       disabled={false}
       id="test"
       onBlur={[Function]}
@@ -210,7 +210,7 @@ exports[`SelectList renders with typical props 1`] = `
     </div>
     <select
       aria-invalid="false"
-      className="select base medium placeholder enabled md normal"
+      className="select base medium selected enabled md normal"
       disabled={false}
       id="test"
       onBlur={[Function]}