feat: add focus indicator in select input

theodorusclarence · Jan 3, 2024 · a05d6d1 · a05d6d1 · vercel · Jan 3, 2024
1 parent 855d37e
commit a05d6d1
Showing 1 changed file with 5 additions and 1 deletion.
diff --git a/src/components/forms/SearchableSelectInput.tsx b/src/components/forms/SearchableSelectInput.tsx
@@ -101,7 +101,11 @@ export default function SearchableSelectInput({
     option: (styles, state) => ({
       ...styles,
       color: 'black',
-      background: state.isSelected ? 'var(--color-primary-100)' : 'white',
+      background: state.isFocused
+        ? 'var(--color-primary-50)'
+        : state.isSelected
+        ? 'var(--color-primary-100)'
+        : 'white',
       ':hover': {
         background: '#E5E7EB',
       },