mirrors/oneuptime
1
0
Fork 0
mirror of https://github.com/OneUptime/oneuptime synced 2024-11-21 22:59:07 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: Update Dropdown (react-select) style

Browse Source
This commit is contained in:
Sokna Ly 2023-11-25 23:19:00 +07:00
parent ed5313b87d
commit 48def92f92
1 changed files with 24 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
CommonUI/src/Components/Dropdown/Dropdown.tsx
View File

@ -1,4 +1,4 @@
import Select from 'react-select';
import Select, { ControlProps, GroupBase, OptionProps } from 'react-select';
import React, {
FunctionComponent,
ReactElement,
@ -126,6 +126,29 @@ const Dropdown: FunctionComponent<ComponentProps> = (
onFocus={() => {
props.onFocus && props.onFocus();
}}
classNames={{
control: (
state: ControlProps<any, boolean, GroupBase<any>>
): string => {
return state.isFocused
? '!border-indigo-500'
: 'border-grey-300';
},
option: (
state: OptionProps<any, boolean, GroupBase<any>>
): string => {
if (state.isDisabled) {
return 'bg-gray-100';
}
if (state.isSelected) {
return '!bg-indigo-500';
}
if (state.isFocused) {
return '!bg-indigo-100';
}
return '';
},
}}
isClearable={true}
isSearchable={true}
placeholder={props.placeholder}