import { ArrowRight } from '@taroify/icons';
import classNames from 'classnames';

import './index.less';

interface IProps {
  text: string;
  placeholder?: string;
  onClick?: () => void;
}

const PREFIX = 'bl-form-cell';

function BlFormCell(props: IProps) {
  const { text, placeholder, onClick } = props;

  return (
    <div className={PREFIX} onClick={onClick}>
      <div className={classNames(`${PREFIX}__text`, { hasText: !!text })}>{text || placeholder}</div>
      <ArrowRight className={`${PREFIX}__right-icon`} />
    </div>
  );
}

export default BlFormCell;
