import React from 'react';
import { Button } from 'antd';
import Tag from './Tag';
import './style.less'

export default (props) => {
  const { size, type, list = [], onDelete, keyFuc, labelFunc } = props;

  return (
    <div className='editable-tag-box'>
      {
        list.map((item, index) => {
          const key = keyFuc(item, index);
          const label = labelFunc(item, index);

          return <Tag key={key} size={size} type={type} onDelete={() => onDelete(item)}>{label}</Tag>
        })
      }
    </div>
  )
}
