arno/trezor-wallet
1
0
Fork 0
mirror of https://github.com/trezor/trezor-wallet synced 2025-06-28 02:42:35 +00:00
Code Issues Releases Wiki Activity

searchable currency select with dropDownIndicator enabled

Browse Source
This commit is contained in:
slowbackspace 2019-03-12 18:34:32 +01:00
parent d0bb9cbbac
commit c96992a3f7
3 changed files with 8 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/components/Select/index.js
View File

@ -4,12 +4,15 @@ import ReactSelect from 'react-select';
import ReactAsyncSelect from 'react-select/lib/Async'; import ReactAsyncSelect from 'react-select/lib/Async';
import colors from 'config/colors'; import colors from 'config/colors';
const styles = isSearchable => ({ const styles = (isSearchable, withDropdownIndicator = true) => ({
singleValue: base => ({ singleValue: base => ({
...base, ...base,
maxWidth: 'calc(100% - 10px)', // 8px padding + 2px maring-left maxWidth: 'calc(100% - 10px)', // 8px padding + 2px maring-left
width: '100%', width: '100%',
color: colors.TEXT_SECONDARY, color: colors.TEXT_SECONDARY,
'&:hover': {
cursor: 'text',
},
}), }),
control: (base, { isDisabled, isFocused }) => ({ control: (base, { isDisabled, isFocused }) => ({
...base, ...base,
@ -20,7 +23,7 @@ const styles = isSearchable => ({
boxShadow: isFocused ? `0 0px 6px 0 ${colors.INPUT_FOCUSED_SHADOW}` : 'none', boxShadow: isFocused ? `0 0px 6px 0 ${colors.INPUT_FOCUSED_SHADOW}` : 'none',
background: isDisabled ? colors.LANDING : colors.WHITE, background: isDisabled ? colors.LANDING : colors.WHITE,
'&:hover': { '&:hover': {
cursor: isSearchable ? 'text' : 'pointer', cursor: 'pointer',
}, },
}), }),
indicatorSeparator: () => ({ indicatorSeparator: () => ({
@ -28,7 +31,7 @@ const styles = isSearchable => ({
}), }),
dropdownIndicator: (base, { isDisabled }) => ({ dropdownIndicator: (base, { isDisabled }) => ({
...base, ...base,
display: isSearchable || isDisabled ? 'none' : 'block', display: !withDropdownIndicator || isDisabled ? 'none' : 'block',
color: colors.TEXT_SECONDARY, color: colors.TEXT_SECONDARY,
path: '', path: '',
'&:hover': { '&:hover': {

2
src/views/Wallet/views/Account/Send/ethereum/index.js
View File

@ -455,7 +455,7 @@ const AccountSend = (props: Props) => {
sideAddons={[ sideAddons={[
<LocalCurrencySelect <LocalCurrencySelect
key="local-currency" key="local-currency"
isSearchable={false} isSearchable
isClearable={false} isClearable={false}
onChange={option => onLocalCurrencyChange(option)} onChange={option => onLocalCurrencyChange(option)}
value={buildCurrencyOption(localCurrency)} value={buildCurrencyOption(localCurrency)}

1
src/views/Wallet/views/Account/Summary/ethereum/index.js
View File

@ -121,6 +121,7 @@ const AccountSummary = (props: Props) => {
<AsyncSelectWrapper> <AsyncSelectWrapper>
<AsyncSelect <AsyncSelect
isSearchable isSearchable
withDropdownIndicator={false}
defaultOptions defaultOptions
value={null} value={null}
isMulti={false} isMulti={false}