@opentiny/genui-sdk-vue

A Vue 3 component library for enhanced LLM display and interaction. Stream AI-generated structured output into OpenTiny interactive UI components with bidirectional conversation support.

• Streaming Rendering: Content renders progressively as the model generates—no long waits for full responses.
• Structured Output: LLM output conforms to JSON Schema, enabling reliable parsing and rendering.
• Interaction: User actions (form submit, button click) feed back into the conversation context for seamless multi-turn flows.

Learn more about GenUI SDK.

Usage

Install together with core and the Vue materials package (the renderer is bundled in the vue package):

pnpm add @opentiny/genui-sdk-vue @opentiny/genui-sdk-core @opentiny/genui-sdk-materials-vue-opentiny-vue

<script setup>
import { GenuiChat, GenuiConfigProvider } from '@opentiny/genui-sdk-vue';
import { materials } from '@opentiny/genui-sdk-materials-vue-opentiny-vue/materials';
</script>

<template>
  <GenuiConfigProvider theme="dark" :materials="materials">
    <GenuiChat
      url="/api/chat"
      model="deepseek-chat"
    />
  </GenuiConfigProvider>
</template>

Documentation

• quick-start
• start-with-render

API

• GenuiRender
• GenuiChat
• GenuiConfigProvider