# bee-tag

> tinper-bee tag ui component for react

Latest version **0.0.4** (published 2020-04-24) · MIT license · 0 weekly downloads

## Install

```sh
npm install bee-tag
pnpm add bee-tag
yarn add bee-tag
bun add bee-tag
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.0.4 |
| Published | 2020-04-24 |
| First published | 2019-04-11 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Node | >=4.0.0 |
| Dependencies | 5 |
| Unpacked size | 24.9 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | Yonyou FED |
| Maintainers | banyudu, bjyxszd, guoxj9966, guoyongfeng, huayingjie, jonyw, kvkens, liushaozhen, liuyk, npm_yx, tinper-bot, whizbz, yangchch, yonyoufed, zhaoyuchief |
| Keywords | react, react-component, bee-tag, iuap-design, tinper-bee, tag |

## Links

- npm: https://www.npmjs.com/package/bee-tag
- Repository: https://github.com/tinper-bee/bee-tag
- Homepage: https://github.com/tinper-bee/bee-tag.git
- Issues: https://github.com/tinper-bee/bee-tag.git/issues
- npm.io page: https://npm.io/package/bee-tag

## Dependencies (5)

- [express](https://npm.io/package/express.md) ^4.16.4
- [classnames](https://npm.io/package/classnames.md) ^2.2.5
- [babel-runtime](https://npm.io/package/babel-runtime.md) ^6.23.0
- [tinper-bee-core](https://npm.io/package/tinper-bee-core.md) latest
- [bee-form-control](https://npm.io/package/bee-form-control.md) ^2.0.2

## Alternatives

- [mobx-react](https://npm.io/package/mobx-react.md) — 2.8M weekly downloads
- [rc-tree](https://npm.io/package/rc-tree.md) — 2.6M weekly downloads
- [@react-oauth/google](https://npm.io/package/@react-oauth/google.md) — 1.3M weekly downloads
- [@wagmi/connectors](https://npm.io/package/@wagmi/connectors.md) — 877.0K weekly downloads
- [vee-validate](https://npm.io/package/vee-validate.md) — 836.4K weekly downloads

## Recent versions

- 0.0.4 (latest) — 2020-04-24
- 0.0.3 — 2019-04-26
- 0.0.2 — 2019-04-11
- 0.0.1 — 2019-04-11

## README

# bee-tag

[![npm version](https://img.shields.io/npm/v/bee-tag.svg)](https://www.npmjs.com/package/bee-tag)
[![Build Status](https://img.shields.io/travis/tinper-bee/bee-tag/master.svg)](https://travis-ci.org/tinper-bee/bee-tag)
[![Coverage Status](https://coveralls.io/repos/github/tinper-bee/bee-tag/badge.svg?branch=master)](https://coveralls.io/github/tinper-bee/bee-tag?branch=master)
[![devDependency Status](https://img.shields.io/david/dev/tinper-bee/bee-tag.svg)](https://david-dm.org/tinper-bee/bee-tag#info=devDependencies)
[![NPM downloads](http://img.shields.io/npm/dm/bee-tag.svg?style=flat)](https://npmjs.org/package/bee-tag)
[![Average time to resolve an issue](http://isitmaintained.com/badge/resolution/tinper-bee/bee-tag.svg)](http://isitmaintained.com/project/tinper-bee/bee-tag "Average time to resolve an issue")
[![Percentage of issues still open](http://isitmaintained.com/badge/open/tinper-bee/bee-tag.svg)](http://isitmaintained.com/project/tinper-bee/bee-tag "Percentage of issues still open")


react bee-tag component for tinper-bee

可定制的标签组件

## 使用

### 使用单独的tag包
#### 组件引入
先进行下载bee-tag包
```
npm install --save bee-button
```
组件调用
```js
import Tag from 'bee-tag';
ReactDOM.render(
        <Tag style={{color: '#000'}}>Tag</Tag>
        , document.getElementById('target'));
```
#### 样式引入

- 可以使用link引入build目录下Tag.css
```
<link rel="stylesheet" href="./node_modules/bee-tag/build/Tag.css">
```
- 可以在js中import样式
```js
import "./node_modules/bee-tag/src/Tag.scss"
```
## API

|参数|说明|类型|默认值|
|:---|:----:|:---:|------:|
|colors|颜色(dark/light/success/warning/message/danger)|string|''|
|disabled|是否禁用(`disabled` 或 `true` `false`)|boolean|false|
|bordered|是否为边框类型(`bordered` 或 `true` `false`)|boolean|false|
|deleted|是否可以删除(`deleted` 或 `true` `false`)|boolean|false|
|visible|标签是否显示关闭图标(`visible` 或 `true` `false`)|boolean|false|
|onClose|标签删除时的回调|(e) => void|-|
|select|是否可以选择(`select` 或 `true` `false`)|boolean|false|
|className|增加额外的class|string|''|
|style|style 属性|object|''|

#### 开发调试

```sh
$ npm install -g bee-tools
$ git clone https://github.com/tinper-bee/bee-tag
$ cd bee-tag
$ npm install
$ npm run dev
```

---
_Source: https://npm.io/package/bee-tag · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._