75:I[8513,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"ScrollBar"] a8:I[34002,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"CodeEditor"] a9:I[314491,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"FilesView"] 53:"#eef0f3" 54:["$","div","aui-border",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","aui-border",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":"#e2e5ea"}]]}] 55:["$","div","aui-border-strong",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","aui-border-strong",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":"#cdd2d9"}]]}] 56:["$","div","aui-fg",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","aui-fg",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":"#0d0f12"}]]}] 57:["$","div","aui-fg-muted",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","aui-fg-muted",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":"#4b5563"}]]}] 58:["$","div","aui-fg-subtle",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","aui-fg-subtle",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":"#5f6875"}]]}] 59:["$","div","aui-accent",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","aui-accent",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":"#0e7490"}]]}] 5a:["$","div","aui-accent-fg",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","aui-accent-fg",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":"#155e75"}]]}] 5b:["$","div","aui-on-accent",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","aui-on-accent",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":"#ffffff"}]]}] 5c:["$","div","aui-hot",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","aui-hot",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":"#be185d"}]]}] 5d:["$","div","aui-hot-fg",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","aui-hot-fg",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":"#9d174d"}]]}] 5e:["$","div","aui-on-hot",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","aui-on-hot",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":"#ffffff"}]]}] 5f:["$","div","aui-warn",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","aui-warn",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":"#b45309"}]]}] 60:["$","div","aui-warn-fg",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","aui-warn-fg",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":"#92400e"}]]}] 61:["$","div","aui-ring",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","aui-ring",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":"#0e7490"}]]}] 62:["$","div","aui-add-bg",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","aui-add-bg",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":["$","div",null,{"className":"flex items-center gap-2","children":[["$","div",null,{"className":"size-4 flex-shrink-0","style":{"backgroundColor":"rgb(8 145 178 / 0.08)"}}],["$","p",null,{"children":"rgb(8 145 178 / 0.08)"}]]}]}]]}] 63:["$","div","aui-add-strong",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","aui-add-strong",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":["$","div",null,{"className":"flex items-center gap-2","children":[["$","div",null,{"className":"size-4 flex-shrink-0","style":{"backgroundColor":"rgb(8 145 178 / 0.16)"}}],["$","p",null,{"children":"rgb(8 145 178 / 0.16)"}]]}]}]]}] 64:["$","div","aui-del-bg",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","aui-del-bg",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":["$","div",null,{"className":"flex items-center gap-2","children":[["$","div",null,{"className":"size-4 flex-shrink-0","style":{"backgroundColor":"rgb(190 24 93 / 0.07)"}}],["$","p",null,{"children":"rgb(190 24 93 / 0.07)"}]]}]}]]}] 65:["$","div","aui-del-strong",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","aui-del-strong",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":["$","div",null,{"className":"flex items-center gap-2","children":[["$","div",null,{"className":"size-4 flex-shrink-0","style":{"backgroundColor":"rgb(190 24 93 / 0.14)"}}],["$","p",null,{"children":"rgb(190 24 93 / 0.14)"}]]}]}]]}] 66:["$","div","aui-chart-input",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","aui-chart-input",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":"#0891b2"}]]}] 67:["$","div","aui-chart-output",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","aui-chart-output",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":"#db2777"}]]}] 68:["$","div","aui-code-keyword",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","aui-code-keyword",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":"#155e75"}]]}] 69:["$","div","aui-code-string",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","aui-code-string",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":"#9a3412"}]]}] 6a:["$","div","aui-code-number",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","aui-code-number",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":"#9d174d"}]]}] 6b:["$","div","aui-code-comment",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","aui-code-comment",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":"#525b67"}]]}] 6c:["$","div","aui-code-punctuation",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","aui-code-punctuation",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":"#4b5563"}]]}] 6d:["$","div","aui-radius",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","aui-radius",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":"0.75rem"}]]}] 6e:["$","div","aui-font-sans",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","aui-font-sans",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":"var(--font-sans, var(--font-geist-sans, ui-sans-serif, system-ui, sans-serif))"}]]}] 6f:["$","div","aui-font-mono",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","aui-font-mono",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":"var(--font-mono, var(--font-geist-mono, ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, monospace))"}]]}] 70:["$","$L75",null,{"orientation":"horizontal"}] 71:["$","div",null,{"className":"flex flex-col border rounded-md","children":[["$","p",null,{"className":"text-sm font-medium border-b p-2","children":"Dark Mode"}],["$","div",null,{"children":["$","$L52",null,{"type":"always","className":"h-80 px-2","children":[["$","div",null,{"className":"gap-2 pb-8 flex flex-col pt-4","children":[["$","div","aui-bg",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","aui-bg",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":"#0d0f12"}]]}],["$","div","aui-surface",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","aui-surface",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":"#181c22"}]]}],["$","div","aui-surface-2",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","aui-surface-2",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":"#1e232a"}]]}],["$","div","aui-border",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","aui-border",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":"#262b33"}]]}],["$","div","aui-border-strong",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","aui-border-strong",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":"#353c47"}]]}],["$","div","aui-fg",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","aui-fg",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":"#e8eaed"}]]}],["$","div","aui-fg-muted",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","aui-fg-muted",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":"#a1a9b4"}]]}],["$","div","aui-fg-subtle",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","aui-fg-subtle",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":"#8b94a0"}]]}],["$","div","aui-accent",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","aui-accent",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":"#22d3ee"}]]}],["$","div","aui-accent-fg",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","aui-accent-fg",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":"#67e8f9"}]]}],["$","div","aui-on-accent",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","aui-on-accent",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":"#0d0f12"}]]}],["$","div","aui-hot",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":["$L76","$L77"]}],"$L78","$L79","$L7a","$L7b","$L7c","$L7d","$L7e","$L7f","$L80","$L81","$L82","$L83","$L84","$L85","$L86","$L87"]}],"$L88"]}]}]]}] 72:["$","div",null,{"className":"flex flex-col border rounded-md","children":[["$","p",null,{"className":"text-sm font-medium border-b p-2","children":"Theme"}],["$","div",null,{"children":["$","$L52",null,{"type":"always","className":"h-80 px-2","children":[["$","div",null,{"className":"gap-2 pb-8 flex flex-col pt-4","children":[["$","div","color-aui-bg",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","color-aui-bg",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":"var(--aui-bg)"}]]}],["$","div","color-aui-surface",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","color-aui-surface",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":"var(--aui-surface)"}]]}],["$","div","color-aui-surface-2",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","color-aui-surface-2",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":"var(--aui-surface-2)"}]]}],["$","div","color-aui-border",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","color-aui-border",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":"var(--aui-border)"}]]}],["$","div","color-aui-border-strong",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","color-aui-border-strong",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":"var(--aui-border-strong)"}]]}],["$","div","color-aui-fg",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","color-aui-fg",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":"var(--aui-fg)"}]]}],["$","div","color-aui-fg-muted",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","color-aui-fg-muted",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":"var(--aui-fg-muted)"}]]}],["$","div","color-aui-fg-subtle",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","color-aui-fg-subtle",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":"var(--aui-fg-subtle)"}]]}],["$","div","color-aui-accent",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","color-aui-accent",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":"var(--aui-accent)"}]]}],["$","div","color-aui-accent-fg",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":[["$","div",null,{"className":"hover:bg-muted/50 py-2","children":["$","p",null,{"className":"text-foreground/80 text-sm","children":["--","color-aui-accent-fg",":"]}]}],["$","div",null,{"className":"hover:bg-muted/50 py-2 px-1 rounded-md w-full","children":"var(--aui-accent-fg)"}]]}],["$","div","color-aui-on-accent",{"className":"items-start gap-1 grid grid-cols-2 text-sm","children":["$L89","$L8a"]}],"$L8b","$L8c","$L8d","$L8e","$L8f","$L90","$L91","$L92","$L93","$L94","$L95","$L96","$L97","$L98","$L99","$L9a","$L9b","$L9c","$L9d","$L9e","$L9f","$La0","$La1","$La2","$La3","$La4","$La5","$La6"]}],"$La7"]}]}]]}] 73:["$","div",null,{"className":"flex flex-col border rounded-md","children":[["$","p",null,{"className":"text-sm font-medium border-b p-2","children":"CSS"}],["$","div",null,{"children":["$","$La8",null,{"lang":"css","copyButton":true,"writing":false,"className":"rounded-none w-full max-h-80","header":false,"children":"@keyframes aui-shimmer {\n\tfrom {\n\t\tbackground-position: 200% 0;\n\t}\n\tto {\n\t\tbackground-position: -200% 0;\n\t}\n}\n\n@keyframes aui-ping {\n\t0% {\n\t\ttransform: scale(1);\n\t\topacity: 0.7;\n\t}\n\t80%, 100% {\n\t\ttransform: scale(2.2);\n\t\topacity: 0;\n\t}\n}\n\n@keyframes aui-spin {\n\tto {\n\t\ttransform: rotate(360deg);\n\t}\n}\n\n@keyframes aui-blink {\n\tto {\n\t\tvisibility: hidden;\n\t}\n}\n\n@keyframes aui-enter {\n\tfrom {\n\t\topacity: 0;\n\t\ttransform: translateY(4px);\n\t}\n\tto {\n\t\topacity: 1;\n\t\ttransform: none;\n\t}\n}\n\n@keyframes aui-expand {\n\tfrom {\n\t\theight: 0;\n\t\topacity: 0;\n\t}\n\tto {\n\t\theight: var(--radix-collapsible-content-height);\n\t\topacity: 1;\n\t}\n}\n\n@keyframes aui-collapse {\n\tfrom {\n\t\theight: var(--radix-collapsible-content-height);\n\t\topacity: 1;\n\t}\n\tto {\n\t\theight: 0;\n\t\topacity: 0;\n\t}\n}\n\n@keyframes aui-indeterminate {\n\t0% {\n\t\ttransform: translateX(-100%);\n\t}\n\t100% {\n\t\ttransform: translateX(250%);\n\t}\n}"}]}]]}] aa:T23f9,'use client'; import type { ComponentPropsWithoutRef, ReactNode } from 'react'; import type { RunUsage } from './lib/ai'; import { formatCost, formatDuration, formatTokens } from './lib/format'; import { useAnimatedNumber } from './lib/hooks'; import { ArrowDownIcon, ArrowUpIcon } from './lib/icons'; import { estimateCost, type ModelPricing } from './lib/usage'; import { cn, type HeadingLevel } from './lib/utils'; export type { RunUsage }; export type { CostBreakdown, ModelPricing } from './lib/usage'; export interface RunMeterProps extends Omit, 'children' | 'title'> { usage?: RunUsage | undefined; /** Used to estimate cost when `cost` is not given. */ pricing?: ModelPricing | undefined; /** Explicit cost in USD, e.g. reported by your gateway. */ cost?: number | undefined; /** Time to first token, ms. */ ttftMs?: number | undefined; /** Total (active) run time, ms. */ durationMs?: number | undefined; /** The run is in progress: values are live. */ live?: boolean; model?: string | undefined; variant?: 'compact' | 'expanded'; /** Heading for the expanded variant. Default "Run". */ title?: ReactNode; /** Heading level for the expanded variant's title. Default 3. */ headingLevel?: HeadingLevel; } function Num({ value, format }: { value: number | undefined; format: (n: number) => string }) { const animated = useAnimatedNumber(value ?? 0); if (value === undefined) return <>–; return <>{format(animated)}; } /** * Token usage, estimated cost and latency for an agent run. * `compact` is a single inline strip for headers; `expanded` is a card with a * token breakdown bar and the prompt-cache hit rate. */ export function RunMeter({ usage, pricing, cost, ttftMs, durationMs, live = false, model, variant = 'compact', title = 'Run', headingLevel = 3, className, ...props }: RunMeterProps) { const Heading = `h${headingLevel}` as const; const breakdown = pricing ? estimateCost(usage, pricing) : undefined; const totalCost = cost ?? breakdown?.total; const input = usage?.inputTokens; const output = usage?.outputTokens; const cached = usage?.inputTokenDetails?.cacheReadTokens; const reasoning = usage?.outputTokenDetails?.reasoningTokens; // Share of input tokens served from the provider's prompt cache: the main cost lever for agents. const cacheHit = input && cached !== undefined ? cached / input : undefined; const summary = [ `${formatTokens(input)} input tokens`, `${formatTokens(output)} output tokens`, totalCost !== undefined ? `estimated cost ${formatCost(totalCost)}` : undefined, ttftMs !== undefined ? `time to first token ${formatDuration(ttftMs)}` : undefined, durationMs !== undefined ? `total ${formatDuration(durationMs)}` : undefined, ] .filter(Boolean) .join(', '); if (variant === 'compact') { const item = 'flex items-center gap-1.5 px-2.5 first:pl-0 last:pr-0'; return (

{summary} {totalCost !== undefined && ( )} {ttftMs !== undefined && ( )} {durationMs !== undefined && (

); } const tokenTotal = (input ?? 0) + (output ?? 0); // Keep a non-zero segment visible even when it is a tiny share. const inputShare = tokenTotal > 0 ? Math.min(97, Math.max((input ?? 0) > 0 ? 3 : 0, ((input ?? 0) / tokenTotal) * 100)) : 0; const label = 'text-xs text-aui-fg-subtle'; const value = 'text-xl font-semibold tracking-tight text-aui-fg tabular-nums'; return (

{title} {live && ( Live )} {model && {model}}

Tokens
Est. cost: {totalCost !== undefined ? : '–'}

TTFT: {formatDuration(ttftMs)}
Total: {formatDuration(durationMs)}
Cache hit: {cacheHit !== undefined ? `${Math.round(cacheHit * 100)}%` : '–'}

{breakdown && (

{formatCost(breakdown.input + breakdown.cachedInput + breakdown.cacheWrite)} input ·{' '} {formatCost(breakdown.output)} output {pricing && ( <> {' '} · ${pricing.input}/${pricing.output} per 1M )}

)}

); } ab:T25f3,/** * Thin, dependency-free helpers over AI SDK v7 `UIMessage` parts. * Only types are imported from `ai`, so nothing from the SDK runtime ends up in the bundle. */ import type { ChatStatus, DynamicToolUIPart, LanguageModelUsage, ReasoningUIPart, SourceDocumentUIPart, SourceUrlUIPart, TextUIPart, ToolUIPart, UIMessage, UITools, } from 'ai'; /** * Fields AI SDK 7 added to a tool part's `approval`: whether a `toolApproval` policy decided it, * and why the tool asked. AI SDK 6 has neither, so they are read defensively. */ type ApprovalExtras = { isAutomatic?: unknown; requestReason?: unknown } | undefined; /** Whether a policy decided the approval rather than a person. Always false on AI SDK 6. */ export function isAutomaticApproval(approval: object | undefined): boolean { return (approval as ApprovalExtras)?.isAutomatic === true; } /** The reason the tool gave for asking (AI SDK 7's `requestReason`), if any. */ export function getApprovalRequestReason(approval: object | undefined): string | undefined { const reason = (approval as ApprovalExtras)?.requestReason; return typeof reason === 'string' ? reason : undefined; } export type { ChatStatus, UIMessage }; /** Any part of any `UIMessage`. */ export type AnyUIPart = UIMessage['parts'][number]; /** A static (`tool-${name}`) or dynamic tool part. */ export type ToolPart = ToolUIPart | DynamicToolUIPart; /** The AI SDK v7 tool part states. */ export type ToolState = ToolPart['state']; export type SourcePart = SourceUrlUIPart | SourceDocumentUIPart; export type { ReasoningUIPart, SourceDocumentUIPart, SourceUrlUIPart, TextUIPart }; /** Token usage, compatible with the AI SDK `LanguageModelUsage` shape. */ export type RunUsage = { inputTokens?: number | undefined; outputTokens?: number | undefined; totalTokens?: number | undefined; inputTokenDetails?: Partial | undefined; outputTokenDetails?: Partial | undefined; }; export const TOOL_STATES = [ 'input-streaming', 'input-available', 'approval-requested', 'approval-responded', 'output-available', 'output-error', 'output-denied', ] as const satisfies readonly ToolState[]; export function isToolPart(part: { type: string }): part is ToolPart { return part.type === 'dynamic-tool' || part.type.startsWith('tool-'); } export function isSourcePart(part: { type: string }): part is SourcePart { return part.type === 'source-url' || part.type === 'source-document'; } /** Same semantics as the SDK's `getToolName`, without the runtime import. */ export function getToolPartName(part: ToolPart): string { return part.type === 'dynamic-tool' ? part.toolName : part.type.slice('tool-'.length); } /** * A UI-level phase derived from the SDK tool state. Several SDK states collapse * into one visual phase (e.g. an approved call that has not returned yet is "running"). */ export type ToolPhase = 'streaming' | 'running' | 'awaiting-approval' | 'success' | 'error' | 'denied'; export function getToolPhase( part: Pick & { approval?: { approved?: boolean; isAutomatic?: boolean } | undefined; preliminary?: boolean | undefined; }, ): ToolPhase { switch (part.state) { case 'input-streaming': return 'streaming'; case 'input-available': return 'running'; case 'approval-requested': // A policy decision (`isAutomatic`) streams as a request immediately followed by its response. return part.approval?.isAutomatic ? 'running' : 'awaiting-approval'; case 'approval-responded': return part.approval?.approved ? 'running' : 'denied'; case 'output-available': return part.preliminary ? 'running' : 'success'; case 'output-error': return 'error'; case 'output-denied': return 'denied'; } } export const TOOL_PHASE_LABEL: Record = { streaming: 'Preparing', running: 'Running', 'awaiting-approval': 'Needs approval', success: 'Done', error: 'Failed', denied: 'Denied', }; export function isSettledPhase(phase: ToolPhase): boolean { return phase === 'success' || phase === 'error' || phase === 'denied'; } export function getToolParts(parts: readonly AnyUIPart[]): ToolPart[] { return parts.filter(isToolPart); } export type ApprovalStatus = 'pending' | 'approved' | 'denied'; /** The approval state of a tool part, or `undefined` for parts outside the approval flow. */ export function getApprovalStatus(part: ToolPart): ApprovalStatus | undefined { if (!part.approval) return undefined; if (part.state === 'approval-requested') return 'pending'; if (part.state === 'output-denied') return 'denied'; return part.approval.approved ? 'approved' : part.approval.approved === false ? 'denied' : 'pending'; } export interface ToolTiming { /** First time the call was observed (input started streaming). */ startedAt?: number | undefined; /** When execution began: input complete, or approval granted. */ runningAt?: number | undefined; /** When the call settled (output, error or denial). */ endedAt?: number | undefined; } export type ToolTimings = Readonly>; /** Pure reducer behind `useToolTimings`, exported for tests and custom stores. */ export function observeToolTimings(prev: ToolTimings, tools: readonly ToolPart[], now: number): ToolTimings { let next: Record | undefined; const write = (id: string, value: ToolTiming) => { next ??= { ...prev }; next[id] = value; }; for (const tool of tools) { const phase = getToolPhase(tool); const current = (next ?? prev)[tool.toolCallId]; if (!current) { if (isSettledPhase(phase)) write(tool.toolCallId, {}); else write(tool.toolCallId, { startedAt: now, runningAt: phase === 'running' ? now : undefined }); continue; } if (current.startedAt === undefined || current.endedAt !== undefined) continue; if (phase === 'running' && current.runningAt === undefined) write(tool.toolCallId, { ...current, runningAt: now }); else if (isSettledPhase(phase)) write(tool.toolCallId, { ...current, runningAt: current.runningAt ?? now, endedAt: now }); } return next ?? prev; } /** Collect sources, de-duplicated by URL (or source id for documents). */ export function getSourceParts(parts: readonly AnyUIPart[]): SourcePart[] { const seen = new Set(); const out: SourcePart[] = []; for (const part of parts) { if (!isSourcePart(part)) continue; const key = part.type === 'source-url' ? part.url : `doc:${part.sourceId}`; if (seen.has(key)) continue; seen.add(key); out.push(part); } return out; } /** A source in app-level shape. AI SDK `source-url` / `source-document` parts are accepted too. */ export interface SourceItem { id: string; url?: string | undefined; title?: string | undefined; /** Optional snippet shown in the cards variant. */ description?: string | undefined; /** For documents. */ filename?: string | undefined; mediaType?: string | undefined; } export function toSourceItem(source: SourcePart | SourceItem): SourceItem { if ('type' in source && isSourcePart(source as SourcePart)) { const part = source as SourcePart; return part.type === 'source-url' ? { id: part.sourceId, url: part.url, title: part.title } : { id: part.sourceId, title: part.title, filename: part.filename, mediaType: part.mediaType }; } return source as SourceItem; } export type AgentState = 'idle' | 'thinking' | 'working' | 'awaiting-approval' | 'done' | 'error'; export const AGENT_STATE_LABEL: Record = { idle: 'Idle', thinking: 'Thinking', working: 'Working', 'awaiting-approval': 'Waiting for approval', done: 'Done', error: 'Error', }; export interface DerivedAgentState { state: AgentState; /** Short human detail, e.g. "read_file" or "Writing response". */ detail?: string | undefined; } /** * Map `useChat` status plus the latest assistant message to a single agent state. * Human-in-the-loop waits (approvals, client-side tools awaiting output) take * precedence over transport status, because the run cannot progress without the user. */ export function deriveAgentState({ status, message, pendingClientTools = [], }: { status: ChatStatus; message?: Pick | undefined; /** Names of client-side tools whose `input-available` state means "waiting for the user". */ pendingClientTools?: readonly string[]; }): DerivedAgentState { if (status === 'error') return { state: 'error' }; const parts = message?.role === 'assistant' ? message.parts : []; const tools = getToolParts(parts); const approval = tools.find((t) => t.state === 'approval-requested' && !isAutomaticApproval(t.approval)); if (approval) return { state: 'awaiting-approval', detail: getToolPartName(approval) }; const clientWait = tools.find( (t) => t.state === 'input-available' && pendingClientTools.includes(getToolPartName(t)), ); if (clientWait && status !== 'submitted') return { state: 'awaiting-approval', detail: getToolPartName(clientWait) }; if (status === 'submitted') return { state: 'thinking' }; if (status === 'streaming') { const last = parts.at(-1); if (!last || last.type === 'step-start' || last.type === 'reasoning') return { state: 'thinking' }; if (isToolPart(last)) return { state: 'working', detail: getToolPartName(last) }; if (last.type === 'text') return { state: 'working', detail: 'Writing response' }; return { state: 'working' }; } return parts.length > 0 ? { state: 'done' } : { state: 'idle' }; } ac:T1071,/** Formatting helpers shared by the components. All output is locale-stable. */ /* * Each unit is chosen by the value as it will be printed, not the raw value: otherwise rounding * produces "1000ms", "60.0s" or "1000.0k" instead of moving up to the next unit. */ export function formatDuration(ms: number | undefined | null): string { if (ms == null || !Number.isFinite(ms) || ms < 0) return '–'; if (Math.round(ms) < 1000) return `${Math.round(ms)}ms`; const centis = (ms / 1000).toFixed(2); if (Number(centis) < 10) return `${centis}s`; const tenths = (ms / 1000).toFixed(1); if (Number(tenths) < 60) return `${tenths}s`; const seconds = Math.round(ms / 1000); return `${Math.floor(seconds / 60)}m ${String(seconds % 60).padStart(2, '0')}s`; } /** Spoken form for screen readers, e.g. "1.2 seconds". */ export function formatDurationLong(ms: number | undefined | null): string { if (ms == null || !Number.isFinite(ms) || ms < 0) return 'unknown duration'; if (Math.round(ms) < 1000) return `${Math.round(ms)} milliseconds`; const tenths = (ms / 1000).toFixed(1); if (Number(tenths) < 60) return `${tenths} seconds`; const total = Math.round(ms / 1000); const minutes = Math.floor(total / 60); const rest = total % 60; return `${minutes} minute${minutes === 1 ? '' : 's'} ${rest} second${rest === 1 ? '' : 's'}`; } export function formatTokens(n: number | undefined | null): string { if (n == null || !Number.isFinite(n)) return '–'; if (Math.abs(Math.round(n)) < 1000) return String(Math.round(n)); const hundredths = (n / 1000).toFixed(2); if (Math.abs(Number(hundredths)) < 10) return `${hundredths}k`; const tenths = (n / 1000).toFixed(1); if (Math.abs(Number(tenths)) < 1000) return `${tenths}k`; return `${(n / 1_000_000).toFixed(2)}M`; } export function formatCost(usd: number | undefined | null): string { if (usd == null || !Number.isFinite(usd)) return '–'; if (usd === 0) return '$0.00'; const four = usd.toFixed(4); if (Math.abs(Number(four)) < 0.01) return `$${four}`; const three = usd.toFixed(3); if (Math.abs(Number(three)) < 1) return `$${three}`; return `$${usd.toFixed(2)}`; } /** `read_file` / `readFile` / `read-file` → "Read file". */ export function humanizeToolName(name: string): string { const spaced = name .replace(/[_-]+/g, ' ') .replace(/([a-z0-9])([A-Z])/g, '$1 $2') .trim() .toLowerCase(); return spaced.charAt(0).toUpperCase() + spaced.slice(1); } export function getHostname(url: string): string { try { return new URL(url).hostname.replace(/^www\./, ''); } catch { return url; } } /** Compact one-line preview of an arbitrary tool input. */ export function summarizeValue(value: unknown, max = 72): string | undefined { if (value == null) return undefined; let text: string; if (typeof value === 'string') text = value; else if (typeof value === 'number' || typeof value === 'boolean') text = String(value); else if (typeof value === 'object') { const entries = Object.entries(value as Record); if (entries.length === 0) return undefined; // Prefer the first string-ish field: it is usually the most descriptive (query, path, command). const primary = entries.find(([, v]) => typeof v === 'string'); text = primary ? String(primary[1]) : entries.map(([k, v]) => `${k}: ${typeof v === 'object' ? '…' : String(v)}`).join(', '); } else return undefined; text = text.replace(/\s+/g, ' ').trim(); return text.length > max ? `${text.slice(0, max - 1)}…` : text; } export function safeStringify(value: unknown, space = 2): string { if (value === undefined) return 'undefined'; if (typeof value === 'string') return JSON.stringify(value); const seen = new WeakSet