import React from 'react';
import AntdInput from 'antd/es/input';

import { ConfigConsumer } from '../config-provider';
import Search from './Search';

import './index.less';

const InternalInput = (props, ref) => (
  <ConfigConsumer>
    {({ getPrefixCls }) => {
      const { prefixCls: customizePrefixCls, ...restProps } = props;
      const prefixCls = getPrefixCls('input', customizePrefixCls);
      return <AntdInput prefixCls={prefixCls} ref={ref} {...restProps} />;
    }}
  </ConfigConsumer>
);

const Input = React.forwardRef(InternalInput);

Input.Group = props => (
  <ConfigConsumer>
    {({ getPrefixCls }) => {
      const { prefixCls: customizePrefixCls, ...restProps } = props;
      const prefixCls = getPrefixCls('input', customizePrefixCls);
      return <AntdInput.Group prefixCls={prefixCls} {...restProps} />;
    }}
  </ConfigConsumer>
);

Input.Search = Search;

Input.TextArea = props => (
  <ConfigConsumer>
    {({ getPrefixCls }) => {
      const { prefixCls: customizePrefixCls, ...restProps } = props;
      const prefixCls = getPrefixCls('input', customizePrefixCls);
      return <AntdInput.TextArea prefixCls={prefixCls} {...restProps} />;
    }}
  </ConfigConsumer>
);

// antd Password 组件不能自定义 EyeIcon
Input.Password = props => (
  <ConfigConsumer>
    {({ getPrefixCls }) => {
      const { prefixCls: customizePrefixCls, ...restProps } = props;
      const prefixCls = getPrefixCls('input', customizePrefixCls);
      return <AntdInput.Password inputPrefixCls={prefixCls} {...restProps} />;
    }}
  </ConfigConsumer>
);

export default Input;