xchain-components/src/components/XTextArea/index.js

Xchain Components

/* eslint react/jsx-filename-extension: 0 */
import * as React from 'react';
import { TextArea } from 'semantic-ui-react';

type Props = {
  autoheight?: boolean,
  width?: string,
  placeholder: string,
  minHeight?: string,
  backgroundColor?: string,
  borderColor?: string,
  fontSize?: string,
  fontWeight?: string,
  onChangeofValue: () => void,
  value: string,
};

const XTextArea = (props: Props) => {
  const {
    minHeight, placeholder, width, autoheight, backgroundColor, borderColor, fontSize, fontWeight,
    value, onChangeofValue,
  } = props;
  return (
    <TextArea
      style={{
        width,
        minHeight,
        backgroundColor,
        borderColor: `1px solid ${borderColor}`,
        fontSize,
        fontWeight,
        padding: '5px',
      }}
      placeholder={placeholder}
      autoHeight={autoheight}
      value={value}
      onChange={onChangeofValue}
    />
  );
};

XTextArea.defaultProps = {
  autoheight: true,
  width: '345px',
  minHeight: '90px',
  borderColor: 'transparent',
  backgroundColor: '#ffffff',
  fontSize: '12px',
  fontWeight: '500',
};
export default XTextArea;