open-index/open-npm huggingface dataset:
npm package: @hocgin/component_name
Description: ### 更改模版 - `package.json` > `@hocgin/component_name`=> `YOUR COMPONENT NAME` > `repository`=> `YOUR Repository URL`
Author: hocgin
Latest version: 0.1.3

## React Component Template

### 更改模版
- `package.json`
> `@hocgin/component_name`=> `YOUR COMPONENT NAME`
> `repository`=> `YOUR Repository URL`

### 发布 npm 
```shell script
# 1. 登陆
npm login
# 2. 编译+发布
npm run deploy
```
npm package: @hocgin/edge-tts
Description: @hocgin/edge-tts
Latest version: 1.0.30

# @hocgin/edge-tts

[![NPM version](https://img.shields.io/npm/v/@hocgin/edge-tts.svg?style=flat)](https://npmjs.org/package/@hocgin/edge-tts)
[![NPM downloads](http://img.shields.io/npm/dm/@hocgin/edge-tts.svg?style=flat)](https://npmjs.org/package/@hocgin/edge-tts)

@hocgin/edge-tts

## Usage

发布 npm run release

## Options

TODO

## Development

```bash
# install dependencies
$ pnpm install

# develop library by docs demo
$ pnpm start

# build library source code
$ pnpm run build

# build library source code in watch mode
$ pnpm run build:watch

# build docs
$ pnpm run docs:build

# check your project for potential problems
$ pnpm run doctor
```

## LICENSE

MIT
npm package: @hocgin/editor
Description: A React Editor
Latest version: 0.0.12

# @hocgin/editor

> 语雀同款的文本编辑器

[![npm](https://img.shields.io/npm/v/@hocgin/editor?style=flat-square)](https://www.npmjs.com/package/@hocgin/editor)

## Usage

```shell
pnpm install @hocgin/editor
```

## Screen

#### 全屏模式

<img src="https://github.com/hocgin/editor/raw/main/_docs/demo1.jpg" width="500px"/>

#### 小屏模式

<img src="https://github.com/hocgin/editor/raw/main/_docs/demo2.png" width="500px"/>

## Development

```bash
# install dependencies
$ pnpm install

# develop library by docs demo
$ pnpm start

# build library source code
$ pnpm run build
```

## LICENSE

MIT
npm package: @hocgin/giboard
Description: show github project with board
Latest version: 1.0.3

# @hocgin/giboard

> Use `github project graphql api` with Board  
> [在线浏览 / Demo](https://logspot.hocgin.top/addone-rss-reader?active=feedback)

[![npm](https://img.shields.io/npm/v/@hocgin/giboard?style=flat-square)](https://www.npmjs.com/package/@hocgin/giboard)

## Screen

![img.png](https://raw.githubusercontent.com/hocgin/giboard/main/_docs/img.png)

## Usage

```shell
pnpm install @hocgin/giboard
```

> 需要创建一个只有`read:project`权限的Token。[创建 Token](https://github.com/settings/tokens/new)  
> ⚠️ 注意: 请不要将 Token 提交到公共仓库，否则 GitHub 会自动进行 Token 回收。

```tsx
<GiBoard token={'ghp_wfheNxmh0HhsxCZi...'} login="hocgin" projectId="16"
         style={{height: 400}}/>
```

如果你已经有自己的看板接口，可以直接传入 `api`，组件会优先请求该接口，并要求它返回与当前方案一致的看板数据结构。

```tsx
<GiBoard api="/api/board" token={'ghp_wfheNxmh0HhsxCZi...'} login="hocgin" projectId="16"
         style={{height: 400}}/>
```

如果你想手动覆盖标题下方的描述，可以传入 `subtitle`，它会优先于接口返回的 `shortDescription`。

```tsx
<GiBoard subtitle="自定义描述" token={'ghp_wfheNxmh0HhsxCZi...'} login="hocgin" projectId="16"
         style={{height: 400}}/>
```

如果你想把底部的说明单独覆盖掉，可以传入 `readme`，它会优先于接口返回的 `readme` 字段。

```tsx
<GiBoard readme="自定义底部说明" token={'ghp_wfheNxmh0HhsxCZi...'} login="hocgin" projectId="16"
         style={{height: 400}}/>
```

如果项目里有多个仓库，可以传入 `repositories`，右上角会显示过滤选择器；如果只传一个仓库名，组件会自动过滤但不显示选择器。

```tsx
<GiBoard repositories={['repo-a', 'repo-b']} token={'ghp_wfheNxmh0HhsxCZi...'} login="hocgin" projectId="16"
         style={{height: 400}}/>
```


| 字段          | 类型     | 描述                       |
|-------------|--------|--------------------------|
| Title       | String | 标题                       |
| Status      | Enum   | 枚举，Todo/In Progress/Done |
| Priority    | Number | 可选，优先级, Desc             |
| Description | String | 可选，描述                    |
| Complete    | Number | 可选，完成度                   |
| Assignees   | User   | 可选，用户信息                  |

## Development

```bash
# install dependencies
$ pnpm install

# develop library by docs demo
$ pnpm start

# build library source code
$ pnpm run build
```

## LICENSE

MIT