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.

next_tokentop 5
The capital of France is
  • Paris64.3%
  • the18.7%
  • located8.1%
  • also4.2%
  • a2.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.

Feedback Row

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