react-translatable-input-component

react-translatable-input-component

A React input component that manages multiple languages.

Install

$ npm install --save react-translatable-input-component

Usage

import { inputTypes, MemoizedTranslatableInput } from 'react-translatable-input-component';

<MemoizedTranslatableInput
    type={inputTypes.text}
    label="Input label"
    onChangeValue={(val) => handleChange('inputName', { customValue: val })}
    value={inputName}
/>


// Formik examples
// input type text
<MemoizedTranslatableInput
    type={inputTypes.text}
    onChangeValue={(val) => formik.setFieldValue('title', val)}
    value={formik.values.title}
    customStyle={{
        width: '100%',
        flex: 1,
        marginTop: 0,
        marginBottom: 8
    }}
/>

// input type textarea
<MemoizedTranslatableInput
    type={inputTypes.textarea}
    onChangeValue={(val) => formik.setFieldValue('description', val)}
    value={formik.values.description}
    textareaSelectionStyle={{
        position: 'absolute',
        fontSize: 14,
        fontWeight: 500,
        left: 5,
        top: 5,
        zIndex: 3,
        cursor: 'pointer',
        padding: 5
    }}
    textareaContainerStyle={{
        position: 'relative',
        marginTop: 0
    }}
/>

License

MIT © [Nijat Aliyev]