2c:I[522016,["/_next/static/immutable/chunks/0x-9rc1bm-510.js","/_next/static/immutable/chunks/0vm4r_y51lca-.js","/_next/static/immutable/chunks/1_05dnk5nlv68.js","/_next/static/immutable/chunks/0zz-qr4ehfg-y.js","/_next/static/immutable/chunks/26w7nc1n_z-ef.js","/_next/static/immutable/chunks/0rg7f484r7pvs.js","/_next/static/immutable/chunks/08zzaq7mzunr6.js","/_next/static/immutable/chunks/2r4xab7oviwp5.js","/_next/static/immutable/chunks/3xlvx278x1e_n.js","/_next/static/immutable/chunks/2ndy6i4i4-y6n.js","/_next/static/immutable/chunks/06y00c7m-_7je.js","/_next/static/immutable/chunks/263-ujry15jpq.js","/_next/static/immutable/chunks/3p6b9_d0h8s6a.js","/_next/static/immutable/chunks/0x4o-jqryzpjy.js","/_next/static/immutable/chunks/35wq0ehn8yo1w.js","/_next/static/immutable/chunks/0q5gv4ffdk-lk.js","/_next/static/immutable/chunks/40nsmaivjxzl9.js","/_next/static/immutable/chunks/2m-qc00i-nvf7.js","/_next/static/immutable/chunks/2iimfs9klm8ee.js","/_next/static/immutable/chunks/18rtnwgqpot3p.js","/_next/static/immutable/chunks/3kcvqkz425zel.js","/_next/static/immutable/chunks/1v12dieyr7wjf.js","/_next/static/immutable/chunks/3-2tm_28na9tk.js","/_next/static/immutable/chunks/14yszr5gqr22_.js","/_next/static/immutable/chunks/2x3a5j5_bt12w.js","/_next/static/immutable/chunks/2a77rt5-k4ju_.js","/_next/static/immutable/chunks/3fw7v0e9fz244.js","/_next/static/immutable/chunks/39oieppwminn9.js","/_next/static/immutable/chunks/42c4hv7h_qef7.js","/_next/static/immutable/chunks/31pqjpqnverqb.js","/_next/static/immutable/chunks/43tk0scc5ia6a.js","/_next/static/immutable/chunks/2a84g45p9ue92.js","/_next/static/immutable/chunks/174-kkyy6-c5l.js","/_next/static/immutable/chunks/3j6wvt_gtks8k.js","/_next/static/immutable/chunks/0xciaf081ehlj.js"],""] 2d:I[406394,["/_next/static/immutable/chunks/0x-9rc1bm-510.js","/_next/static/immutable/chunks/0vm4r_y51lca-.js","/_next/static/immutable/chunks/1_05dnk5nlv68.js","/_next/static/immutable/chunks/0zz-qr4ehfg-y.js","/_next/static/immutable/chunks/26w7nc1n_z-ef.js","/_next/static/immutable/chunks/0rg7f484r7pvs.js","/_next/static/immutable/chunks/08zzaq7mzunr6.js","/_next/static/immutable/chunks/2r4xab7oviwp5.js","/_next/static/immutable/chunks/3xlvx278x1e_n.js","/_next/static/immutable/chunks/2ndy6i4i4-y6n.js","/_next/static/immutable/chunks/06y00c7m-_7je.js","/_next/static/immutable/chunks/263-ujry15jpq.js","/_next/static/immutable/chunks/3p6b9_d0h8s6a.js","/_next/static/immutable/chunks/0x4o-jqryzpjy.js","/_next/static/immutable/chunks/35wq0ehn8yo1w.js","/_next/static/immutable/chunks/0q5gv4ffdk-lk.js","/_next/static/immutable/chunks/40nsmaivjxzl9.js","/_next/static/immutable/chunks/2m-qc00i-nvf7.js","/_next/static/immutable/chunks/2iimfs9klm8ee.js","/_next/static/immutable/chunks/18rtnwgqpot3p.js","/_next/static/immutable/chunks/3kcvqkz425zel.js","/_next/static/immutable/chunks/1v12dieyr7wjf.js","/_next/static/immutable/chunks/3-2tm_28na9tk.js","/_next/static/immutable/chunks/14yszr5gqr22_.js","/_next/static/immutable/chunks/2x3a5j5_bt12w.js","/_next/static/immutable/chunks/2a77rt5-k4ju_.js","/_next/static/immutable/chunks/3fw7v0e9fz244.js","/_next/static/immutable/chunks/39oieppwminn9.js","/_next/static/immutable/chunks/42c4hv7h_qef7.js","/_next/static/immutable/chunks/31pqjpqnverqb.js","/_next/static/immutable/chunks/43tk0scc5ia6a.js","/_next/static/immutable/chunks/2a84g45p9ue92.js","/_next/static/immutable/chunks/174-kkyy6-c5l.js","/_next/static/immutable/chunks/3j6wvt_gtks8k.js","/_next/static/immutable/chunks/0xciaf081ehlj.js"],"BlockTabs"] 2e:I[966139,["/_next/static/immutable/chunks/0x-9rc1bm-510.js","/_next/static/immutable/chunks/0vm4r_y51lca-.js","/_next/static/immutable/chunks/1_05dnk5nlv68.js","/_next/static/immutable/chunks/0zz-qr4ehfg-y.js","/_next/static/immutable/chunks/26w7nc1n_z-ef.js","/_next/static/immutable/chunks/0rg7f484r7pvs.js","/_next/static/immutable/chunks/08zzaq7mzunr6.js","/_next/static/immutable/chunks/2r4xab7oviwp5.js","/_next/static/immutable/chunks/3xlvx278x1e_n.js","/_next/static/immutable/chunks/2ndy6i4i4-y6n.js","/_next/static/immutable/chunks/06y00c7m-_7je.js","/_next/static/immutable/chunks/263-ujry15jpq.js","/_next/static/immutable/chunks/3p6b9_d0h8s6a.js","/_next/static/immutable/chunks/0x4o-jqryzpjy.js","/_next/static/immutable/chunks/35wq0ehn8yo1w.js","/_next/static/immutable/chunks/0q5gv4ffdk-lk.js","/_next/static/immutable/chunks/40nsmaivjxzl9.js","/_next/static/immutable/chunks/2m-qc00i-nvf7.js","/_next/static/immutable/chunks/2iimfs9klm8ee.js","/_next/static/immutable/chunks/18rtnwgqpot3p.js","/_next/static/immutable/chunks/3kcvqkz425zel.js","/_next/static/immutable/chunks/1v12dieyr7wjf.js","/_next/static/immutable/chunks/3-2tm_28na9tk.js","/_next/static/immutable/chunks/14yszr5gqr22_.js","/_next/static/immutable/chunks/2x3a5j5_bt12w.js","/_next/static/immutable/chunks/2a77rt5-k4ju_.js","/_next/static/immutable/chunks/3fw7v0e9fz244.js","/_next/static/immutable/chunks/39oieppwminn9.js","/_next/static/immutable/chunks/42c4hv7h_qef7.js","/_next/static/immutable/chunks/31pqjpqnverqb.js","/_next/static/immutable/chunks/43tk0scc5ia6a.js","/_next/static/immutable/chunks/2a84g45p9ue92.js","/_next/static/immutable/chunks/174-kkyy6-c5l.js","/_next/static/immutable/chunks/3j6wvt_gtks8k.js","/_next/static/immutable/chunks/0xciaf081ehlj.js"],"PreviewFrame"] 2f:I[967833,["/_next/static/immutable/chunks/0x-9rc1bm-510.js","/_next/static/immutable/chunks/0vm4r_y51lca-.js","/_next/static/immutable/chunks/1_05dnk5nlv68.js","/_next/static/immutable/chunks/0zz-qr4ehfg-y.js","/_next/static/immutable/chunks/26w7nc1n_z-ef.js","/_next/static/immutable/chunks/0rg7f484r7pvs.js","/_next/static/immutable/chunks/08zzaq7mzunr6.js","/_next/static/immutable/chunks/2r4xab7oviwp5.js","/_next/static/immutable/chunks/3xlvx278x1e_n.js","/_next/static/immutable/chunks/2ndy6i4i4-y6n.js","/_next/static/immutable/chunks/06y00c7m-_7je.js","/_next/static/immutable/chunks/263-ujry15jpq.js","/_next/static/immutable/chunks/3p6b9_d0h8s6a.js","/_next/static/immutable/chunks/0x4o-jqryzpjy.js","/_next/static/immutable/chunks/35wq0ehn8yo1w.js","/_next/static/immutable/chunks/0q5gv4ffdk-lk.js","/_next/static/immutable/chunks/40nsmaivjxzl9.js","/_next/static/immutable/chunks/2m-qc00i-nvf7.js","/_next/static/immutable/chunks/2iimfs9klm8ee.js","/_next/static/immutable/chunks/18rtnwgqpot3p.js","/_next/static/immutable/chunks/3kcvqkz425zel.js","/_next/static/immutable/chunks/1v12dieyr7wjf.js","/_next/static/immutable/chunks/3-2tm_28na9tk.js","/_next/static/immutable/chunks/14yszr5gqr22_.js","/_next/static/immutable/chunks/2x3a5j5_bt12w.js","/_next/static/immutable/chunks/2a77rt5-k4ju_.js","/_next/static/immutable/chunks/3fw7v0e9fz244.js","/_next/static/immutable/chunks/39oieppwminn9.js","/_next/static/immutable/chunks/42c4hv7h_qef7.js","/_next/static/immutable/chunks/31pqjpqnverqb.js","/_next/static/immutable/chunks/43tk0scc5ia6a.js","/_next/static/immutable/chunks/2a84g45p9ue92.js","/_next/static/immutable/chunks/174-kkyy6-c5l.js","/_next/static/immutable/chunks/3j6wvt_gtks8k.js","/_next/static/immutable/chunks/0xciaf081ehlj.js"],"CodeView"] 30:T2660,"use client"; /* react-markdown passes a `node` prop to every component; it is dropped before spreading onto the DOM. */ /* eslint-disable @typescript-eslint/no-unused-vars */ import * as React from "react"; import ReactMarkdown, { type Components } from "react-markdown"; import remarkGfm from "remark-gfm"; import { IconExternalLink } from "@tabler/icons-react"; import { StreamingText } from "@/components/ui/streaming-text"; import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow, } from "@/components/ui/table"; import { cn } from "@/lib/utils"; import { AiCodeBlock, type AiCodeLanguage } from "../ai-code-block/ai-code-block"; const LANGS: Record = { ts: "ts", typescript: "ts", tsx: "tsx", js: "js", javascript: "js", jsx: "jsx", sh: "sh", bash: "sh", shell: "sh", zsh: "sh", json: "json", }; /** * Split markdown into top-level blocks at blank lines, never inside a fenced code * block, and keep loose list items together. Each block is rendered (and memoized) * on its own, so while text streams in only the last block re-renders. */ export function splitMarkdownBlocks(source: string): string[] { const lines = source.split("\n"); const blocks: string[] = []; let current: string[] = []; let fence: string | null = null; const flush = () => { if (current.length) blocks.push(current.join("\n")); current = []; }; for (const line of lines) { const mark = /^\s{0,3}(`{3,}|~{3,})/.exec(line)?.[1]; if (mark) { if (fence === null) fence = mark[0]; else if (mark[0] === fence) fence = null; } if (fence === null && !mark && line.trim() === "") { flush(); continue; } current.push(line); } flush(); // Re-join list continuations so loose lists keep their numbering. const isItem = (b: string) => /^\s*([-*+]|\d+[.)])\s/.test(b); const isIndented = (b: string) => /^(\s{2,}|\t)\S/.test(b); const merged: string[] = []; for (const block of blocks) { const prev = merged[merged.length - 1]; if (prev !== undefined && isItem(prev) && (isItem(block) || isIndented(block))) { merged[merged.length - 1] = `${prev}\n\n${block}`; } else merged.push(block); } return merged; } const StreamCtx = React.createContext(false); /** Wraps plain string children in Kobra StreamingText while streaming. */ function Words({ children }: { children?: React.ReactNode }) { const streaming = React.useContext(StreamCtx); if (!streaming) return <>{children}; return ( <> {React.Children.map(children, (child) => typeof child === "string" ? {child} : child, )} ); } type NodeProps = React.ComponentProps & { node?: unknown }; const components: Components = { h1: ({ node: _n, children, ...p }: NodeProps<"h1">) => (

{children}

), h2: ({ node: _n, children, ...p }: NodeProps<"h2">) => (

{children}

), h3: ({ node: _n, children, ...p }: NodeProps<"h3">) => (

{children}

), h4: ({ node: _n, children, ...p }: NodeProps<"h4">) => (

{children}

), h5: ({ node: _n, children, ...p }: NodeProps<"h5">) => (

{children}

), h6: ({ node: _n, children, ...p }: NodeProps<"h6">) => (

{children}

), p: ({ node: _n, children, ...p }: NodeProps<"p">) => (

{children}

), strong: ({ node: _n, ...p }: NodeProps<"strong">) => , em: ({ node: _n, ...p }: NodeProps<"em">) => , del: ({ node: _n, ...p }: NodeProps<"del">) => , a: ({ node: _n, children, href, ...p }: NodeProps<"a">) => { const external = typeof href === "string" && /^https?:/.test(href); return ( {children} {external ? : null} ); }, ul: ({ node: _n, className, ...p }: NodeProps<"ul">) => (
), ol: ({ node: _n, ...p }: NodeProps<"ol">) => (
), li: ({ node: _n, children, className, ...p }: NodeProps<"li">) => (
ol]:my-1 [&>p]:my-0 [&>ul]:my-1", className?.includes("task-list-item") && "ps-0")}> {children}
), input: ({ node: _n, type, checked, ...p }: NodeProps<"input">) => type === "checkbox" ? ( {checked ? ( ) : null} ) : ( ), blockquote: ({ node: _n, ...p }: NodeProps<"blockquote">) => (
), hr: ({ node: _n, ...p }: NodeProps<"hr">) =>
, table: ({ node: _n, children }: NodeProps<"table">) => (
{children}

), thead: ({ node: _n, children }: NodeProps<"thead">) => {children}, tbody: ({ node: _n, children }: NodeProps<"tbody">) => {children}, tr: ({ node: _n, children }: NodeProps<"tr">) => {children}, th: ({ node: _n, children, style, ...p }: NodeProps<"th">) => ( {children} ), td: ({ node: _n, children, style, ...p }: NodeProps<"td">) => ( {children} ), code: ({ node: _n, className, children, ...p }: NodeProps<"code">) => ( {children} ), pre: ({ node: _n, children }: NodeProps<"pre">) => { const child = React.Children.toArray(children)[0] as React.ReactElement<{ className?: string; children?: React.ReactNode }> | undefined; const lang = /language-([\w-]+)/.exec(child?.props?.className ?? "")?.[1]?.toLowerCase(); const text = String(child?.props?.children ?? "").replace(/\n$/, ""); return (

); }, }; type BlockProps = { source: string; streaming: boolean }; const MarkdownBlock = React.memo( function MarkdownBlock({ source, streaming }: BlockProps) { return ( {source} ); }, (a, b) => a.source === b.source && a.streaming === b.streaming, ); export type AiMarkdownProps = Omit, "children"> & { /** Markdown source. Pass the growing string while a response streams in. */ children: string; /** Fade new words in with Kobra StreamingText and keep finished blocks untouched. */ streaming?: boolean; }; function AiMarkdown({ children, streaming = false, className, ...props }: AiMarkdownProps) { const blocks = React.useMemo(() => splitMarkdownBlocks(children), [children]); return (
{blocks.map((block, index) => ( ))}
); } export { AiMarkdown }; 31:T265b,"use client"; import * as React from "react"; import { IconCode, IconTerminal2, IconTextWrap } from "@tabler/icons-react"; import { Button } from "@/components/ui/button"; import { CopyCheck, useReceipt } from "@/components/ui/copy-check"; import { INK } from "@/components/ui/code-block"; import { Tooltip, TooltipContent, TooltipTrigger } from "@/components/ui/tooltip"; import { highlightCode, type CodeLanguage } from "@/lib/highlight-code"; import { cn } from "@/lib/utils"; /** Languages the block labels. `json` reuses the JS grammar; `text` is unhighlighted. */ export type AiCodeLanguage = CodeLanguage | "json" | "text"; const GRAMMAR: Record = { ts: "ts", tsx: "tsx", js: "js", jsx: "jsx", sh: "sh", json: "js", text: "sh", }; const LABEL: Record = { ts: "TypeScript", tsx: "TSX", js: "JavaScript", jsx: "JSX", sh: "Shell", json: "JSON", text: "Text", }; type Ctx = { code: string; language: AiCodeLanguage; filename?: string; wrap: boolean; setWrap: (next: boolean) => void; lineNumbers: boolean; maxHeight?: number; }; const AiCodeBlockContext = React.createContext(null); function useAiCodeBlock(part: string) { const ctx = React.useContext(AiCodeBlockContext); if (!ctx) throw new Error(`${part} must be used inside `); return ctx; } export type AiCodeBlockProps = Omit, "children"> & { code: string; language?: AiCodeLanguage; /** Shown in the header instead of the language label. */ filename?: string; lineNumbers?: boolean; /** Soft-wrap long lines. Controlled with `onWrapChange`, or uncontrolled with `defaultWrap`. */ wrap?: boolean; defaultWrap?: boolean; onWrapChange?: (wrap: boolean) => void; /** Render the wrap toggle in the header. */ wrapToggle?: boolean; /** `default` has a header bar; `bare` drops it and floats the copy action on hover or focus. */ variant?: "default" | "bare"; /** Cap the body height in px; it scrolls past that. */ maxHeight?: number; /** Compose your own parts; omit for the default header plus body. */ children?: React.ReactNode; }; function AiCodeBlock({ code, language = "ts", filename, lineNumbers = false, wrap: wrapProp, defaultWrap = false, onWrapChange, wrapToggle = false, variant = "default", maxHeight, children, className, ...props }: AiCodeBlockProps) { const [inner, setInner] = React.useState(defaultWrap); const wrap = wrapProp ?? inner; const setWrap = React.useCallback( (next: boolean) => { if (wrapProp === undefined) setInner(next); onWrapChange?.(next); }, [wrapProp, onWrapChange], ); const ctx = React.useMemo( () => ({ code, language, filename, wrap, setWrap, lineNumbers, maxHeight }), [code, language, filename, wrap, setWrap, lineNumbers, maxHeight], ); return (
{children ?? ( <> {variant === "default" ? ( {wrapToggle ? : null} ) : ( {wrapToggle ? : null} )} )}
); } function AiCodeBlockHeader({ className, ...props }: React.ComponentProps<"figcaption">) { return (
); } /** Language icon plus filename (or the language name when no filename is given). */ function AiCodeBlockLabel({ className, children, ...props }: React.ComponentProps<"span">) { const { language, filename } = useAiCodeBlock("AiCodeBlockLabel"); const Glyph = language === "sh" ? IconTerminal2 : IconCode; return ( {children ?? ( <> {filename ? {filename} : null} {LABEL[language]} )} ); } function AiCodeBlockActions({ floating = false, className, ...props }: React.ComponentProps<"div"> & { floating?: boolean }) { return (
); } function AiCodeBlockCopy({ className, ...props }: Omit, "children">) { const { code, filename } = useAiCodeBlock("AiCodeBlockCopy"); const [copied, showCopied] = useReceipt(); const copy = async () => { try { await navigator.clipboard.writeText(code); } catch { return; } showCopied(); }; return ( } /> {copied ? "Copied" : "Copy"} ); } function AiCodeBlockWrapToggle({ className, ...props }: Omit, "children">) { const { wrap, setWrap } = useAiCodeBlock("AiCodeBlockWrapToggle"); return ( setWrap(!wrap)} className={cn("text-muted-foreground hover:text-foreground aria-pressed:text-foreground aria-pressed:before:bg-foreground/7", className)} {...props} > } /> {wrap ? "Unwrap lines" : "Wrap lines"} ); } function AiCodeBlockContent({ className, ...props }: React.ComponentProps<"div">) { const { code, language, wrap, lineNumbers, maxHeight, filename } = useAiCodeBlock("AiCodeBlockContent"); const lines = React.useMemo(() => highlightCode(code.replace(/\n$/, ""), GRAMMAR[language]), [code, language]); const digits = String(lines.length).length; return (

{lines.map((runs, number) => ( {lineNumbers ? ( {number + 1} ) : ( )} {runs.map((run, index) => ( {run.text} ))} ))}

); } export { AiCodeBlock, AiCodeBlockHeader, AiCodeBlockLabel, AiCodeBlockActions, AiCodeBlockCopy, AiCodeBlockWrapToggle, AiCodeBlockContent, }; 32:Ta44,"use client"; import { useEffect, useRef, useState } from "react"; import { IconPlayerPause, IconPlayerPlay, IconRefresh } from "@tabler/icons-react"; import { Button } from "@/components/ui/button"; import { AiMarkdown } from "./ai-markdown"; import { answerMarkdown, chunkWords } from "../_fixtures-b"; import { DemoPage, DemoSection } from "../../_shared/variant-frame"; const chunks = chunkWords(answerMarkdown, 2); function StreamingDemo() { const [count, setCount] = useState(0); const [playing, setPlaying] = useState(true); const timer = useRef(0); useEffect(() => { if (!playing) return; timer.current = window.setInterval(() => { setCount((c) => { if (c >= chunks.length) { window.clearInterval(timer.current); return c; } return c + 1; }); }, 40); return () => window.clearInterval(timer.current); }, [playing]); const done = count >= chunks.length; const text = chunks.slice(0, count).join(""); return (

{count}/{chunks.length}
{text}
); } const SURFACE = "min-w-0 rounded-xl bg-card p-4 text-card-foreground ring-1 ring-foreground/10"; export function AiMarkdownDemo() { return (
{answerMarkdown}

{"Use `readFeed()` with a **short** TTL, _then_ tune it. Avoid ~~global~~ shared keys."}
); } export default AiMarkdownDemo; 23:["$","article",null,{"className":"grid gap-6","children":[["$","header",null,{"className":"grid gap-3","children":[["$","nav",null,{"aria-label":"breadcrumb","data-slot":"breadcrumb","className":"","children":["$","ol",null,{"data-slot":"breadcrumb-list","className":"flex flex-wrap items-center gap-1.5 text-sm wrap-break-word text-muted-foreground","children":[["$","li",null,{"data-slot":"breadcrumb-item","className":"inline-flex items-center gap-1","children":["$","$L2c",null,{"href":"/","data-slot":"breadcrumb-link","className":"transition-colors hover:text-foreground","children":"Kobra Commerce"}]}],["$","li",null,{"data-slot":"breadcrumb-separator","role":"presentation","aria-hidden":"true","className":"[&>svg]:size-3.5","children":["$","svg",null,{"ref":"$undefined","xmlns":"http://www.w3.org/2000/svg","width":24,"height":24,"viewBox":"0 0 24 24","fill":"none","stroke":"currentColor","strokeWidth":2,"strokeLinecap":"round","strokeLinejoin":"round","className":"tabler-icon tabler-icon-chevron-right rtl:-scale-x-100","children":["$undefined",["$","path","svg-0",{"d":"M9 6l6 6l-6 6"}],"$undefined"]}]}],["$","li",null,{"data-slot":"breadcrumb-item","className":"inline-flex items-center gap-1","children":["$","$L2c",null,{"href":"/#ai","data-slot":"breadcrumb-link","className":"transition-colors hover:text-foreground","children":"AI"}]}],["$","li",null,{"data-slot":"breadcrumb-separator","role":"presentation","aria-hidden":"true","className":"[&>svg]:size-3.5","children":["$","svg",null,{"ref":"$undefined","xmlns":"http://www.w3.org/2000/svg","width":24,"height":24,"viewBox":"0 0 24 24","fill":"none","stroke":"currentColor","strokeWidth":2,"strokeLinecap":"round","strokeLinejoin":"round","className":"tabler-icon tabler-icon-chevron-right rtl:-scale-x-100","children":["$undefined",["$","path","svg-0",{"d":"M9 6l6 6l-6 6"}],"$undefined"]}]}],["$","li",null,{"data-slot":"breadcrumb-item","className":"inline-flex items-center gap-1","children":["$","span",null,{"data-slot":"breadcrumb-page","role":"link","aria-disabled":"true","aria-current":"page","className":"font-normal text-foreground","children":"AI markdown"}]}]]}]}],["$","div",null,{"className":"flex flex-wrap items-center gap-3","children":[["$","h1",null,{"className":"text-2xl font-bold","children":"AI markdown"}],["$","span",null,{"data-slot":"badge","data-variant":"green","className":"group/badge t-label relative isolate inline-flex w-fit shrink-0 items-center justify-center gap-1 rounded-full border border-transparent py-0.5 font-medium [--surface-calm:0.5] whitespace-nowrap transition-ring before:pointer-events-none before:absolute before:inset-0 before:-z-10 before:rounded-[inherit] before:border before:border-transparent before:transition-[scale,background-color,border-color] before:duration-150 before:ease-out focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 motion-reduce:before:transition-none has-data-[icon=inline-end]:pe-1.5 has-data-[icon=inline-start]:ps-1.5 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [a,button]:active:before:scale-[0.97] motion-reduce:[a,button]:active:before:scale-100 [&>svg]:pointer-events-none [&>svg]:size-3! t-surface t-surface-success text-[var(--badge-green-fg)] h-5 px-1.5 text-xs","children":"Ready"}]]}],["$","p",null,{"className":"max-w-[65ch] text-sm text-muted-foreground","children":"Markdown for chat answers with Kobra typography, tables, code blocks and memoized streaming."}]]}],["$","$L2d",null,{"preview":["$","$L2e",null,{"slug":"ai-markdown","group":"ai","minHeight":640,"fixedHeight":"$undefined"}],"code":["$","$L2f",null,{"files":[{"path":"blocks/ai/ai-markdown/ai-markdown.tsx","code":"$30"},{"path":"blocks/ai/ai-code-block/ai-code-block.tsx","code":"$31"},{"path":"blocks/ai/ai-markdown/demo.tsx","code":"$32"},{"path":"blocks/ai/ai-markdown/meta.ts","code":"import type { BlockMeta } from \"../../../lib/block-meta\";\n\nexport const aiMarkdownMeta: BlockMeta = {\n slug: \"ai-markdown\",\n title: \"AI markdown\",\n description: \"Markdown for chat answers with Kobra typography, tables, code blocks and memoized streaming.\",\n group: \"ai\",\n kobraDeps: [\"button\", \"code-block\", \"copy-check\", \"streaming-text\", \"table\", \"tooltip\"],\n files: [\n \"blocks/ai/ai-markdown/ai-markdown.tsx\",\n \"blocks/ai/ai-code-block/ai-code-block.tsx\",\n ],\n props: [\n { name: \"children\", type: \"string\", description: \"Markdown source; pass the growing string while streaming.\" },\n { name: \"streaming\", type: \"boolean\", default: \"false\", description: \"Fade new words in via Kobra StreamingText; finished blocks stay memoized.\" },\n { name: \"splitMarkdownBlocks()\", type: \"(source: string) => string[]\", description: \"Helper: top-level blocks split at blank lines outside fences, loose lists kept whole.\" },\n ],\n tags: [\"ai\", \"chat\", \"markdown\", \"streaming\"],\n status: \"ready\",\n};\n"}]}],"props":"$L33"}],"$L34"]}]