@ai-sdk/devtools 1.0.0-beta.15 → 1.0.0-beta.17
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -178,4 +178,4 @@ If you want to hide the \`${l.titleName}\`, you can wrap it with our VisuallyHid
|
|
|
178
178
|
|
|
179
179
|
For more information, see https://radix-ui.com/primitives/docs/components/${l.docsSlug}`;return w.useEffect(()=>{n&&(document.getElementById(n)||console.error(o))},[o,n]),null},xS="DialogDescriptionWarning",wS=({contentRef:n,descriptionId:l})=>{const s=`Warning: Missing \`Description\` or \`aria-describedby={undefined}\` for {${bh(xS).contentName}}.`;return w.useEffect(()=>{var c;const u=(c=n.current)==null?void 0:c.getAttribute("aria-describedby");l&&u&&(document.getElementById(l)||console.warn(s))},[s,n,l]),null},SS=ch,bS=fh,CS=mh,kS=hh,ES=gh,NS=yh;function jS(n){if(typeof document>"u")return;let l=document.head||document.getElementsByTagName("head")[0],o=document.createElement("style");o.type="text/css",l.appendChild(o),o.styleSheet?o.styleSheet.cssText=n:o.appendChild(document.createTextNode(n))}const Ch=oe.createContext({drawerRef:{current:null},overlayRef:{current:null},onPress:()=>{},onRelease:()=>{},onDrag:()=>{},onNestedDrag:()=>{},onNestedOpenChange:()=>{},onNestedRelease:()=>{},openProp:void 0,dismissible:!1,isOpen:!1,isDragging:!1,keyboardIsOpen:{current:!1},snapPointsOffset:null,snapPoints:null,handleOnly:!1,modal:!1,shouldFade:!1,activeSnapPoint:null,onOpenChange:()=>{},setActiveSnapPoint:()=>{},closeDrawer:()=>{},direction:"bottom",shouldAnimate:{current:!0},shouldScaleBackground:!1,setBackgroundColorOnScale:!0,noBodyStyles:!1,container:null,autoFocus:!1}),pl=()=>{const n=oe.useContext(Ch);if(!n)throw new Error("useDrawerContext must be used within a Drawer.Root");return n};jS(`[data-vaul-drawer]{touch-action:none;will-change:transform;transition:transform .5s cubic-bezier(.32, .72, 0, 1);animation-duration:.5s;animation-timing-function:cubic-bezier(0.32,0.72,0,1)}[data-vaul-drawer][data-vaul-snap-points=false][data-vaul-drawer-direction=bottom][data-state=open]{animation-name:slideFromBottom}[data-vaul-drawer][data-vaul-snap-points=false][data-vaul-drawer-direction=bottom][data-state=closed]{animation-name:slideToBottom}[data-vaul-drawer][data-vaul-snap-points=false][data-vaul-drawer-direction=top][data-state=open]{animation-name:slideFromTop}[data-vaul-drawer][data-vaul-snap-points=false][data-vaul-drawer-direction=top][data-state=closed]{animation-name:slideToTop}[data-vaul-drawer][data-vaul-snap-points=false][data-vaul-drawer-direction=left][data-state=open]{animation-name:slideFromLeft}[data-vaul-drawer][data-vaul-snap-points=false][data-vaul-drawer-direction=left][data-state=closed]{animation-name:slideToLeft}[data-vaul-drawer][data-vaul-snap-points=false][data-vaul-drawer-direction=right][data-state=open]{animation-name:slideFromRight}[data-vaul-drawer][data-vaul-snap-points=false][data-vaul-drawer-direction=right][data-state=closed]{animation-name:slideToRight}[data-vaul-drawer][data-vaul-snap-points=true][data-vaul-drawer-direction=bottom]{transform:translate3d(0,var(--initial-transform,100%),0)}[data-vaul-drawer][data-vaul-snap-points=true][data-vaul-drawer-direction=top]{transform:translate3d(0,calc(var(--initial-transform,100%) * -1),0)}[data-vaul-drawer][data-vaul-snap-points=true][data-vaul-drawer-direction=left]{transform:translate3d(calc(var(--initial-transform,100%) * -1),0,0)}[data-vaul-drawer][data-vaul-snap-points=true][data-vaul-drawer-direction=right]{transform:translate3d(var(--initial-transform,100%),0,0)}[data-vaul-drawer][data-vaul-delayed-snap-points=true][data-vaul-drawer-direction=top]{transform:translate3d(0,var(--snap-point-height,0),0)}[data-vaul-drawer][data-vaul-delayed-snap-points=true][data-vaul-drawer-direction=bottom]{transform:translate3d(0,var(--snap-point-height,0),0)}[data-vaul-drawer][data-vaul-delayed-snap-points=true][data-vaul-drawer-direction=left]{transform:translate3d(var(--snap-point-height,0),0,0)}[data-vaul-drawer][data-vaul-delayed-snap-points=true][data-vaul-drawer-direction=right]{transform:translate3d(var(--snap-point-height,0),0,0)}[data-vaul-overlay][data-vaul-snap-points=false]{animation-duration:.5s;animation-timing-function:cubic-bezier(0.32,0.72,0,1)}[data-vaul-overlay][data-vaul-snap-points=false][data-state=open]{animation-name:fadeIn}[data-vaul-overlay][data-state=closed]{animation-name:fadeOut}[data-vaul-animate=false]{animation:none!important}[data-vaul-overlay][data-vaul-snap-points=true]{opacity:0;transition:opacity .5s cubic-bezier(.32, .72, 0, 1)}[data-vaul-overlay][data-vaul-snap-points=true]{opacity:1}[data-vaul-drawer]:not([data-vaul-custom-container=true])::after{content:'';position:absolute;background:inherit;background-color:inherit}[data-vaul-drawer][data-vaul-drawer-direction=top]::after{top:initial;bottom:100%;left:0;right:0;height:200%}[data-vaul-drawer][data-vaul-drawer-direction=bottom]::after{top:100%;bottom:initial;left:0;right:0;height:200%}[data-vaul-drawer][data-vaul-drawer-direction=left]::after{left:initial;right:100%;top:0;bottom:0;width:200%}[data-vaul-drawer][data-vaul-drawer-direction=right]::after{left:100%;right:initial;top:0;bottom:0;width:200%}[data-vaul-overlay][data-vaul-snap-points=true]:not([data-vaul-snap-points-overlay=true]):not(
|
|
180
180
|
[data-state=closed]
|
|
181
|
-
){opacity:0}[data-vaul-overlay][data-vaul-snap-points-overlay=true]{opacity:1}[data-vaul-handle]{display:block;position:relative;opacity:.7;background:#e2e2e4;margin-left:auto;margin-right:auto;height:5px;width:32px;border-radius:1rem;touch-action:pan-y}[data-vaul-handle]:active,[data-vaul-handle]:hover{opacity:1}[data-vaul-handle-hitarea]{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:max(100%,2.75rem);height:max(100%,2.75rem);touch-action:inherit}@media (hover:hover) and (pointer:fine){[data-vaul-drawer]{user-select:none}}@media (pointer:fine){[data-vaul-handle-hitarea]:{width:100%;height:100%}}@keyframes fadeIn{from{opacity:0}to{opacity:1}}@keyframes fadeOut{to{opacity:0}}@keyframes slideFromBottom{from{transform:translate3d(0,var(--initial-transform,100%),0)}to{transform:translate3d(0,0,0)}}@keyframes slideToBottom{to{transform:translate3d(0,var(--initial-transform,100%),0)}}@keyframes slideFromTop{from{transform:translate3d(0,calc(var(--initial-transform,100%) * -1),0)}to{transform:translate3d(0,0,0)}}@keyframes slideToTop{to{transform:translate3d(0,calc(var(--initial-transform,100%) * -1),0)}}@keyframes slideFromLeft{from{transform:translate3d(calc(var(--initial-transform,100%) * -1),0,0)}to{transform:translate3d(0,0,0)}}@keyframes slideToLeft{to{transform:translate3d(calc(var(--initial-transform,100%) * -1),0,0)}}@keyframes slideFromRight{from{transform:translate3d(var(--initial-transform,100%),0,0)}to{transform:translate3d(0,0,0)}}@keyframes slideToRight{to{transform:translate3d(var(--initial-transform,100%),0,0)}}`);function RS(){const n=navigator.userAgent;return typeof window<"u"&&(/Firefox/.test(n)&&/Mobile/.test(n)||/FxiOS/.test(n))}function TS(){return qu(/^Mac/)}function PS(){return qu(/^iPhone/)}function Np(){return/^((?!chrome|android).)*safari/i.test(navigator.userAgent)}function _S(){return qu(/^iPad/)||TS()&&navigator.maxTouchPoints>1}function kh(){return PS()||_S()}function qu(n){return typeof window<"u"&&window.navigator!=null?n.test(window.navigator.platform):void 0}const AS=24,OS=typeof window<"u"?w.useLayoutEffect:w.useEffect;function jp(...n){return(...l)=>{for(let o of n)typeof o=="function"&&o(...l)}}const du=typeof document<"u"&&window.visualViewport;function Rp(n){let l=window.getComputedStyle(n);return/(auto|scroll)/.test(l.overflow+l.overflowX+l.overflowY)}function Eh(n){for(Rp(n)&&(n=n.parentElement);n&&!Rp(n);)n=n.parentElement;return n||document.scrollingElement||document.documentElement}const MS=new Set(["checkbox","radio","range","color","file","image","button","submit","reset"]);let Mi=0,fu;function DS(n={}){let{isDisabled:l}=n;OS(()=>{if(!l)return Mi++,Mi===1&&kh()&&(fu=LS()),()=>{Mi--,Mi===0&&(fu==null||fu())}},[l])}function LS(){let n,l=0,o=x=>{n=Eh(x.target),!(n===document.documentElement&&n===document.body)&&(l=x.changedTouches[0].pageY)},s=x=>{if(!n||n===document.documentElement||n===document.body){x.preventDefault();return}let S=x.changedTouches[0].pageY,C=n.scrollTop,P=n.scrollHeight-n.clientHeight;P!==0&&((C<=0&&S>l||C>=P&&S<l)&&x.preventDefault(),l=S)},u=x=>{let S=x.target;ku(S)&&S!==document.activeElement&&(x.preventDefault(),S.style.transform="translateY(-2000px)",S.focus(),requestAnimationFrame(()=>{S.style.transform=""}))},c=x=>{let S=x.target;ku(S)&&(S.style.transform="translateY(-2000px)",requestAnimationFrame(()=>{S.style.transform="",du&&(du.height<window.innerHeight?requestAnimationFrame(()=>{Tp(S)}):du.addEventListener("resize",()=>Tp(S),{once:!0}))}))},p=()=>{window.scrollTo(0,0)},m=window.pageXOffset,h=window.pageYOffset,y=jp(zS(document.documentElement,"paddingRight",`${window.innerWidth-document.documentElement.clientWidth}px`));window.scrollTo(0,0);let v=jp(nl(document,"touchstart",o,{passive:!1,capture:!0}),nl(document,"touchmove",s,{passive:!1,capture:!0}),nl(document,"touchend",u,{passive:!1,capture:!0}),nl(document,"focus",c,!0),nl(window,"scroll",p));return()=>{y(),v(),window.scrollTo(m,h)}}function zS(n,l,o){let s=n.style[l];return n.style[l]=o,()=>{n.style[l]=s}}function nl(n,l,o,s){return n.addEventListener(l,o,s),()=>{n.removeEventListener(l,o,s)}}function Tp(n){let l=document.scrollingElement||document.documentElement;for(;n&&n!==l;){let o=Eh(n);if(o!==document.documentElement&&o!==document.body&&o!==n){let s=o.getBoundingClientRect().top,u=n.getBoundingClientRect().top,c=n.getBoundingClientRect().bottom;const p=o.getBoundingClientRect().bottom+AS;c>p&&(o.scrollTop+=u-s)}n=o.parentElement}}function ku(n){return n instanceof HTMLInputElement&&!MS.has(n.type)||n instanceof HTMLTextAreaElement||n instanceof HTMLElement&&n.isContentEditable}function IS(n,l){typeof n=="function"?n(l):n!=null&&(n.current=l)}function $S(...n){return l=>n.forEach(o=>IS(o,l))}function Nh(...n){return w.useCallback($S(...n),n)}const jh=new WeakMap;function Ze(n,l,o=!1){if(!n||!(n instanceof HTMLElement))return;let s={};Object.entries(l).forEach(([u,c])=>{if(u.startsWith("--")){n.style.setProperty(u,c);return}s[u]=n.style[u],n.style[u]=c}),!o&&jh.set(n,s)}function FS(n,l){if(!n||!(n instanceof HTMLElement))return;let o=jh.get(n);o&&(n.style[l]=o[l])}const Xe=n=>{switch(n){case"top":case"bottom":return!0;case"left":case"right":return!1;default:return n}};function Di(n,l){if(!n)return null;const o=window.getComputedStyle(n),s=o.transform||o.webkitTransform||o.mozTransform;let u=s.match(/^matrix3d\((.+)\)$/);return u?parseFloat(u[1].split(", ")[Xe(l)?13:12]):(u=s.match(/^matrix\((.+)\)$/),u?parseFloat(u[1].split(", ")[Xe(l)?5:4]):null)}function WS(n){return 8*(Math.log(n+1)-2)}function pu(n,l){if(!n)return()=>{};const o=n.style.cssText;return Object.assign(n.style,l),()=>{n.style.cssText=o}}function BS(...n){return(...l)=>{for(const o of n)typeof o=="function"&&o(...l)}}const Fe={DURATION:.5,EASE:[.32,.72,0,1]},Rh=.4,HS=.25,VS=100,Th=8,Li=16,Eu=26,mu="vaul-dragging";function Ph(n){const l=oe.useRef(n);return oe.useEffect(()=>{l.current=n}),oe.useMemo(()=>(...o)=>l.current==null?void 0:l.current.call(l,...o),[])}function US({defaultProp:n,onChange:l}){const o=oe.useState(n),[s]=o,u=oe.useRef(s),c=Ph(l);return oe.useEffect(()=>{u.current!==s&&(c(s),u.current=s)},[s,u,c]),o}function _h({prop:n,defaultProp:l,onChange:o=()=>{}}){const[s,u]=US({defaultProp:l,onChange:o}),c=n!==void 0,p=c?n:s,m=Ph(o),h=oe.useCallback(y=>{if(c){const x=typeof y=="function"?y(n):y;x!==n&&m(x)}else u(y)},[c,n,u,m]);return[p,h]}function YS({activeSnapPointProp:n,setActiveSnapPointProp:l,snapPoints:o,drawerRef:s,overlayRef:u,fadeFromIndex:c,onSnapPointChange:p,direction:m="bottom",container:h,snapToSequentialPoint:y}){const[v,x]=_h({prop:n,defaultProp:o==null?void 0:o[0],onChange:l}),[S,C]=oe.useState(typeof window<"u"?{innerWidth:window.innerWidth,innerHeight:window.innerHeight}:void 0);oe.useEffect(()=>{function L(){C({innerWidth:window.innerWidth,innerHeight:window.innerHeight})}return window.addEventListener("resize",L),()=>window.removeEventListener("resize",L)},[]);const P=oe.useMemo(()=>v===(o==null?void 0:o[o.length-1])||null,[o,v]),k=oe.useMemo(()=>{var L;return(L=o==null?void 0:o.findIndex(R=>R===v))!=null?L:null},[o,v]),E=o&&o.length>0&&(c||c===0)&&!Number.isNaN(c)&&o[c]===v||!o,A=oe.useMemo(()=>{const L=h?{width:h.getBoundingClientRect().width,height:h.getBoundingClientRect().height}:typeof window<"u"?{width:window.innerWidth,height:window.innerHeight}:{width:0,height:0};var R;return(R=o==null?void 0:o.map(W=>{const Q=typeof W=="string";let ee=0;if(Q&&(ee=parseInt(W,10)),Xe(m)){const U=Q?ee:S?W*L.height:0;return S?m==="bottom"?L.height-U:-L.height+U:U}const ce=Q?ee:S?W*L.width:0;return S?m==="right"?L.width-ce:-L.width+ce:ce}))!=null?R:[]},[o,S,h]),D=oe.useMemo(()=>k!==null?A==null?void 0:A[k]:null,[A,k]),$=oe.useCallback(L=>{var R;const W=(R=A==null?void 0:A.findIndex(Q=>Q===L))!=null?R:null;p(W),Ze(s.current,{transition:`transform ${Fe.DURATION}s cubic-bezier(${Fe.EASE.join(",")})`,transform:Xe(m)?`translate3d(0, ${L}px, 0)`:`translate3d(${L}px, 0, 0)`}),A&&W!==A.length-1&&c!==void 0&&W!==c&&W<c?Ze(u.current,{transition:`opacity ${Fe.DURATION}s cubic-bezier(${Fe.EASE.join(",")})`,opacity:"0"}):Ze(u.current,{transition:`opacity ${Fe.DURATION}s cubic-bezier(${Fe.EASE.join(",")})`,opacity:"1"}),x(o==null?void 0:o[Math.max(W,0)])},[s.current,o,A,c,u,x]);oe.useEffect(()=>{if(v||n){var L;const R=(L=o==null?void 0:o.findIndex(W=>W===n||W===v))!=null?L:-1;A&&R!==-1&&typeof A[R]=="number"&&$(A[R])}},[v,n,o,A,$]);function N({draggedDistance:L,closeDrawer:R,velocity:W,dismissible:Q}){if(c===void 0)return;const ee=m==="bottom"||m==="right"?(D??0)-L:(D??0)+L,ce=k===c-1,U=k===0,q=L>0;if(ce&&Ze(u.current,{transition:`opacity ${Fe.DURATION}s cubic-bezier(${Fe.EASE.join(",")})`}),!y&&W>2&&!q){Q?R():$(A[0]);return}if(!y&&W>2&&q&&A&&o){$(A[o.length-1]);return}const te=A==null?void 0:A.reduce((ne,B)=>typeof ne!="number"||typeof B!="number"?ne:Math.abs(B-ee)<Math.abs(ne-ee)?B:ne),J=Xe(m)?window.innerHeight:window.innerWidth;if(W>Rh&&Math.abs(L)<J*.4){const ne=q?1:-1;if(ne>0&&P&&o){$(A[o.length-1]);return}if(U&&ne<0&&Q&&R(),k===null)return;$(A[k+ne]);return}$(te)}function F({draggedDistance:L}){if(D===null)return;const R=m==="bottom"||m==="right"?D-L:D+L;(m==="bottom"||m==="right")&&R<A[A.length-1]||(m==="top"||m==="left")&&R>A[A.length-1]||Ze(s.current,{transform:Xe(m)?`translate3d(0, ${R}px, 0)`:`translate3d(${R}px, 0, 0)`})}function V(L,R){if(!o||typeof k!="number"||!A||c===void 0)return null;const W=k===c-1;if(k>=c&&R)return 0;if(W&&!R)return 1;if(!E&&!W)return null;const ee=W?k+1:k-1,ce=W?A[ee]-A[ee-1]:A[ee+1]-A[ee],U=L/Math.abs(ce);return W?1-U:U}return{isLastSnapPoint:P,activeSnapPoint:v,shouldFade:E,getPercentageDragged:V,setActiveSnapPoint:x,activeSnapPointIndex:k,onRelease:N,onDrag:F,snapPointsOffset:A}}const XS=()=>()=>{};function QS(){const{direction:n,isOpen:l,shouldScaleBackground:o,setBackgroundColorOnScale:s,noBodyStyles:u}=pl(),c=oe.useRef(null),p=w.useMemo(()=>document.body.style.backgroundColor,[]);function m(){return(window.innerWidth-Eu)/window.innerWidth}oe.useEffect(()=>{if(l&&o){c.current&&clearTimeout(c.current);const h=document.querySelector("[data-vaul-drawer-wrapper]")||document.querySelector("[vaul-drawer-wrapper]");if(!h)return;BS(s&&!u?pu(document.body,{background:"black"}):XS,pu(h,{transformOrigin:Xe(n)?"top":"left",transitionProperty:"transform, border-radius",transitionDuration:`${Fe.DURATION}s`,transitionTimingFunction:`cubic-bezier(${Fe.EASE.join(",")})`}));const y=pu(h,{borderRadius:`${Th}px`,overflow:"hidden",...Xe(n)?{transform:`scale(${m()}) translate3d(0, calc(env(safe-area-inset-top) + 14px), 0)`}:{transform:`scale(${m()}) translate3d(calc(env(safe-area-inset-top) + 14px), 0, 0)`}});return()=>{y(),c.current=window.setTimeout(()=>{p?document.body.style.background=p:document.body.style.removeProperty("background")},Fe.DURATION*1e3)}}},[l,o,p])}let rl=null;function GS({isOpen:n,modal:l,nested:o,hasBeenOpened:s,preventScrollRestoration:u,noBodyStyles:c}){const[p,m]=oe.useState(()=>typeof window<"u"?window.location.href:""),h=oe.useRef(0),y=oe.useCallback(()=>{if(Np()&&rl===null&&n&&!c){rl={position:document.body.style.position,top:document.body.style.top,left:document.body.style.left,height:document.body.style.height,right:"unset"};const{scrollX:x,innerHeight:S}=window;document.body.style.setProperty("position","fixed","important"),Object.assign(document.body.style,{top:`${-h.current}px`,left:`${-x}px`,right:"0px",height:"auto"}),window.setTimeout(()=>window.requestAnimationFrame(()=>{const C=S-window.innerHeight;C&&h.current>=S&&(document.body.style.top=`${-(h.current+C)}px`)}),300)}},[n]),v=oe.useCallback(()=>{if(Np()&&rl!==null&&!c){const x=-parseInt(document.body.style.top,10),S=-parseInt(document.body.style.left,10);Object.assign(document.body.style,rl),window.requestAnimationFrame(()=>{if(u&&p!==window.location.href){m(window.location.href);return}window.scrollTo(S,x)}),rl=null}},[p]);return oe.useEffect(()=>{function x(){h.current=window.scrollY}return x(),window.addEventListener("scroll",x),()=>{window.removeEventListener("scroll",x)}},[]),oe.useEffect(()=>{if(l)return()=>{typeof document>"u"||document.querySelector("[data-vaul-drawer]")||v()}},[l,v]),oe.useEffect(()=>{o||!s||(n?(!window.matchMedia("(display-mode: standalone)").matches&&y(),l||window.setTimeout(()=>{v()},500)):v())},[n,s,p,l,o,y,v]),{restorePositionSetting:v}}function KS({open:n,onOpenChange:l,children:o,onDrag:s,onRelease:u,snapPoints:c,shouldScaleBackground:p=!1,setBackgroundColorOnScale:m=!0,closeThreshold:h=HS,scrollLockTimeout:y=VS,dismissible:v=!0,handleOnly:x=!1,fadeFromIndex:S=c&&c.length-1,activeSnapPoint:C,setActiveSnapPoint:P,fixed:k,modal:E=!0,onClose:A,nested:D,noBodyStyles:$=!1,direction:N="bottom",defaultOpen:F=!1,disablePreventScroll:V=!0,snapToSequentialPoint:L=!1,preventScrollRestoration:R=!1,repositionInputs:W=!0,onAnimationEnd:Q,container:ee,autoFocus:ce=!1}){var U,q;const[te=!1,J]=_h({defaultProp:F,prop:n,onChange:ye=>{l==null||l(ye),!ye&&!D&&ho(),setTimeout(()=>{Q==null||Q(ye)},Fe.DURATION*1e3),ye&&!E&&typeof window<"u"&&window.requestAnimationFrame(()=>{document.body.style.pointerEvents="auto"}),ye||(document.body.style.pointerEvents="auto")}}),[ne,B]=oe.useState(!1),[K,I]=oe.useState(!1),[_,H]=oe.useState(!1),fe=oe.useRef(null),we=oe.useRef(null),pe=oe.useRef(null),me=oe.useRef(null),Ce=oe.useRef(null),be=oe.useRef(!1),xe=oe.useRef(null),ze=oe.useRef(0),Qe=oe.useRef(!1),Ct=oe.useRef(!F),ot=oe.useRef(0),he=oe.useRef(null),ir=oe.useRef(((U=he.current)==null?void 0:U.getBoundingClientRect().height)||0),sr=oe.useRef(((q=he.current)==null?void 0:q.getBoundingClientRect().width)||0),hn=oe.useRef(0),Rr=oe.useCallback(ye=>{c&&ye===Tn.length-1&&(we.current=new Date)},[]),{activeSnapPoint:en,activeSnapPointIndex:_t,setActiveSnapPoint:gn,onRelease:po,snapPointsOffset:Tn,onDrag:ml,shouldFade:mo,getPercentageDragged:hl}=YS({snapPoints:c,activeSnapPointProp:C,setActiveSnapPointProp:P,drawerRef:he,fadeFromIndex:S,overlayRef:fe,onSnapPointChange:Rr,direction:N,container:ee,snapToSequentialPoint:L});DS({isDisabled:!te||K||!E||_||!ne||!W||!V});const{restorePositionSetting:ho}=GS({isOpen:te,modal:E,nested:D??!1,hasBeenOpened:ne,preventScrollRestoration:R,noBodyStyles:$});function vn(){return(window.innerWidth-Eu)/window.innerWidth}function gl(ye){var je,Re;!v&&!c||he.current&&!he.current.contains(ye.target)||(ir.current=((je=he.current)==null?void 0:je.getBoundingClientRect().height)||0,sr.current=((Re=he.current)==null?void 0:Re.getBoundingClientRect().width)||0,I(!0),pe.current=new Date,kh()&&window.addEventListener("touchend",()=>be.current=!1,{once:!0}),ye.target.setPointerCapture(ye.pointerId),ze.current=Xe(N)?ye.pageY:ye.pageX)}function Pn(ye,je){var Re;let ke=ye;const De=(Re=window.getSelection())==null?void 0:Re.toString(),lt=he.current?Di(he.current,N):null,Je=new Date;if(ke.tagName==="SELECT"||ke.hasAttribute("data-vaul-no-drag")||ke.closest("[data-vaul-no-drag]"))return!1;if(N==="right"||N==="left")return!0;if(we.current&&Je.getTime()-we.current.getTime()<500)return!1;if(lt!==null&&(N==="bottom"?lt>0:lt<0))return!0;if(De&&De.length>0)return!1;if(Ce.current&&Je.getTime()-Ce.current.getTime()<y&<===0||je)return Ce.current=Je,!1;for(;ke;){if(ke.scrollHeight>ke.clientHeight){if(ke.scrollTop!==0)return Ce.current=new Date,!1;if(ke.getAttribute("role")==="dialog")return!0}ke=ke.parentNode}return!0}function ar(ye){if(he.current&&K){const je=N==="bottom"||N==="right"?1:-1,Re=(ze.current-(Xe(N)?ye.pageY:ye.pageX))*je,ke=Re>0,De=c&&!v&&!ke;if(De&&_t===0)return;const lt=Math.abs(Re),Je=document.querySelector("[data-vaul-drawer-wrapper]"),Ft=N==="bottom"||N==="top"?ir.current:sr.current;let gt=lt/Ft;const Wt=hl(lt,ke);if(Wt!==null&&(gt=Wt),De&>>=1||!be.current&&!Pn(ye.target,ke))return;if(he.current.classList.add(mu),be.current=!0,Ze(he.current,{transition:"none"}),Ze(fe.current,{transition:"none"}),c&&ml({draggedDistance:Re}),ke&&!c){const at=WS(Re),_n=Math.min(at*-1,0)*je;Ze(he.current,{transform:Xe(N)?`translate3d(0, ${_n}px, 0)`:`translate3d(${_n}px, 0, 0)`});return}const Bt=1-gt;if((mo||S&&_t===S-1)&&(s==null||s(ye,gt),Ze(fe.current,{opacity:`${Bt}`,transition:"none"},!0)),Je&&fe.current&&p){const at=Math.min(vn()+gt*(1-vn()),1),_n=8-gt*8,An=Math.max(0,14-gt*14);Ze(Je,{borderRadius:`${_n}px`,transform:Xe(N)?`scale(${at}) translate3d(0, ${An}px, 0)`:`scale(${at}) translate3d(${An}px, 0, 0)`,transition:"none"},!0)}if(!c){const at=lt*je;Ze(he.current,{transform:Xe(N)?`translate3d(0, ${at}px, 0)`:`translate3d(${at}px, 0, 0)`})}}}oe.useEffect(()=>{window.requestAnimationFrame(()=>{Ct.current=!0})},[]),oe.useEffect(()=>{var ye;function je(){if(!he.current||!W)return;const Re=document.activeElement;if(ku(Re)||Qe.current){var ke;const De=((ke=window.visualViewport)==null?void 0:ke.height)||0,lt=window.innerHeight;let Je=lt-De;const Ft=he.current.getBoundingClientRect().height||0,gt=Ft>lt*.8;hn.current||(hn.current=Ft);const Wt=he.current.getBoundingClientRect().top;if(Math.abs(ot.current-Je)>60&&(Qe.current=!Qe.current),c&&c.length>0&&Tn&&_t){const Bt=Tn[_t]||0;Je+=Bt}if(ot.current=Je,Ft>De||Qe.current){const Bt=he.current.getBoundingClientRect().height;let at=Bt;Bt>De&&(at=De-(gt?Wt:Eu)),k?he.current.style.height=`${Bt-Math.max(Je,0)}px`:he.current.style.height=`${Math.max(at,De-Wt)}px`}else RS()||(he.current.style.height=`${hn.current}px`);c&&c.length>0&&!Qe.current?he.current.style.bottom="0px":he.current.style.bottom=`${Math.max(Je,0)}px`}}return(ye=window.visualViewport)==null||ye.addEventListener("resize",je),()=>{var Re;return(Re=window.visualViewport)==null?void 0:Re.removeEventListener("resize",je)}},[_t,c,Tn]);function ur(ye){vl(),A==null||A(),ye||J(!1),setTimeout(()=>{c&&gn(c[0])},Fe.DURATION*1e3)}function go(){if(!he.current)return;const ye=document.querySelector("[data-vaul-drawer-wrapper]"),je=Di(he.current,N);Ze(he.current,{transform:"translate3d(0, 0, 0)",transition:`transform ${Fe.DURATION}s cubic-bezier(${Fe.EASE.join(",")})`}),Ze(fe.current,{transition:`opacity ${Fe.DURATION}s cubic-bezier(${Fe.EASE.join(",")})`,opacity:"1"}),p&&je&&je>0&&te&&Ze(ye,{borderRadius:`${Th}px`,overflow:"hidden",...Xe(N)?{transform:`scale(${vn()}) translate3d(0, calc(env(safe-area-inset-top) + 14px), 0)`,transformOrigin:"top"}:{transform:`scale(${vn()}) translate3d(calc(env(safe-area-inset-top) + 14px), 0, 0)`,transformOrigin:"left"},transitionProperty:"transform, border-radius",transitionDuration:`${Fe.DURATION}s`,transitionTimingFunction:`cubic-bezier(${Fe.EASE.join(",")})`},!0)}function vl(){!K||!he.current||(he.current.classList.remove(mu),be.current=!1,I(!1),me.current=new Date)}function ms(ye){if(!K||!he.current)return;he.current.classList.remove(mu),be.current=!1,I(!1),me.current=new Date;const je=Di(he.current,N);if(!ye||!Pn(ye.target,!1)||!je||Number.isNaN(je)||pe.current===null)return;const Re=me.current.getTime()-pe.current.getTime(),ke=ze.current-(Xe(N)?ye.pageY:ye.pageX),De=Math.abs(ke)/Re;if(De>.05&&(H(!0),setTimeout(()=>{H(!1)},200)),c){po({draggedDistance:ke*(N==="bottom"||N==="right"?1:-1),closeDrawer:ur,velocity:De,dismissible:v}),u==null||u(ye,!0);return}if(N==="bottom"||N==="right"?ke>0:ke<0){go(),u==null||u(ye,!0);return}if(De>Rh){ur(),u==null||u(ye,!1);return}var lt;const Je=Math.min((lt=he.current.getBoundingClientRect().height)!=null?lt:0,window.innerHeight);var Ft;const gt=Math.min((Ft=he.current.getBoundingClientRect().width)!=null?Ft:0,window.innerWidth),Wt=N==="left"||N==="right";if(Math.abs(je)>=(Wt?gt:Je)*h){ur(),u==null||u(ye,!1);return}u==null||u(ye,!0),go()}oe.useEffect(()=>(te&&(Ze(document.documentElement,{scrollBehavior:"auto"}),we.current=new Date),()=>{FS(document.documentElement,"scrollBehavior")}),[te]);function vo(ye){const je=ye?(window.innerWidth-Li)/window.innerWidth:1,Re=ye?-16:0;xe.current&&window.clearTimeout(xe.current),Ze(he.current,{transition:`transform ${Fe.DURATION}s cubic-bezier(${Fe.EASE.join(",")})`,transform:Xe(N)?`scale(${je}) translate3d(0, ${Re}px, 0)`:`scale(${je}) translate3d(${Re}px, 0, 0)`}),!ye&&he.current&&(xe.current=setTimeout(()=>{const ke=Di(he.current,N);Ze(he.current,{transition:"none",transform:Xe(N)?`translate3d(0, ${ke}px, 0)`:`translate3d(${ke}px, 0, 0)`})},500))}function yo(ye,je){if(je<0)return;const Re=(window.innerWidth-Li)/window.innerWidth,ke=Re+je*(1-Re),De=-16+je*Li;Ze(he.current,{transform:Xe(N)?`scale(${ke}) translate3d(0, ${De}px, 0)`:`scale(${ke}) translate3d(${De}px, 0, 0)`,transition:"none"})}function xo(ye,je){const Re=Xe(N)?window.innerHeight:window.innerWidth,ke=je?(Re-Li)/Re:1,De=je?-16:0;je&&Ze(he.current,{transition:`transform ${Fe.DURATION}s cubic-bezier(${Fe.EASE.join(",")})`,transform:Xe(N)?`scale(${ke}) translate3d(0, ${De}px, 0)`:`scale(${ke}) translate3d(${De}px, 0, 0)`})}return oe.useEffect(()=>{E||window.requestAnimationFrame(()=>{document.body.style.pointerEvents="auto"})},[E]),oe.createElement(SS,{defaultOpen:F,onOpenChange:ye=>{!v&&!ye||(ye?B(!0):ur(!0),J(ye))},open:te},oe.createElement(Ch.Provider,{value:{activeSnapPoint:en,snapPoints:c,setActiveSnapPoint:gn,drawerRef:he,overlayRef:fe,onOpenChange:l,onPress:gl,onRelease:ms,onDrag:ar,dismissible:v,shouldAnimate:Ct,handleOnly:x,isOpen:te,isDragging:K,shouldFade:mo,closeDrawer:ur,onNestedDrag:yo,onNestedOpenChange:vo,onNestedRelease:xo,keyboardIsOpen:Qe,modal:E,snapPointsOffset:Tn,activeSnapPointIndex:_t,direction:N,shouldScaleBackground:p,setBackgroundColorOnScale:m,noBodyStyles:$,container:ee,autoFocus:ce}},o))}const Ah=oe.forwardRef(function({...n},l){const{overlayRef:o,snapPoints:s,onRelease:u,shouldFade:c,isOpen:p,modal:m,shouldAnimate:h}=pl(),y=Nh(l,o),v=s&&s.length>0;if(!m)return null;const x=oe.useCallback(S=>u(S),[u]);return oe.createElement(kS,{onMouseUp:x,ref:y,"data-vaul-overlay":"","data-vaul-snap-points":p&&v?"true":"false","data-vaul-snap-points-overlay":p&&c?"true":"false","data-vaul-animate":h!=null&&h.current?"true":"false",...n})});Ah.displayName="Drawer.Overlay";const Oh=oe.forwardRef(function({onPointerDownOutside:n,style:l,onOpenAutoFocus:o,...s},u){const{drawerRef:c,onPress:p,onRelease:m,onDrag:h,keyboardIsOpen:y,snapPointsOffset:v,activeSnapPointIndex:x,modal:S,isOpen:C,direction:P,snapPoints:k,container:E,handleOnly:A,shouldAnimate:D,autoFocus:$}=pl(),[N,F]=oe.useState(!1),V=Nh(u,c),L=oe.useRef(null),R=oe.useRef(null),W=oe.useRef(!1),Q=k&&k.length>0;QS();const ee=(U,q,te=0)=>{if(W.current)return!0;const J=Math.abs(U.y),ne=Math.abs(U.x),B=ne>J,K=["bottom","right"].includes(q)?1:-1;if(q==="left"||q==="right"){if(!(U.x*K<0)&&ne>=0&&ne<=te)return B}else if(!(U.y*K<0)&&J>=0&&J<=te)return!B;return W.current=!0,!0};oe.useEffect(()=>{Q&&window.requestAnimationFrame(()=>{F(!0)})},[]);function ce(U){L.current=null,W.current=!1,m(U)}return oe.createElement(ES,{"data-vaul-drawer-direction":P,"data-vaul-drawer":"","data-vaul-delayed-snap-points":N?"true":"false","data-vaul-snap-points":C&&Q?"true":"false","data-vaul-custom-container":E?"true":"false","data-vaul-animate":D!=null&&D.current?"true":"false",...s,ref:V,style:v&&v.length>0?{"--snap-point-height":`${v[x??0]}px`,...l}:l,onPointerDown:U=>{A||(s.onPointerDown==null||s.onPointerDown.call(s,U),L.current={x:U.pageX,y:U.pageY},p(U))},onOpenAutoFocus:U=>{o==null||o(U),$||U.preventDefault()},onPointerDownOutside:U=>{if(n==null||n(U),!S||U.defaultPrevented){U.preventDefault();return}y.current&&(y.current=!1)},onFocusOutside:U=>{if(!S){U.preventDefault();return}},onPointerMove:U=>{if(R.current=U,A||(s.onPointerMove==null||s.onPointerMove.call(s,U),!L.current))return;const q=U.pageY-L.current.y,te=U.pageX-L.current.x,J=U.pointerType==="touch"?10:2;ee({x:te,y:q},P,J)?h(U):(Math.abs(te)>J||Math.abs(q)>J)&&(L.current=null)},onPointerUp:U=>{s.onPointerUp==null||s.onPointerUp.call(s,U),L.current=null,W.current=!1,m(U)},onPointerOut:U=>{s.onPointerOut==null||s.onPointerOut.call(s,U),ce(R.current)},onContextMenu:U=>{s.onContextMenu==null||s.onContextMenu.call(s,U),R.current&&ce(R.current)}})});Oh.displayName="Drawer.Content";const qS=250,ZS=120,JS=oe.forwardRef(function({preventCycle:n=!1,children:l,...o},s){const{closeDrawer:u,isDragging:c,snapPoints:p,activeSnapPoint:m,setActiveSnapPoint:h,dismissible:y,handleOnly:v,isOpen:x,onPress:S,onDrag:C}=pl(),P=oe.useRef(null),k=oe.useRef(!1);function E(){if(k.current){$();return}window.setTimeout(()=>{A()},ZS)}function A(){if(c||n||k.current){$();return}if($(),!p||p.length===0){y||u();return}if(m===p[p.length-1]&&y){u();return}const F=p.findIndex(L=>L===m);if(F===-1)return;const V=p[F+1];h(V)}function D(){P.current=window.setTimeout(()=>{k.current=!0},qS)}function $(){P.current&&window.clearTimeout(P.current),k.current=!1}return oe.createElement("div",{onClick:E,onPointerCancel:$,onPointerDown:N=>{v&&S(N),D()},onPointerMove:N=>{v&&C(N)},ref:s,"data-vaul-drawer-visible":x?"true":"false","data-vaul-handle":"","aria-hidden":"true",...o},oe.createElement("span",{"data-vaul-handle-hitarea":"","aria-hidden":"true"},l))});JS.displayName="Drawer.Handle";function eb(n){const l=pl(),{container:o=l.container,...s}=n;return oe.createElement(CS,{container:o,...s})}const fo={Root:KS,Content:Oh,Overlay:Ah,Trigger:bS,Portal:eb,Title:NS};function Fi({...n}){return f.jsx(fo.Root,{"data-slot":"drawer",...n})}function Wi({...n}){return f.jsx(fo.Trigger,{"data-slot":"drawer-trigger",...n})}function tb({...n}){return f.jsx(fo.Portal,{"data-slot":"drawer-portal",...n})}function nb({className:n,...l}){return f.jsx(fo.Overlay,{"data-slot":"drawer-overlay",className:fn("data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50",n),...l})}function Bi({className:n,children:l,...o}){return f.jsxs(tb,{"data-slot":"drawer-portal",children:[f.jsx(nb,{}),f.jsxs(fo.Content,{"data-slot":"drawer-content",className:fn("group/drawer-content bg-background fixed z-50 flex h-auto flex-col","data-[vaul-drawer-direction=top]:inset-x-0 data-[vaul-drawer-direction=top]:top-0 data-[vaul-drawer-direction=top]:mb-24 data-[vaul-drawer-direction=top]:max-h-[80vh] data-[vaul-drawer-direction=top]:rounded-b-lg data-[vaul-drawer-direction=top]:border-b","data-[vaul-drawer-direction=bottom]:inset-x-0 data-[vaul-drawer-direction=bottom]:bottom-0 data-[vaul-drawer-direction=bottom]:mt-24 data-[vaul-drawer-direction=bottom]:max-h-[80vh] data-[vaul-drawer-direction=bottom]:rounded-t-lg data-[vaul-drawer-direction=bottom]:border-t","data-[vaul-drawer-direction=right]:inset-y-0 data-[vaul-drawer-direction=right]:right-0 data-[vaul-drawer-direction=right]:border-l","data-[vaul-drawer-direction=left]:inset-y-0 data-[vaul-drawer-direction=left]:left-0 data-[vaul-drawer-direction=left]:w-3/4 data-[vaul-drawer-direction=left]:border-r data-[vaul-drawer-direction=left]:sm:max-w-sm",n),...o,children:[f.jsx("div",{className:"bg-muted mx-auto mt-4 hidden h-2 w-[100px] shrink-0 rounded-full group-data-[vaul-drawer-direction=bottom]/drawer-content:block"}),l]})]})}function Hi({className:n,...l}){return f.jsx("div",{"data-slot":"drawer-header",className:fn("flex flex-col gap-0.5 p-4 group-data-[vaul-drawer-direction=bottom]/drawer-content:text-center group-data-[vaul-drawer-direction=top]/drawer-content:text-center md:gap-1.5 md:text-left",n),...l})}function Vi({className:n,...l}){return f.jsx(fo.Title,{"data-slot":"drawer-title",className:fn("text-foreground font-semibold",n),...l})}function It({data:n,compact:l=!1,size:o="sm"}){const[s,u]=w.useState(!1),c=JSON.stringify(n,null,2),p=l&&c.length>200?JSON.stringify(n):c,m={sm:"text-xs",base:"text-sm",lg:"text-base"},h=async()=>{await navigator.clipboard.writeText(c),u(!0),setTimeout(()=>u(!1),2e3)};return f.jsxs("div",{className:"relative group",children:[f.jsx("button",{onClick:h,className:"absolute top-1.5 right-1.5 p-1.5 rounded-md border border-border bg-background opacity-0 group-hover:opacity-100 transition-opacity z-10",title:"Copy to clipboard",children:s?f.jsx(Op,{className:"size-3 text-success"}):f.jsx(Mp,{className:"size-3 text-muted-foreground"})}),f.jsx("pre",{className:`font-mono ${m[o]} text-muted-foreground whitespace-pre-wrap wrap-break-words bg-background rounded p-2 ${l?"max-h-20 overflow-hidden":""}`,children:p})]})}function rb({rawRequest:n,rawResponse:l,rawChunks:o,isStream:s}){const[u,c]=w.useState(!1),[p,m]=w.useState("parsed");if(!n&&!l)return null;const h=s&&o;return f.jsxs("div",{className:"border-t border-border",children:[f.jsxs("button",{className:"w-full flex items-center gap-2 px-4 py-2.5 text-[11px] text-muted-foreground hover:text-foreground hover:bg-accent/50 transition-colors",onClick:()=>c(!u),children:[f.jsx(or,{className:`size-3 transition-transform ${u?"rotate-90":""}`}),f.jsx("span",{className:"font-medium uppercase tracking-wider",children:"Request / Response"})]}),u&&f.jsxs("div",{className:"px-4 pb-4 grid grid-cols-2 gap-4",children:[n&&f.jsxs("div",{className:"flex flex-col",children:[f.jsx("div",{className:"h-7 flex items-end mb-2",children:f.jsx("span",{className:"text-[10px] font-medium uppercase tracking-wider text-muted-foreground",children:"Request"})}),f.jsx("div",{className:"max-h-[400px] overflow-auto rounded-md border border-border",children:f.jsx(It,{data:rr(n)})})]}),(l||o)&&f.jsxs("div",{className:"flex flex-col",children:[f.jsxs("div",{className:"h-7 flex items-end justify-between mb-2",children:[f.jsx("span",{className:"text-[10px] font-medium uppercase tracking-wider text-muted-foreground",children:s?"Stream":"Response"}),h&&f.jsxs("div",{className:"inline-flex rounded-md border border-border bg-muted/30 p-0.5",children:[f.jsx("button",{onClick:()=>m("parsed"),className:`px-2 py-0.5 text-[10px] font-medium rounded transition-colors ${p==="parsed"?"bg-background text-foreground shadow-sm":"text-muted-foreground hover:text-foreground"}`,children:"AI SDK"}),f.jsx("button",{onClick:()=>m("raw"),className:`px-2 py-0.5 text-[10px] font-medium rounded transition-colors ${p==="raw"?"bg-background text-foreground shadow-sm":"text-muted-foreground hover:text-foreground"}`,children:"Provider"})]})]}),f.jsx("div",{className:"max-h-[400px] overflow-auto rounded-md border border-border",children:f.jsx(It,{data:rr(h&&p==="raw"?o:l)})})]})]})]})}function ob({usage:n}){const l=Ji(n==null?void 0:n.inputTokens),o=es(n==null?void 0:n.outputTokens);return f.jsxs("div",{className:"space-y-6",children:[f.jsxs("div",{className:"grid grid-cols-2 gap-4",children:[f.jsxs("div",{className:"rounded-lg border border-border bg-card p-4",children:[f.jsx("div",{className:"text-xs font-medium uppercase tracking-wider text-muted-foreground mb-2",children:"Input Tokens"}),f.jsx("div",{className:"text-2xl font-semibold",children:l.total}),(l.cacheRead!==void 0||l.cacheWrite!==void 0)&&f.jsxs("div",{className:"mt-3 space-y-1 text-sm text-muted-foreground",children:[l.cacheRead!==void 0&&f.jsxs("div",{className:"flex justify-between",children:[f.jsx("span",{children:"Cache read"}),f.jsx("span",{className:"font-mono",children:l.cacheRead})]}),l.cacheWrite!==void 0&&f.jsxs("div",{className:"flex justify-between",children:[f.jsx("span",{children:"Cache write"}),f.jsx("span",{className:"font-mono",children:l.cacheWrite})]}),l.noCache!==void 0&&f.jsxs("div",{className:"flex justify-between",children:[f.jsx("span",{children:"No cache"}),f.jsx("span",{className:"font-mono",children:l.noCache})]})]})]}),f.jsxs("div",{className:"rounded-lg border border-border bg-card p-4",children:[f.jsx("div",{className:"text-xs font-medium uppercase tracking-wider text-muted-foreground mb-2",children:"Output Tokens"}),f.jsx("div",{className:"text-2xl font-semibold",children:o.total}),(o.text!==void 0||o.reasoning!==void 0)&&f.jsxs("div",{className:"mt-3 space-y-1 text-sm text-muted-foreground",children:[o.text!==void 0&&f.jsxs("div",{className:"flex justify-between",children:[f.jsx("span",{children:"Text"}),f.jsx("span",{className:"font-mono",children:o.text})]}),o.reasoning!==void 0&&f.jsxs("div",{className:"flex justify-between",children:[f.jsx("span",{children:"Reasoning"}),f.jsx("span",{className:"font-mono",children:o.reasoning})]})]})]})]}),(n==null?void 0:n.raw)!=null&&f.jsxs("div",{children:[f.jsx("div",{className:"text-xs font-medium uppercase tracking-wider text-muted-foreground mb-2",children:"Raw Provider Usage"}),f.jsx(It,{data:n.raw,size:"sm"})]}),f.jsxs("div",{children:[f.jsx("div",{className:"text-xs font-medium uppercase tracking-wider text-muted-foreground mb-2",children:"Full Usage Object"}),f.jsx(It,{data:n,size:"sm"})]})]})}function Mh({input:n,output:l,raw:o}){const s=n.noCache!==void 0||n.cacheRead!==void 0||n.cacheWrite!==void 0,u=l.text!==void 0||l.reasoning!==void 0;return s||u?f.jsxs("div",{className:"text-xs space-y-2",children:[f.jsxs("div",{children:[f.jsxs("div",{className:"font-medium mb-1",children:["Input: ",n.total]}),n.cacheRead!==void 0&&f.jsxs("div",{className:"text-muted-foreground ml-2",children:["Cache read: ",n.cacheRead]}),n.cacheWrite!==void 0&&f.jsxs("div",{className:"text-muted-foreground ml-2",children:["Cache write: ",n.cacheWrite]})]}),f.jsxs("div",{children:[f.jsxs("div",{className:"font-medium mb-1",children:["Output: ",l.total]}),l.text!==void 0&&f.jsxs("div",{className:"text-muted-foreground ml-2",children:["Text: ",l.text]}),l.reasoning!==void 0&&f.jsxs("div",{className:"text-muted-foreground ml-2",children:["Reasoning: ",l.reasoning]})]}),o!==void 0&&f.jsx("div",{className:"pt-1 border-t border-border mt-1",children:f.jsxs("div",{className:"text-muted-foreground/70 font-mono text-[10px] max-w-[200px] truncate",children:["Raw: ",JSON.stringify(o)]})})]}):f.jsxs("div",{className:"text-xs",children:[f.jsxs("div",{children:["Input: ",n.total]}),f.jsxs("div",{children:["Output: ",l.total]})]})}function Dh({content:n}){const[l,o]=w.useState(!1),s=n.length>200?n.slice(0,200)+"…":n;return f.jsxs("div",{className:"rounded-md border border-amber-500/30 overflow-hidden",children:[f.jsxs("button",{className:"w-full flex items-center gap-2 px-3 py-2 bg-amber-500/10 hover:bg-amber-500/20 transition-colors",onClick:()=>o(!l),children:[f.jsx(or,{className:`size-3 text-amber-500 transition-transform shrink-0 ${l?"rotate-90":""}`}),f.jsx(ll,{className:"size-3 text-amber-500 shrink-0"}),f.jsx("span",{className:"text-xs font-medium text-amber-500",children:"Thinking"}),!l&&f.jsx("span",{className:"text-[11px] text-amber-500/70 truncate ml-1",children:s})]}),l&&f.jsx("div",{className:"p-3 bg-card/50 border-t border-amber-500/30",children:f.jsx("div",{className:"text-xs text-foreground/80 leading-relaxed whitespace-pre-wrap",children:n})})]})}function Lh({content:n,defaultExpanded:l=!1,isSystem:o=!1}){const[s,u]=w.useState(l),[c,p]=w.useState(!1),m=n.length>200?n.slice(0,200)+"…":n,h=o?"border-blue-500/30":"border-border",y=o?"bg-blue-500/10":"bg-muted/30",v=o?"hover:bg-blue-500/20":"hover:bg-muted/50",x=o?"text-blue-400":"text-muted-foreground",S=o?"text-blue-400":"text-foreground",C=async P=>{P.stopPropagation(),await navigator.clipboard.writeText(n),p(!0),setTimeout(()=>p(!1),2e3)};return f.jsxs("div",{className:`rounded-md border ${h} overflow-hidden`,children:[f.jsxs("button",{className:`w-full flex items-center gap-2 px-3 py-2 ${y} ${v} transition-colors`,onClick:()=>u(!s),children:[f.jsx(or,{className:`size-3 ${x} transition-transform shrink-0 ${s?"rotate-90":""}`}),f.jsx(lo,{className:`size-3 ${x} shrink-0`}),f.jsx("span",{className:`text-xs font-medium ${S}`,children:"Text"}),!s&&f.jsx("span",{className:`text-[11px] ${o?"text-blue-400/70":"text-muted-foreground"} truncate ml-1`,children:m})]}),s&&f.jsxs("div",{className:`p-3 bg-card/50 border-t ${h} group relative`,children:[f.jsx("button",{onClick:C,className:"absolute top-1.5 right-1.5 p-1.5 rounded-md border border-border bg-background opacity-0 group-hover:opacity-100 transition-opacity z-10",title:"Copy to clipboard",children:c?f.jsx(Op,{className:"size-3 text-success"}):f.jsx(Mp,{className:"size-3 text-muted-foreground"})}),f.jsx("div",{className:"text-xs text-foreground leading-relaxed whitespace-pre-wrap max-h-60 overflow-y-auto",children:n})]})]})}function lb({tool:n}){const[l,o]=w.useState(!1);return f.jsxs("div",{className:"rounded-md border border-border bg-background overflow-hidden",children:[f.jsxs("button",{className:"w-full flex items-center justify-between p-2.5 hover:bg-accent/50 transition-colors",onClick:()=>o(!l),children:[f.jsx("span",{className:"text-sm font-mono text-purple",children:n.name}),n.parameters&&f.jsx(or,{className:`size-3 text-muted-foreground transition-transform ${l?"rotate-90":""}`})]}),l&&n.parameters&&f.jsxs("div",{className:"px-2.5 pb-2.5 border-t border-border",children:[n.description&&f.jsx("p",{className:"text-xs text-muted-foreground mb-2 pt-2",children:n.description}),f.jsx(It,{data:n.parameters,compact:!0})]}),!l&&n.description&&f.jsx("div",{className:"px-2.5 pb-2 -mt-1",children:f.jsx("p",{className:"text-[11px] text-muted-foreground truncate",children:n.description})})]})}function ib({toolName:n,toolCallId:l,data:o}){const[s,u]=w.useState(!1),c=typeof o=="string"?rr(o):o;return f.jsxs("div",{className:"rounded-md border border-purple/30 overflow-hidden",children:[f.jsxs("button",{className:"w-full flex items-center gap-2 px-3 py-2 bg-purple/10 hover:bg-purple/20 transition-colors",onClick:()=>u(!s),children:[f.jsx(or,{className:`size-3 text-purple transition-transform shrink-0 ${s?"rotate-90":""}`}),f.jsx(kr,{className:"size-3 text-purple shrink-0"}),f.jsx("span",{className:"text-xs font-mono font-medium text-purple",children:n}),!s&&c!=null&&typeof c=="object"&&!Array.isArray(c)&&f.jsx("span",{className:"text-[11px] font-mono text-purple/70 truncate",children:qm(c)}),l&&f.jsx("span",{className:"text-[10px] font-mono text-muted-foreground/60 ml-auto shrink-0",children:l})]}),s&&f.jsx("div",{className:"p-3 bg-card/50 border-t border-purple/30",children:f.jsx(It,{data:c})})]})}function sb({toolName:n,toolCallId:l,data:o}){const[s,u]=w.useState(!1);return f.jsxs("div",{className:"rounded-md border border-success/30 overflow-hidden",children:[f.jsxs("button",{className:"w-full flex items-center gap-2 px-3 py-2 bg-success/10 hover:bg-success/20 transition-colors",onClick:()=>u(!s),children:[f.jsx(or,{className:`size-3 text-success transition-transform shrink-0 ${s?"rotate-90":""}`}),f.jsx("span",{className:"text-xs font-medium text-success",children:"Result"}),n&&f.jsx("span",{className:"text-[11px] font-mono text-muted-foreground",children:n}),l&&f.jsx("span",{className:"text-[10px] font-mono text-muted-foreground/60 ml-auto shrink-0",children:l})]}),s&&f.jsx("div",{className:"p-3 bg-card/50 border-t border-success/30",children:f.jsx(It,{data:o})})]})}function ab({modelId:n,provider:l,input:o,providerOptions:s,usage:u}){var m,h;const c=((m=o==null?void 0:o.tools)==null?void 0:m.length)??0,p=[];if((o==null?void 0:o.temperature)!=null&&p.push({label:"temp",value:String(o.temperature)}),(o==null?void 0:o.maxOutputTokens)!=null&&p.push({label:"max tokens",value:String(o.maxOutputTokens)}),(o==null?void 0:o.topP)!=null&&p.push({label:"topP",value:String(o.topP)}),(o==null?void 0:o.topK)!=null&&p.push({label:"topK",value:String(o.topK)}),(o==null?void 0:o.toolChoice)!=null){const y=typeof o.toolChoice=="string"?o.toolChoice:o.toolChoice.type;p.push({label:"tool choice",value:y})}return f.jsxs("div",{className:"flex items-center gap-2 px-4 py-2 bg-muted/20 border-b border-border text-[11px] text-muted-foreground",children:[l&&f.jsx("span",{className:"px-1.5 py-0.5 rounded bg-sidebar-primary/10 text-sidebar-primary text-[10px] font-medium",children:l}),f.jsx("span",{className:"font-mono",children:n}),p.length>0&&f.jsxs(f.Fragment,{children:[f.jsx("span",{className:"text-muted-foreground/30",children:"·"}),p.map((y,v)=>f.jsxs("span",{children:[y.label,": ",f.jsx("span",{className:"text-foreground",children:y.value}),v<p.length-1&&f.jsx("span",{className:"text-muted-foreground/30 mx-1",children:"·"})]},v))]}),c>0&&f.jsxs(f.Fragment,{children:[f.jsx("span",{className:"text-muted-foreground/30",children:"·"}),f.jsxs(Fi,{direction:"right",children:[f.jsx(Wi,{asChild:!0,children:f.jsxs("button",{className:"inline-flex items-center gap-1 hover:text-foreground transition-colors cursor-pointer",children:[f.jsx(kr,{className:"size-3"}),c," available ",c===1?"tool":"tools"]})}),f.jsxs(Bi,{className:"h-full w-[800px] sm:max-w-[800px] overflow-hidden",children:[f.jsx(Hi,{className:"border-b border-border shrink-0",children:f.jsxs(Vi,{children:["Available Tools (",c,")"]})}),f.jsx("div",{className:"flex-1 overflow-y-auto p-4",children:f.jsx("div",{className:"space-y-3",children:(h=o==null?void 0:o.tools)==null?void 0:h.map((y,v)=>f.jsx(lb,{tool:y},v))})})]})]})]}),s&&Object.keys(s).length>0&&f.jsxs(f.Fragment,{children:[f.jsx("span",{className:"text-muted-foreground/30",children:"·"}),f.jsxs(Fi,{direction:"right",children:[f.jsx(Wi,{asChild:!0,children:f.jsxs("button",{className:"inline-flex items-center gap-1 hover:text-foreground transition-colors cursor-pointer",children:[f.jsx(y0,{className:"size-3"}),"Provider options"]})}),f.jsxs(Bi,{className:"h-full w-[800px] sm:max-w-[800px] overflow-hidden",children:[f.jsx(Hi,{className:"border-b border-border shrink-0",children:f.jsx(Vi,{children:"Provider Options"})}),f.jsx("div",{className:"flex-1 overflow-y-auto p-4",children:f.jsx(It,{data:s,size:"lg"})})]})]})]}),u&&f.jsxs(f.Fragment,{children:[f.jsx("span",{className:"text-muted-foreground/30",children:"·"}),f.jsxs(Fi,{direction:"right",children:[f.jsx(Wi,{asChild:!0,children:f.jsxs("button",{className:"inline-flex items-center gap-1 hover:text-foreground transition-colors cursor-pointer",children:[f.jsx(o0,{className:"size-3"}),"Usage"]})}),f.jsxs(Bi,{className:"h-full w-[800px] sm:max-w-[800px] overflow-hidden",children:[f.jsx(Hi,{className:"border-b border-border shrink-0",children:f.jsx(Vi,{children:"Token Usage"})}),f.jsx("div",{className:"flex-1 overflow-y-auto p-4",children:f.jsx(ob,{usage:u})})]})]})]})]})}function zh({className:n,...l}){return f.jsx("div",{"data-slot":"card",className:fn("bg-card text-card-foreground flex flex-col gap-6 rounded-xl border py-6 shadow-sm",n),...l})}var ps="Collapsible",[ub,Pb]=cl(ps),[cb,Zu]=ub(ps),Ih=w.forwardRef((n,l)=>{const{__scopeCollapsible:o,open:s,defaultOpen:u,disabled:c,onOpenChange:p,...m}=n,[h,y]=Uu({prop:s,defaultProp:u??!1,onChange:p,caller:ps});return f.jsx(cb,{scope:o,disabled:c,contentId:ol(),open:h,onOpenToggle:w.useCallback(()=>y(v=>!v),[y]),children:f.jsx(He.div,{"data-state":ec(h),"data-disabled":c?"":void 0,...m,ref:l})})});Ih.displayName=ps;var $h="CollapsibleTrigger",Fh=w.forwardRef((n,l)=>{const{__scopeCollapsible:o,...s}=n,u=Zu($h,o);return f.jsx(He.button,{type:"button","aria-controls":u.contentId,"aria-expanded":u.open||!1,"data-state":ec(u.open),"data-disabled":u.disabled?"":void 0,disabled:u.disabled,...s,ref:l,onClick:Be(n.onClick,u.onOpenToggle)})});Fh.displayName=$h;var Ju="CollapsibleContent",Wh=w.forwardRef((n,l)=>{const{forceMount:o,...s}=n,u=Zu(Ju,n.__scopeCollapsible);return f.jsx(Zt,{present:o||u.open,children:({present:c})=>f.jsx(db,{...s,ref:l,present:c})})});Wh.displayName=Ju;var db=w.forwardRef((n,l)=>{const{__scopeCollapsible:o,present:s,children:u,...c}=n,p=Zu(Ju,o),[m,h]=w.useState(s),y=w.useRef(null),v=rt(l,y),x=w.useRef(0),S=x.current,C=w.useRef(0),P=C.current,k=p.open||m,E=w.useRef(k),A=w.useRef(void 0);return w.useEffect(()=>{const D=requestAnimationFrame(()=>E.current=!1);return()=>cancelAnimationFrame(D)},[]),cn(()=>{const D=y.current;if(D){A.current=A.current||{transitionDuration:D.style.transitionDuration,animationName:D.style.animationName},D.style.transitionDuration="0s",D.style.animationName="none";const $=D.getBoundingClientRect();x.current=$.height,C.current=$.width,E.current||(D.style.transitionDuration=A.current.transitionDuration,D.style.animationName=A.current.animationName),h(s)}},[p.open,s]),f.jsx(He.div,{"data-state":ec(p.open),"data-disabled":p.disabled?"":void 0,id:p.contentId,hidden:!k,...c,ref:v,style:{"--radix-collapsible-content-height":S?`${S}px`:void 0,"--radix-collapsible-content-width":P?`${P}px`:void 0,...n.style},children:k&&u})});function ec(n){return n?"open":"closed"}var fb=Ih;function pb({...n}){return f.jsx(fb,{"data-slot":"collapsible",...n})}function mb({...n}){return f.jsx(Fh,{"data-slot":"collapsible-trigger",...n})}function hb({...n}){return f.jsx(Wh,{"data-slot":"collapsible-content",...n})}function gb({input:n}){const l=(n==null?void 0:n.prompt)??[],o=l.length,s=l.slice(-2),u=Math.max(0,o-2);return f.jsxs(Fi,{direction:"right",children:[f.jsx(Wi,{asChild:!0,children:f.jsxs("button",{className:"w-full h-full text-left p-4 hover:bg-accent/30 transition-colors cursor-pointer flex flex-col justify-start",children:[f.jsx("h3",{className:"text-[11px] font-semibold uppercase tracking-wider text-muted-foreground mb-3",children:"Input"}),f.jsxs("div",{className:"space-y-3",children:[u>0&&f.jsxs("div",{className:"text-[11px] text-muted-foreground/60 text-center py-1.5 rounded-md bg-muted/30",children:["+ ",u," previous"," ",u===1?"message":"messages"]}),s.map((c,p)=>f.jsx(vb,{message:c,index:u+p+1},p)),o===0&&f.jsx("p",{className:"text-sm text-muted-foreground",children:"No messages"})]})]})}),f.jsxs(Bi,{className:"h-full w-[800px] sm:max-w-[800px] overflow-hidden",children:[f.jsx(Hi,{className:"border-b border-border shrink-0",children:f.jsxs(Vi,{children:["All Messages (",o,")"]})}),f.jsx("div",{className:"flex-1 overflow-y-auto p-4",children:f.jsx("div",{className:"space-y-3",children:l.map((c,p)=>f.jsx(yb,{message:c,index:p+1},p))})})]})]})}function Bh(n){return typeof n=="string"?n:Array.isArray(n)?n.filter(l=>l.type==="text").map(l=>l.text).join(""):""}function Hh(n){return Array.isArray(n)?n.filter(l=>l.type==="tool-call"):[]}function Vh(n){return Array.isArray(n)?n.filter(l=>l.type==="tool-result"):[]}function Uh(n){return Array.isArray(n)?n.filter(l=>l.type==="thinking"||l.type==="reasoning").map(l=>l.thinking||l.text||l.reasoning||"").join(""):""}function vb({message:n,index:l}){const{role:o,content:s}=n,u={user:"User",assistant:"Assistant",system:"System",tool:"Tool"},c=Bh(s),p=Hh(s),m=Vh(s),h=Uh(s),y=(c?1:0)+(h?1:0)+p.length+m.length;return f.jsxs("div",{className:"rounded-md border border-border/50 bg-background/50 p-2.5 space-y-2",children:[f.jsxs("div",{className:"flex items-center gap-2",children:[l&&f.jsx("span",{className:"text-[10px] font-mono text-muted-foreground/50",children:l}),f.jsx("span",{className:"text-[10px] font-medium uppercase tracking-wider text-muted-foreground",children:u[o]||o}),y>1&&f.jsxs("span",{className:"text-[10px] text-muted-foreground/60",children:[y," parts"]})]}),h&&f.jsx("div",{className:"text-xs text-amber-500/60",children:"[thinking]"}),c&&f.jsx("div",{className:"text-xs text-foreground/90 line-clamp-3",children:c}),p.length>0&&f.jsxs("div",{className:"space-y-1",children:[p.slice(0,3).map((v,x)=>{const S=v.args??v.input,C=typeof S=="string"?rr(S):S??{};return f.jsxs("div",{className:"text-[11px] font-mono text-muted-foreground truncate",children:[v.toolName,"(",d1(C),")"]},x)}),p.length>3&&f.jsxs("div",{className:"text-[11px] text-muted-foreground/60",children:["+",p.length-3," more tool"," ",p.length-3===1?"call":"calls"]})]}),m.length>0&&f.jsxs("div",{className:"space-y-1",children:[m.slice(0,3).map((v,x)=>{const S=v.result??v.output??v,C=f1(S);return f.jsxs("div",{className:"text-[11px] font-mono text-muted-foreground truncate",children:[v.toolName||"tool","(…) => ",C]},x)}),m.length>3&&f.jsxs("div",{className:"text-[11px] text-muted-foreground/60",children:["+",m.length-3," more tool"," ",m.length-3===1?"result":"results"]})]}),!c&&!h&&p.length===0&&m.length===0&&f.jsx("div",{className:"text-[11px] text-muted-foreground italic",children:"Empty message"})]})}function yb({message:n,index:l}){const{role:o,content:s}=n,u={user:"User",assistant:"Assistant",system:"System",tool:"Tool"},c=Bh(s),p=Hh(s),m=Vh(s),h=Uh(s),y=(c?1:0)+(h?1:0)+p.length+m.length;return f.jsxs("div",{className:"rounded-md border border-border/50 bg-background/50 p-3 space-y-2",children:[f.jsxs("div",{className:"flex items-center gap-2",children:[l&&f.jsx("span",{className:"text-[10px] font-mono text-muted-foreground/50",children:l}),f.jsx("span",{className:"text-[10px] font-medium uppercase tracking-wider text-muted-foreground",children:u[o]||o}),y>1&&f.jsxs("span",{className:"text-[10px] text-muted-foreground/60",children:[y," parts"]})]}),h&&f.jsx(Dh,{content:h}),c&&f.jsx(Lh,{content:c,defaultExpanded:!h&&p.length===0&&m.length===0,isSystem:o==="system"}),p.length>0&&f.jsx("div",{className:"space-y-2",children:p.map((v,x)=>f.jsx(ib,{toolName:v.toolName,toolCallId:v.toolCallId,data:v.args??v.input},x))}),m.length>0&&f.jsx("div",{className:"space-y-2",children:m.map((v,x)=>f.jsx(sb,{toolName:v.toolName,toolCallId:v.toolCallId,data:v.result??v.output??v},x))}),!c&&!h&&p.length===0&&m.length===0&&f.jsx("div",{className:"text-[11px] text-muted-foreground italic",children:"Empty message"})]})}function xb({output:n,toolResults:l=[]}){var y,v,x;const o=S=>l.find(C=>C.type==="tool-result"&&"toolCallId"in C&&C.toolCallId===S),s=(n==null?void 0:n.toolCalls)||(((y=n==null?void 0:n.content)==null?void 0:y.filter(S=>S.type==="tool-call"))??[]),u=(n==null?void 0:n.textParts)||(((v=n==null?void 0:n.content)==null?void 0:v.filter(S=>S.type==="text"))??[]),c=(n==null?void 0:n.reasoningParts)||(((x=n==null?void 0:n.content)==null?void 0:x.filter(S=>S.type==="thinking"||S.type==="reasoning"))??[]),p=u.map(S=>S.text).join(""),m=c.map(S=>S.text||S.thinking||S.reasoning||"").join(""),h=p&&!m&&s.length===0;return f.jsxs("div",{className:"space-y-3",children:[m&&f.jsx(Dh,{content:m}),p&&f.jsx(Lh,{content:p,defaultExpanded:!!h}),s.map((S,C)=>{const P=S.toolCallId?o(S.toolCallId):void 0;return f.jsx(wb,{toolName:S.toolName,args:S.args??S.input,result:(P==null?void 0:P.output)??(P==null?void 0:P.result)},C)})]})}function wb({toolName:n,args:l,result:o}){const[s,u]=w.useState(!1),c=typeof l=="string"?rr(l):l,p=typeof o=="string"?rr(o):o;return f.jsxs("div",{className:"rounded-md border border-purple/30 overflow-hidden",children:[f.jsxs("button",{className:"w-full flex items-center gap-2 px-3 py-2 bg-purple/10 hover:bg-purple/20 transition-colors",onClick:()=>u(!s),children:[f.jsx(or,{className:`size-3 text-purple transition-transform shrink-0 ${s?"rotate-90":""}`}),f.jsx(kr,{className:"size-3 text-purple shrink-0"}),f.jsx("span",{className:"text-xs font-mono font-medium text-purple",children:n}),!s&&c&&typeof c=="object"&&!Array.isArray(c)&&f.jsx("span",{className:"text-[11px] font-mono text-purple/70 truncate",children:qm(c)})]}),s&&f.jsxs(f.Fragment,{children:[f.jsxs("div",{className:"p-3 bg-card/50 border-t border-purple/30",children:[f.jsx("div",{className:"text-[10px] font-medium uppercase tracking-wider text-muted-foreground mb-2",children:"Input"}),f.jsx(It,{data:c})]}),p!=null&&f.jsxs("div",{className:"p-3 border-t border-border bg-success/5",children:[f.jsx("div",{className:"text-[10px] font-medium uppercase tracking-wider text-success mb-2",children:"Output"}),f.jsx(It,{data:p})]})]})]})}function Yh({step:n,index:l,steps:o,isRunInProgress:s,expandedSteps:u,toggleStep:c,parseJson:p,formatDuration:m,childRuns:h,depth:y}){const v=u.has(n.id),S=l===o.length-1&&s,C=p(n.input),P=p(n.output),k=p(n.usage),E=c1(P,n.error),D=u1(C,l===0);return f.jsx(pb,{open:v,onOpenChange:()=>c(n.id),children:f.jsxs(zh,{className:`overflow-hidden py-0 gap-0 ${S?"ring-2 ring-blue-500/50 ring-offset-1 ring-offset-background":""}`,children:[f.jsx(mb,{asChild:!0,children:f.jsxs("button",{className:`w-full flex items-center justify-between px-4 py-3 text-left transition-colors hover:bg-accent/50 ${v?"border-b border-border":""}`,children:[f.jsxs("div",{className:"flex items-center gap-3",children:[f.jsx("span",{className:"text-xs text-muted-foreground font-mono w-4",children:n.step_number}),f.jsxs("div",{className:"flex items-center gap-2",children:[D&&f.jsxs(f.Fragment,{children:[D.type==="user"?f.jsx(lo,{className:"size-3.5 text-muted-foreground"}):f.jsx(kr,{className:"size-3.5 text-muted-foreground"}),D.fullText||D.toolDetails?f.jsxs(to,{children:[f.jsx(no,{asChild:!0,children:f.jsx("span",{className:`text-sm text-muted-foreground ${D.type==="tool"?"font-mono":""}`,children:D.label})}),f.jsx(ro,{side:"bottom",className:"max-w-sm max-h-40 overflow-hidden",children:f.jsx("span",{className:"line-clamp-6",children:D.fullText||D.toolDetails})})]}):f.jsx("span",{className:`text-sm text-muted-foreground ${D.type==="tool"?"font-mono":""}`,children:D.label}),f.jsx("span",{className:"text-muted-foreground/50 mx-1",children:"→"})]}),E.icon==="wrench"&&f.jsx(kr,{className:"size-3.5 text-muted-foreground"}),E.icon==="message"&&f.jsx(lo,{className:"size-3.5 text-muted-foreground"}),E.icon==="alert"&&f.jsx(ns,{className:"size-3.5 text-destructive"}),E.toolDetails?f.jsxs(to,{children:[f.jsx(no,{asChild:!0,children:f.jsx("span",{className:"text-sm font-medium font-mono",children:E.label})}),f.jsx(ro,{children:E.toolDetails})]}):f.jsx("span",{className:`text-sm font-medium ${E.icon==="wrench"?"font-mono":""}`,children:E.label})]})]}),f.jsxs("div",{className:"flex items-center gap-4",children:[S?f.jsxs("span",{className:"text-[11px] text-blue-400 font-medium flex items-center gap-1.5",children:[f.jsx(il,{className:"size-3 animate-spin"}),"streaming"]}):f.jsx("span",{className:"text-[11px] text-muted-foreground font-mono",children:m(n.duration_ms)}),k&&f.jsxs(to,{children:[f.jsx(no,{asChild:!0,children:f.jsxs("span",{className:"text-[11px] font-mono text-muted-foreground cursor-help",children:[Gm(Ji(k.inputTokens))," ",f.jsx("span",{className:"text-muted-foreground/50",children:"→"})," ",Km(es(k.outputTokens))]})}),f.jsx(ro,{children:f.jsx(Mh,{input:Ji(k.inputTokens),output:es(k.outputTokens),raw:k.raw})})]}),f.jsx(u0,{className:`size-4 text-muted-foreground transition-transform ${v?"rotate-180":""}`})]})]})}),f.jsx(hb,{children:f.jsx(Xh,{step:n,index:l,steps:o,isRunInProgress:s,parseJson:p,formatDuration:m,childRuns:h,expandedSteps:u,toggleStep:c,depth:y})})]})})}function Xh({step:n,index:l,steps:o,isRunInProgress:s,parseJson:u,formatDuration:c,childRuns:p,expandedSteps:m,toggleStep:h,depth:y}){var D,$;const x=l===o.length-1&&s,S=u(n.input),C=u(n.output),P=u(n.usage),k=o[l+1],E=k?u(k.input):null,A=(($=(D=E==null?void 0:E.prompt)==null?void 0:D.filter(N=>N.role==="tool"))==null?void 0:$.flatMap(N=>Array.isArray(N.content)?N.content:[]))??[];return f.jsxs(f.Fragment,{children:[f.jsx(ab,{modelId:n.model_id,provider:n.provider,input:S,providerOptions:u(n.provider_options),usage:P}),f.jsxs("div",{className:"grid grid-cols-2 divide-x divide-border",children:[f.jsx("div",{className:"bg-card/50",children:f.jsx(gb,{input:S})}),f.jsxs("div",{className:"p-4 bg-background min-h-full",children:[f.jsx("h3",{className:"text-[11px] font-semibold uppercase tracking-wider text-muted-foreground mb-3",children:"Output"}),n.error?f.jsx("div",{className:"p-3 rounded-md bg-destructive/10 border border-destructive/30 text-sm text-destructive-foreground font-mono",children:n.error}):C?f.jsx(xb,{output:C,toolResults:A}):x?f.jsxs("div",{className:"flex items-center gap-2 text-sm text-blue-400",children:[f.jsx(il,{className:"size-4 animate-spin"}),f.jsx("span",{children:"Waiting for response..."})]}):f.jsx("p",{className:"text-sm text-muted-foreground",children:"No output"})]})]}),p.length>0&&m&&h&&f.jsx(Sb,{childRuns:p,expandedSteps:m,toggleStep:h,parseJson:u,formatDuration:c,depth:y}),f.jsx(rb,{rawRequest:n.raw_request,rawResponse:n.raw_response,rawChunks:n.raw_chunks,isStream:n.type==="stream"})]})}function Sb({childRuns:n,expandedSteps:l,toggleStep:o,parseJson:s,formatDuration:u,depth:c}){return f.jsxs("div",{className:"border-t border-border bg-muted/10",children:[f.jsxs("div",{className:"px-4 py-2 flex items-center gap-2",children:[f.jsx("div",{className:"h-px flex-1 bg-border"}),f.jsxs("span",{className:"text-[10px] font-medium uppercase tracking-wider text-muted-foreground shrink-0",children:["Sub-agent ",n.length===1?"call":"calls"," (",n.length,")"]}),f.jsx("div",{className:"h-px flex-1 bg-border"})]}),f.jsx("div",{className:"px-4 pb-3 flex flex-col gap-2",children:n.map(p=>f.jsx(bb,{childRun:p,expandedSteps:l,toggleStep:o,parseJson:s,formatDuration:u,depth:c+1},p.run.id))})]})}function bb({childRun:n,expandedSteps:l,toggleStep:o,parseJson:s,formatDuration:u,depth:c}){var k;const[p,m]=w.useState(!1),h=n.steps[0],y=h?s(h.input):null,x=[...(y==null?void 0:y.prompt)??[]].reverse().find(E=>E.role==="user");let S="Sub-agent call";if(x){const E=typeof x.content=="string"?x.content:Array.isArray(x.content)&&((k=x.content.find(A=>A.type==="text"))==null?void 0:k.text)||"";S=E.length>60?E.slice(0,60)+"...":E}const C=n.steps.reduce((E,A)=>E+(A.duration_ms||0),0),P=h==null?void 0:h.model_id;return f.jsxs("div",{className:"rounded-md border border-cyan-500/30 overflow-hidden",children:[f.jsxs("button",{className:"w-full flex items-center gap-2 px-3 py-2 bg-cyan-500/10 hover:bg-cyan-500/15 transition-colors",onClick:()=>m(!p),children:[f.jsx(or,{className:`size-3 text-cyan-400 transition-transform shrink-0 ${p?"rotate-90":""}`}),f.jsx(ll,{className:"size-3 text-cyan-400 shrink-0"}),f.jsx("span",{className:"text-xs font-medium text-cyan-400 truncate",children:S}),f.jsxs("span",{className:"ml-auto flex items-center gap-3 shrink-0",children:[P&&f.jsx("span",{className:"text-[10px] font-mono text-muted-foreground",children:P}),f.jsxs("span",{className:"text-[10px] text-muted-foreground",children:[n.steps.length," ",n.steps.length===1?"step":"steps"]}),f.jsx("span",{className:"text-[10px] font-mono text-muted-foreground",children:u(C)}),n.run.isInProgress&&f.jsx(il,{className:"size-3 text-blue-400 animate-spin"})]})]}),p&&f.jsx("div",{className:"border-t border-cyan-500/20 bg-background/50 p-3 flex flex-col gap-2",children:n.steps.map((E,A)=>{const D=(n.childRuns??[]).filter($=>$.run.parent_step_id===E.id);return f.jsx(Yh,{step:E,index:A,steps:n.steps,isRunInProgress:n.run.isInProgress??!1,expandedSteps:l,toggleStep:o,parseJson:s,formatDuration:u,childRuns:D,depth:c},E.id)})})]})}function Cb({runDetail:n,parseJson:l,formatDuration:o}){const[s,u]=w.useState(null),[c,p]=w.useState(280),m=w.useRef(!1),h=w.useMemo(()=>h1(n,l),[n,l]),y=w.useMemo(()=>{const R=[];function W(Q,ee){R.push(...Q);for(const ce of ee)W(ce.steps,ce.childRuns??[])}return W(n.steps,n.childRuns??[]),R},[n]),v=w.useMemo(()=>{const R=[];function W(Q){for(const ee of Q)R.push(ee),W(ee.childRuns??[])}return W(n.childRuns??[]),R},[n]),x=w.useCallback(R=>{R.preventDefault(),R.stopPropagation(),m.current=!0;const W=R.clientX,Q=c,ee=U=>{if(!m.current)return;const q=Math.min(Math.max(Q+(U.clientX-W),120),600);p(q)},ce=()=>{m.current=!1,document.removeEventListener("mousemove",ee),document.removeEventListener("mouseup",ce),document.body.style.cursor="",document.body.style.userSelect=""};document.addEventListener("mousemove",ee),document.addEventListener("mouseup",ce),document.body.style.cursor="col-resize",document.body.style.userSelect="none"},[c]);if(h.length===0)return null;const S=Math.max(...h.map(R=>R.startMs+R.durationMs),1),C=5,P=Array.from({length:C+1},(R,W)=>{const Q=S/C*W;return{ms:Q,label:Q<1e3?`${Math.round(Q)}ms`:`${(Q/1e3).toFixed(1)}s`}}),k=28,E=R=>{u(W=>W===R?null:R)},A=s?h.find(R=>R.id===s):null,D=(A==null?void 0:A.stepId)??s,$=D?y.find(R=>R.id===D):null,N=$?(()=>{if(n.steps.find(W=>W.id===$.id))return n.steps.findIndex(W=>W.id===$.id);const R=v.find(W=>W.steps.some(Q=>Q.id===$.id));return(R==null?void 0:R.steps.findIndex(W=>W.id===$.id))??0})():0,F=$?(()=>{if(n.steps.find(W=>W.id===$.id))return n.steps;const R=v.find(W=>W.steps.some(Q=>Q.id===$.id));return(R==null?void 0:R.steps)??n.steps})():n.steps,V=$?v.filter(R=>R.run.parent_step_id===$.id):[],L=R=>{switch(R){case"child-run":return f.jsx(ll,{className:"size-3 text-cyan-400 shrink-0"});case"thinking":return f.jsx(ll,{className:"size-3 text-amber-500 shrink-0"});case"tool-call":return f.jsx(kr,{className:"size-3 text-purple-400 shrink-0"});case"text":return f.jsx(lo,{className:"size-3 text-emerald-400 shrink-0"});case"error":return f.jsx(ns,{className:"size-3 text-red-400 shrink-0"});default:return f.jsx(Dp,{className:"size-3 text-blue-400 shrink-0"})}};return f.jsxs("div",{className:"space-y-4",children:[f.jsxs("div",{className:"rounded-lg border border-border bg-card overflow-hidden",children:[f.jsxs("div",{className:"px-4 py-2 border-b border-border bg-muted/20 flex items-center justify-between",children:[f.jsx("span",{className:"text-[11px] font-medium uppercase tracking-wider text-muted-foreground",children:"Trace Timeline"}),f.jsx("span",{className:"text-[11px] font-mono text-muted-foreground",children:o(S)})]}),f.jsx("div",{className:"overflow-x-auto",children:f.jsxs("div",{style:{minWidth:c+400},children:[f.jsxs("div",{className:"flex border-b border-border/50",style:{height:22},children:[f.jsx("div",{style:{width:c,minWidth:c},className:"shrink-0"}),f.jsx("div",{className:"w-1 shrink-0 cursor-col-resize hover:bg-primary/30",onMouseDown:x}),f.jsx("div",{className:"flex-1 relative",children:P.map((R,W)=>f.jsx("span",{className:"absolute text-[9px] font-mono text-muted-foreground/60 -translate-x-1/2",style:{left:`${R.ms/S*100}%`,top:5},children:R.label},W))})]}),h.map(R=>{const W=R.startMs/S*100,Q=Math.max(R.durationMs/S*100,.3),ee=s===R.id;return f.jsxs("div",{className:`flex items-center border-b border-border/30 transition-colors cursor-pointer ${ee?"bg-accent":"hover:bg-accent/30"}`,style:{height:k},onClick:()=>E(R.id),children:[f.jsxs("div",{className:"shrink-0 flex items-center gap-1.5 px-2 overflow-hidden",style:{width:c,minWidth:c,paddingLeft:8+R.depth*16},children:[L(R.kind),f.jsx("span",{className:"text-[11px] font-mono text-foreground truncate",children:R.label}),R.sublabel&&f.jsx("span",{className:"text-[10px] text-muted-foreground truncate",children:R.sublabel}),f.jsx("span",{className:"ml-auto text-[10px] font-mono text-muted-foreground shrink-0 pl-1",children:o(R.durationMs||null)}),R.tokens&&f.jsxs("span",{className:"text-[9px] font-mono text-muted-foreground/60 shrink-0",children:[R.tokens.input,"→",R.tokens.output]})]}),f.jsx("div",{className:"w-1 shrink-0 cursor-col-resize hover:bg-primary/30 self-stretch",onMouseDown:x}),f.jsxs("div",{className:"flex-1 relative h-full",children:[P.map((ce,U)=>f.jsx("div",{className:"absolute top-0 bottom-0 border-l border-border/20",style:{left:`${ce.ms/S*100}%`}},U)),f.jsxs(to,{children:[f.jsx(no,{asChild:!0,children:f.jsx("div",{className:"absolute top-1 bottom-1 flex items-center cursor-pointer",style:{left:`${W}%`,width:`${Q}%`,minWidth:3},children:f.jsx("div",{className:`h-full w-full rounded-sm ${ee?"ring-2 ring-foreground/50 ring-offset-1 ring-offset-background":""} ${R.isInProgress?`${m1[R.kind]} animate-pulse`:p1[R.kind]}`})})}),f.jsx(ro,{side:"top",className:"max-w-xs",children:f.jsxs("div",{className:"text-xs space-y-1",children:[f.jsx("div",{className:"font-medium",children:R.label}),R.sublabel&&f.jsx("div",{className:"text-muted-foreground",children:R.sublabel}),R.modelId&&R.modelId!==R.label&&f.jsx("div",{className:"text-muted-foreground font-mono",children:R.modelId}),f.jsxs("div",{className:"text-muted-foreground font-mono",children:[o(R.durationMs||null),R.tokens&&f.jsxs("span",{className:"ml-2",children:[R.tokens.input," in → ",R.tokens.output," ","out"]})]}),f.jsxs("div",{className:"text-muted-foreground/60 pt-0.5",children:["Click to ",ee?"deselect":"view details"]})]})})]})]})]},R.id)})]})})]}),$&&A&&f.jsxs(zh,{className:"overflow-hidden py-0 gap-0",children:[f.jsxs("div",{className:"flex items-center justify-between px-4 py-2.5 bg-muted/20 border-b border-border",children:[f.jsxs("div",{className:"flex items-center gap-2",children:[L(A.kind),f.jsxs("span",{className:"text-xs text-muted-foreground font-mono",children:["Step ",N+1]}),A.kind!=="step"&&f.jsx(gu,{variant:"secondary",className:"text-[10px] h-5 capitalize",children:A.kind}),f.jsx("span",{className:"text-xs font-medium font-mono",children:A.label}),$.provider&&f.jsx("span",{className:"px-1.5 py-0.5 rounded bg-sidebar-primary/10 text-sidebar-primary text-[10px] font-medium",children:$.provider})]}),f.jsx("button",{onClick:()=>u(null),className:"text-[11px] text-muted-foreground hover:text-foreground transition-colors",children:"Deselect"})]}),f.jsx(kb,{span:A,step:$,stepIndex:N,steps:F,runDetail:n,parseJson:l,formatDuration:o,childRuns:V})]})]})}function kb({span:n,step:l,stepIndex:o,steps:s,runDetail:u,parseJson:c,formatDuration:p,childRuns:m}){const h=c(l.output),y=(h==null?void 0:h.content)??[];if(n.kind==="tool-call"&&n.toolCallId){const v=y.find(E=>E.type==="tool-call"&&"toolCallId"in E&&E.toolCallId===n.toolCallId),x=y.find(E=>E.type==="tool-result"&&"toolCallId"in E&&E.toolCallId===n.toolCallId),S=(v==null?void 0:v.input)??(v==null?void 0:v.args),C=typeof S=="string"?rr(S):S,P=(x==null?void 0:x.output)??(x==null?void 0:x.result),k=typeof P=="string"?rr(P):P;return f.jsxs("div",{className:"p-4 space-y-4",children:[f.jsxs("div",{className:"flex items-center gap-2 mb-1",children:[f.jsx(kr,{className:"size-4 text-purple-400"}),f.jsx("span",{className:"text-sm font-mono font-medium text-purple-400",children:n.label})]}),C!=null&&f.jsxs("div",{children:[f.jsx("h4",{className:"text-[11px] font-semibold uppercase tracking-wider text-muted-foreground mb-2",children:"Input"}),f.jsx(It,{data:C})]}),k!=null&&f.jsxs("div",{children:[f.jsx("h4",{className:"text-[11px] font-semibold uppercase tracking-wider text-success mb-2",children:"Output"}),f.jsx(It,{data:k})]}),!C&&!k&&f.jsx("p",{className:"text-sm text-muted-foreground",children:"No data available for this tool call."})]})}return n.kind==="thinking"&&n.thinkingText?f.jsxs("div",{className:"p-4 space-y-2",children:[f.jsxs("div",{className:"flex items-center gap-2 mb-1",children:[f.jsx(ll,{className:"size-4 text-amber-500"}),f.jsx("span",{className:"text-sm font-medium text-amber-500",children:"Thinking"})]}),f.jsx("div",{className:"text-sm text-foreground/80 leading-relaxed whitespace-pre-wrap rounded-md border border-amber-500/20 bg-amber-500/5 p-3",children:n.thinkingText})]}):n.kind==="text"&&n.textContent?f.jsxs("div",{className:"p-4 space-y-2",children:[f.jsxs("div",{className:"flex items-center gap-2 mb-1",children:[f.jsx(lo,{className:"size-4 text-emerald-400"}),f.jsx("span",{className:"text-sm font-medium text-emerald-400",children:"Text Response"})]}),f.jsx("div",{className:"text-sm text-foreground/80 leading-relaxed whitespace-pre-wrap rounded-md border border-border bg-background p-3",children:n.textContent})]}):n.kind==="error"?f.jsxs("div",{className:"p-4 space-y-2",children:[f.jsxs("div",{className:"flex items-center gap-2 mb-1",children:[f.jsx(ns,{className:"size-4 text-red-400"}),f.jsx("span",{className:"text-sm font-medium text-red-400",children:"Error"})]}),f.jsx("div",{className:"text-sm text-destructive-foreground font-mono whitespace-pre-wrap rounded-md border border-destructive/30 bg-destructive/10 p-3",children:l.error})]}):f.jsx(Xh,{step:l,index:o,steps:s,isRunInProgress:u.run.isInProgress??!1,parseJson:c,formatDuration:p,childRuns:m,depth:0})}function Eb(){const[n,l]=w.useState([]),[o,s]=w.useState(null),[u,c]=w.useState(new Set),[p,m]=w.useState(!0),[h,y]=w.useState(!1),v=async()=>{try{const F=await(await fetch("/api/runs")).json();l(F)}catch(N){console.error("Failed to fetch runs:",N)}finally{m(!1)}},x=async()=>{await fetch("/api/clear",{method:"POST"}),l([]),s(null)};w.useEffect(()=>{v()},[]),w.useEffect(()=>{let N=null,F=null;const V=()=>{N=new EventSource("/api/events"),N.addEventListener("connected",()=>{console.log("[DevTools] Connected to real-time updates")}),N.addEventListener("update",()=>{v(),o&&fetch(`/api/runs/${o.run.id}`).then(L=>L.json()).then(L=>{L&&!L.error&&s(L)}).catch(()=>{})}),N.addEventListener("heartbeat",()=>{}),N.onerror=()=>{console.log("[DevTools] SSE connection lost, reconnecting..."),N==null||N.close(),F=setTimeout(V,2e3)}};return V(),()=>{N==null||N.close(),F&&clearTimeout(F)}},[o==null?void 0:o.run.id]);const S=async N=>{const V=await(await fetch(`/api/runs/${N}`)).json();s(V),c(new Set)},C=N=>{c(F=>{const V=new Set(F);return V.has(N)?V.delete(N):V.add(N),V})},P=N=>N===null?"-":N<1e3?`${N}ms`:`${(N/1e3).toFixed(2)}s`,k=N=>{if(!N)return null;try{return JSON.parse(N)}catch{return N}},E=N=>{var R,W;const F=N[0];if(!F)return"Empty run";const V=k(F.input),L=(R=V==null?void 0:V.prompt)==null?void 0:R.find(Q=>Q.role==="user");if(L){const Q=typeof L.content=="string"?L.content:Array.isArray(L.content)&&((W=L.content.find(ee=>ee.type==="text"))==null?void 0:W.text)||"";return Q.slice(0,50)+(Q.length>50?"...":"")}return"No user message"},A=N=>N.some(F=>F.error),D=N=>N.reduce((F,V)=>F+(V.duration_ms||0),0),$=N=>N.reduce((F,V)=>{const L=k(V.usage),R=Ji(L==null?void 0:L.inputTokens),W=es(L==null?void 0:L.outputTokens),Q={total:F.input.total+R.total};(F.input.noCache!==void 0||R.noCache!==void 0)&&(Q.noCache=(F.input.noCache??0)+(R.noCache??0)),(F.input.cacheRead!==void 0||R.cacheRead!==void 0)&&(Q.cacheRead=(F.input.cacheRead??0)+(R.cacheRead??0)),(F.input.cacheWrite!==void 0||R.cacheWrite!==void 0)&&(Q.cacheWrite=(F.input.cacheWrite??0)+(R.cacheWrite??0));const ee={total:F.output.total+W.total};return(F.output.text!==void 0||W.text!==void 0)&&(ee.text=(F.output.text??0)+(W.text??0)),(F.output.reasoning!==void 0||W.reasoning!==void 0)&&(ee.reasoning=(F.output.reasoning??0)+(W.reasoning??0)),{input:Q,output:ee}},{input:{total:0},output:{total:0}});return f.jsxs("div",{className:"flex flex-col h-screen bg-background",children:[f.jsxs("header",{className:"flex justify-between items-center px-5 py-3 border-b border-border bg-card",children:[f.jsxs("div",{className:"flex items-center gap-2",children:[f.jsx(C0,{}),f.jsx("span",{className:"text-base font-medium text-muted-foreground",children:"DevTools"})]}),f.jsxs("div",{className:"flex gap-2",children:[f.jsxs(Zf,{variant:"ghost",size:"sm",onClick:v,className:"h-8 px-3 text-xs",children:[f.jsx(g0,{className:"size-3.5"}),"Refresh"]}),f.jsxs(Zf,{variant:"ghost",size:"sm",onClick:x,className:"h-8 px-3 text-xs text-destructive-foreground hover:bg-destructive/20",children:[f.jsx(w0,{className:"size-3.5"}),"Clear"]})]})]}),f.jsxs("div",{className:"flex flex-1 overflow-hidden",children:[f.jsxs("aside",{className:"w-[300px] border-r border-border bg-sidebar flex flex-col",children:[f.jsx("div",{className:"px-4 py-3 border-b border-border",children:f.jsx("span",{className:"text-[11px] font-medium uppercase tracking-wider text-muted-foreground",children:"Runs"})}),f.jsx(ep,{className:"flex-1 overflow-hidden",children:p?f.jsx("p",{className:"p-4 text-muted-foreground text-sm",children:"Loading..."}):n.length===0?f.jsx("p",{className:"p-4 text-muted-foreground text-sm",children:"No runs yet"}):f.jsx("div",{children:n.map(N=>{const F=(o==null?void 0:o.run.id)===N.id;return f.jsxs("button",{className:`w-full text-left px-4 py-3 border-b border-border/50 transition-colors ${F?"bg-accent":"hover:bg-accent/50"}`,onClick:()=>S(N.id),children:[f.jsxs("div",{className:"flex items-start gap-2 mb-1.5 min-w-0",children:[N.isInProgress?f.jsx(il,{className:"size-3.5 text-blue-400 mt-0.5 shrink-0 animate-spin"}):N.hasError?f.jsx(ns,{className:"size-3.5 text-destructive-foreground mt-0.5 shrink-0"}):f.jsx(lo,{className:"size-3.5 text-muted-foreground mt-0.5 shrink-0"}),f.jsxs("div",{className:"min-w-0",children:[N.function_id&&f.jsx("span",{className:"text-[11px] font-mono text-sidebar-primary block truncate",children:N.function_id}),f.jsx("span",{className:"text-[13px] text-foreground leading-tight line-clamp-1 break-all",children:N.firstMessage||"Loading..."})]})]}),f.jsxs("div",{className:"flex items-center gap-2 ml-5.5 text-[11px] text-muted-foreground",children:[N.type&&f.jsxs("span",{className:`flex items-center gap-1 px-1.5 py-0.5 rounded text-[10px] font-medium ${N.type==="stream"?"bg-blue-500/15 text-blue-400":"bg-emerald-500/15 text-emerald-400"}`,children:[N.type==="stream"&&f.jsx(Dp,{className:"size-2.5"}),N.type]}),f.jsxs("span",{children:[N.stepCount," ",N.stepCount===1?"step":"steps"]}),f.jsx("span",{children:"·"}),f.jsx("span",{className:"font-mono",children:new Date(N.started_at).toLocaleTimeString([],{hour:"2-digit",minute:"2-digit"})})]})]},N.id)})})})]}),f.jsx("main",{className:"flex-1 overflow-hidden",children:f.jsx(ep,{className:"h-full",children:o?f.jsxs("div",{className:"p-5",children:[f.jsxs("div",{className:"flex items-center justify-between mb-5",children:[f.jsxs("div",{className:"flex items-center gap-3",children:[f.jsx("h2",{className:"text-sm font-medium text-foreground",children:E(o.steps)}),o.run.isInProgress&&f.jsxs(gu,{variant:"secondary",className:"text-[10px] h-5 gap-1.5 bg-blue-500/15 text-blue-400 border-blue-500/30",children:[f.jsx(il,{className:"size-3 animate-spin"}),"In Progress"]}),A(o.steps)&&f.jsx(gu,{variant:"destructive",className:"text-[10px] h-5",children:"Error"})]}),f.jsxs("div",{className:"flex items-center text-xs text-muted-foreground",children:[f.jsxs("span",{children:[o.steps.length," steps"]}),f.jsx("span",{className:"px-3 text-muted-foreground/30",children:"·"}),f.jsx("span",{className:"font-mono",children:P(D(o.steps))}),f.jsx("span",{className:"px-3 text-muted-foreground/30",children:"·"}),f.jsxs(to,{children:[f.jsx(no,{asChild:!0,children:f.jsxs("span",{className:"font-mono cursor-help",children:["input:"," ",Gm($(o.steps).input)," ",f.jsx("span",{className:"text-muted-foreground/50",children:"→"})," ","output:"," ",Km($(o.steps).output)]})}),f.jsx(ro,{children:f.jsx(Mh,{input:$(o.steps).input,output:$(o.steps).output})})]}),f.jsx("span",{className:"px-3 text-muted-foreground/30",children:"·"}),f.jsx("span",{children:new Date(o.run.started_at).toLocaleString()}),f.jsx("span",{className:"px-3 text-muted-foreground/30",children:"·"}),f.jsxs(to,{children:[f.jsx(no,{asChild:!0,children:f.jsxs("button",{onClick:()=>y(N=>!N),className:`inline-flex items-center gap-1.5 px-2 py-1 rounded-md text-[11px] font-medium transition-colors ${h?"bg-accent text-foreground":"text-muted-foreground hover:text-foreground hover:bg-accent/50"}`,children:[f.jsx(i0,{className:"size-3.5"}),"Timeline"]})}),f.jsx(ro,{children:h?"Switch to steps view":"Switch to timeline view"})]})]})]}),h?f.jsx(Cb,{runDetail:o,parseJson:k,formatDuration:P}):f.jsx("div",{className:"flex flex-col gap-3",children:o.steps.map((N,F)=>{const V=(o.childRuns??[]).filter(L=>L.run.parent_step_id===N.id);return f.jsx(Yh,{step:N,index:F,steps:o.steps,isRunInProgress:o.run.isInProgress??!1,expandedSteps:u,toggleStep:C,parseJson:k,formatDuration:P,childRuns:V,depth:0},N.id)})})]}):f.jsx("div",{className:"flex items-center justify-center min-h-[calc(100vh-57px)] text-muted-foreground",children:f.jsx("p",{className:"text-sm",children:"Select a run to view details"})})})})]})]})}Kv.createRoot(document.getElementById("root")).render(f.jsx(Eb,{}));
|
|
181
|
+
){opacity:0}[data-vaul-overlay][data-vaul-snap-points-overlay=true]{opacity:1}[data-vaul-handle]{display:block;position:relative;opacity:.7;background:#e2e2e4;margin-left:auto;margin-right:auto;height:5px;width:32px;border-radius:1rem;touch-action:pan-y}[data-vaul-handle]:active,[data-vaul-handle]:hover{opacity:1}[data-vaul-handle-hitarea]{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:max(100%,2.75rem);height:max(100%,2.75rem);touch-action:inherit}@media (hover:hover) and (pointer:fine){[data-vaul-drawer]{user-select:none}}@media (pointer:fine){[data-vaul-handle-hitarea]:{width:100%;height:100%}}@keyframes fadeIn{from{opacity:0}to{opacity:1}}@keyframes fadeOut{to{opacity:0}}@keyframes slideFromBottom{from{transform:translate3d(0,var(--initial-transform,100%),0)}to{transform:translate3d(0,0,0)}}@keyframes slideToBottom{to{transform:translate3d(0,var(--initial-transform,100%),0)}}@keyframes slideFromTop{from{transform:translate3d(0,calc(var(--initial-transform,100%) * -1),0)}to{transform:translate3d(0,0,0)}}@keyframes slideToTop{to{transform:translate3d(0,calc(var(--initial-transform,100%) * -1),0)}}@keyframes slideFromLeft{from{transform:translate3d(calc(var(--initial-transform,100%) * -1),0,0)}to{transform:translate3d(0,0,0)}}@keyframes slideToLeft{to{transform:translate3d(calc(var(--initial-transform,100%) * -1),0,0)}}@keyframes slideFromRight{from{transform:translate3d(var(--initial-transform,100%),0,0)}to{transform:translate3d(0,0,0)}}@keyframes slideToRight{to{transform:translate3d(var(--initial-transform,100%),0,0)}}`);function RS(){const n=navigator.userAgent;return typeof window<"u"&&(/Firefox/.test(n)&&/Mobile/.test(n)||/FxiOS/.test(n))}function TS(){return qu(/^Mac/)}function PS(){return qu(/^iPhone/)}function Np(){return/^((?!chrome|android).)*safari/i.test(navigator.userAgent)}function _S(){return qu(/^iPad/)||TS()&&navigator.maxTouchPoints>1}function kh(){return PS()||_S()}function qu(n){return typeof window<"u"&&window.navigator!=null?n.test(window.navigator.platform):void 0}const AS=24,OS=typeof window<"u"?w.useLayoutEffect:w.useEffect;function jp(...n){return(...l)=>{for(let o of n)typeof o=="function"&&o(...l)}}const du=typeof document<"u"&&window.visualViewport;function Rp(n){let l=window.getComputedStyle(n);return/(auto|scroll)/.test(l.overflow+l.overflowX+l.overflowY)}function Eh(n){for(Rp(n)&&(n=n.parentElement);n&&!Rp(n);)n=n.parentElement;return n||document.scrollingElement||document.documentElement}const MS=new Set(["checkbox","radio","range","color","file","image","button","submit","reset"]);let Mi=0,fu;function DS(n={}){let{isDisabled:l}=n;OS(()=>{if(!l)return Mi++,Mi===1&&kh()&&(fu=LS()),()=>{Mi--,Mi===0&&(fu==null||fu())}},[l])}function LS(){let n,l=0,o=x=>{n=Eh(x.target),!(n===document.documentElement&&n===document.body)&&(l=x.changedTouches[0].pageY)},s=x=>{if(!n||n===document.documentElement||n===document.body){x.preventDefault();return}let S=x.changedTouches[0].pageY,C=n.scrollTop,P=n.scrollHeight-n.clientHeight;P!==0&&((C<=0&&S>l||C>=P&&S<l)&&x.preventDefault(),l=S)},u=x=>{let S=x.target;ku(S)&&S!==document.activeElement&&(x.preventDefault(),S.style.transform="translateY(-2000px)",S.focus(),requestAnimationFrame(()=>{S.style.transform=""}))},c=x=>{let S=x.target;ku(S)&&(S.style.transform="translateY(-2000px)",requestAnimationFrame(()=>{S.style.transform="",du&&(du.height<window.innerHeight?requestAnimationFrame(()=>{Tp(S)}):du.addEventListener("resize",()=>Tp(S),{once:!0}))}))},p=()=>{window.scrollTo(0,0)},m=window.pageXOffset,h=window.pageYOffset,y=jp(zS(document.documentElement,"paddingRight",`${window.innerWidth-document.documentElement.clientWidth}px`));window.scrollTo(0,0);let v=jp(nl(document,"touchstart",o,{passive:!1,capture:!0}),nl(document,"touchmove",s,{passive:!1,capture:!0}),nl(document,"touchend",u,{passive:!1,capture:!0}),nl(document,"focus",c,!0),nl(window,"scroll",p));return()=>{y(),v(),window.scrollTo(m,h)}}function zS(n,l,o){let s=n.style[l];return n.style[l]=o,()=>{n.style[l]=s}}function nl(n,l,o,s){return n.addEventListener(l,o,s),()=>{n.removeEventListener(l,o,s)}}function Tp(n){let l=document.scrollingElement||document.documentElement;for(;n&&n!==l;){let o=Eh(n);if(o!==document.documentElement&&o!==document.body&&o!==n){let s=o.getBoundingClientRect().top,u=n.getBoundingClientRect().top,c=n.getBoundingClientRect().bottom;const p=o.getBoundingClientRect().bottom+AS;c>p&&(o.scrollTop+=u-s)}n=o.parentElement}}function ku(n){return n instanceof HTMLInputElement&&!MS.has(n.type)||n instanceof HTMLTextAreaElement||n instanceof HTMLElement&&n.isContentEditable}function IS(n,l){typeof n=="function"?n(l):n!=null&&(n.current=l)}function $S(...n){return l=>n.forEach(o=>IS(o,l))}function Nh(...n){return w.useCallback($S(...n),n)}const jh=new WeakMap;function Ze(n,l,o=!1){if(!n||!(n instanceof HTMLElement))return;let s={};Object.entries(l).forEach(([u,c])=>{if(u.startsWith("--")){n.style.setProperty(u,c);return}s[u]=n.style[u],n.style[u]=c}),!o&&jh.set(n,s)}function FS(n,l){if(!n||!(n instanceof HTMLElement))return;let o=jh.get(n);o&&(n.style[l]=o[l])}const Xe=n=>{switch(n){case"top":case"bottom":return!0;case"left":case"right":return!1;default:return n}};function Di(n,l){if(!n)return null;const o=window.getComputedStyle(n),s=o.transform||o.webkitTransform||o.mozTransform;let u=s.match(/^matrix3d\((.+)\)$/);return u?parseFloat(u[1].split(", ")[Xe(l)?13:12]):(u=s.match(/^matrix\((.+)\)$/),u?parseFloat(u[1].split(", ")[Xe(l)?5:4]):null)}function WS(n){return 8*(Math.log(n+1)-2)}function pu(n,l){if(!n)return()=>{};const o=n.style.cssText;return Object.assign(n.style,l),()=>{n.style.cssText=o}}function BS(...n){return(...l)=>{for(const o of n)typeof o=="function"&&o(...l)}}const Fe={DURATION:.5,EASE:[.32,.72,0,1]},Rh=.4,HS=.25,VS=100,Th=8,Li=16,Eu=26,mu="vaul-dragging";function Ph(n){const l=oe.useRef(n);return oe.useEffect(()=>{l.current=n}),oe.useMemo(()=>(...o)=>l.current==null?void 0:l.current.call(l,...o),[])}function US({defaultProp:n,onChange:l}){const o=oe.useState(n),[s]=o,u=oe.useRef(s),c=Ph(l);return oe.useEffect(()=>{u.current!==s&&(c(s),u.current=s)},[s,u,c]),o}function _h({prop:n,defaultProp:l,onChange:o=()=>{}}){const[s,u]=US({defaultProp:l,onChange:o}),c=n!==void 0,p=c?n:s,m=Ph(o),h=oe.useCallback(y=>{if(c){const x=typeof y=="function"?y(n):y;x!==n&&m(x)}else u(y)},[c,n,u,m]);return[p,h]}function YS({activeSnapPointProp:n,setActiveSnapPointProp:l,snapPoints:o,drawerRef:s,overlayRef:u,fadeFromIndex:c,onSnapPointChange:p,direction:m="bottom",container:h,snapToSequentialPoint:y}){const[v,x]=_h({prop:n,defaultProp:o==null?void 0:o[0],onChange:l}),[S,C]=oe.useState(typeof window<"u"?{innerWidth:window.innerWidth,innerHeight:window.innerHeight}:void 0);oe.useEffect(()=>{function L(){C({innerWidth:window.innerWidth,innerHeight:window.innerHeight})}return window.addEventListener("resize",L),()=>window.removeEventListener("resize",L)},[]);const P=oe.useMemo(()=>v===(o==null?void 0:o[o.length-1])||null,[o,v]),k=oe.useMemo(()=>{var L;return(L=o==null?void 0:o.findIndex(R=>R===v))!=null?L:null},[o,v]),E=o&&o.length>0&&(c||c===0)&&!Number.isNaN(c)&&o[c]===v||!o,A=oe.useMemo(()=>{const L=h?{width:h.getBoundingClientRect().width,height:h.getBoundingClientRect().height}:typeof window<"u"?{width:window.innerWidth,height:window.innerHeight}:{width:0,height:0};var R;return(R=o==null?void 0:o.map(W=>{const Q=typeof W=="string";let ee=0;if(Q&&(ee=parseInt(W,10)),Xe(m)){const U=Q?ee:S?W*L.height:0;return S?m==="bottom"?L.height-U:-L.height+U:U}const ce=Q?ee:S?W*L.width:0;return S?m==="right"?L.width-ce:-L.width+ce:ce}))!=null?R:[]},[o,S,h]),D=oe.useMemo(()=>k!==null?A==null?void 0:A[k]:null,[A,k]),$=oe.useCallback(L=>{var R;const W=(R=A==null?void 0:A.findIndex(Q=>Q===L))!=null?R:null;p(W),Ze(s.current,{transition:`transform ${Fe.DURATION}s cubic-bezier(${Fe.EASE.join(",")})`,transform:Xe(m)?`translate3d(0, ${L}px, 0)`:`translate3d(${L}px, 0, 0)`}),A&&W!==A.length-1&&c!==void 0&&W!==c&&W<c?Ze(u.current,{transition:`opacity ${Fe.DURATION}s cubic-bezier(${Fe.EASE.join(",")})`,opacity:"0"}):Ze(u.current,{transition:`opacity ${Fe.DURATION}s cubic-bezier(${Fe.EASE.join(",")})`,opacity:"1"}),x(o==null?void 0:o[Math.max(W,0)])},[s.current,o,A,c,u,x]);oe.useEffect(()=>{if(v||n){var L;const R=(L=o==null?void 0:o.findIndex(W=>W===n||W===v))!=null?L:-1;A&&R!==-1&&typeof A[R]=="number"&&$(A[R])}},[v,n,o,A,$]);function N({draggedDistance:L,closeDrawer:R,velocity:W,dismissible:Q}){if(c===void 0)return;const ee=m==="bottom"||m==="right"?(D??0)-L:(D??0)+L,ce=k===c-1,U=k===0,q=L>0;if(ce&&Ze(u.current,{transition:`opacity ${Fe.DURATION}s cubic-bezier(${Fe.EASE.join(",")})`}),!y&&W>2&&!q){Q?R():$(A[0]);return}if(!y&&W>2&&q&&A&&o){$(A[o.length-1]);return}const te=A==null?void 0:A.reduce((ne,B)=>typeof ne!="number"||typeof B!="number"?ne:Math.abs(B-ee)<Math.abs(ne-ee)?B:ne),J=Xe(m)?window.innerHeight:window.innerWidth;if(W>Rh&&Math.abs(L)<J*.4){const ne=q?1:-1;if(ne>0&&P&&o){$(A[o.length-1]);return}if(U&&ne<0&&Q&&R(),k===null)return;$(A[k+ne]);return}$(te)}function F({draggedDistance:L}){if(D===null)return;const R=m==="bottom"||m==="right"?D-L:D+L;(m==="bottom"||m==="right")&&R<A[A.length-1]||(m==="top"||m==="left")&&R>A[A.length-1]||Ze(s.current,{transform:Xe(m)?`translate3d(0, ${R}px, 0)`:`translate3d(${R}px, 0, 0)`})}function V(L,R){if(!o||typeof k!="number"||!A||c===void 0)return null;const W=k===c-1;if(k>=c&&R)return 0;if(W&&!R)return 1;if(!E&&!W)return null;const ee=W?k+1:k-1,ce=W?A[ee]-A[ee-1]:A[ee+1]-A[ee],U=L/Math.abs(ce);return W?1-U:U}return{isLastSnapPoint:P,activeSnapPoint:v,shouldFade:E,getPercentageDragged:V,setActiveSnapPoint:x,activeSnapPointIndex:k,onRelease:N,onDrag:F,snapPointsOffset:A}}const XS=()=>()=>{};function QS(){const{direction:n,isOpen:l,shouldScaleBackground:o,setBackgroundColorOnScale:s,noBodyStyles:u}=pl(),c=oe.useRef(null),p=w.useMemo(()=>document.body.style.backgroundColor,[]);function m(){return(window.innerWidth-Eu)/window.innerWidth}oe.useEffect(()=>{if(l&&o){c.current&&clearTimeout(c.current);const h=document.querySelector("[data-vaul-drawer-wrapper]")||document.querySelector("[vaul-drawer-wrapper]");if(!h)return;BS(s&&!u?pu(document.body,{background:"black"}):XS,pu(h,{transformOrigin:Xe(n)?"top":"left",transitionProperty:"transform, border-radius",transitionDuration:`${Fe.DURATION}s`,transitionTimingFunction:`cubic-bezier(${Fe.EASE.join(",")})`}));const y=pu(h,{borderRadius:`${Th}px`,overflow:"hidden",...Xe(n)?{transform:`scale(${m()}) translate3d(0, calc(env(safe-area-inset-top) + 14px), 0)`}:{transform:`scale(${m()}) translate3d(calc(env(safe-area-inset-top) + 14px), 0, 0)`}});return()=>{y(),c.current=window.setTimeout(()=>{p?document.body.style.background=p:document.body.style.removeProperty("background")},Fe.DURATION*1e3)}}},[l,o,p])}let rl=null;function GS({isOpen:n,modal:l,nested:o,hasBeenOpened:s,preventScrollRestoration:u,noBodyStyles:c}){const[p,m]=oe.useState(()=>typeof window<"u"?window.location.href:""),h=oe.useRef(0),y=oe.useCallback(()=>{if(Np()&&rl===null&&n&&!c){rl={position:document.body.style.position,top:document.body.style.top,left:document.body.style.left,height:document.body.style.height,right:"unset"};const{scrollX:x,innerHeight:S}=window;document.body.style.setProperty("position","fixed","important"),Object.assign(document.body.style,{top:`${-h.current}px`,left:`${-x}px`,right:"0px",height:"auto"}),window.setTimeout(()=>window.requestAnimationFrame(()=>{const C=S-window.innerHeight;C&&h.current>=S&&(document.body.style.top=`${-(h.current+C)}px`)}),300)}},[n]),v=oe.useCallback(()=>{if(Np()&&rl!==null&&!c){const x=-parseInt(document.body.style.top,10),S=-parseInt(document.body.style.left,10);Object.assign(document.body.style,rl),window.requestAnimationFrame(()=>{if(u&&p!==window.location.href){m(window.location.href);return}window.scrollTo(S,x)}),rl=null}},[p]);return oe.useEffect(()=>{function x(){h.current=window.scrollY}return x(),window.addEventListener("scroll",x),()=>{window.removeEventListener("scroll",x)}},[]),oe.useEffect(()=>{if(l)return()=>{typeof document>"u"||document.querySelector("[data-vaul-drawer]")||v()}},[l,v]),oe.useEffect(()=>{o||!s||(n?(!window.matchMedia("(display-mode: standalone)").matches&&y(),l||window.setTimeout(()=>{v()},500)):v())},[n,s,p,l,o,y,v]),{restorePositionSetting:v}}function KS({open:n,onOpenChange:l,children:o,onDrag:s,onRelease:u,snapPoints:c,shouldScaleBackground:p=!1,setBackgroundColorOnScale:m=!0,closeThreshold:h=HS,scrollLockTimeout:y=VS,dismissible:v=!0,handleOnly:x=!1,fadeFromIndex:S=c&&c.length-1,activeSnapPoint:C,setActiveSnapPoint:P,fixed:k,modal:E=!0,onClose:A,nested:D,noBodyStyles:$=!1,direction:N="bottom",defaultOpen:F=!1,disablePreventScroll:V=!0,snapToSequentialPoint:L=!1,preventScrollRestoration:R=!1,repositionInputs:W=!0,onAnimationEnd:Q,container:ee,autoFocus:ce=!1}){var U,q;const[te=!1,J]=_h({defaultProp:F,prop:n,onChange:ye=>{l==null||l(ye),!ye&&!D&&ho(),setTimeout(()=>{Q==null||Q(ye)},Fe.DURATION*1e3),ye&&!E&&typeof window<"u"&&window.requestAnimationFrame(()=>{document.body.style.pointerEvents="auto"}),ye||(document.body.style.pointerEvents="auto")}}),[ne,B]=oe.useState(!1),[K,I]=oe.useState(!1),[_,H]=oe.useState(!1),fe=oe.useRef(null),we=oe.useRef(null),pe=oe.useRef(null),me=oe.useRef(null),Ce=oe.useRef(null),be=oe.useRef(!1),xe=oe.useRef(null),ze=oe.useRef(0),Qe=oe.useRef(!1),Ct=oe.useRef(!F),ot=oe.useRef(0),he=oe.useRef(null),ir=oe.useRef(((U=he.current)==null?void 0:U.getBoundingClientRect().height)||0),sr=oe.useRef(((q=he.current)==null?void 0:q.getBoundingClientRect().width)||0),hn=oe.useRef(0),Rr=oe.useCallback(ye=>{c&&ye===Tn.length-1&&(we.current=new Date)},[]),{activeSnapPoint:en,activeSnapPointIndex:_t,setActiveSnapPoint:gn,onRelease:po,snapPointsOffset:Tn,onDrag:ml,shouldFade:mo,getPercentageDragged:hl}=YS({snapPoints:c,activeSnapPointProp:C,setActiveSnapPointProp:P,drawerRef:he,fadeFromIndex:S,overlayRef:fe,onSnapPointChange:Rr,direction:N,container:ee,snapToSequentialPoint:L});DS({isDisabled:!te||K||!E||_||!ne||!W||!V});const{restorePositionSetting:ho}=GS({isOpen:te,modal:E,nested:D??!1,hasBeenOpened:ne,preventScrollRestoration:R,noBodyStyles:$});function vn(){return(window.innerWidth-Eu)/window.innerWidth}function gl(ye){var je,Re;!v&&!c||he.current&&!he.current.contains(ye.target)||(ir.current=((je=he.current)==null?void 0:je.getBoundingClientRect().height)||0,sr.current=((Re=he.current)==null?void 0:Re.getBoundingClientRect().width)||0,I(!0),pe.current=new Date,kh()&&window.addEventListener("touchend",()=>be.current=!1,{once:!0}),ye.target.setPointerCapture(ye.pointerId),ze.current=Xe(N)?ye.pageY:ye.pageX)}function Pn(ye,je){var Re;let ke=ye;const De=(Re=window.getSelection())==null?void 0:Re.toString(),lt=he.current?Di(he.current,N):null,Je=new Date;if(ke.tagName==="SELECT"||ke.hasAttribute("data-vaul-no-drag")||ke.closest("[data-vaul-no-drag]"))return!1;if(N==="right"||N==="left")return!0;if(we.current&&Je.getTime()-we.current.getTime()<500)return!1;if(lt!==null&&(N==="bottom"?lt>0:lt<0))return!0;if(De&&De.length>0)return!1;if(Ce.current&&Je.getTime()-Ce.current.getTime()<y&<===0||je)return Ce.current=Je,!1;for(;ke;){if(ke.scrollHeight>ke.clientHeight){if(ke.scrollTop!==0)return Ce.current=new Date,!1;if(ke.getAttribute("role")==="dialog")return!0}ke=ke.parentNode}return!0}function ar(ye){if(he.current&&K){const je=N==="bottom"||N==="right"?1:-1,Re=(ze.current-(Xe(N)?ye.pageY:ye.pageX))*je,ke=Re>0,De=c&&!v&&!ke;if(De&&_t===0)return;const lt=Math.abs(Re),Je=document.querySelector("[data-vaul-drawer-wrapper]"),Ft=N==="bottom"||N==="top"?ir.current:sr.current;let gt=lt/Ft;const Wt=hl(lt,ke);if(Wt!==null&&(gt=Wt),De&>>=1||!be.current&&!Pn(ye.target,ke))return;if(he.current.classList.add(mu),be.current=!0,Ze(he.current,{transition:"none"}),Ze(fe.current,{transition:"none"}),c&&ml({draggedDistance:Re}),ke&&!c){const at=WS(Re),_n=Math.min(at*-1,0)*je;Ze(he.current,{transform:Xe(N)?`translate3d(0, ${_n}px, 0)`:`translate3d(${_n}px, 0, 0)`});return}const Bt=1-gt;if((mo||S&&_t===S-1)&&(s==null||s(ye,gt),Ze(fe.current,{opacity:`${Bt}`,transition:"none"},!0)),Je&&fe.current&&p){const at=Math.min(vn()+gt*(1-vn()),1),_n=8-gt*8,An=Math.max(0,14-gt*14);Ze(Je,{borderRadius:`${_n}px`,transform:Xe(N)?`scale(${at}) translate3d(0, ${An}px, 0)`:`scale(${at}) translate3d(${An}px, 0, 0)`,transition:"none"},!0)}if(!c){const at=lt*je;Ze(he.current,{transform:Xe(N)?`translate3d(0, ${at}px, 0)`:`translate3d(${at}px, 0, 0)`})}}}oe.useEffect(()=>{window.requestAnimationFrame(()=>{Ct.current=!0})},[]),oe.useEffect(()=>{var ye;function je(){if(!he.current||!W)return;const Re=document.activeElement;if(ku(Re)||Qe.current){var ke;const De=((ke=window.visualViewport)==null?void 0:ke.height)||0,lt=window.innerHeight;let Je=lt-De;const Ft=he.current.getBoundingClientRect().height||0,gt=Ft>lt*.8;hn.current||(hn.current=Ft);const Wt=he.current.getBoundingClientRect().top;if(Math.abs(ot.current-Je)>60&&(Qe.current=!Qe.current),c&&c.length>0&&Tn&&_t){const Bt=Tn[_t]||0;Je+=Bt}if(ot.current=Je,Ft>De||Qe.current){const Bt=he.current.getBoundingClientRect().height;let at=Bt;Bt>De&&(at=De-(gt?Wt:Eu)),k?he.current.style.height=`${Bt-Math.max(Je,0)}px`:he.current.style.height=`${Math.max(at,De-Wt)}px`}else RS()||(he.current.style.height=`${hn.current}px`);c&&c.length>0&&!Qe.current?he.current.style.bottom="0px":he.current.style.bottom=`${Math.max(Je,0)}px`}}return(ye=window.visualViewport)==null||ye.addEventListener("resize",je),()=>{var Re;return(Re=window.visualViewport)==null?void 0:Re.removeEventListener("resize",je)}},[_t,c,Tn]);function ur(ye){vl(),A==null||A(),ye||J(!1),setTimeout(()=>{c&&gn(c[0])},Fe.DURATION*1e3)}function go(){if(!he.current)return;const ye=document.querySelector("[data-vaul-drawer-wrapper]"),je=Di(he.current,N);Ze(he.current,{transform:"translate3d(0, 0, 0)",transition:`transform ${Fe.DURATION}s cubic-bezier(${Fe.EASE.join(",")})`}),Ze(fe.current,{transition:`opacity ${Fe.DURATION}s cubic-bezier(${Fe.EASE.join(",")})`,opacity:"1"}),p&&je&&je>0&&te&&Ze(ye,{borderRadius:`${Th}px`,overflow:"hidden",...Xe(N)?{transform:`scale(${vn()}) translate3d(0, calc(env(safe-area-inset-top) + 14px), 0)`,transformOrigin:"top"}:{transform:`scale(${vn()}) translate3d(calc(env(safe-area-inset-top) + 14px), 0, 0)`,transformOrigin:"left"},transitionProperty:"transform, border-radius",transitionDuration:`${Fe.DURATION}s`,transitionTimingFunction:`cubic-bezier(${Fe.EASE.join(",")})`},!0)}function vl(){!K||!he.current||(he.current.classList.remove(mu),be.current=!1,I(!1),me.current=new Date)}function ms(ye){if(!K||!he.current)return;he.current.classList.remove(mu),be.current=!1,I(!1),me.current=new Date;const je=Di(he.current,N);if(!ye||!Pn(ye.target,!1)||!je||Number.isNaN(je)||pe.current===null)return;const Re=me.current.getTime()-pe.current.getTime(),ke=ze.current-(Xe(N)?ye.pageY:ye.pageX),De=Math.abs(ke)/Re;if(De>.05&&(H(!0),setTimeout(()=>{H(!1)},200)),c){po({draggedDistance:ke*(N==="bottom"||N==="right"?1:-1),closeDrawer:ur,velocity:De,dismissible:v}),u==null||u(ye,!0);return}if(N==="bottom"||N==="right"?ke>0:ke<0){go(),u==null||u(ye,!0);return}if(De>Rh){ur(),u==null||u(ye,!1);return}var lt;const Je=Math.min((lt=he.current.getBoundingClientRect().height)!=null?lt:0,window.innerHeight);var Ft;const gt=Math.min((Ft=he.current.getBoundingClientRect().width)!=null?Ft:0,window.innerWidth),Wt=N==="left"||N==="right";if(Math.abs(je)>=(Wt?gt:Je)*h){ur(),u==null||u(ye,!1);return}u==null||u(ye,!0),go()}oe.useEffect(()=>(te&&(Ze(document.documentElement,{scrollBehavior:"auto"}),we.current=new Date),()=>{FS(document.documentElement,"scrollBehavior")}),[te]);function vo(ye){const je=ye?(window.innerWidth-Li)/window.innerWidth:1,Re=ye?-16:0;xe.current&&window.clearTimeout(xe.current),Ze(he.current,{transition:`transform ${Fe.DURATION}s cubic-bezier(${Fe.EASE.join(",")})`,transform:Xe(N)?`scale(${je}) translate3d(0, ${Re}px, 0)`:`scale(${je}) translate3d(${Re}px, 0, 0)`}),!ye&&he.current&&(xe.current=setTimeout(()=>{const ke=Di(he.current,N);Ze(he.current,{transition:"none",transform:Xe(N)?`translate3d(0, ${ke}px, 0)`:`translate3d(${ke}px, 0, 0)`})},500))}function yo(ye,je){if(je<0)return;const Re=(window.innerWidth-Li)/window.innerWidth,ke=Re+je*(1-Re),De=-16+je*Li;Ze(he.current,{transform:Xe(N)?`scale(${ke}) translate3d(0, ${De}px, 0)`:`scale(${ke}) translate3d(${De}px, 0, 0)`,transition:"none"})}function xo(ye,je){const Re=Xe(N)?window.innerHeight:window.innerWidth,ke=je?(Re-Li)/Re:1,De=je?-16:0;je&&Ze(he.current,{transition:`transform ${Fe.DURATION}s cubic-bezier(${Fe.EASE.join(",")})`,transform:Xe(N)?`scale(${ke}) translate3d(0, ${De}px, 0)`:`scale(${ke}) translate3d(${De}px, 0, 0)`})}return oe.useEffect(()=>{E||window.requestAnimationFrame(()=>{document.body.style.pointerEvents="auto"})},[E]),oe.createElement(SS,{defaultOpen:F,onOpenChange:ye=>{!v&&!ye||(ye?B(!0):ur(!0),J(ye))},open:te},oe.createElement(Ch.Provider,{value:{activeSnapPoint:en,snapPoints:c,setActiveSnapPoint:gn,drawerRef:he,overlayRef:fe,onOpenChange:l,onPress:gl,onRelease:ms,onDrag:ar,dismissible:v,shouldAnimate:Ct,handleOnly:x,isOpen:te,isDragging:K,shouldFade:mo,closeDrawer:ur,onNestedDrag:yo,onNestedOpenChange:vo,onNestedRelease:xo,keyboardIsOpen:Qe,modal:E,snapPointsOffset:Tn,activeSnapPointIndex:_t,direction:N,shouldScaleBackground:p,setBackgroundColorOnScale:m,noBodyStyles:$,container:ee,autoFocus:ce}},o))}const Ah=oe.forwardRef(function({...n},l){const{overlayRef:o,snapPoints:s,onRelease:u,shouldFade:c,isOpen:p,modal:m,shouldAnimate:h}=pl(),y=Nh(l,o),v=s&&s.length>0;if(!m)return null;const x=oe.useCallback(S=>u(S),[u]);return oe.createElement(kS,{onMouseUp:x,ref:y,"data-vaul-overlay":"","data-vaul-snap-points":p&&v?"true":"false","data-vaul-snap-points-overlay":p&&c?"true":"false","data-vaul-animate":h!=null&&h.current?"true":"false",...n})});Ah.displayName="Drawer.Overlay";const Oh=oe.forwardRef(function({onPointerDownOutside:n,style:l,onOpenAutoFocus:o,...s},u){const{drawerRef:c,onPress:p,onRelease:m,onDrag:h,keyboardIsOpen:y,snapPointsOffset:v,activeSnapPointIndex:x,modal:S,isOpen:C,direction:P,snapPoints:k,container:E,handleOnly:A,shouldAnimate:D,autoFocus:$}=pl(),[N,F]=oe.useState(!1),V=Nh(u,c),L=oe.useRef(null),R=oe.useRef(null),W=oe.useRef(!1),Q=k&&k.length>0;QS();const ee=(U,q,te=0)=>{if(W.current)return!0;const J=Math.abs(U.y),ne=Math.abs(U.x),B=ne>J,K=["bottom","right"].includes(q)?1:-1;if(q==="left"||q==="right"){if(!(U.x*K<0)&&ne>=0&&ne<=te)return B}else if(!(U.y*K<0)&&J>=0&&J<=te)return!B;return W.current=!0,!0};oe.useEffect(()=>{Q&&window.requestAnimationFrame(()=>{F(!0)})},[]);function ce(U){L.current=null,W.current=!1,m(U)}return oe.createElement(ES,{"data-vaul-drawer-direction":P,"data-vaul-drawer":"","data-vaul-delayed-snap-points":N?"true":"false","data-vaul-snap-points":C&&Q?"true":"false","data-vaul-custom-container":E?"true":"false","data-vaul-animate":D!=null&&D.current?"true":"false",...s,ref:V,style:v&&v.length>0?{"--snap-point-height":`${v[x??0]}px`,...l}:l,onPointerDown:U=>{A||(s.onPointerDown==null||s.onPointerDown.call(s,U),L.current={x:U.pageX,y:U.pageY},p(U))},onOpenAutoFocus:U=>{o==null||o(U),$||U.preventDefault()},onPointerDownOutside:U=>{if(n==null||n(U),!S||U.defaultPrevented){U.preventDefault();return}y.current&&(y.current=!1)},onFocusOutside:U=>{if(!S){U.preventDefault();return}},onPointerMove:U=>{if(R.current=U,A||(s.onPointerMove==null||s.onPointerMove.call(s,U),!L.current))return;const q=U.pageY-L.current.y,te=U.pageX-L.current.x,J=U.pointerType==="touch"?10:2;ee({x:te,y:q},P,J)?h(U):(Math.abs(te)>J||Math.abs(q)>J)&&(L.current=null)},onPointerUp:U=>{s.onPointerUp==null||s.onPointerUp.call(s,U),L.current=null,W.current=!1,m(U)},onPointerOut:U=>{s.onPointerOut==null||s.onPointerOut.call(s,U),ce(R.current)},onContextMenu:U=>{s.onContextMenu==null||s.onContextMenu.call(s,U),R.current&&ce(R.current)}})});Oh.displayName="Drawer.Content";const qS=250,ZS=120,JS=oe.forwardRef(function({preventCycle:n=!1,children:l,...o},s){const{closeDrawer:u,isDragging:c,snapPoints:p,activeSnapPoint:m,setActiveSnapPoint:h,dismissible:y,handleOnly:v,isOpen:x,onPress:S,onDrag:C}=pl(),P=oe.useRef(null),k=oe.useRef(!1);function E(){if(k.current){$();return}window.setTimeout(()=>{A()},ZS)}function A(){if(c||n||k.current){$();return}if($(),!p||p.length===0){y||u();return}if(m===p[p.length-1]&&y){u();return}const F=p.findIndex(L=>L===m);if(F===-1)return;const V=p[F+1];h(V)}function D(){P.current=window.setTimeout(()=>{k.current=!0},qS)}function $(){P.current&&window.clearTimeout(P.current),k.current=!1}return oe.createElement("div",{onClick:E,onPointerCancel:$,onPointerDown:N=>{v&&S(N),D()},onPointerMove:N=>{v&&C(N)},ref:s,"data-vaul-drawer-visible":x?"true":"false","data-vaul-handle":"","aria-hidden":"true",...o},oe.createElement("span",{"data-vaul-handle-hitarea":"","aria-hidden":"true"},l))});JS.displayName="Drawer.Handle";function eb(n){const l=pl(),{container:o=l.container,...s}=n;return oe.createElement(CS,{container:o,...s})}const fo={Root:KS,Content:Oh,Overlay:Ah,Trigger:bS,Portal:eb,Title:NS};function Fi({...n}){return f.jsx(fo.Root,{"data-slot":"drawer",...n})}function Wi({...n}){return f.jsx(fo.Trigger,{"data-slot":"drawer-trigger",...n})}function tb({...n}){return f.jsx(fo.Portal,{"data-slot":"drawer-portal",...n})}function nb({className:n,...l}){return f.jsx(fo.Overlay,{"data-slot":"drawer-overlay",className:fn("data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50",n),...l})}function Bi({className:n,children:l,...o}){return f.jsxs(tb,{"data-slot":"drawer-portal",children:[f.jsx(nb,{}),f.jsxs(fo.Content,{"data-slot":"drawer-content",className:fn("group/drawer-content bg-background fixed z-50 flex h-auto flex-col","data-[vaul-drawer-direction=top]:inset-x-0 data-[vaul-drawer-direction=top]:top-0 data-[vaul-drawer-direction=top]:mb-24 data-[vaul-drawer-direction=top]:max-h-[80vh] data-[vaul-drawer-direction=top]:rounded-b-lg data-[vaul-drawer-direction=top]:border-b","data-[vaul-drawer-direction=bottom]:inset-x-0 data-[vaul-drawer-direction=bottom]:bottom-0 data-[vaul-drawer-direction=bottom]:mt-24 data-[vaul-drawer-direction=bottom]:max-h-[80vh] data-[vaul-drawer-direction=bottom]:rounded-t-lg data-[vaul-drawer-direction=bottom]:border-t","data-[vaul-drawer-direction=right]:inset-y-0 data-[vaul-drawer-direction=right]:right-0 data-[vaul-drawer-direction=right]:border-l","data-[vaul-drawer-direction=left]:inset-y-0 data-[vaul-drawer-direction=left]:left-0 data-[vaul-drawer-direction=left]:w-3/4 data-[vaul-drawer-direction=left]:border-r data-[vaul-drawer-direction=left]:sm:max-w-sm",n),...o,children:[f.jsx("div",{className:"bg-muted mx-auto mt-4 hidden h-2 w-[100px] shrink-0 rounded-full group-data-[vaul-drawer-direction=bottom]/drawer-content:block"}),l]})]})}function Hi({className:n,...l}){return f.jsx("div",{"data-slot":"drawer-header",className:fn("flex flex-col gap-0.5 p-4 group-data-[vaul-drawer-direction=bottom]/drawer-content:text-center group-data-[vaul-drawer-direction=top]/drawer-content:text-center md:gap-1.5 md:text-left",n),...l})}function Vi({className:n,...l}){return f.jsx(fo.Title,{"data-slot":"drawer-title",className:fn("text-foreground font-semibold",n),...l})}function It({data:n,compact:l=!1,size:o="sm"}){const[s,u]=w.useState(!1),c=JSON.stringify(n,null,2),p=l&&c.length>200?JSON.stringify(n):c,m={sm:"text-xs",base:"text-sm",lg:"text-base"},h=async()=>{await navigator.clipboard.writeText(c),u(!0),setTimeout(()=>u(!1),2e3)};return f.jsxs("div",{className:"relative group",children:[f.jsx("button",{onClick:h,className:"absolute top-1.5 right-1.5 p-1.5 rounded-md border border-border bg-background opacity-0 group-hover:opacity-100 transition-opacity z-10",title:"Copy to clipboard",children:s?f.jsx(Op,{className:"size-3 text-success"}):f.jsx(Mp,{className:"size-3 text-muted-foreground"})}),f.jsx("pre",{className:`font-mono ${m[o]} text-muted-foreground whitespace-pre-wrap wrap-break-words bg-background rounded p-2 ${l?"overflow-hidden max-h-20":""}`,children:p})]})}function rb({rawRequest:n,rawResponse:l,rawChunks:o,isStream:s}){const[u,c]=w.useState(!1),[p,m]=w.useState("parsed");if(!n&&!l)return null;const h=s&&o;return f.jsxs("div",{className:"border-t border-border",children:[f.jsxs("button",{className:"w-full flex items-center gap-2 px-4 py-2.5 text-[11px] text-muted-foreground hover:text-foreground hover:bg-accent/50 transition-colors",onClick:()=>c(!u),children:[f.jsx(or,{className:`size-3 transition-transform ${u?"rotate-90":""}`}),f.jsx("span",{className:"font-medium tracking-wider uppercase",children:"Request / Response"})]}),u&&f.jsxs("div",{className:"grid grid-cols-2 gap-4 px-4 pb-4",children:[n&&f.jsxs("div",{className:"flex flex-col",children:[f.jsx("div",{className:"flex items-end mb-2 h-7",children:f.jsx("span",{className:"text-[10px] font-medium uppercase tracking-wider text-muted-foreground",children:"Request"})}),f.jsx("div",{className:"max-h-[400px] overflow-auto rounded-md border border-border",children:f.jsx(It,{data:rr(n)})})]}),(l||o)&&f.jsxs("div",{className:"flex flex-col",children:[f.jsxs("div",{className:"flex justify-between items-end mb-2 h-7",children:[f.jsx("span",{className:"text-[10px] font-medium uppercase tracking-wider text-muted-foreground",children:s?"Stream":"Response"}),h&&f.jsxs("div",{className:"inline-flex rounded-md border border-border bg-muted/30 p-0.5",children:[f.jsx("button",{onClick:()=>m("parsed"),className:`px-2 py-0.5 text-[10px] font-medium rounded transition-colors ${p==="parsed"?"bg-background text-foreground shadow-sm":"text-muted-foreground hover:text-foreground"}`,children:"AI SDK"}),f.jsx("button",{onClick:()=>m("raw"),className:`px-2 py-0.5 text-[10px] font-medium rounded transition-colors ${p==="raw"?"bg-background text-foreground shadow-sm":"text-muted-foreground hover:text-foreground"}`,children:"Provider"})]})]}),f.jsx("div",{className:"max-h-[400px] overflow-auto rounded-md border border-border",children:f.jsx(It,{data:rr(h&&p==="raw"?o:l)})})]})]})]})}function ob({usage:n}){const l=Ji(n==null?void 0:n.inputTokens),o=es(n==null?void 0:n.outputTokens);return f.jsxs("div",{className:"space-y-6",children:[f.jsxs("div",{className:"grid grid-cols-2 gap-4",children:[f.jsxs("div",{className:"p-4 rounded-lg border border-border bg-card",children:[f.jsx("div",{className:"mb-2 text-xs font-medium tracking-wider uppercase text-muted-foreground",children:"Input Tokens"}),f.jsx("div",{className:"text-2xl font-semibold",children:l.total}),(l.cacheRead!==void 0||l.cacheWrite!==void 0)&&f.jsxs("div",{className:"mt-3 space-y-1 text-sm text-muted-foreground",children:[l.cacheRead!==void 0&&f.jsxs("div",{className:"flex justify-between",children:[f.jsx("span",{children:"Cache read"}),f.jsx("span",{className:"font-mono",children:l.cacheRead})]}),l.cacheWrite!==void 0&&f.jsxs("div",{className:"flex justify-between",children:[f.jsx("span",{children:"Cache write"}),f.jsx("span",{className:"font-mono",children:l.cacheWrite})]}),l.noCache!==void 0&&f.jsxs("div",{className:"flex justify-between",children:[f.jsx("span",{children:"No cache"}),f.jsx("span",{className:"font-mono",children:l.noCache})]})]})]}),f.jsxs("div",{className:"p-4 rounded-lg border border-border bg-card",children:[f.jsx("div",{className:"mb-2 text-xs font-medium tracking-wider uppercase text-muted-foreground",children:"Output Tokens"}),f.jsx("div",{className:"text-2xl font-semibold",children:o.total}),(o.text!==void 0||o.reasoning!==void 0)&&f.jsxs("div",{className:"mt-3 space-y-1 text-sm text-muted-foreground",children:[o.text!==void 0&&f.jsxs("div",{className:"flex justify-between",children:[f.jsx("span",{children:"Text"}),f.jsx("span",{className:"font-mono",children:o.text})]}),o.reasoning!==void 0&&f.jsxs("div",{className:"flex justify-between",children:[f.jsx("span",{children:"Reasoning"}),f.jsx("span",{className:"font-mono",children:o.reasoning})]})]})]})]}),(n==null?void 0:n.raw)!=null&&f.jsxs("div",{children:[f.jsx("div",{className:"mb-2 text-xs font-medium tracking-wider uppercase text-muted-foreground",children:"Raw Provider Usage"}),f.jsx(It,{data:n.raw,size:"sm"})]}),f.jsxs("div",{children:[f.jsx("div",{className:"mb-2 text-xs font-medium tracking-wider uppercase text-muted-foreground",children:"Full Usage Object"}),f.jsx(It,{data:n,size:"sm"})]})]})}function Mh({input:n,output:l,raw:o}){const s=n.noCache!==void 0||n.cacheRead!==void 0||n.cacheWrite!==void 0,u=l.text!==void 0||l.reasoning!==void 0;return s||u?f.jsxs("div",{className:"space-y-2 text-xs",children:[f.jsxs("div",{children:[f.jsxs("div",{className:"mb-1 font-medium",children:["Input: ",n.total]}),n.cacheRead!==void 0&&f.jsxs("div",{className:"ml-2 text-muted-foreground",children:["Cache read: ",n.cacheRead]}),n.cacheWrite!==void 0&&f.jsxs("div",{className:"ml-2 text-muted-foreground",children:["Cache write: ",n.cacheWrite]})]}),f.jsxs("div",{children:[f.jsxs("div",{className:"mb-1 font-medium",children:["Output: ",l.total]}),l.text!==void 0&&f.jsxs("div",{className:"ml-2 text-muted-foreground",children:["Text: ",l.text]}),l.reasoning!==void 0&&f.jsxs("div",{className:"ml-2 text-muted-foreground",children:["Reasoning: ",l.reasoning]})]}),o!==void 0&&f.jsx("div",{className:"pt-1 mt-1 border-t border-border",children:f.jsxs("div",{className:"text-muted-foreground/70 font-mono text-[10px] max-w-[200px] truncate",children:["Raw: ",JSON.stringify(o)]})})]}):f.jsxs("div",{className:"text-xs",children:[f.jsxs("div",{children:["Input: ",n.total]}),f.jsxs("div",{children:["Output: ",l.total]})]})}function Dh({content:n}){const[l,o]=w.useState(!1),s=n.length>200?n.slice(0,200)+"…":n;return f.jsxs("div",{className:"overflow-hidden rounded-md border border-amber-500/30",children:[f.jsxs("button",{className:"flex gap-2 items-center px-3 py-2 w-full transition-colors bg-amber-500/10 hover:bg-amber-500/20",onClick:()=>o(!l),children:[f.jsx(or,{className:`size-3 text-amber-500 transition-transform shrink-0 ${l?"rotate-90":""}`}),f.jsx(ll,{className:"text-amber-500 size-3 shrink-0"}),f.jsx("span",{className:"text-xs font-medium text-amber-500",children:"Thinking"}),!l&&f.jsx("span",{className:"text-[11px] text-amber-500/70 truncate ml-1",children:s})]}),l&&f.jsx("div",{className:"p-3 border-t bg-card/50 border-amber-500/30",children:f.jsx("div",{className:"text-xs leading-relaxed whitespace-pre-wrap text-foreground/80",children:n})})]})}function Lh({content:n,defaultExpanded:l=!1,isSystem:o=!1}){const[s,u]=w.useState(l),[c,p]=w.useState(!1),m=n.length>200?n.slice(0,200)+"…":n,h=o?"border-blue-500/30":"border-border",y=o?"bg-blue-500/10":"bg-muted/30",v=o?"hover:bg-blue-500/20":"hover:bg-muted/50",x=o?"text-blue-400":"text-muted-foreground",S=o?"text-blue-400":"text-foreground",C=async P=>{P.stopPropagation(),await navigator.clipboard.writeText(n),p(!0),setTimeout(()=>p(!1),2e3)};return f.jsxs("div",{className:`overflow-hidden rounded-md border ${h}`,children:[f.jsxs("button",{className:`flex gap-2 items-center px-3 py-2 w-full transition-colors ${y} ${v}`,onClick:()=>u(!s),children:[f.jsx(or,{className:`size-3 ${x} transition-transform shrink-0 ${s?"rotate-90":""}`}),f.jsx(lo,{className:`size-3 ${x} shrink-0`}),f.jsx("span",{className:`text-xs font-medium ${S}`,children:"Text"}),!s&&f.jsx("span",{className:`text-[11px] ${o?"text-blue-400/70":"text-muted-foreground"} truncate ml-1`,children:m})]}),s&&f.jsxs("div",{className:`relative p-3 border-t bg-card/50 ${h} group`,children:[f.jsx("button",{onClick:C,className:"absolute top-1.5 right-1.5 p-1.5 rounded-md border border-border bg-background opacity-0 group-hover:opacity-100 transition-opacity z-10",title:"Copy to clipboard",children:c?f.jsx(Op,{className:"size-3 text-success"}):f.jsx(Mp,{className:"size-3 text-muted-foreground"})}),f.jsx("div",{className:"overflow-y-auto max-h-60 text-xs leading-relaxed whitespace-pre-wrap text-foreground",children:n})]})]})}function lb({tool:n}){const[l,o]=w.useState(!1);return f.jsxs("div",{className:"overflow-hidden rounded-md border border-border bg-background",children:[f.jsxs("button",{className:"w-full flex items-center justify-between p-2.5 hover:bg-accent/50 transition-colors",onClick:()=>o(!l),children:[f.jsx("span",{className:"font-mono text-sm text-purple",children:n.name}),n.parameters&&f.jsx(or,{className:`size-3 text-muted-foreground transition-transform ${l?"rotate-90":""}`})]}),l&&n.parameters&&f.jsxs("div",{className:"px-2.5 pb-2.5 border-t border-border",children:[n.description&&f.jsx("p",{className:"pt-2 mb-2 text-xs text-muted-foreground",children:n.description}),f.jsx(It,{data:n.parameters,compact:!0})]}),!l&&n.description&&f.jsx("div",{className:"px-2.5 pb-2 -mt-1",children:f.jsx("p",{className:"text-[11px] text-muted-foreground truncate",children:n.description})})]})}function ib({toolName:n,toolCallId:l,data:o}){const[s,u]=w.useState(!1),c=typeof o=="string"?rr(o):o;return f.jsxs("div",{className:"overflow-hidden rounded-md border border-purple/30",children:[f.jsxs("button",{className:"flex gap-2 items-center px-3 py-2 w-full transition-colors bg-purple/10 hover:bg-purple/20",onClick:()=>u(!s),children:[f.jsx(or,{className:`size-3 text-purple transition-transform shrink-0 ${s?"rotate-90":""}`}),f.jsx(kr,{className:"size-3 text-purple shrink-0"}),f.jsx("span",{className:"font-mono text-xs font-medium text-purple",children:n}),!s&&c!=null&&typeof c=="object"&&!Array.isArray(c)&&f.jsx("span",{className:"text-[11px] font-mono text-purple/70 truncate",children:qm(c)}),l&&f.jsx("span",{className:"text-[10px] font-mono text-muted-foreground/60 ml-auto shrink-0",children:l})]}),s&&f.jsx("div",{className:"p-3 border-t bg-card/50 border-purple/30",children:f.jsx(It,{data:c})})]})}function sb({toolName:n,toolCallId:l,data:o}){const[s,u]=w.useState(!1);return f.jsxs("div",{className:"overflow-hidden rounded-md border border-success/30",children:[f.jsxs("button",{className:"flex gap-2 items-center px-3 py-2 w-full transition-colors bg-success/10 hover:bg-success/20",onClick:()=>u(!s),children:[f.jsx(or,{className:`size-3 text-success transition-transform shrink-0 ${s?"rotate-90":""}`}),f.jsx("span",{className:"text-xs font-medium text-success",children:"Result"}),n&&f.jsx("span",{className:"text-[11px] font-mono text-muted-foreground",children:n}),l&&f.jsx("span",{className:"text-[10px] font-mono text-muted-foreground/60 ml-auto shrink-0",children:l})]}),s&&f.jsx("div",{className:"p-3 border-t bg-card/50 border-success/30",children:f.jsx(It,{data:o})})]})}function ab({modelId:n,provider:l,input:o,providerOptions:s,usage:u}){var m,h;const c=((m=o==null?void 0:o.tools)==null?void 0:m.length)??0,p=[];if((o==null?void 0:o.temperature)!=null&&p.push({label:"temp",value:String(o.temperature)}),(o==null?void 0:o.maxOutputTokens)!=null&&p.push({label:"max tokens",value:String(o.maxOutputTokens)}),(o==null?void 0:o.topP)!=null&&p.push({label:"topP",value:String(o.topP)}),(o==null?void 0:o.topK)!=null&&p.push({label:"topK",value:String(o.topK)}),(o==null?void 0:o.toolChoice)!=null){const y=typeof o.toolChoice=="string"?o.toolChoice:o.toolChoice.type;p.push({label:"tool choice",value:y})}return f.jsxs("div",{className:"flex items-center gap-2 px-4 py-2 bg-muted/20 border-b border-border text-[11px] text-muted-foreground",children:[l&&f.jsx("span",{className:"px-1.5 py-0.5 rounded bg-sidebar-primary/10 text-sidebar-primary text-[10px] font-medium",children:l}),f.jsx("span",{className:"font-mono",children:n}),p.length>0&&f.jsxs(f.Fragment,{children:[f.jsx("span",{className:"text-muted-foreground/30",children:"·"}),p.map((y,v)=>f.jsxs("span",{children:[y.label,": ",f.jsx("span",{className:"text-foreground",children:y.value}),v<p.length-1&&f.jsx("span",{className:"mx-1 text-muted-foreground/30",children:"·"})]},v))]}),c>0&&f.jsxs(f.Fragment,{children:[f.jsx("span",{className:"text-muted-foreground/30",children:"·"}),f.jsxs(Fi,{direction:"right",children:[f.jsx(Wi,{asChild:!0,children:f.jsxs("button",{className:"inline-flex gap-1 items-center transition-colors cursor-pointer hover:text-foreground",children:[f.jsx(kr,{className:"size-3"}),c," available ",c===1?"tool":"tools"]})}),f.jsxs(Bi,{className:"h-full w-[800px] sm:max-w-[800px] overflow-hidden",children:[f.jsx(Hi,{className:"border-b border-border shrink-0",children:f.jsxs(Vi,{children:["Available Tools (",c,")"]})}),f.jsx("div",{className:"overflow-y-auto flex-1 p-4",children:f.jsx("div",{className:"space-y-3",children:(h=o==null?void 0:o.tools)==null?void 0:h.map((y,v)=>f.jsx(lb,{tool:y},v))})})]})]})]}),s&&Object.keys(s).length>0&&f.jsxs(f.Fragment,{children:[f.jsx("span",{className:"text-muted-foreground/30",children:"·"}),f.jsxs(Fi,{direction:"right",children:[f.jsx(Wi,{asChild:!0,children:f.jsxs("button",{className:"inline-flex gap-1 items-center transition-colors cursor-pointer hover:text-foreground",children:[f.jsx(y0,{className:"size-3"}),"Provider options"]})}),f.jsxs(Bi,{className:"h-full w-[800px] sm:max-w-[800px] overflow-hidden",children:[f.jsx(Hi,{className:"border-b border-border shrink-0",children:f.jsx(Vi,{children:"Provider Options"})}),f.jsx("div",{className:"overflow-y-auto flex-1 p-4",children:f.jsx(It,{data:s,size:"lg"})})]})]})]}),u&&f.jsxs(f.Fragment,{children:[f.jsx("span",{className:"text-muted-foreground/30",children:"·"}),f.jsxs(Fi,{direction:"right",children:[f.jsx(Wi,{asChild:!0,children:f.jsxs("button",{className:"inline-flex gap-1 items-center transition-colors cursor-pointer hover:text-foreground",children:[f.jsx(o0,{className:"size-3"}),"Usage"]})}),f.jsxs(Bi,{className:"h-full w-[800px] sm:max-w-[800px] overflow-hidden",children:[f.jsx(Hi,{className:"border-b border-border shrink-0",children:f.jsx(Vi,{children:"Token Usage"})}),f.jsx("div",{className:"overflow-y-auto flex-1 p-4",children:f.jsx(ob,{usage:u})})]})]})]})]})}function zh({className:n,...l}){return f.jsx("div",{"data-slot":"card",className:fn("bg-card text-card-foreground flex flex-col gap-6 rounded-xl border py-6 shadow-sm",n),...l})}var ps="Collapsible",[ub,Pb]=cl(ps),[cb,Zu]=ub(ps),Ih=w.forwardRef((n,l)=>{const{__scopeCollapsible:o,open:s,defaultOpen:u,disabled:c,onOpenChange:p,...m}=n,[h,y]=Uu({prop:s,defaultProp:u??!1,onChange:p,caller:ps});return f.jsx(cb,{scope:o,disabled:c,contentId:ol(),open:h,onOpenToggle:w.useCallback(()=>y(v=>!v),[y]),children:f.jsx(He.div,{"data-state":ec(h),"data-disabled":c?"":void 0,...m,ref:l})})});Ih.displayName=ps;var $h="CollapsibleTrigger",Fh=w.forwardRef((n,l)=>{const{__scopeCollapsible:o,...s}=n,u=Zu($h,o);return f.jsx(He.button,{type:"button","aria-controls":u.contentId,"aria-expanded":u.open||!1,"data-state":ec(u.open),"data-disabled":u.disabled?"":void 0,disabled:u.disabled,...s,ref:l,onClick:Be(n.onClick,u.onOpenToggle)})});Fh.displayName=$h;var Ju="CollapsibleContent",Wh=w.forwardRef((n,l)=>{const{forceMount:o,...s}=n,u=Zu(Ju,n.__scopeCollapsible);return f.jsx(Zt,{present:o||u.open,children:({present:c})=>f.jsx(db,{...s,ref:l,present:c})})});Wh.displayName=Ju;var db=w.forwardRef((n,l)=>{const{__scopeCollapsible:o,present:s,children:u,...c}=n,p=Zu(Ju,o),[m,h]=w.useState(s),y=w.useRef(null),v=rt(l,y),x=w.useRef(0),S=x.current,C=w.useRef(0),P=C.current,k=p.open||m,E=w.useRef(k),A=w.useRef(void 0);return w.useEffect(()=>{const D=requestAnimationFrame(()=>E.current=!1);return()=>cancelAnimationFrame(D)},[]),cn(()=>{const D=y.current;if(D){A.current=A.current||{transitionDuration:D.style.transitionDuration,animationName:D.style.animationName},D.style.transitionDuration="0s",D.style.animationName="none";const $=D.getBoundingClientRect();x.current=$.height,C.current=$.width,E.current||(D.style.transitionDuration=A.current.transitionDuration,D.style.animationName=A.current.animationName),h(s)}},[p.open,s]),f.jsx(He.div,{"data-state":ec(p.open),"data-disabled":p.disabled?"":void 0,id:p.contentId,hidden:!k,...c,ref:v,style:{"--radix-collapsible-content-height":S?`${S}px`:void 0,"--radix-collapsible-content-width":P?`${P}px`:void 0,...n.style},children:k&&u})});function ec(n){return n?"open":"closed"}var fb=Ih;function pb({...n}){return f.jsx(fb,{"data-slot":"collapsible",...n})}function mb({...n}){return f.jsx(Fh,{"data-slot":"collapsible-trigger",...n})}function hb({...n}){return f.jsx(Wh,{"data-slot":"collapsible-content",...n})}function gb({input:n}){const l=(n==null?void 0:n.prompt)??[],o=l.length,s=l.slice(-2),u=Math.max(0,o-2);return f.jsxs(Fi,{direction:"right",children:[f.jsx(Wi,{asChild:!0,children:f.jsxs("button",{className:"w-full h-full text-left p-4 hover:bg-accent/30 transition-colors cursor-pointer flex flex-col justify-start",children:[f.jsx("h3",{className:"text-[11px] font-semibold uppercase tracking-wider text-muted-foreground mb-3",children:"Input"}),f.jsxs("div",{className:"space-y-3",children:[u>0&&f.jsxs("div",{className:"text-[11px] text-muted-foreground/60 text-center py-1.5 rounded-md bg-muted/30",children:["+ ",u," previous"," ",u===1?"message":"messages"]}),s.map((c,p)=>f.jsx(vb,{message:c,index:u+p+1},p)),o===0&&f.jsx("p",{className:"text-sm text-muted-foreground",children:"No messages"})]})]})}),f.jsxs(Bi,{className:"h-full w-[800px] sm:max-w-[800px] overflow-hidden",children:[f.jsx(Hi,{className:"border-b border-border shrink-0",children:f.jsxs(Vi,{children:["All Messages (",o,")"]})}),f.jsx("div",{className:"flex-1 overflow-y-auto p-4",children:f.jsx("div",{className:"space-y-3",children:l.map((c,p)=>f.jsx(yb,{message:c,index:p+1},p))})})]})]})}function Bh(n){return typeof n=="string"?n:Array.isArray(n)?n.filter(l=>l.type==="text").map(l=>l.text).join(""):""}function Hh(n){return Array.isArray(n)?n.filter(l=>l.type==="tool-call"):[]}function Vh(n){return Array.isArray(n)?n.filter(l=>l.type==="tool-result"):[]}function Uh(n){return Array.isArray(n)?n.filter(l=>l.type==="thinking"||l.type==="reasoning").map(l=>l.thinking||l.text||l.reasoning||"").join(""):""}function vb({message:n,index:l}){const{role:o,content:s}=n,u={user:"User",assistant:"Assistant",system:"System",tool:"Tool"},c=Bh(s),p=Hh(s),m=Vh(s),h=Uh(s),y=(c?1:0)+(h?1:0)+p.length+m.length;return f.jsxs("div",{className:"rounded-md border border-border/50 bg-background/50 p-2.5 space-y-2",children:[f.jsxs("div",{className:"flex items-center gap-2",children:[l&&f.jsx("span",{className:"text-[10px] font-mono text-muted-foreground/50",children:l}),f.jsx("span",{className:"text-[10px] font-medium uppercase tracking-wider text-muted-foreground",children:u[o]||o}),y>1&&f.jsxs("span",{className:"text-[10px] text-muted-foreground/60",children:[y," parts"]})]}),h&&f.jsx("div",{className:"text-xs text-amber-500/60",children:"[thinking]"}),c&&f.jsx("div",{className:"text-xs text-foreground/90 line-clamp-3",children:c}),p.length>0&&f.jsxs("div",{className:"space-y-1",children:[p.slice(0,3).map((v,x)=>{const S=v.args??v.input,C=typeof S=="string"?rr(S):S??{};return f.jsxs("div",{className:"text-[11px] font-mono text-muted-foreground truncate",children:[v.toolName,"(",d1(C),")"]},x)}),p.length>3&&f.jsxs("div",{className:"text-[11px] text-muted-foreground/60",children:["+",p.length-3," more tool"," ",p.length-3===1?"call":"calls"]})]}),m.length>0&&f.jsxs("div",{className:"space-y-1",children:[m.slice(0,3).map((v,x)=>{const S=v.result??v.output??v,C=f1(S);return f.jsxs("div",{className:"text-[11px] font-mono text-muted-foreground truncate",children:[v.toolName||"tool","(…) => ",C]},x)}),m.length>3&&f.jsxs("div",{className:"text-[11px] text-muted-foreground/60",children:["+",m.length-3," more tool"," ",m.length-3===1?"result":"results"]})]}),!c&&!h&&p.length===0&&m.length===0&&f.jsx("div",{className:"text-[11px] text-muted-foreground italic",children:"Empty message"})]})}function yb({message:n,index:l}){const{role:o,content:s}=n,u={user:"User",assistant:"Assistant",system:"System",tool:"Tool"},c=Bh(s),p=Hh(s),m=Vh(s),h=Uh(s),y=(c?1:0)+(h?1:0)+p.length+m.length;return f.jsxs("div",{className:"rounded-md border border-border/50 bg-background/50 p-3 space-y-2",children:[f.jsxs("div",{className:"flex items-center gap-2",children:[l&&f.jsx("span",{className:"text-[10px] font-mono text-muted-foreground/50",children:l}),f.jsx("span",{className:"text-[10px] font-medium uppercase tracking-wider text-muted-foreground",children:u[o]||o}),y>1&&f.jsxs("span",{className:"text-[10px] text-muted-foreground/60",children:[y," parts"]})]}),h&&f.jsx(Dh,{content:h}),c&&f.jsx(Lh,{content:c,defaultExpanded:!h&&p.length===0&&m.length===0,isSystem:o==="system"}),p.length>0&&f.jsx("div",{className:"space-y-2",children:p.map((v,x)=>f.jsx(ib,{toolName:v.toolName,toolCallId:v.toolCallId,data:v.args??v.input},x))}),m.length>0&&f.jsx("div",{className:"space-y-2",children:m.map((v,x)=>f.jsx(sb,{toolName:v.toolName,toolCallId:v.toolCallId,data:v.result??v.output??v},x))}),!c&&!h&&p.length===0&&m.length===0&&f.jsx("div",{className:"text-[11px] text-muted-foreground italic",children:"Empty message"})]})}function xb({output:n,toolResults:l=[]}){var y,v,x;const o=S=>l.find(C=>C.type==="tool-result"&&"toolCallId"in C&&C.toolCallId===S),s=(n==null?void 0:n.toolCalls)||(((y=n==null?void 0:n.content)==null?void 0:y.filter(S=>S.type==="tool-call"))??[]),u=(n==null?void 0:n.textParts)||(((v=n==null?void 0:n.content)==null?void 0:v.filter(S=>S.type==="text"))??[]),c=(n==null?void 0:n.reasoningParts)||(((x=n==null?void 0:n.content)==null?void 0:x.filter(S=>S.type==="thinking"||S.type==="reasoning"))??[]),p=u.map(S=>S.text).join(""),m=c.map(S=>S.text||S.thinking||S.reasoning||"").join(""),h=p&&!m&&s.length===0;return f.jsxs("div",{className:"space-y-3",children:[m&&f.jsx(Dh,{content:m}),p&&f.jsx(Lh,{content:p,defaultExpanded:!!h}),s.map((S,C)=>{const P=S.toolCallId?o(S.toolCallId):void 0;return f.jsx(wb,{toolName:S.toolName,args:S.args??S.input,result:(P==null?void 0:P.output)??(P==null?void 0:P.result)},C)})]})}function wb({toolName:n,args:l,result:o}){const[s,u]=w.useState(!1),c=typeof l=="string"?rr(l):l,p=typeof o=="string"?rr(o):o;return f.jsxs("div",{className:"rounded-md border border-purple/30 overflow-hidden",children:[f.jsxs("button",{className:"w-full flex items-center gap-2 px-3 py-2 bg-purple/10 hover:bg-purple/20 transition-colors",onClick:()=>u(!s),children:[f.jsx(or,{className:`size-3 text-purple transition-transform shrink-0 ${s?"rotate-90":""}`}),f.jsx(kr,{className:"size-3 text-purple shrink-0"}),f.jsx("span",{className:"text-xs font-mono font-medium text-purple",children:n}),!s&&c&&typeof c=="object"&&!Array.isArray(c)&&f.jsx("span",{className:"text-[11px] font-mono text-purple/70 truncate",children:qm(c)})]}),s&&f.jsxs(f.Fragment,{children:[f.jsxs("div",{className:"p-3 bg-card/50 border-t border-purple/30",children:[f.jsx("div",{className:"text-[10px] font-medium uppercase tracking-wider text-muted-foreground mb-2",children:"Input"}),f.jsx(It,{data:c})]}),p!=null&&f.jsxs("div",{className:"p-3 border-t border-border bg-success/5",children:[f.jsx("div",{className:"text-[10px] font-medium uppercase tracking-wider text-success mb-2",children:"Output"}),f.jsx(It,{data:p})]})]})]})}function Yh({step:n,index:l,steps:o,isRunInProgress:s,expandedSteps:u,toggleStep:c,parseJson:p,formatDuration:m,childRuns:h,depth:y}){const v=u.has(n.id),S=l===o.length-1&&s,C=p(n.input),P=p(n.output),k=p(n.usage),E=c1(P,n.error),D=u1(C,l===0);return f.jsx(pb,{open:v,onOpenChange:()=>c(n.id),children:f.jsxs(zh,{className:`overflow-hidden py-0 gap-0 ${S?"ring-2 ring-blue-500/50 ring-offset-1 ring-offset-background":""}`,children:[f.jsx(mb,{asChild:!0,children:f.jsxs("button",{className:`w-full flex items-center justify-between px-4 py-3 text-left transition-colors hover:bg-accent/50 ${v?"border-b border-border":""}`,children:[f.jsxs("div",{className:"flex items-center gap-3",children:[f.jsx("span",{className:"text-xs text-muted-foreground font-mono w-4",children:n.step_number}),f.jsxs("div",{className:"flex items-center gap-2",children:[D&&f.jsxs(f.Fragment,{children:[D.type==="user"?f.jsx(lo,{className:"size-3.5 text-muted-foreground"}):f.jsx(kr,{className:"size-3.5 text-muted-foreground"}),D.fullText||D.toolDetails?f.jsxs(to,{children:[f.jsx(no,{asChild:!0,children:f.jsx("span",{className:`text-sm text-muted-foreground ${D.type==="tool"?"font-mono":""}`,children:D.label})}),f.jsx(ro,{side:"bottom",className:"max-w-sm max-h-40 overflow-hidden",children:f.jsx("span",{className:"line-clamp-6",children:D.fullText||D.toolDetails})})]}):f.jsx("span",{className:`text-sm text-muted-foreground ${D.type==="tool"?"font-mono":""}`,children:D.label}),f.jsx("span",{className:"text-muted-foreground/50 mx-1",children:"→"})]}),E.icon==="wrench"&&f.jsx(kr,{className:"size-3.5 text-muted-foreground"}),E.icon==="message"&&f.jsx(lo,{className:"size-3.5 text-muted-foreground"}),E.icon==="alert"&&f.jsx(ns,{className:"size-3.5 text-destructive"}),E.toolDetails?f.jsxs(to,{children:[f.jsx(no,{asChild:!0,children:f.jsx("span",{className:"text-sm font-medium font-mono",children:E.label})}),f.jsx(ro,{children:E.toolDetails})]}):f.jsx("span",{className:`text-sm font-medium ${E.icon==="wrench"?"font-mono":""}`,children:E.label})]})]}),f.jsxs("div",{className:"flex items-center gap-4",children:[S?f.jsxs("span",{className:"text-[11px] text-blue-400 font-medium flex items-center gap-1.5",children:[f.jsx(il,{className:"size-3 animate-spin"}),"streaming"]}):f.jsx("span",{className:"text-[11px] text-muted-foreground font-mono",children:m(n.duration_ms)}),k&&f.jsxs(to,{children:[f.jsx(no,{asChild:!0,children:f.jsxs("span",{className:"text-[11px] font-mono text-muted-foreground cursor-help",children:[Gm(Ji(k.inputTokens))," ",f.jsx("span",{className:"text-muted-foreground/50",children:"→"})," ",Km(es(k.outputTokens))]})}),f.jsx(ro,{children:f.jsx(Mh,{input:Ji(k.inputTokens),output:es(k.outputTokens),raw:k.raw})})]}),f.jsx(u0,{className:`size-4 text-muted-foreground transition-transform ${v?"rotate-180":""}`})]})]})}),f.jsx(hb,{children:f.jsx(Xh,{step:n,index:l,steps:o,isRunInProgress:s,parseJson:p,formatDuration:m,childRuns:h,expandedSteps:u,toggleStep:c,depth:y})})]})})}function Xh({step:n,index:l,steps:o,isRunInProgress:s,parseJson:u,formatDuration:c,childRuns:p,expandedSteps:m,toggleStep:h,depth:y}){var D,$;const x=l===o.length-1&&s,S=u(n.input),C=u(n.output),P=u(n.usage),k=o[l+1],E=k?u(k.input):null,A=(($=(D=E==null?void 0:E.prompt)==null?void 0:D.filter(N=>N.role==="tool"))==null?void 0:$.flatMap(N=>Array.isArray(N.content)?N.content:[]))??[];return f.jsxs(f.Fragment,{children:[f.jsx(ab,{modelId:n.model_id,provider:n.provider,input:S,providerOptions:u(n.provider_options),usage:P}),f.jsxs("div",{className:"grid grid-cols-2 divide-x divide-border",children:[f.jsx("div",{className:"bg-card/50",children:f.jsx(gb,{input:S})}),f.jsxs("div",{className:"p-4 bg-background min-h-full",children:[f.jsx("h3",{className:"text-[11px] font-semibold uppercase tracking-wider text-muted-foreground mb-3",children:"Output"}),n.error?f.jsx("div",{className:"p-3 rounded-md bg-destructive/10 border border-destructive/30 text-sm text-destructive-foreground font-mono",children:n.error}):C?f.jsx(xb,{output:C,toolResults:A}):x?f.jsxs("div",{className:"flex items-center gap-2 text-sm text-blue-400",children:[f.jsx(il,{className:"size-4 animate-spin"}),f.jsx("span",{children:"Waiting for response..."})]}):f.jsx("p",{className:"text-sm text-muted-foreground",children:"No output"})]})]}),p.length>0&&m&&h&&f.jsx(Sb,{childRuns:p,expandedSteps:m,toggleStep:h,parseJson:u,formatDuration:c,depth:y}),f.jsx(rb,{rawRequest:n.raw_request,rawResponse:n.raw_response,rawChunks:n.raw_chunks,isStream:n.type==="stream"})]})}function Sb({childRuns:n,expandedSteps:l,toggleStep:o,parseJson:s,formatDuration:u,depth:c}){return f.jsxs("div",{className:"border-t border-border bg-muted/10",children:[f.jsxs("div",{className:"px-4 py-2 flex items-center gap-2",children:[f.jsx("div",{className:"h-px flex-1 bg-border"}),f.jsxs("span",{className:"text-[10px] font-medium uppercase tracking-wider text-muted-foreground shrink-0",children:["Sub-agent ",n.length===1?"call":"calls"," (",n.length,")"]}),f.jsx("div",{className:"h-px flex-1 bg-border"})]}),f.jsx("div",{className:"px-4 pb-3 flex flex-col gap-2",children:n.map(p=>f.jsx(bb,{childRun:p,expandedSteps:l,toggleStep:o,parseJson:s,formatDuration:u,depth:c+1},p.run.id))})]})}function bb({childRun:n,expandedSteps:l,toggleStep:o,parseJson:s,formatDuration:u,depth:c}){var k;const[p,m]=w.useState(!1),h=n.steps[0],y=h?s(h.input):null,x=[...(y==null?void 0:y.prompt)??[]].reverse().find(E=>E.role==="user");let S="Sub-agent call";if(x){const E=typeof x.content=="string"?x.content:Array.isArray(x.content)&&((k=x.content.find(A=>A.type==="text"))==null?void 0:k.text)||"";S=E.length>60?E.slice(0,60)+"...":E}const C=n.steps.reduce((E,A)=>E+(A.duration_ms||0),0),P=h==null?void 0:h.model_id;return f.jsxs("div",{className:"rounded-md border border-cyan-500/30 overflow-hidden",children:[f.jsxs("button",{className:"w-full flex items-center gap-2 px-3 py-2 bg-cyan-500/10 hover:bg-cyan-500/15 transition-colors",onClick:()=>m(!p),children:[f.jsx(or,{className:`size-3 text-cyan-400 transition-transform shrink-0 ${p?"rotate-90":""}`}),f.jsx(ll,{className:"size-3 text-cyan-400 shrink-0"}),f.jsx("span",{className:"text-xs font-medium text-cyan-400 truncate",children:S}),f.jsxs("span",{className:"ml-auto flex items-center gap-3 shrink-0",children:[P&&f.jsx("span",{className:"text-[10px] font-mono text-muted-foreground",children:P}),f.jsxs("span",{className:"text-[10px] text-muted-foreground",children:[n.steps.length," ",n.steps.length===1?"step":"steps"]}),f.jsx("span",{className:"text-[10px] font-mono text-muted-foreground",children:u(C)}),n.run.isInProgress&&f.jsx(il,{className:"size-3 text-blue-400 animate-spin"})]})]}),p&&f.jsx("div",{className:"border-t border-cyan-500/20 bg-background/50 p-3 flex flex-col gap-2",children:n.steps.map((E,A)=>{const D=(n.childRuns??[]).filter($=>$.run.parent_step_id===E.id);return f.jsx(Yh,{step:E,index:A,steps:n.steps,isRunInProgress:n.run.isInProgress??!1,expandedSteps:l,toggleStep:o,parseJson:s,formatDuration:u,childRuns:D,depth:c},E.id)})})]})}function Cb({runDetail:n,parseJson:l,formatDuration:o}){const[s,u]=w.useState(null),[c,p]=w.useState(280),m=w.useRef(!1),h=w.useMemo(()=>h1(n,l),[n,l]),y=w.useMemo(()=>{const R=[];function W(Q,ee){R.push(...Q);for(const ce of ee)W(ce.steps,ce.childRuns??[])}return W(n.steps,n.childRuns??[]),R},[n]),v=w.useMemo(()=>{const R=[];function W(Q){for(const ee of Q)R.push(ee),W(ee.childRuns??[])}return W(n.childRuns??[]),R},[n]),x=w.useCallback(R=>{R.preventDefault(),R.stopPropagation(),m.current=!0;const W=R.clientX,Q=c,ee=U=>{if(!m.current)return;const q=Math.min(Math.max(Q+(U.clientX-W),120),600);p(q)},ce=()=>{m.current=!1,document.removeEventListener("mousemove",ee),document.removeEventListener("mouseup",ce),document.body.style.cursor="",document.body.style.userSelect=""};document.addEventListener("mousemove",ee),document.addEventListener("mouseup",ce),document.body.style.cursor="col-resize",document.body.style.userSelect="none"},[c]);if(h.length===0)return null;const S=Math.max(...h.map(R=>R.startMs+R.durationMs),1),C=5,P=Array.from({length:C+1},(R,W)=>{const Q=S/C*W;return{ms:Q,label:Q<1e3?`${Math.round(Q)}ms`:`${(Q/1e3).toFixed(1)}s`}}),k=28,E=R=>{u(W=>W===R?null:R)},A=s?h.find(R=>R.id===s):null,D=(A==null?void 0:A.stepId)??s,$=D?y.find(R=>R.id===D):null,N=$?(()=>{if(n.steps.find(W=>W.id===$.id))return n.steps.findIndex(W=>W.id===$.id);const R=v.find(W=>W.steps.some(Q=>Q.id===$.id));return(R==null?void 0:R.steps.findIndex(W=>W.id===$.id))??0})():0,F=$?(()=>{if(n.steps.find(W=>W.id===$.id))return n.steps;const R=v.find(W=>W.steps.some(Q=>Q.id===$.id));return(R==null?void 0:R.steps)??n.steps})():n.steps,V=$?v.filter(R=>R.run.parent_step_id===$.id):[],L=R=>{switch(R){case"child-run":return f.jsx(ll,{className:"size-3 text-cyan-400 shrink-0"});case"thinking":return f.jsx(ll,{className:"size-3 text-amber-500 shrink-0"});case"tool-call":return f.jsx(kr,{className:"size-3 text-purple-400 shrink-0"});case"text":return f.jsx(lo,{className:"size-3 text-emerald-400 shrink-0"});case"error":return f.jsx(ns,{className:"size-3 text-red-400 shrink-0"});default:return f.jsx(Dp,{className:"size-3 text-blue-400 shrink-0"})}};return f.jsxs("div",{className:"space-y-4",children:[f.jsxs("div",{className:"rounded-lg border border-border bg-card overflow-hidden",children:[f.jsxs("div",{className:"px-4 py-2 border-b border-border bg-muted/20 flex items-center justify-between",children:[f.jsx("span",{className:"text-[11px] font-medium uppercase tracking-wider text-muted-foreground",children:"Trace Timeline"}),f.jsx("span",{className:"text-[11px] font-mono text-muted-foreground",children:o(S)})]}),f.jsx("div",{className:"overflow-x-auto",children:f.jsxs("div",{style:{minWidth:c+400},children:[f.jsxs("div",{className:"flex border-b border-border/50",style:{height:22},children:[f.jsx("div",{style:{width:c,minWidth:c},className:"shrink-0"}),f.jsx("div",{className:"w-1 shrink-0 cursor-col-resize hover:bg-primary/30",onMouseDown:x}),f.jsx("div",{className:"flex-1 relative",children:P.map((R,W)=>f.jsx("span",{className:"absolute text-[9px] font-mono text-muted-foreground/60 -translate-x-1/2",style:{left:`${R.ms/S*100}%`,top:5},children:R.label},W))})]}),h.map(R=>{const W=R.startMs/S*100,Q=Math.max(R.durationMs/S*100,.3),ee=s===R.id;return f.jsxs("div",{className:`flex items-center border-b border-border/30 transition-colors cursor-pointer ${ee?"bg-accent":"hover:bg-accent/30"}`,style:{height:k},onClick:()=>E(R.id),children:[f.jsxs("div",{className:"shrink-0 flex items-center gap-1.5 px-2 overflow-hidden",style:{width:c,minWidth:c,paddingLeft:8+R.depth*16},children:[L(R.kind),f.jsx("span",{className:"text-[11px] font-mono text-foreground truncate",children:R.label}),R.sublabel&&f.jsx("span",{className:"text-[10px] text-muted-foreground truncate",children:R.sublabel}),f.jsx("span",{className:"ml-auto text-[10px] font-mono text-muted-foreground shrink-0 pl-1",children:o(R.durationMs||null)}),R.tokens&&f.jsxs("span",{className:"text-[9px] font-mono text-muted-foreground/60 shrink-0",children:[R.tokens.input,"→",R.tokens.output]})]}),f.jsx("div",{className:"w-1 shrink-0 cursor-col-resize hover:bg-primary/30 self-stretch",onMouseDown:x}),f.jsxs("div",{className:"flex-1 relative h-full",children:[P.map((ce,U)=>f.jsx("div",{className:"absolute top-0 bottom-0 border-l border-border/20",style:{left:`${ce.ms/S*100}%`}},U)),f.jsxs(to,{children:[f.jsx(no,{asChild:!0,children:f.jsx("div",{className:"absolute top-1 bottom-1 flex items-center cursor-pointer",style:{left:`${W}%`,width:`${Q}%`,minWidth:3},children:f.jsx("div",{className:`h-full w-full rounded-sm ${ee?"ring-2 ring-foreground/50 ring-offset-1 ring-offset-background":""} ${R.isInProgress?`${m1[R.kind]} animate-pulse`:p1[R.kind]}`})})}),f.jsx(ro,{side:"top",className:"max-w-xs",children:f.jsxs("div",{className:"text-xs space-y-1",children:[f.jsx("div",{className:"font-medium",children:R.label}),R.sublabel&&f.jsx("div",{className:"text-muted-foreground",children:R.sublabel}),R.modelId&&R.modelId!==R.label&&f.jsx("div",{className:"text-muted-foreground font-mono",children:R.modelId}),f.jsxs("div",{className:"text-muted-foreground font-mono",children:[o(R.durationMs||null),R.tokens&&f.jsxs("span",{className:"ml-2",children:[R.tokens.input," in → ",R.tokens.output," ","out"]})]}),f.jsxs("div",{className:"text-muted-foreground/60 pt-0.5",children:["Click to ",ee?"deselect":"view details"]})]})})]})]})]},R.id)})]})})]}),$&&A&&f.jsxs(zh,{className:"overflow-hidden py-0 gap-0",children:[f.jsxs("div",{className:"flex items-center justify-between px-4 py-2.5 bg-muted/20 border-b border-border",children:[f.jsxs("div",{className:"flex items-center gap-2",children:[L(A.kind),f.jsxs("span",{className:"text-xs text-muted-foreground font-mono",children:["Step ",N+1]}),A.kind!=="step"&&f.jsx(gu,{variant:"secondary",className:"text-[10px] h-5 capitalize",children:A.kind}),f.jsx("span",{className:"text-xs font-medium font-mono",children:A.label}),$.provider&&f.jsx("span",{className:"px-1.5 py-0.5 rounded bg-sidebar-primary/10 text-sidebar-primary text-[10px] font-medium",children:$.provider})]}),f.jsx("button",{onClick:()=>u(null),className:"text-[11px] text-muted-foreground hover:text-foreground transition-colors",children:"Deselect"})]}),f.jsx(kb,{span:A,step:$,stepIndex:N,steps:F,runDetail:n,parseJson:l,formatDuration:o,childRuns:V})]})]})}function kb({span:n,step:l,stepIndex:o,steps:s,runDetail:u,parseJson:c,formatDuration:p,childRuns:m}){const h=c(l.output),y=(h==null?void 0:h.content)??[];if(n.kind==="tool-call"&&n.toolCallId){const v=y.find(E=>E.type==="tool-call"&&"toolCallId"in E&&E.toolCallId===n.toolCallId),x=y.find(E=>E.type==="tool-result"&&"toolCallId"in E&&E.toolCallId===n.toolCallId),S=(v==null?void 0:v.input)??(v==null?void 0:v.args),C=typeof S=="string"?rr(S):S,P=(x==null?void 0:x.output)??(x==null?void 0:x.result),k=typeof P=="string"?rr(P):P;return f.jsxs("div",{className:"p-4 space-y-4",children:[f.jsxs("div",{className:"flex items-center gap-2 mb-1",children:[f.jsx(kr,{className:"size-4 text-purple-400"}),f.jsx("span",{className:"text-sm font-mono font-medium text-purple-400",children:n.label})]}),C!=null&&f.jsxs("div",{children:[f.jsx("h4",{className:"text-[11px] font-semibold uppercase tracking-wider text-muted-foreground mb-2",children:"Input"}),f.jsx(It,{data:C})]}),k!=null&&f.jsxs("div",{children:[f.jsx("h4",{className:"text-[11px] font-semibold uppercase tracking-wider text-success mb-2",children:"Output"}),f.jsx(It,{data:k})]}),!C&&!k&&f.jsx("p",{className:"text-sm text-muted-foreground",children:"No data available for this tool call."})]})}return n.kind==="thinking"&&n.thinkingText?f.jsxs("div",{className:"p-4 space-y-2",children:[f.jsxs("div",{className:"flex items-center gap-2 mb-1",children:[f.jsx(ll,{className:"size-4 text-amber-500"}),f.jsx("span",{className:"text-sm font-medium text-amber-500",children:"Thinking"})]}),f.jsx("div",{className:"text-sm text-foreground/80 leading-relaxed whitespace-pre-wrap rounded-md border border-amber-500/20 bg-amber-500/5 p-3",children:n.thinkingText})]}):n.kind==="text"&&n.textContent?f.jsxs("div",{className:"p-4 space-y-2",children:[f.jsxs("div",{className:"flex items-center gap-2 mb-1",children:[f.jsx(lo,{className:"size-4 text-emerald-400"}),f.jsx("span",{className:"text-sm font-medium text-emerald-400",children:"Text Response"})]}),f.jsx("div",{className:"text-sm text-foreground/80 leading-relaxed whitespace-pre-wrap rounded-md border border-border bg-background p-3",children:n.textContent})]}):n.kind==="error"?f.jsxs("div",{className:"p-4 space-y-2",children:[f.jsxs("div",{className:"flex items-center gap-2 mb-1",children:[f.jsx(ns,{className:"size-4 text-red-400"}),f.jsx("span",{className:"text-sm font-medium text-red-400",children:"Error"})]}),f.jsx("div",{className:"text-sm text-destructive-foreground font-mono whitespace-pre-wrap rounded-md border border-destructive/30 bg-destructive/10 p-3",children:l.error})]}):f.jsx(Xh,{step:l,index:o,steps:s,isRunInProgress:u.run.isInProgress??!1,parseJson:c,formatDuration:p,childRuns:m,depth:0})}function Eb(){const[n,l]=w.useState([]),[o,s]=w.useState(null),[u,c]=w.useState(new Set),[p,m]=w.useState(!0),[h,y]=w.useState(!1),v=async()=>{try{const F=await(await fetch("/api/runs")).json();l(F)}catch(N){console.error("Failed to fetch runs:",N)}finally{m(!1)}},x=async()=>{await fetch("/api/clear",{method:"POST"}),l([]),s(null)};w.useEffect(()=>{v()},[]),w.useEffect(()=>{let N=null,F=null;const V=()=>{N=new EventSource("/api/events"),N.addEventListener("connected",()=>{console.log("[DevTools] Connected to real-time updates")}),N.addEventListener("update",()=>{v(),o&&fetch(`/api/runs/${o.run.id}`).then(L=>L.json()).then(L=>{L&&!L.error&&s(L)}).catch(()=>{})}),N.addEventListener("heartbeat",()=>{}),N.onerror=()=>{console.log("[DevTools] SSE connection lost, reconnecting..."),N==null||N.close(),F=setTimeout(V,2e3)}};return V(),()=>{N==null||N.close(),F&&clearTimeout(F)}},[o==null?void 0:o.run.id]);const S=async N=>{const V=await(await fetch(`/api/runs/${N}`)).json();s(V),c(new Set)},C=N=>{c(F=>{const V=new Set(F);return V.has(N)?V.delete(N):V.add(N),V})},P=N=>N===null?"-":N<1e3?`${N}ms`:`${(N/1e3).toFixed(2)}s`,k=N=>{if(!N)return null;try{return JSON.parse(N)}catch{return N}},E=N=>{var R,W;const F=N[0];if(!F)return"Empty run";const V=k(F.input),L=(R=V==null?void 0:V.prompt)==null?void 0:R.find(Q=>Q.role==="user");if(L){const Q=typeof L.content=="string"?L.content:Array.isArray(L.content)&&((W=L.content.find(ee=>ee.type==="text"))==null?void 0:W.text)||"";return Q.slice(0,50)+(Q.length>50?"...":"")}return"No user message"},A=N=>N.some(F=>F.error),D=N=>N.reduce((F,V)=>F+(V.duration_ms||0),0),$=N=>N.reduce((F,V)=>{const L=k(V.usage),R=Ji(L==null?void 0:L.inputTokens),W=es(L==null?void 0:L.outputTokens),Q={total:F.input.total+R.total};(F.input.noCache!==void 0||R.noCache!==void 0)&&(Q.noCache=(F.input.noCache??0)+(R.noCache??0)),(F.input.cacheRead!==void 0||R.cacheRead!==void 0)&&(Q.cacheRead=(F.input.cacheRead??0)+(R.cacheRead??0)),(F.input.cacheWrite!==void 0||R.cacheWrite!==void 0)&&(Q.cacheWrite=(F.input.cacheWrite??0)+(R.cacheWrite??0));const ee={total:F.output.total+W.total};return(F.output.text!==void 0||W.text!==void 0)&&(ee.text=(F.output.text??0)+(W.text??0)),(F.output.reasoning!==void 0||W.reasoning!==void 0)&&(ee.reasoning=(F.output.reasoning??0)+(W.reasoning??0)),{input:Q,output:ee}},{input:{total:0},output:{total:0}});return f.jsxs("div",{className:"flex flex-col h-screen bg-background",children:[f.jsxs("header",{className:"flex justify-between items-center px-5 py-3 border-b border-border bg-card",children:[f.jsxs("div",{className:"flex items-center gap-2",children:[f.jsx(C0,{}),f.jsx("span",{className:"text-base font-medium text-muted-foreground",children:"DevTools"})]}),f.jsxs("div",{className:"flex gap-2",children:[f.jsxs(Zf,{variant:"ghost",size:"sm",onClick:v,className:"h-8 px-3 text-xs",children:[f.jsx(g0,{className:"size-3.5"}),"Refresh"]}),f.jsxs(Zf,{variant:"ghost",size:"sm",onClick:x,className:"h-8 px-3 text-xs text-destructive-foreground hover:bg-destructive/20",children:[f.jsx(w0,{className:"size-3.5"}),"Clear"]})]})]}),f.jsxs("div",{className:"flex flex-1 overflow-hidden",children:[f.jsxs("aside",{className:"w-[300px] border-r border-border bg-sidebar flex flex-col",children:[f.jsx("div",{className:"px-4 py-3 border-b border-border",children:f.jsx("span",{className:"text-[11px] font-medium uppercase tracking-wider text-muted-foreground",children:"Runs"})}),f.jsx(ep,{className:"flex-1 overflow-hidden",children:p?f.jsx("p",{className:"p-4 text-muted-foreground text-sm",children:"Loading..."}):n.length===0?f.jsx("p",{className:"p-4 text-muted-foreground text-sm",children:"No runs yet"}):f.jsx("div",{children:n.map(N=>{const F=(o==null?void 0:o.run.id)===N.id;return f.jsxs("button",{className:`w-full text-left px-4 py-3 border-b border-border/50 transition-colors ${F?"bg-accent":"hover:bg-accent/50"}`,onClick:()=>S(N.id),children:[f.jsxs("div",{className:"flex items-start gap-2 mb-1.5 min-w-0",children:[N.isInProgress?f.jsx(il,{className:"size-3.5 text-blue-400 mt-0.5 shrink-0 animate-spin"}):N.hasError?f.jsx(ns,{className:"size-3.5 text-destructive-foreground mt-0.5 shrink-0"}):f.jsx(lo,{className:"size-3.5 text-muted-foreground mt-0.5 shrink-0"}),f.jsxs("div",{className:"min-w-0",children:[N.function_id&&f.jsx("span",{className:"text-[11px] font-mono text-sidebar-primary block truncate",children:N.function_id}),f.jsx("span",{className:"text-[13px] text-foreground leading-tight line-clamp-1 break-all",children:N.firstMessage||"Loading..."})]})]}),f.jsxs("div",{className:"flex items-center gap-2 ml-5.5 text-[11px] text-muted-foreground",children:[N.type&&f.jsxs("span",{className:`flex items-center gap-1 px-1.5 py-0.5 rounded text-[10px] font-medium ${N.type==="stream"?"bg-blue-500/15 text-blue-400":"bg-emerald-500/15 text-emerald-400"}`,children:[N.type==="stream"&&f.jsx(Dp,{className:"size-2.5"}),N.type]}),f.jsxs("span",{children:[N.stepCount," ",N.stepCount===1?"step":"steps"]}),f.jsx("span",{children:"·"}),f.jsx("span",{className:"font-mono",children:new Date(N.started_at).toLocaleTimeString([],{hour:"2-digit",minute:"2-digit"})})]})]},N.id)})})})]}),f.jsx("main",{className:"flex-1 overflow-hidden",children:f.jsx(ep,{className:"h-full",children:o?f.jsxs("div",{className:"p-5",children:[f.jsxs("div",{className:"flex items-center justify-between mb-5",children:[f.jsxs("div",{className:"flex items-center gap-3",children:[f.jsx("h2",{className:"text-sm font-medium text-foreground",children:E(o.steps)}),o.run.isInProgress&&f.jsxs(gu,{variant:"secondary",className:"text-[10px] h-5 gap-1.5 bg-blue-500/15 text-blue-400 border-blue-500/30",children:[f.jsx(il,{className:"size-3 animate-spin"}),"In Progress"]}),A(o.steps)&&f.jsx(gu,{variant:"destructive",className:"text-[10px] h-5",children:"Error"})]}),f.jsxs("div",{className:"flex items-center text-xs text-muted-foreground",children:[f.jsxs("span",{children:[o.steps.length," steps"]}),f.jsx("span",{className:"px-3 text-muted-foreground/30",children:"·"}),f.jsx("span",{className:"font-mono",children:P(D(o.steps))}),f.jsx("span",{className:"px-3 text-muted-foreground/30",children:"·"}),f.jsxs(to,{children:[f.jsx(no,{asChild:!0,children:f.jsxs("span",{className:"font-mono cursor-help",children:["input:"," ",Gm($(o.steps).input)," ",f.jsx("span",{className:"text-muted-foreground/50",children:"→"})," ","output:"," ",Km($(o.steps).output)]})}),f.jsx(ro,{children:f.jsx(Mh,{input:$(o.steps).input,output:$(o.steps).output})})]}),f.jsx("span",{className:"px-3 text-muted-foreground/30",children:"·"}),f.jsx("span",{children:new Date(o.run.started_at).toLocaleString()}),f.jsx("span",{className:"px-3 text-muted-foreground/30",children:"·"}),f.jsxs(to,{children:[f.jsx(no,{asChild:!0,children:f.jsxs("button",{onClick:()=>y(N=>!N),className:`inline-flex items-center gap-1.5 px-2 py-1 rounded-md text-[11px] font-medium transition-colors ${h?"bg-accent text-foreground":"text-muted-foreground hover:text-foreground hover:bg-accent/50"}`,children:[f.jsx(i0,{className:"size-3.5"}),"Timeline"]})}),f.jsx(ro,{children:h?"Switch to steps view":"Switch to timeline view"})]})]})]}),h?f.jsx(Cb,{runDetail:o,parseJson:k,formatDuration:P}):f.jsx("div",{className:"flex flex-col gap-3",children:o.steps.map((N,F)=>{const V=(o.childRuns??[]).filter(L=>L.run.parent_step_id===N.id);return f.jsx(Yh,{step:N,index:F,steps:o.steps,isRunInProgress:o.run.isInProgress??!1,expandedSteps:u,toggleStep:C,parseJson:k,formatDuration:P,childRuns:V,depth:0},N.id)})})]}):f.jsx("div",{className:"flex items-center justify-center min-h-[calc(100vh-57px)] text-muted-foreground",children:f.jsx("p",{className:"text-sm",children:"Select a run to view details"})})})})]})]})}Kv.createRoot(document.getElementById("root")).render(f.jsx(Eb,{}));
|
package/dist/client/index.html
CHANGED
|
@@ -10,7 +10,7 @@
|
|
|
10
10
|
href="https://fonts.googleapis.com/css2?family=Geist:wght@400;500;600;700&family=Geist+Mono:wght@400;500;600;700&display=swap"
|
|
11
11
|
rel="stylesheet"
|
|
12
12
|
/>
|
|
13
|
-
<script type="module" crossorigin src="/assets/index-
|
|
13
|
+
<script type="module" crossorigin src="/assets/index-DYruJ8X0.js"></script>
|
|
14
14
|
<link rel="stylesheet" crossorigin href="/assets/index-B1quREL_.css">
|
|
15
15
|
</head>
|
|
16
16
|
<body>
|
package/dist/index.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { LanguageModelV4Middleware } from '@ai-sdk/provider';
|
|
2
|
-
import {
|
|
2
|
+
import { Telemetry } from 'ai';
|
|
3
3
|
|
|
4
4
|
/**
|
|
5
5
|
* Factory function that creates a devtools middleware instance.
|
|
@@ -25,15 +25,15 @@ declare const devToolsMiddleware: () => LanguageModelV4Middleware;
|
|
|
25
25
|
*
|
|
26
26
|
* Usage:
|
|
27
27
|
* ```ts
|
|
28
|
-
* import {
|
|
28
|
+
* import { registerTelemetry } from 'ai';
|
|
29
29
|
* import { DevToolsTelemetry } from '@ai-sdk/devtools';
|
|
30
30
|
*
|
|
31
|
-
*
|
|
31
|
+
* registerTelemetry(DevToolsTelemetry());
|
|
32
32
|
* ```
|
|
33
33
|
*
|
|
34
|
-
* Telemetry is enabled by default — no need to set `
|
|
34
|
+
* Telemetry is enabled by default — no need to set `telemetry`
|
|
35
35
|
* unless you want to configure `functionId`, `recordInputs`, or `recordOutputs`.
|
|
36
36
|
*/
|
|
37
|
-
declare function DevToolsTelemetry():
|
|
37
|
+
declare function DevToolsTelemetry(): Telemetry;
|
|
38
38
|
|
|
39
39
|
export { DevToolsTelemetry, devToolsMiddleware };
|
package/dist/index.js
CHANGED
|
@@ -505,13 +505,14 @@ function DevToolsTelemetry() {
|
|
|
505
505
|
streamChunks: [],
|
|
506
506
|
rawStreamChunks: []
|
|
507
507
|
};
|
|
508
|
-
|
|
508
|
+
const stepNumber = stepStartEvent.steps.length;
|
|
509
|
+
state.stepStates.set(stepNumber, stepState);
|
|
509
510
|
activeSteps2.set(stepId, stepState);
|
|
510
511
|
const prompt = stepStartEvent.promptMessages ?? stepStartEvent.messages;
|
|
511
512
|
await createStep({
|
|
512
513
|
id: stepId,
|
|
513
514
|
run_id: state.runId,
|
|
514
|
-
step_number:
|
|
515
|
+
step_number: stepNumber + 1,
|
|
515
516
|
type: state.operationType,
|
|
516
517
|
model_id: stepStartEvent.modelId,
|
|
517
518
|
provider: stepStartEvent.provider ?? null,
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ai-sdk/devtools",
|
|
3
|
-
"version": "1.0.0-beta.
|
|
3
|
+
"version": "1.0.0-beta.17",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"main": "./dist/index.js",
|
|
6
6
|
"module": "./dist/index.js",
|
|
@@ -49,15 +49,36 @@
|
|
|
49
49
|
"tailwind-merge": "^3.4.0",
|
|
50
50
|
"tailwindcss": "^4.1.17",
|
|
51
51
|
"tsup": "^8",
|
|
52
|
-
"vitest": "^
|
|
52
|
+
"vitest": "^4.1.5",
|
|
53
53
|
"tsx": "^4.19.2",
|
|
54
54
|
"tw-animate-css": "^1.4.0",
|
|
55
55
|
"typescript": "5.8.3",
|
|
56
56
|
"vaul": "^1.1.2",
|
|
57
57
|
"vite": "^6.0.3",
|
|
58
58
|
"zod": "3.25.76",
|
|
59
|
-
"ai": "7.0.0-beta.
|
|
59
|
+
"ai": "7.0.0-beta.112"
|
|
60
60
|
},
|
|
61
|
+
"publishConfig": {
|
|
62
|
+
"access": "public",
|
|
63
|
+
"provenance": true
|
|
64
|
+
},
|
|
65
|
+
"homepage": "https://ai-sdk.dev/docs",
|
|
66
|
+
"repository": {
|
|
67
|
+
"type": "git",
|
|
68
|
+
"url": "https://github.com/vercel/ai",
|
|
69
|
+
"directory": "packages/devtools"
|
|
70
|
+
},
|
|
71
|
+
"bugs": {
|
|
72
|
+
"url": "https://github.com/vercel/ai/issues"
|
|
73
|
+
},
|
|
74
|
+
"license": "Apache-2.0",
|
|
75
|
+
"sideEffects": false,
|
|
76
|
+
"engines": {
|
|
77
|
+
"node": ">=18"
|
|
78
|
+
},
|
|
79
|
+
"keywords": [
|
|
80
|
+
"ai"
|
|
81
|
+
],
|
|
61
82
|
"scripts": {
|
|
62
83
|
"dev": "concurrently -k \"pnpm dev:api\" \"pnpm dev:client\"",
|
|
63
84
|
"dev:api": "AI_SDK_DEVTOOLS_DEV=true tsx src/viewer/server.ts",
|
package/src/integration.ts
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import type {
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
2
|
+
GenerateTextStartEvent,
|
|
3
|
+
GenerateTextStepStartEvent,
|
|
4
|
+
GenerateTextStepEndEvent,
|
|
5
|
+
StreamTextChunkEvent,
|
|
6
|
+
GenerateObjectStartEvent,
|
|
7
|
+
GenerateObjectStepStartEvent,
|
|
8
|
+
GenerateObjectStepEndEvent,
|
|
9
|
+
Telemetry,
|
|
10
10
|
ToolSet,
|
|
11
11
|
} from 'ai';
|
|
12
12
|
import {
|
|
@@ -93,16 +93,16 @@ function getOperationType(operationId: string): OperationType {
|
|
|
93
93
|
*
|
|
94
94
|
* Usage:
|
|
95
95
|
* ```ts
|
|
96
|
-
* import {
|
|
96
|
+
* import { registerTelemetry } from 'ai';
|
|
97
97
|
* import { DevToolsTelemetry } from '@ai-sdk/devtools';
|
|
98
98
|
*
|
|
99
|
-
*
|
|
99
|
+
* registerTelemetry(DevToolsTelemetry());
|
|
100
100
|
* ```
|
|
101
101
|
*
|
|
102
|
-
* Telemetry is enabled by default — no need to set `
|
|
102
|
+
* Telemetry is enabled by default — no need to set `telemetry`
|
|
103
103
|
* unless you want to configure `functionId`, `recordInputs`, or `recordOutputs`.
|
|
104
104
|
*/
|
|
105
|
-
export function DevToolsTelemetry():
|
|
105
|
+
export function DevToolsTelemetry(): Telemetry {
|
|
106
106
|
if (process.env.NODE_ENV === 'production') {
|
|
107
107
|
throw new Error(
|
|
108
108
|
'@ai-sdk/devtools should not be used in production. ' +
|
|
@@ -187,7 +187,7 @@ export function DevToolsTelemetry(): TelemetryIntegration {
|
|
|
187
187
|
return state;
|
|
188
188
|
}
|
|
189
189
|
|
|
190
|
-
const integration:
|
|
190
|
+
const integration: Telemetry = {
|
|
191
191
|
onStart: async event => {
|
|
192
192
|
const operationId = (event as { operationId: string }).operationId;
|
|
193
193
|
|
|
@@ -199,7 +199,12 @@ export function DevToolsTelemetry(): TelemetryIntegration {
|
|
|
199
199
|
return;
|
|
200
200
|
}
|
|
201
201
|
|
|
202
|
-
const startEvent = event as
|
|
202
|
+
const startEvent = event as (
|
|
203
|
+
| GenerateTextStartEvent<ToolSet>
|
|
204
|
+
| GenerateObjectStartEvent
|
|
205
|
+
) & {
|
|
206
|
+
functionId?: string | undefined;
|
|
207
|
+
};
|
|
203
208
|
|
|
204
209
|
const parentInfo = resolveParentInfo();
|
|
205
210
|
|
|
@@ -213,7 +218,7 @@ export function DevToolsTelemetry(): TelemetryIntegration {
|
|
|
213
218
|
},
|
|
214
219
|
|
|
215
220
|
onStepStart: async event => {
|
|
216
|
-
const stepStartEvent = event as
|
|
221
|
+
const stepStartEvent = event as GenerateTextStepStartEvent<ToolSet> & {
|
|
217
222
|
promptMessages?: unknown[];
|
|
218
223
|
};
|
|
219
224
|
|
|
@@ -229,7 +234,8 @@ export function DevToolsTelemetry(): TelemetryIntegration {
|
|
|
229
234
|
streamChunks: [],
|
|
230
235
|
rawStreamChunks: [],
|
|
231
236
|
};
|
|
232
|
-
|
|
237
|
+
const stepNumber = stepStartEvent.steps.length;
|
|
238
|
+
state.stepStates.set(stepNumber, stepState);
|
|
233
239
|
activeSteps.set(stepId, stepState);
|
|
234
240
|
|
|
235
241
|
const prompt = stepStartEvent.promptMessages ?? stepStartEvent.messages;
|
|
@@ -237,7 +243,7 @@ export function DevToolsTelemetry(): TelemetryIntegration {
|
|
|
237
243
|
await createStep({
|
|
238
244
|
id: stepId,
|
|
239
245
|
run_id: state.runId,
|
|
240
|
-
step_number:
|
|
246
|
+
step_number: stepNumber + 1,
|
|
241
247
|
type: state.operationType,
|
|
242
248
|
model_id: stepStartEvent.modelId,
|
|
243
249
|
provider: stepStartEvent.provider ?? null,
|
|
@@ -267,7 +273,7 @@ export function DevToolsTelemetry(): TelemetryIntegration {
|
|
|
267
273
|
},
|
|
268
274
|
|
|
269
275
|
onObjectStepStart: async event => {
|
|
270
|
-
const stepStartEvent = event as
|
|
276
|
+
const stepStartEvent = event as GenerateObjectStepStartEvent & {
|
|
271
277
|
promptMessages?: unknown[];
|
|
272
278
|
};
|
|
273
279
|
|
|
@@ -311,7 +317,7 @@ export function DevToolsTelemetry(): TelemetryIntegration {
|
|
|
311
317
|
},
|
|
312
318
|
|
|
313
319
|
onChunk: async event => {
|
|
314
|
-
const { chunk } = event as
|
|
320
|
+
const { chunk } = event as StreamTextChunkEvent;
|
|
315
321
|
|
|
316
322
|
if (chunk.type === 'raw') {
|
|
317
323
|
const rawValue = (chunk as { rawValue: unknown }).rawValue;
|
|
@@ -359,7 +365,7 @@ export function DevToolsTelemetry(): TelemetryIntegration {
|
|
|
359
365
|
},
|
|
360
366
|
|
|
361
367
|
onStepFinish: async event => {
|
|
362
|
-
const stepResult = event as
|
|
368
|
+
const stepResult = event as GenerateTextStepEndEvent<ToolSet>;
|
|
363
369
|
|
|
364
370
|
const state = callStates.get(stepResult.callId);
|
|
365
371
|
if (!state) return;
|
|
@@ -407,7 +413,7 @@ export function DevToolsTelemetry(): TelemetryIntegration {
|
|
|
407
413
|
},
|
|
408
414
|
|
|
409
415
|
onObjectStepFinish: async event => {
|
|
410
|
-
const stepResult = event as
|
|
416
|
+
const stepResult = event as GenerateObjectStepEndEvent;
|
|
411
417
|
|
|
412
418
|
const state = callStates.get(stepResult.callId);
|
|
413
419
|
if (!state) return;
|
|
@@ -72,7 +72,7 @@ export function JsonBlock({
|
|
|
72
72
|
</button>
|
|
73
73
|
<pre
|
|
74
74
|
className={`font-mono ${sizeClasses[size]} text-muted-foreground whitespace-pre-wrap wrap-break-words bg-background rounded p-2 ${
|
|
75
|
-
compact ? 'max-h-20
|
|
75
|
+
compact ? 'overflow-hidden max-h-20' : ''
|
|
76
76
|
}`}
|
|
77
77
|
>
|
|
78
78
|
{displayString}
|
|
@@ -108,16 +108,16 @@ export function RawDataSection({
|
|
|
108
108
|
<ChevronRight
|
|
109
109
|
className={`size-3 transition-transform ${expanded ? 'rotate-90' : ''}`}
|
|
110
110
|
/>
|
|
111
|
-
<span className="font-medium
|
|
111
|
+
<span className="font-medium tracking-wider uppercase">
|
|
112
112
|
Request / Response
|
|
113
113
|
</span>
|
|
114
114
|
</button>
|
|
115
115
|
|
|
116
116
|
{expanded && (
|
|
117
|
-
<div className="
|
|
117
|
+
<div className="grid grid-cols-2 gap-4 px-4 pb-4">
|
|
118
118
|
{rawRequest && (
|
|
119
119
|
<div className="flex flex-col">
|
|
120
|
-
<div className="
|
|
120
|
+
<div className="flex items-end mb-2 h-7">
|
|
121
121
|
<span className="text-[10px] font-medium uppercase tracking-wider text-muted-foreground">
|
|
122
122
|
Request
|
|
123
123
|
</span>
|
|
@@ -129,7 +129,7 @@ export function RawDataSection({
|
|
|
129
129
|
)}
|
|
130
130
|
{(rawResponse || rawChunks) && (
|
|
131
131
|
<div className="flex flex-col">
|
|
132
|
-
<div className="
|
|
132
|
+
<div className="flex justify-between items-end mb-2 h-7">
|
|
133
133
|
<span className="text-[10px] font-medium uppercase tracking-wider text-muted-foreground">
|
|
134
134
|
{isStream ? 'Stream' : 'Response'}
|
|
135
135
|
</span>
|
|
@@ -182,8 +182,8 @@ export function UsageDetails({ usage }: { usage: ParsedUsage }) {
|
|
|
182
182
|
return (
|
|
183
183
|
<div className="space-y-6">
|
|
184
184
|
<div className="grid grid-cols-2 gap-4">
|
|
185
|
-
<div className="rounded-lg border border-border bg-card
|
|
186
|
-
<div className="text-xs font-medium
|
|
185
|
+
<div className="p-4 rounded-lg border border-border bg-card">
|
|
186
|
+
<div className="mb-2 text-xs font-medium tracking-wider uppercase text-muted-foreground">
|
|
187
187
|
Input Tokens
|
|
188
188
|
</div>
|
|
189
189
|
<div className="text-2xl font-semibold">{inputBreakdown.total}</div>
|
|
@@ -212,8 +212,8 @@ export function UsageDetails({ usage }: { usage: ParsedUsage }) {
|
|
|
212
212
|
)}
|
|
213
213
|
</div>
|
|
214
214
|
|
|
215
|
-
<div className="rounded-lg border border-border bg-card
|
|
216
|
-
<div className="text-xs font-medium
|
|
215
|
+
<div className="p-4 rounded-lg border border-border bg-card">
|
|
216
|
+
<div className="mb-2 text-xs font-medium tracking-wider uppercase text-muted-foreground">
|
|
217
217
|
Output Tokens
|
|
218
218
|
</div>
|
|
219
219
|
<div className="text-2xl font-semibold">{outputBreakdown.total}</div>
|
|
@@ -239,7 +239,7 @@ export function UsageDetails({ usage }: { usage: ParsedUsage }) {
|
|
|
239
239
|
|
|
240
240
|
{usage?.raw != null && (
|
|
241
241
|
<div>
|
|
242
|
-
<div className="text-xs font-medium
|
|
242
|
+
<div className="mb-2 text-xs font-medium tracking-wider uppercase text-muted-foreground">
|
|
243
243
|
Raw Provider Usage
|
|
244
244
|
</div>
|
|
245
245
|
<JsonBlock data={usage.raw} size="sm" />
|
|
@@ -247,7 +247,7 @@ export function UsageDetails({ usage }: { usage: ParsedUsage }) {
|
|
|
247
247
|
)}
|
|
248
248
|
|
|
249
249
|
<div>
|
|
250
|
-
<div className="text-xs font-medium
|
|
250
|
+
<div className="mb-2 text-xs font-medium tracking-wider uppercase text-muted-foreground">
|
|
251
251
|
Full Usage Object
|
|
252
252
|
</div>
|
|
253
253
|
<JsonBlock data={usage} size="sm" />
|
|
@@ -283,33 +283,33 @@ export function TokenBreakdownTooltip({
|
|
|
283
283
|
}
|
|
284
284
|
|
|
285
285
|
return (
|
|
286
|
-
<div className="
|
|
286
|
+
<div className="space-y-2 text-xs">
|
|
287
287
|
<div>
|
|
288
|
-
<div className="font-medium
|
|
288
|
+
<div className="mb-1 font-medium">Input: {input.total}</div>
|
|
289
289
|
{input.cacheRead !== undefined && (
|
|
290
|
-
<div className="text-muted-foreground
|
|
290
|
+
<div className="ml-2 text-muted-foreground">
|
|
291
291
|
Cache read: {input.cacheRead}
|
|
292
292
|
</div>
|
|
293
293
|
)}
|
|
294
294
|
{input.cacheWrite !== undefined && (
|
|
295
|
-
<div className="text-muted-foreground
|
|
295
|
+
<div className="ml-2 text-muted-foreground">
|
|
296
296
|
Cache write: {input.cacheWrite}
|
|
297
297
|
</div>
|
|
298
298
|
)}
|
|
299
299
|
</div>
|
|
300
300
|
<div>
|
|
301
|
-
<div className="font-medium
|
|
301
|
+
<div className="mb-1 font-medium">Output: {output.total}</div>
|
|
302
302
|
{output.text !== undefined && (
|
|
303
|
-
<div className="text-muted-foreground
|
|
303
|
+
<div className="ml-2 text-muted-foreground">Text: {output.text}</div>
|
|
304
304
|
)}
|
|
305
305
|
{output.reasoning !== undefined && (
|
|
306
|
-
<div className="text-muted-foreground
|
|
306
|
+
<div className="ml-2 text-muted-foreground">
|
|
307
307
|
Reasoning: {output.reasoning}
|
|
308
308
|
</div>
|
|
309
309
|
)}
|
|
310
310
|
</div>
|
|
311
311
|
{raw !== undefined && (
|
|
312
|
-
<div className="pt-1 border-t border-border
|
|
312
|
+
<div className="pt-1 mt-1 border-t border-border">
|
|
313
313
|
<div className="text-muted-foreground/70 font-mono text-[10px] max-w-[200px] truncate">
|
|
314
314
|
Raw: {JSON.stringify(raw)}
|
|
315
315
|
</div>
|
|
@@ -326,9 +326,9 @@ export function ReasoningBlock({ content }: { content: string }) {
|
|
|
326
326
|
content.length > 200 ? content.slice(0, 200) + '…' : content;
|
|
327
327
|
|
|
328
328
|
return (
|
|
329
|
-
<div className="rounded-md border border-amber-500/30
|
|
329
|
+
<div className="overflow-hidden rounded-md border border-amber-500/30">
|
|
330
330
|
<button
|
|
331
|
-
className="
|
|
331
|
+
className="flex gap-2 items-center px-3 py-2 w-full transition-colors bg-amber-500/10 hover:bg-amber-500/20"
|
|
332
332
|
onClick={() => setExpanded(!expanded)}
|
|
333
333
|
>
|
|
334
334
|
<ChevronRight
|
|
@@ -336,7 +336,7 @@ export function ReasoningBlock({ content }: { content: string }) {
|
|
|
336
336
|
expanded ? 'rotate-90' : ''
|
|
337
337
|
}`}
|
|
338
338
|
/>
|
|
339
|
-
<Brain className="
|
|
339
|
+
<Brain className="text-amber-500 size-3 shrink-0" />
|
|
340
340
|
<span className="text-xs font-medium text-amber-500">Thinking</span>
|
|
341
341
|
{!expanded && (
|
|
342
342
|
<span className="text-[11px] text-amber-500/70 truncate ml-1">
|
|
@@ -346,8 +346,8 @@ export function ReasoningBlock({ content }: { content: string }) {
|
|
|
346
346
|
</button>
|
|
347
347
|
|
|
348
348
|
{expanded && (
|
|
349
|
-
<div className="p-3 bg-card/50 border-
|
|
350
|
-
<div className="text-xs
|
|
349
|
+
<div className="p-3 border-t bg-card/50 border-amber-500/30">
|
|
350
|
+
<div className="text-xs leading-relaxed whitespace-pre-wrap text-foreground/80">
|
|
351
351
|
{content}
|
|
352
352
|
</div>
|
|
353
353
|
</div>
|
|
@@ -385,9 +385,9 @@ export function TextBlock({
|
|
|
385
385
|
};
|
|
386
386
|
|
|
387
387
|
return (
|
|
388
|
-
<div className={`rounded-md border ${borderColor}
|
|
388
|
+
<div className={`overflow-hidden rounded-md border ${borderColor}`}>
|
|
389
389
|
<button
|
|
390
|
-
className={`
|
|
390
|
+
className={`flex gap-2 items-center px-3 py-2 w-full transition-colors ${bgColor} ${hoverBgColor}`}
|
|
391
391
|
onClick={() => setExpanded(!expanded)}
|
|
392
392
|
>
|
|
393
393
|
<ChevronRight
|
|
@@ -408,7 +408,7 @@ export function TextBlock({
|
|
|
408
408
|
|
|
409
409
|
{expanded && (
|
|
410
410
|
<div
|
|
411
|
-
className={`p-3 bg-card/50
|
|
411
|
+
className={`relative p-3 border-t bg-card/50 ${borderColor} group`}
|
|
412
412
|
>
|
|
413
413
|
<button
|
|
414
414
|
onClick={handleCopy}
|
|
@@ -421,7 +421,7 @@ export function TextBlock({
|
|
|
421
421
|
<Copy className="size-3 text-muted-foreground" />
|
|
422
422
|
)}
|
|
423
423
|
</button>
|
|
424
|
-
<div className="
|
|
424
|
+
<div className="overflow-y-auto max-h-60 text-xs leading-relaxed whitespace-pre-wrap text-foreground">
|
|
425
425
|
{content}
|
|
426
426
|
</div>
|
|
427
427
|
</div>
|
|
@@ -434,12 +434,12 @@ export function ToolItem({ tool }: { tool: ToolDefinition }) {
|
|
|
434
434
|
const [expanded, setExpanded] = useState(false);
|
|
435
435
|
|
|
436
436
|
return (
|
|
437
|
-
<div className="rounded-md border border-border bg-background
|
|
437
|
+
<div className="overflow-hidden rounded-md border border-border bg-background">
|
|
438
438
|
<button
|
|
439
439
|
className="w-full flex items-center justify-between p-2.5 hover:bg-accent/50 transition-colors"
|
|
440
440
|
onClick={() => setExpanded(!expanded)}
|
|
441
441
|
>
|
|
442
|
-
<span className="
|
|
442
|
+
<span className="font-mono text-sm text-purple">{tool.name}</span>
|
|
443
443
|
{tool.parameters && (
|
|
444
444
|
<ChevronRight
|
|
445
445
|
className={`size-3 text-muted-foreground transition-transform ${
|
|
@@ -451,7 +451,7 @@ export function ToolItem({ tool }: { tool: ToolDefinition }) {
|
|
|
451
451
|
{expanded && tool.parameters && (
|
|
452
452
|
<div className="px-2.5 pb-2.5 border-t border-border">
|
|
453
453
|
{tool.description && (
|
|
454
|
-
<p className="text-xs text-muted-foreground
|
|
454
|
+
<p className="pt-2 mb-2 text-xs text-muted-foreground">
|
|
455
455
|
{tool.description}
|
|
456
456
|
</p>
|
|
457
457
|
)}
|
|
@@ -482,9 +482,9 @@ export function CollapsibleToolCall({
|
|
|
482
482
|
const parsedData = typeof data === 'string' ? safeParseJson(data) : data;
|
|
483
483
|
|
|
484
484
|
return (
|
|
485
|
-
<div className="rounded-md border border-purple/30
|
|
485
|
+
<div className="overflow-hidden rounded-md border border-purple/30">
|
|
486
486
|
<button
|
|
487
|
-
className="
|
|
487
|
+
className="flex gap-2 items-center px-3 py-2 w-full transition-colors bg-purple/10 hover:bg-purple/20"
|
|
488
488
|
onClick={() => setExpanded(!expanded)}
|
|
489
489
|
>
|
|
490
490
|
<ChevronRight
|
|
@@ -493,7 +493,7 @@ export function CollapsibleToolCall({
|
|
|
493
493
|
}`}
|
|
494
494
|
/>
|
|
495
495
|
<Wrench className="size-3 text-purple shrink-0" />
|
|
496
|
-
<span className="text-xs font-
|
|
496
|
+
<span className="font-mono text-xs font-medium text-purple">
|
|
497
497
|
{toolName}
|
|
498
498
|
</span>
|
|
499
499
|
{!expanded &&
|
|
@@ -511,7 +511,7 @@ export function CollapsibleToolCall({
|
|
|
511
511
|
)}
|
|
512
512
|
</button>
|
|
513
513
|
{expanded && (
|
|
514
|
-
<div className="p-3 bg-card/50 border-
|
|
514
|
+
<div className="p-3 border-t bg-card/50 border-purple/30">
|
|
515
515
|
<JsonBlock data={parsedData} />
|
|
516
516
|
</div>
|
|
517
517
|
)}
|
|
@@ -531,9 +531,9 @@ export function CollapsibleToolResult({
|
|
|
531
531
|
const [expanded, setExpanded] = useState(false);
|
|
532
532
|
|
|
533
533
|
return (
|
|
534
|
-
<div className="rounded-md border border-success/30
|
|
534
|
+
<div className="overflow-hidden rounded-md border border-success/30">
|
|
535
535
|
<button
|
|
536
|
-
className="
|
|
536
|
+
className="flex gap-2 items-center px-3 py-2 w-full transition-colors bg-success/10 hover:bg-success/20"
|
|
537
537
|
onClick={() => setExpanded(!expanded)}
|
|
538
538
|
>
|
|
539
539
|
<ChevronRight
|
|
@@ -554,7 +554,7 @@ export function CollapsibleToolResult({
|
|
|
554
554
|
)}
|
|
555
555
|
</button>
|
|
556
556
|
{expanded && (
|
|
557
|
-
<div className="p-3 bg-card/50 border-
|
|
557
|
+
<div className="p-3 border-t bg-card/50 border-success/30">
|
|
558
558
|
<JsonBlock data={data} />
|
|
559
559
|
</div>
|
|
560
560
|
)}
|
|
@@ -610,7 +610,7 @@ export function StepConfigBar({
|
|
|
610
610
|
<span key={i}>
|
|
611
611
|
{p.label}: <span className="text-foreground">{p.value}</span>
|
|
612
612
|
{i < params.length - 1 && (
|
|
613
|
-
<span className="text-muted-foreground/30
|
|
613
|
+
<span className="mx-1 text-muted-foreground/30">·</span>
|
|
614
614
|
)}
|
|
615
615
|
</span>
|
|
616
616
|
))}
|
|
@@ -622,7 +622,7 @@ export function StepConfigBar({
|
|
|
622
622
|
<span className="text-muted-foreground/30">·</span>
|
|
623
623
|
<Drawer direction="right">
|
|
624
624
|
<DrawerTrigger asChild>
|
|
625
|
-
<button className="inline-flex
|
|
625
|
+
<button className="inline-flex gap-1 items-center transition-colors cursor-pointer hover:text-foreground">
|
|
626
626
|
<Wrench className="size-3" />
|
|
627
627
|
{toolCount} available {toolCount === 1 ? 'tool' : 'tools'}
|
|
628
628
|
</button>
|
|
@@ -631,7 +631,7 @@ export function StepConfigBar({
|
|
|
631
631
|
<DrawerHeader className="border-b border-border shrink-0">
|
|
632
632
|
<DrawerTitle>Available Tools ({toolCount})</DrawerTitle>
|
|
633
633
|
</DrawerHeader>
|
|
634
|
-
<div className="
|
|
634
|
+
<div className="overflow-y-auto flex-1 p-4">
|
|
635
635
|
<div className="space-y-3">
|
|
636
636
|
{input?.tools?.map((tool: ToolDefinition, i: number) => (
|
|
637
637
|
<ToolItem key={i} tool={tool} />
|
|
@@ -648,7 +648,7 @@ export function StepConfigBar({
|
|
|
648
648
|
<span className="text-muted-foreground/30">·</span>
|
|
649
649
|
<Drawer direction="right">
|
|
650
650
|
<DrawerTrigger asChild>
|
|
651
|
-
<button className="inline-flex
|
|
651
|
+
<button className="inline-flex gap-1 items-center transition-colors cursor-pointer hover:text-foreground">
|
|
652
652
|
<Settings className="size-3" />
|
|
653
653
|
Provider options
|
|
654
654
|
</button>
|
|
@@ -657,7 +657,7 @@ export function StepConfigBar({
|
|
|
657
657
|
<DrawerHeader className="border-b border-border shrink-0">
|
|
658
658
|
<DrawerTitle>Provider Options</DrawerTitle>
|
|
659
659
|
</DrawerHeader>
|
|
660
|
-
<div className="
|
|
660
|
+
<div className="overflow-y-auto flex-1 p-4">
|
|
661
661
|
<JsonBlock data={providerOptions} size="lg" />
|
|
662
662
|
</div>
|
|
663
663
|
</DrawerContent>
|
|
@@ -670,7 +670,7 @@ export function StepConfigBar({
|
|
|
670
670
|
<span className="text-muted-foreground/30">·</span>
|
|
671
671
|
<Drawer direction="right">
|
|
672
672
|
<DrawerTrigger asChild>
|
|
673
|
-
<button className="inline-flex
|
|
673
|
+
<button className="inline-flex gap-1 items-center transition-colors cursor-pointer hover:text-foreground">
|
|
674
674
|
<BarChart3 className="size-3" />
|
|
675
675
|
Usage
|
|
676
676
|
</button>
|
|
@@ -679,7 +679,7 @@ export function StepConfigBar({
|
|
|
679
679
|
<DrawerHeader className="border-b border-border shrink-0">
|
|
680
680
|
<DrawerTitle>Token Usage</DrawerTitle>
|
|
681
681
|
</DrawerHeader>
|
|
682
|
-
<div className="
|
|
682
|
+
<div className="overflow-y-auto flex-1 p-4">
|
|
683
683
|
<UsageDetails usage={usage} />
|
|
684
684
|
</div>
|
|
685
685
|
</DrawerContent>
|