New Components
AI Elements 1.9 brings two significant new components to the library:
JSXPreview Component - The new <JSXPreview /> component enables dynamic rendering of JSX strings, with built-in support for incomplete JSX during streaming scenarios. This is particularly useful when displaying AI-generated UI in real time, as the component automatically closes unclosed tags to prevent rendering errors.
PromptInputActionAddScreenshot - A new sub-component of <PromptInput /> that captures screenshots of the current page. This allows developers to give AI models visual context of the user's interface, improving the quality of AI-generated responses and actions.
Enhanced Features
The <Conversation /> component now includes an optional download button that exports conversation history as a markdown file. This makes it easier for users to save and reference AI interactions.
Agent Integration
Developers can now install an AI Elements skill directly into their preferred AI agent framework using npx skills add vercel/ai-elements. This skill provides agents with a better understanding of how to build and use AI Elements components, streamlining the development of AI-powered interfaces.
Getting Started
All new components are available via the standard installation command: npx ai-elements@latest add [component-name]. See the documentation for complete integration details and usage examples.