ai-elements-vue 0.14.2 → 1.0.0

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 (2) hide show
  1. package/README.md +56 -23
  2. package/package.json +1 -1
package/README.md CHANGED
@@ -1,10 +1,6 @@
1
- # AI Elements Vue
2
-
3
- A command-line interface for installing [AI Elements Vue](https://ai-elements-vue.com) components - a component library built on top of [shadcn-vue](https://www.shadcn-vue.com/) to help you build AI-native applications faster.
4
-
5
1
  ## Overview
6
2
 
7
- AI Elements Vue provides pre-built, customizable Vue components specifically designed for AI applications, including conversations, messages, code blocks, reasoning displays, and more. The CLI makes it easy to add these components to your Vue.js or Nuxt.js project.
3
+ [AI Elements Vue](https://ai-elements-vue.com) provides pre-built, customizable Vue components specifically designed for AI applications, including conversations, messages, code blocks, reasoning displays, and more. The CLI makes it easy to add these components to your Vue.js and Nuxt.js project.
8
4
 
9
5
  ## Installation
10
6
 
@@ -51,6 +47,7 @@ npx ai-elements-vue@latest add <component-name>
51
47
  ```
52
48
 
53
49
  Examples:
50
+
54
51
  ```bash
55
52
  # Install the message component
56
53
  npx ai-elements-vue@latest add message
@@ -78,23 +75,43 @@ npx shadcn-vue@latest add https://registry.ai-elements-vue.com/message.json
78
75
 
79
76
  AI Elements Vue includes the following components:
80
77
 
81
- | Component | Status | Description |
82
- |-----------|--------|-------------|
83
- | `message` | ✅ | Individual chat messages with avatars |
84
- | `conversation` | ✅ | Container for chat conversations |
85
- | `response` | ✅ | Formatted AI response display |
86
- | `prompt-input` | ✅ | Advanced input component with model selection |
87
- | `actions` | ✅ | Interactive action buttons for AI responses |
88
- | `branch` | ✅ | Branch visualization for conversation flows |
89
- | `code-block` | ✅ | Syntax-highlighted code display with copy functionality |
90
- | `image` | ✅ | AI-generated image display component |
91
- | `inline-citation` | ❌ | Inline source citations |
92
- | `loader` | ✅ | Loading states for AI operations |
93
- | `reasoning` | ❌ | Display AI reasoning and thought processes |
94
- | `source` | ❌ | Source attribution component |
95
- | `suggestion` | ✅ | Quick action suggestions |
96
- | `task` | ❌ | Task completion tracking |
97
- | `tool` | ❌ | Tool usage visualization |
78
+ | Component | Description |
79
+ | ------------------ | ------------------------------------------------------- |
80
+ | **Chatbot** | |
81
+ | `chain-of-thought` | Display AI reasoning and thought processes |
82
+ | `checkpoint` | Conversation checkpoint component |
83
+ | `confirmation` | Tool execution approval workflows |
84
+ | `context` | Display Context consumption |
85
+ | `conversation` | Container for chat conversations |
86
+ | `inline-citation` | Inline source citations |
87
+ | `message` | Individual chat messages with avatars |
88
+ | `model-selector` | AI model selection component |
89
+ | `plan` | Plan and task planning display component |
90
+ | `prompt-input` | Advanced input component with model selection |
91
+ | `queue` | Message and todo queue with attachments |
92
+ | `reasoning` | Display AI reasoning and thought processes |
93
+ | `shimmer` | Text shimmer animation effect |
94
+ | `sources` | Source attribution component |
95
+ | `suggestion` | Quick action suggestions |
96
+ | `task` | Task completion tracking |
97
+ | `tool` | Tool usage visualization |
98
+ | **Workflow** | |
99
+ | `canvas` | ReactFlow canvas for workflow visualizations |
100
+ | `connection` | Connection line component for workflow edges |
101
+ | `controls` | Flow controls for canvas (zoom, fit view, etc.) |
102
+ | `edge` | Edge component for connections between workflow nodes |
103
+ | `node` | Node component for workflow graphs |
104
+ | `panel` | Panel component for canvas overlays |
105
+ | `toolbar` | Node toolbar for workflow elements |
106
+ | **Vibe-Coding** | |
107
+ | `artifact` | Display a code or document |
108
+ | `web-preview` | Embedded web page previews |
109
+ | **Documentation** | |
110
+ | `open-in-chat` | Open in chat button for a message |
111
+ | **Utilities** | |
112
+ | `code-block` | Syntax-highlighted code display with copy functionality |
113
+ | `image` | AI-generated image display component |
114
+ | `loader` | Loading states for AI operations |
98
115
 
99
116
  ## How It Works
100
117
 
@@ -119,6 +136,22 @@ For the best experience, we recommend:
119
136
  2. **CSS Variables**: Use shadcn-vue's CSS Variables mode for theming
120
137
  3. **TypeScript**: Enable TypeScript for better development experience
121
138
 
139
+ ## Contributing
140
+
141
+ If you'd like to contribute to AI Elements Vue, please follow these steps:
142
+
143
+ 1. Fork the repository
144
+ 2. Create a new branch
145
+ 3. Make your changes to the components in `packages/elements`.
146
+ 4. Open a PR to the `main` branch.
147
+
148
+ ## 🙏 Acknowledgments
149
+
150
+ This project draws inspiration from several excellent projects:
151
+
152
+ - **[shadcn-vue](https://www.shadcn-svelte.com/)** - UI component foundation
153
+ - **[Vercel AI Elements](https://vercel.com/changelog/introducing-ai-elements)** - AI component concepts
154
+
122
155
  ---
123
156
 
124
- Made with ❤️ by [cwandev](https://github.com/cwandev)
157
+ Made with ❤️ by [vuepont](https://github.com/vuepont)
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "ai-elements-vue",
3
- "version": "0.14.2",
3
+ "version": "1.0.0",
4
4
  "private": false,
5
5
  "description": "AI Elements Vue is a component library and custom registry built on top of shadcn-vue to help you build AI-native applications faster.",
6
6
  "license": "MIT",