https://github.com/khulnasoft-lab/gpt-vis
https://github.com/khulnasoft-lab/gpt-vis
Last synced: 2 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/khulnasoft-lab/gpt-vis
- Owner: khulnasoft-lab
- License: mit
- Created: 2024-07-13T21:34:53.000Z (10 months ago)
- Default Branch: main
- Last Pushed: 2024-08-20T01:59:51.000Z (9 months ago)
- Last Synced: 2025-01-26T14:08:54.888Z (4 months ago)
- Language: TypeScript
- Size: 133 KB
- Stars: 0
- Watchers: 3
- Forks: 1
- Open Issues: 4
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
GPT-VIS
Components for GPTs, generative AI, and LLM projects. Not only UI Components.
## 特性
- 🤖 **LLM 相关**：针对 LLM 对话式交互，以及服务端序列化输出而设计，方便快速集成到 AI 应用中。
- 🍡 **丰富组件**：内置有 20+ 美观好看的常用 UI 组件，满足常规需求。
- 🔨 **易于扩展**：对于自己的特殊 UI 定制需求，提供方便的扩展机制和架构设计。
## 安装
使用 NodeJS 包管理工具安装依赖。
```bash
$npm i --save gpt-vis
```
## 快速使用
快速使用 gpt-vis渲染出对话卡片的 UI。
```tsx
import { Conversation, Components } from 'gpt-vis';
function Demo() {
// 服务端返回的协议内容
const content =
'# GPT-VIS \n\nComponents for GPTs, generative AI, and LLM projects. Not only UI Components.';
return {content};
}
```
使用自定义的 UI 组件。UI 渲染最终使用 markdown 格式，所以自定义的方式有两种，一种是基于 markdown code 标签去扩展语言，一种是扩展标签。
````tsx
import { Conversation, Components } from 'gpt-vis';
const custom = {
'my-ui': () => {},
};
function Demo() {
// 服务端返回的协议内容
const content = '# GPT-VIS \n\n```my-ui\n{"value": "1"}```';
return (
{content}
);
}
````
## Development
```bash
# install dependencies
$ npm install
# develop library by docs demo
$ npm run dev
# build library source code
$ npm run build
```
## License
MIT