verdnatura-chat/app/containers/UIKit/Input.tsx

46 lines
1.3 KiB
TypeScript
Raw Normal View History

2020-02-11 14:01:35 +00:00
import React from 'react';
import { StyleSheet, Text, View } from 'react-native';
import { BLOCK_CONTEXT } from '@rocket.chat/ui-kit';
import sharedStyles from '../../views/Styles';
import { themes } from '../../lib/constants';
import { IInput } from './interfaces';
2020-02-11 14:01:35 +00:00
const styles = StyleSheet.create({
container: {
marginBottom: 16
},
label: {
fontSize: 14,
marginVertical: 10,
...sharedStyles.textSemibold
},
description: {
marginBottom: 10,
fontSize: 15,
...sharedStyles.textRegular
},
error: {
marginTop: 8,
fontSize: 14,
...sharedStyles.textRegular,
...sharedStyles.textAlignCenter
},
hint: {
fontSize: 14,
...sharedStyles.textRegular
}
});
export const Input = ({ element, parser, label, description, error, hint, theme }: IInput) => (
2020-02-11 14:01:35 +00:00
<View style={styles.container}>
{label ? (
<Text style={[styles.label, { color: error ? themes[theme].dangerColor : themes[theme].titleText }]}>{label}</Text>
) : null}
2020-02-11 14:01:35 +00:00
{description ? <Text style={[styles.description, { color: themes[theme].auxiliaryText }]}>{description}</Text> : null}
{parser.renderInputs({ ...element }, BLOCK_CONTEXT.FORM, parser)}
{error ? <Text style={[styles.error, { color: themes[theme].dangerColor }]}>{error}</Text> : null}
{hint ? <Text style={[styles.hint, { color: themes[theme].auxiliaryText }]}>{hint}</Text> : null}
</View>
);