Examples & Use Cases

Explore practical examples of the Lumia AI in action. Each example includes complete code and explanations.

Text Generation

Generate text responses using Lumia models

import { generateText } from 'ai';
import { Lumia } from '@ai-sdk/Lumia';

async function main() {
  const { text } = await generateText({
    model: Lumia('Lumia-V2-Pro'),
    prompt: 'Write a short poem about technology and nature.',
    system: 'You are a creative poet who writes concise, meaningful poems.'
  });
  
  console.log(text);
}

main();

Chat Interface

Build a simple chat interface with streaming responses

import { streamText } from 'ai';
import { Lumia } from '@ai-sdk/Lumia';
import { useState } from 'react';

export default function ChatExample() {
  const [messages, setMessages] = useState([]);
  const [input, setInput] = useState('');
  
  async function handleSubmit(e) {
    e.preventDefault();
    if (!input.trim()) return;
    
    const userMessage = { role: 'user', content: input };
    setMessages(prev => [...prev, userMessage]);
    setInput('');
    
    const result = streamText({
      model: Lumia('Lumia-V2-Pro'),
      prompt: input,
      system: 'You are a helpful assistant.',
      onChunk: ({ chunk }) => {
        if (chunk.type === 'text-delta') {
          setMessages(prev => {
            const last = prev[prev.length - 1];
            last.content += chunk.text;
            return [...prev];
          });
        }
      }
    });
  }
  
  return (
    <div className="flex flex-col h-[500px]">
      <div className="flex-1 overflow-y-auto p-4">
        {messages.map((msg, i) => (
          <div key={i} className={`flex ${msg.role === 'user' ? 'justify-end' : 'justify-start'}`}>
            <div className={`rounded-2xl px-4 py-2 ${msg.role === 'user' ? 'bg-blue-100' : 'bg-gray-100'}`}>
              {msg.content}
            </div>
          </div>
        ))}
      </div>
      
      <form onSubmit={handleSubmit} className="p-4">
        <input
          value={input}
          onChange={(e) => setInput(e.target.value)}
          className="w-full rounded-2xl px-4 py-2"
          placeholder="Type a message..."
        />
      </form>
    </div>
  );
}