@opentiny/tiny-robot 0.4.0 → 0.4.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/README.md +192 -1
  2. package/README.zh-CN.md +192 -0
  3. package/package.json +33 -4
package/README.md CHANGED
@@ -1 +1,192 @@
1
- # 组件
1
+ # TinyRobot
2
+
3
+ <p align="center">
4
+ <a href="https://opentiny.design" target="_blank" rel="noopener noreferrer">
5
+ <img alt="OpenTiny Logo" src="https://raw.githubusercontent.com/opentiny/tiny-robot/HEAD/logo.svg" height="100" style="max-width:100%;">
6
+ </a>
7
+ </p>
8
+
9
+ [![npm version](https://img.shields.io/npm/v/@opentiny/tiny-robot.svg)](https://www.npmjs.com/package/@opentiny/tiny-robot)
10
+ [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
11
+
12
+ **TinyRobot** is an AI component library built for Vue 3, following the OpenTiny Design system. It provides rich AI interaction components to help developers quickly build enterprise-level AI applications.
13
+
14
+ ## ✨ Features
15
+
16
+ - 🤖 **Rich AI Components**: Comprehensive set of AI interaction components including chat bubbles, message input, conversation management, and more
17
+ - 🎨 **OpenTiny Design**: Follows OpenTiny Design system for consistent UI/UX
18
+ - 🚀 **Out of the Box**: Get started in minutes with minimal configuration
19
+ - 🎯 **TypeScript Support**: Full TypeScript support with complete type definitions
20
+ - 🌈 **Theme Customization**: Flexible theme system supporting multiple themes and custom styles
21
+ - 📦 **Tree Shaking**: Optimized for tree shaking, import only what you need
22
+ - 🔄 **Streaming Support**: Built-in support for streaming AI responses
23
+ - 💾 **Storage Strategy**: Flexible storage strategies (LocalStorage, IndexedDB, custom)
24
+
25
+ English | [简体中文](https://github.com/opentiny/tiny-robot/blob/HEAD/README.zh-CN.md)
26
+
27
+ [![Ask DeepWiki](https://deepwiki.com/badge.svg)](https://deepwiki.com/opentiny/tiny-robot)
28
+
29
+ ## 📦 Packages
30
+
31
+ TinyRobot is a monorepo containing the following packages:
32
+
33
+ | Package | Description | Version |
34
+ | --------------------------- | ------------------------------------------------------------ | ----------------------------------------------------------------------------------------------------------------------------- |
35
+ | `@opentiny/tiny-robot` | Core component library with all AI interaction components | [![npm](https://img.shields.io/npm/v/@opentiny/tiny-robot.svg)](https://www.npmjs.com/package/@opentiny/tiny-robot) |
36
+ | `@opentiny/tiny-robot-kit` | Utility functions and AI client tools for model interactions | [![npm](https://img.shields.io/npm/v/@opentiny/tiny-robot-kit.svg)](https://www.npmjs.com/package/@opentiny/tiny-robot-kit) |
37
+ | `@opentiny/tiny-robot-svgs` | SVG icon library with all component icons | [![npm](https://img.shields.io/npm/v/@opentiny/tiny-robot-svgs.svg)](https://www.npmjs.com/package/@opentiny/tiny-robot-svgs) |
38
+
39
+ ## 🚀 Quick Start
40
+
41
+ ### Prerequisites
42
+
43
+ - Node.js >= 20.13.0
44
+ - Vue >= 3.2.0
45
+ - Package manager: npm, yarn, or pnpm
46
+
47
+ ### Installation
48
+
49
+ **Core package** — `@opentiny/tiny-robot` is the main package.
50
+
51
+ ```bash
52
+ # Using pnpm (recommended)
53
+ pnpm add @opentiny/tiny-robot
54
+
55
+ # Using npm
56
+ npm install @opentiny/tiny-robot
57
+
58
+ # Using yarn
59
+ yarn add @opentiny/tiny-robot
60
+ ```
61
+
62
+ **Optional packages**:
63
+
64
+ - `@opentiny/tiny-robot-kit` — Only needed if you use AI model request or data-processing features. Add it when required:
65
+
66
+ ```bash
67
+ pnpm add @opentiny/tiny-robot-kit
68
+ ```
69
+
70
+ - `@opentiny/tiny-robot-svgs` — Optional. Install separately only if you need to use the SVG icon library standalone or with custom icons:
71
+
72
+ ```bash
73
+ pnpm add @opentiny/tiny-robot-svgs
74
+ ```
75
+
76
+ ### Basic Usage
77
+
78
+ #### 1. Import Styles
79
+
80
+ In your `main.js` or `main.ts`:
81
+
82
+ ```ts
83
+ import { createApp } from 'vue'
84
+ import App from './App.vue'
85
+ import '@opentiny/tiny-robot/dist/style.css'
86
+
87
+ const app = createApp(App)
88
+ app.mount('#app')
89
+ ```
90
+
91
+ #### 2. Use Components
92
+
93
+ ```vue
94
+ <template>
95
+ <div class="chat-container">
96
+ <tr-bubble role="ai" content="Hello! I'm TinyRobot, an AI component library for Vue 3." placement="start" />
97
+ <tr-bubble role="user" content="That's great! How can I get started?" placement="end" />
98
+ </div>
99
+ </template>
100
+
101
+ <script setup>
102
+ import { TrBubble } from '@opentiny/tiny-robot'
103
+ </script>
104
+ ```
105
+
106
+ ## 📚 Documentation
107
+
108
+ - 📖 [Full Documentation](https://docs.opentiny.design/tiny-robot/) - Complete API reference and guides
109
+ - 🎯 [Quick Start Guide](https://docs.opentiny.design/tiny-robot/guide/quick-start) - Get started in minutes
110
+ - 🎨 [Theme Configuration](https://docs.opentiny.design/tiny-robot/guide/theme-config) - Customize themes
111
+ - 📝 [Update Log](https://docs.opentiny.design/tiny-robot/guide/update-log) - Version history
112
+ - 💡 [Examples](https://docs.opentiny.design/tiny-robot/examples/assistant) - Complete application examples
113
+
114
+ ## 🏗️ Project Structure
115
+
116
+ ```text
117
+ tiny-robot/
118
+ ├── packages/
119
+ │ ├── components/ # Core component library
120
+ │ │ ├── src/
121
+ │ │ │ ├── bubble/ # Chat bubble components
122
+ │ │ │ ├── sender/ # Message input component
123
+ │ │ │ ├── container/ # Container component
124
+ │ │ │ ├── history/ # Conversation history
125
+ │ │ │ ├── attachments/ # File attachments
126
+ │ │ │ └── ... # Other components
127
+ │ │ └── package.json
128
+ │ ├── kit/ # Utility functions and AI tools
129
+ │ │ ├── src/
130
+ │ │ │ ├── providers/ # AI provider implementations
131
+ │ │ │ ├── vue/ # Vue composables
132
+ │ │ │ │ ├── message/ # useMessage composable
133
+ │ │ │ │ └── conversation/ # useConversation composable
134
+ │ │ │ └── storage/ # Storage utilities
135
+ │ │ └── package.json
136
+ │ ├── svgs/ # SVG icon library
137
+ │ ├── playground/ # Development playground
138
+ │ └── test/ # Test suite
139
+ ├── docs/ # Documentation site
140
+ │ ├── src/ # Documentation source
141
+ │ └── demos/ # Component demos
142
+ ├── scripts/ # Build and utility scripts
143
+ └── package.json
144
+ ```
145
+
146
+ ## 🛠️ Development
147
+
148
+ ### Setup
149
+
150
+ ```bash
151
+ # Install dependencies
152
+ pnpm install
153
+
154
+ # Start development server (playground + docs)
155
+ pnpm dev
156
+ ```
157
+
158
+ ### Development Workflow
159
+
160
+ 1. **Start Development Server**:
161
+ - Run `pnpm dev` in the project root directory
162
+ - This starts both the playground and documentation site
163
+ - After modifying components in `packages/components/src/`, changes will be automatically reflected in the documentation page
164
+
165
+ 2. **Documentation**:
166
+ - Documentation source: `docs/src/`
167
+ - Component demos: `docs/demos/`
168
+
169
+ 3. **Testing**:
170
+ - Run `pnpm test` to execute tests
171
+
172
+ ## 📄 License
173
+
174
+ MIT License - see [LICENSE](https://github.com/opentiny/tiny-robot/blob/HEAD/LICENSE) file for details.
175
+
176
+ ## 🤝 Contributing
177
+
178
+ Contributions are welcome! Please read our [Contributing Guide](https://github.com/opentiny/tiny-robot/blob/HEAD/CONTRIBUTING.md) to understand the recommended workflow, commit message conventions, and how to submit Issues and Pull Requests.
179
+
180
+ ## 📞 Support
181
+
182
+ - 📖 [Documentation](https://docs.opentiny.design/tiny-robot/)
183
+ - 🐛 [Issue Tracker](https://github.com/opentiny/tiny-robot/issues)
184
+ - 💬 [Discussions](https://github.com/opentiny/tiny-robot/discussions)
185
+
186
+ ## 🙏 Acknowledgments
187
+
188
+ Built with ❤️ by the OpenTiny team.
189
+
190
+ ---
191
+
192
+ **Note**: This project is part of the [OpenTiny](https://github.com/opentiny) ecosystem.
@@ -0,0 +1,192 @@
1
+ # TinyRobot
2
+
3
+ <p align="center">
4
+ <a href="https://opentiny.design" target="_blank" rel="noopener noreferrer">
5
+ <img alt="OpenTiny Logo" src="https://raw.githubusercontent.com/opentiny/tiny-robot/HEAD/logo.svg" height="100" style="max-width:100%;">
6
+ </a>
7
+ </p>
8
+
9
+ [![npm version](https://img.shields.io/npm/v/@opentiny/tiny-robot.svg)](https://www.npmjs.com/package/@opentiny/tiny-robot)
10
+ [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
11
+
12
+ **TinyRobot** 是一个基于 Vue 3 构建的 AI 组件库,遵循 OpenTiny Design 设计体系。它提供了丰富的 AI 交互组件,帮助开发者快速构建企业级 AI 应用。
13
+
14
+ ## ✨ 特性
15
+
16
+ - 🤖 **丰富的 AI 组件**:包含聊天气泡、消息输入、会话管理等完整的 AI 交互组件
17
+ - 🎨 **OpenTiny Design**:遵循 OpenTiny Design 设计体系,提供一致的 UI/UX
18
+ - 🚀 **开箱即用**:几分钟内即可开始使用,配置简单
19
+ - 🎯 **TypeScript 支持**:完整的 TypeScript 支持,提供完整的类型定义
20
+ - 🌈 **主题定制**:灵活的主题系统,支持多种主题和自定义样式
21
+ - 📦 **Tree Shaking**:针对 Tree Shaking 优化,按需导入
22
+ - 🔄 **流式支持**:内置流式 AI 响应支持
23
+ - 💾 **存储策略**:灵活的存储策略(LocalStorage、IndexedDB、自定义)
24
+
25
+ [English](https://github.com/opentiny/tiny-robot/blob/HEAD/README.md) | 简体中文
26
+
27
+ [![Ask DeepWiki](https://deepwiki.com/badge.svg)](https://deepwiki.com/opentiny/tiny-robot)
28
+
29
+ ## 📦 包说明
30
+
31
+ TinyRobot 是一个 monorepo,包含以下包:
32
+
33
+ | 包 | 说明 | 版本 |
34
+ | --------------------------- | -------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------- |
35
+ | `@opentiny/tiny-robot` | 核心组件库,包含所有 AI 交互组件 | [![npm](https://img.shields.io/npm/v/@opentiny/tiny-robot.svg)](https://www.npmjs.com/package/@opentiny/tiny-robot) |
36
+ | `@opentiny/tiny-robot-kit` | 工具函数和 AI 客户端工具,用于模型交互 | [![npm](https://img.shields.io/npm/v/@opentiny/tiny-robot-kit.svg)](https://www.npmjs.com/package/@opentiny/tiny-robot-kit) |
37
+ | `@opentiny/tiny-robot-svgs` | SVG 图标库,包含所有组件所需的图标 | [![npm](https://img.shields.io/npm/v/@opentiny/tiny-robot-svgs.svg)](https://www.npmjs.com/package/@opentiny/tiny-robot-svgs) |
38
+
39
+ ## 🚀 快速开始
40
+
41
+ ### 环境要求
42
+
43
+ - Node.js >= 20.13.0
44
+ - Vue >= 3.2.0
45
+ - 包管理器:npm、yarn 或 pnpm
46
+
47
+ ### 安装
48
+
49
+ **核心包** — `@opentiny/tiny-robot` 是主包。
50
+
51
+ ```bash
52
+ # 使用 pnpm(推荐)
53
+ pnpm add @opentiny/tiny-robot
54
+
55
+ # 使用 npm
56
+ npm install @opentiny/tiny-robot
57
+
58
+ # 使用 yarn
59
+ yarn add @opentiny/tiny-robot
60
+ ```
61
+
62
+ **可选包**:
63
+
64
+ - `@opentiny/tiny-robot-kit` — 仅在需要 AI 模型请求或数据处理功能时使用。需要时添加:
65
+
66
+ ```bash
67
+ pnpm add @opentiny/tiny-robot-kit
68
+ ```
69
+
70
+ - `@opentiny/tiny-robot-svgs` — 可选。仅在需要单独使用 SVG 图标库或自定义图标时单独安装:
71
+
72
+ ```bash
73
+ pnpm add @opentiny/tiny-robot-svgs
74
+ ```
75
+
76
+ ### 基本用法
77
+
78
+ #### 1. 引入样式
79
+
80
+ 在 `main.js` 或 `main.ts` 中:
81
+
82
+ ```ts
83
+ import { createApp } from 'vue'
84
+ import App from './App.vue'
85
+ import '@opentiny/tiny-robot/dist/style.css'
86
+
87
+ const app = createApp(App)
88
+ app.mount('#app')
89
+ ```
90
+
91
+ #### 2. 使用组件
92
+
93
+ ```vue
94
+ <template>
95
+ <div class="chat-container">
96
+ <tr-bubble role="ai" content="Hello! I'm TinyRobot, an AI component library for Vue 3." placement="start" />
97
+ <tr-bubble role="user" content="That's great! How can I get started?" placement="end" />
98
+ </div>
99
+ </template>
100
+
101
+ <script setup>
102
+ import { TrBubble } from '@opentiny/tiny-robot'
103
+ </script>
104
+ ```
105
+
106
+ ## 📚 文档
107
+
108
+ - 📖 [完整文档](https://docs.opentiny.design/tiny-robot/) - 完整的 API 参考和指南
109
+ - 🎯 [快速开始指南](https://docs.opentiny.design/tiny-robot/guide/quick-start) - 几分钟内快速上手
110
+ - 🎨 [主题配置](https://docs.opentiny.design/tiny-robot/guide/theme-config) - 自定义主题
111
+ - 📝 [更新日志](https://docs.opentiny.design/tiny-robot/guide/update-log) - 版本历史
112
+ - 💡 [示例](https://docs.opentiny.design/tiny-robot/examples/assistant) - 完整的应用示例
113
+
114
+ ## 🏗️ 项目结构
115
+
116
+ ```text
117
+ tiny-robot/
118
+ ├── packages/
119
+ │ ├── components/ # 核心组件库
120
+ │ │ ├── src/
121
+ │ │ │ ├── bubble/ # 聊天气泡组件
122
+ │ │ │ ├── sender/ # 消息输入组件
123
+ │ │ │ ├── container/ # 容器组件
124
+ │ │ │ ├── history/ # 会话历史
125
+ │ │ │ ├── attachments/ # 文件附件
126
+ │ │ │ └── ... # 其他组件
127
+ │ │ └── package.json
128
+ │ ├── kit/ # 工具函数和 AI 工具
129
+ │ │ ├── src/
130
+ │ │ │ ├── providers/ # AI 提供商实现
131
+ │ │ │ ├── vue/ # Vue 组合式函数
132
+ │ │ │ │ ├── message/ # useMessage 组合式函数
133
+ │ │ │ │ └── conversation/ # useConversation 组合式函数
134
+ │ │ │ └── storage/ # 存储工具
135
+ │ │ └── package.json
136
+ │ ├── svgs/ # SVG 图标库
137
+ │ ├── playground/ # 开发演练场
138
+ │ └── test/ # 测试套件
139
+ ├── docs/ # 文档站点
140
+ │ ├── src/ # 文档源码
141
+ │ └── demos/ # 组件示例
142
+ ├── scripts/ # 构建和工具脚本
143
+ └── package.json
144
+ ```
145
+
146
+ ## 🛠️ 开发
147
+
148
+ ### 环境设置
149
+
150
+ ```bash
151
+ # 安装依赖
152
+ pnpm install
153
+
154
+ # 启动开发服务器(演练场 + 文档)
155
+ pnpm dev
156
+ ```
157
+
158
+ ### 开发流程
159
+
160
+ 1. **启动开发服务器**:
161
+ - 在项目根目录运行 `pnpm dev`
162
+ - 这将同时启动演练场和文档站点
163
+ - 修改 `packages/components/src/` 中的组件后,更改会自动反映在文档页面中
164
+
165
+ 2. **文档**:
166
+ - 文档源码:`docs/src/`
167
+ - 组件示例:`docs/demos/`
168
+
169
+ 3. **测试**:
170
+ - 运行 `pnpm test` 执行测试
171
+
172
+ ## 📄 许可证
173
+
174
+ MIT 许可证 - 查看 [LICENSE](https://github.com/opentiny/tiny-robot/blob/HEAD/LICENSE) 文件了解详情。
175
+
176
+ ## 🤝 贡献
177
+
178
+ 欢迎贡献!请阅读[贡献指南](https://github.com/opentiny/tiny-robot/blob/HEAD/CONTRIBUTING_zh.md)了解推荐的工作流程、Commit 规范以及如何提交 Issue 和 Pull Request。
179
+
180
+ ## 📞 支持
181
+
182
+ - 📖 [文档](https://docs.opentiny.design/tiny-robot/)
183
+ - 🐛 [问题追踪](https://github.com/opentiny/tiny-robot/issues)
184
+ - 💬 [讨论](https://github.com/opentiny/tiny-robot/discussions)
185
+
186
+ ## 🙏 致谢
187
+
188
+ 由 OpenTiny 团队用 ❤️ 构建。
189
+
190
+ ---
191
+
192
+ **注意**:本项目是 [OpenTiny](https://github.com/opentiny) 生态系统的一部分。
package/package.json CHANGED
@@ -1,6 +1,34 @@
1
1
  {
2
2
  "name": "@opentiny/tiny-robot",
3
- "version": "0.4.0",
3
+ "version": "0.4.1",
4
+ "license": "MIT",
5
+ "description": "TinyRobot 是一个 AI 对话组件库,提供了丰富的 AI 交互组件,助力开发者快速构建企业级 AI 应用;同时也是一个智能助手,支持普通 AI 问答、也支持集成 MCP Server,让 AI 真正帮人“干活”。",
6
+ "homepage": "https://docs.opentiny.design/tiny-robot/",
7
+ "repository": {
8
+ "type": "git",
9
+ "url": "git+https://github.com/opentiny/tiny-robot.git"
10
+ },
11
+ "bugs": {
12
+ "url": "https://github.com/opentiny/tiny-robot/issues"
13
+ },
14
+ "keywords": [
15
+ "vue",
16
+ "vue3",
17
+ "vue-components",
18
+ "component-library",
19
+ "ai",
20
+ "ai-components",
21
+ "chat",
22
+ "chat-ui",
23
+ "chatbot",
24
+ "llm",
25
+ "openai",
26
+ "assistant",
27
+ "streaming",
28
+ "conversation",
29
+ "tiny-robot",
30
+ "opentiny"
31
+ ],
4
32
  "publishConfig": {
5
33
  "access": "public"
6
34
  },
@@ -9,7 +37,8 @@
9
37
  "module": "./dist/index.js",
10
38
  "sideEffects": false,
11
39
  "files": [
12
- "dist"
40
+ "dist",
41
+ "README*"
13
42
  ],
14
43
  "scripts": {
15
44
  "dev": "vue-tsc && vite build --watch",
@@ -23,7 +52,7 @@
23
52
  },
24
53
  "dependencies": {
25
54
  "@floating-ui/dom": "^1.6.0",
26
- "@opentiny/tiny-robot-svgs": "0.4.0",
55
+ "@opentiny/tiny-robot-svgs": "0.4.1",
27
56
  "@opentiny/vue": "^3.20.0",
28
57
  "@tiptap/core": "^3.11.0",
29
58
  "@tiptap/extension-character-count": "^3.11.0",
@@ -53,5 +82,5 @@
53
82
  "vue": "^3.3.11",
54
83
  "vue-tsc": "^2.2.8"
55
84
  },
56
- "gitHead": "558095a424930d99e079e6e1cf4fe8929d48c7b2"
85
+ "gitHead": "e7d831041cd49068110e17c5b5f410ed7fa2706c"
57
86
  }