import React from 'react';
import RcPagination from 'rc-pagination';
import classnames from 'classnames';
// import { Pagination } from 'antd';
// import 'antd/lib/select/style/index.less';

import MiniSelect from './MiniSelect';
import Select from '../select';
import { ConfigConsumer } from '../config-provider';
import './index.less';

export default props => {
  const { prefixCls: customizePrefixCls, selectPrefixCls: customizeSelectPrefixCls, size, className, ...restProps } = props;
  return (
    <ConfigConsumer>
      {({ getPrefixCls, direction, paginationIconsProps }) => {
        const prefixCls = getPrefixCls('pagination', customizePrefixCls);
        const selectPrefixCls = getPrefixCls('select', customizeSelectPrefixCls);
        const isSmall = size === 'small';
        const extendedClassName = classnames(className, {
          mini: isSmall,
          [`${prefixCls}-rtl`]: direction === 'rtl',
        });
        return (
          <RcPagination
            prefixCls={prefixCls}
            selectPrefixCls={selectPrefixCls}
            selectComponentClass={isSmall ? MiniSelect : Select}
            className={extendedClassName}
            {...paginationIconsProps(prefixCls, direction)}
            {...restProps}
          />
        );
      }}
    </ConfigConsumer>
  );
};