Export JSON

Mini code viewer for a structured response, with a filename header, copy button, and a preformatted JSON preview body.

response.json
{
  "answer": "Use Redis INCR",
  "sources": 3,
  "latency_ms": 420
}

New here? Read the installation guide.

Import & use
import { Ai43 } from "@/components/beste/piece/ai43";

<Ai43
  filename="response.json"
  content="{
  \"answer\": \"Use Redis INCR\",
  \"sources\": 3,
  \"latency_ms\": 420
}"
/>

More AI pieces

View all AI
OPENAI_API_KEY
sk-••••••••••••••••••••••••••••••••

API Key Input

Masked API key field with a show/hide eye toggle and a copy button, tagged with the env var name.

ts
const slug = (s: string) =>
  s.toLowerCase().replace(/\s+/g, '-');

Generated Code

AI code output card with a language tag, copy and regenerate actions, and a monospace block below.

The smoothest cup of the morning starts with beans roasted just last

Streaming Response

Partial assistant reply bubble with a blinking block cursor on the trailing character.

embedding.vec1,536 dims
[0]cosine similarity ready[15]

Embedding Preview

Vector embedding visualizer with a zero baseline, positive values drawn upward in the tone color and negatives drawn downward in muted.

Feedback Row

Thumbs up and down buttons with tinted active state, alongside copy and share actions.

next_tokentop 5
“The capital of France is”
  • “Paris”64.3%
  • “the”18.7%
  • “located”8.1%
  • “also”4.2%
  • “a”2.1%

Top-K Tokens

Debugger-style panel showing the language model's next-token probabilities, with the top candidate highlighted and bars scaled to softmax weight.