Changeset View
Changeset View
Standalone View
Standalone View
cashtab/src/components/Common/EnhancedInputs.js
Show All 9 Lines | import { | ||||
ThemedWalletOutlined, | ThemedWalletOutlined, | ||||
ThemedAliasOutlined, | ThemedAliasOutlined, | ||||
} from 'components/Common/CustomIcons'; | } from 'components/Common/CustomIcons'; | ||||
import styled, { css } from 'styled-components'; | import styled, { css } from 'styled-components'; | ||||
import ScanQRCode from './ScanQRCode'; | import ScanQRCode from './ScanQRCode'; | ||||
import { supportedFiatCurrencies } from 'config/cashtabSettings'; | import { supportedFiatCurrencies } from 'config/cashtabSettings'; | ||||
import appConfig from 'config/app'; | import appConfig from 'config/app'; | ||||
const { TextArea } = Input; | |||||
export const AntdFormCss = css` | export const AntdFormCss = css` | ||||
input[type='number'] { | input[type='number'] { | ||||
-moz-appearance: textfield; | -moz-appearance: textfield; | ||||
} | } | ||||
.ant-input-group-addon { | .ant-input-group-addon { | ||||
background-color: ${props => | background-color: ${props => | ||||
props.theme.forms.addonBackground} !important; | props.theme.forms.addonBackground} !important; | ||||
border: 1px solid ${props => props.theme.forms.border}; | border: 1px solid ${props => props.theme.forms.border}; | ||||
▲ Show 20 Lines • Show All 270 Lines • ▼ Show 20 Lines | export const DestinationAmount = ({ onMax, inputProps, ...otherProps }) => { | ||||
); | ); | ||||
}; | }; | ||||
DestinationAmount.propTypes = { | DestinationAmount.propTypes = { | ||||
onMax: PropTypes.func, | onMax: PropTypes.func, | ||||
inputProps: PropTypes.object, | inputProps: PropTypes.object, | ||||
}; | }; | ||||
export const InputAmountSingle = ({ inputProps, ...otherProps }) => { | |||||
return ( | |||||
<AntdFormWrapper> | |||||
<Form.Item {...otherProps}> | |||||
<Input type="string" {...inputProps} /> | |||||
</Form.Item> | |||||
</AntdFormWrapper> | |||||
); | |||||
}; | |||||
InputAmountSingle.propTypes = { | |||||
inputProps: PropTypes.object, | |||||
}; | |||||
// loadWithCameraOpen prop: if true, load page with camera scanning open | // loadWithCameraOpen prop: if true, load page with camera scanning open | ||||
export const DestinationAddressSingle = ({ | export const DestinationAddressSingle = ({ | ||||
onScan, | onScan, | ||||
loadWithCameraOpen, | loadWithCameraOpen, | ||||
inputProps, | inputProps, | ||||
...otherProps | ...otherProps | ||||
}) => { | }) => { | ||||
return ( | return ( | ||||
▲ Show 20 Lines • Show All 75 Lines • ▼ Show 20 Lines | return ( | ||||
</AntdFormWrapper> | </AntdFormWrapper> | ||||
); | ); | ||||
}; | }; | ||||
AliasAddressInput.propTypes = { | AliasAddressInput.propTypes = { | ||||
inputProps: PropTypes.object, | inputProps: PropTypes.object, | ||||
}; | }; | ||||
export const DestinationAddressMulti = ({ inputProps, ...otherProps }) => { | |||||
return ( | |||||
<AntdFormWrapper> | |||||
<Form.Item {...otherProps}> | |||||
<TextArea | |||||
style={{ height: '189px' }} | |||||
prefix={<ThemedWalletOutlined />} | |||||
autoComplete="off" | |||||
{...inputProps} | |||||
/> | |||||
</Form.Item> | |||||
</AntdFormWrapper> | |||||
); | |||||
}; | |||||
DestinationAddressMulti.propTypes = { | |||||
inputProps: PropTypes.object, | |||||
}; | |||||
export const CurrencySelectDropdown = selectProps => { | export const CurrencySelectDropdown = selectProps => { | ||||
const { Option } = Select; | const { Option } = Select; | ||||
// Build select dropdown from supportedFiatCurrencies | // Build select dropdown from supportedFiatCurrencies | ||||
const currencyMenuOptions = []; | const currencyMenuOptions = []; | ||||
const currencyKeys = Object.keys(supportedFiatCurrencies); | const currencyKeys = Object.keys(supportedFiatCurrencies); | ||||
for (let i = 0; i < currencyKeys.length; i += 1) { | for (let i = 0; i < currencyKeys.length; i += 1) { | ||||
const currencyMenuOption = {}; | const currencyMenuOption = {}; | ||||
Show All 31 Lines |