@waniwani/sdk 0.1.0 → 0.1.2

package/dist/chat/index.d.ts

@@ -36,8 +36,11 @@ interface ChatTheme {
     toolCardColor?: string;
 }
 interface SuggestionsConfig {
-    /** Maximum number of AI suggestions to request. Defaults to 3. */
-    count?: number;
+    /**
+     * Initial suggestions to show before the user sends their first message.
+     * Defaults to an empty array.
+     */
+    initial?: string[];
 }
 interface ChatBaseProps {
     /** WaniWani project API key */
@@ -54,6 +57,14 @@ interface ChatBaseProps {
     body?: Record<string, unknown>;
     /** Enable file attachments in the input. Defaults to false. */
     allowAttachments?: boolean;
+    /** Placeholder text shown in the input field. Defaults to "Ask me anything...". Animates with a typing effect. */
+    placeholder?: string;
+    /**
+     * Name of a custom DOM event to listen for that triggers focus (scroll + glow) and optionally sends a message.
+     * Dispatch via `new CustomEvent('triggerDemoRequest', { detail: { message: 'Hi!' } })`.
+     * Set to `false` to disable. Defaults to `"triggerDemoRequest"`.
+     */
+    triggerEvent?: string | false;
     /** Callback fired when a message is sent */
     onMessageSent?: (message: string) => void;
     /** Callback fired when a response is received */
@@ -89,6 +100,8 @@ interface ChatCardProps extends ChatBaseProps {
 interface ChatHandle {
     /** Programmatically send a user message into the chat */
     sendMessage: (text: string) => void;
+    /** Scroll to the chat input, focus it, and show a highlight glow */
+    focus: () => void;
 }
 /** @deprecated Use ChatBarProps instead */
 type ChatWidgetProps = ChatBarProps;
@@ -112,13 +125,16 @@ interface McpAppFrameProps {
     autoHeight?: boolean;
     /** Called when the view requests to open a URL */
     onOpenLink?: (url: string) => void;
-    /** Called when the view sends a chat message */
-    onMessage?: (message: {
+    /** Called when a widget sends a follow-up message via `ui/message` */
+    onFollowUp?: (message: {
         role: string;
-        content: string;
+        content: Array<{
+            type: string;
+            text?: string;
+        }>;
     }) => void;
 }
-declare function McpAppFrame({ resourceUri, toolInput, toolResult, resourceEndpoint, isDark, className, autoHeight, onOpenLink, onMessage, }: McpAppFrameProps): react_jsx_runtime.JSX.Element;
+declare function McpAppFrame({ resourceUri, toolInput, toolResult, resourceEndpoint, isDark, className, autoHeight, onOpenLink, onFollowUp, }: McpAppFrameProps): react_jsx_runtime.JSX.Element;
 
 declare const ChatCard: react.ForwardRefExoticComponent<ChatCardProps & react.RefAttributes<ChatHandle>>;
 

package/dist/chat/index.js

@@ -1,3 +1,3 @@
 "use client";
-import{forwardRef as no,useCallback as et,useEffect as so,useImperativeHandle as ao,useRef as io,useState as lo}from"react";import{ArrowDownIcon as nt}from"lucide-react";import{useCallback as st}from"react";import{StickToBottom as Ie,useStickToBottomContext as at}from"use-stick-to-bottom";import{clsx as tt}from"clsx";import{twMerge as ot}from"tailwind-merge";function u(...t){return ot(tt(t))}import{jsx as rt}from"react/jsx-runtime";var z=({className:t,variant:e="default",size:o="default",type:n="button",...r})=>rt("button",{type:n,className:u("inline-flex cursor-pointer items-center justify-center rounded-md font-medium transition-colors disabled:pointer-events-none disabled:opacity-50",e==="default"&&"bg-primary text-primary-foreground hover:bg-primary/90",e==="outline"&&"border border-border bg-background hover:bg-accent hover:text-accent-foreground",e==="ghost"&&"hover:bg-accent hover:text-accent-foreground",o==="default"&&"h-9 px-4 py-2 text-sm",o==="sm"&&"h-8 px-3 text-xs",o==="icon"&&"size-9",o==="icon-sm"&&"size-7",t),...r});import{jsx as X}from"react/jsx-runtime";var Z=({className:t,...e})=>X(Ie,{className:u("relative flex-1 overflow-y-hidden",t),initial:"smooth",resize:"smooth",role:"log",...e}),Q=({className:t,...e})=>X(Ie.Content,{className:u("flex flex-col gap-8 p-4",t),...e}),Y=({className:t,...e})=>{let{isAtBottom:o,scrollToBottom:n}=at(),r=st(()=>{n()},[n]);return!o&&X(z,{className:u("absolute bottom-4 left-[50%] translate-x-[-50%] rounded-full",t),onClick:r,size:"icon",variant:"outline",...e,children:X(nt,{className:"size-4"})})};import{ArrowUpIcon as it,LoaderIcon as lt,PaperclipIcon as ut,SquareIcon as ct,XIcon as pt}from"lucide-react";import{nanoid as mt}from"nanoid";import{createContext as dt,useCallback as U,useContext as ft,useEffect as ge,useMemo as gt,useRef as he,useState as Ee}from"react";import{jsx as A,jsxs as Re}from"react/jsx-runtime";var ht=async t=>{try{let o=await(await fetch(t)).blob();return new Promise(n=>{let r=new FileReader;r.onloadend=()=>n(r.result),r.onerror=()=>n(null),r.readAsDataURL(o)})}catch{return null}},Ne=dt(null),Le=()=>{let t=ft(Ne);if(!t)throw new Error("usePromptInputAttachments must be used within a PromptInput");return t},ee=({className:t,accept:e,multiple:o,globalDrop:n,maxFiles:r,maxFileSize:s,onSubmit:a,children:p,...C})=>{let i=he(null),g=he(null),[m,v]=Ee([]),w=he(m);ge(()=>{w.current=m},[m]);let d=U(()=>{i.current?.click()},[]),T=U(b=>{let f=[...b];if(f.length===0)return;let x=S=>s?S.size<=s:!0,R=f.filter(x);v(S=>{let D=typeof r=="number"?Math.max(0,r-S.length):void 0,E=typeof D=="number"?R.slice(0,D):R;return[...S,...E.map(k=>({filename:k.name,id:mt(),mediaType:k.type,type:"file",url:URL.createObjectURL(k)}))]})},[r,s]),c=U(b=>{v(f=>{let x=f.find(R=>R.id===b);return x?.url&&URL.revokeObjectURL(x.url),f.filter(R=>R.id!==b)})},[]),l=U(()=>{v(b=>{for(let f of b)f.url&&URL.revokeObjectURL(f.url);return[]})},[]);ge(()=>()=>{for(let b of w.current)b.url&&URL.revokeObjectURL(b.url)},[]);let h=U(b=>{b.currentTarget.files&&T(b.currentTarget.files),b.currentTarget.value=""},[T]);ge(()=>{if(!n)return;let b=x=>{x.dataTransfer?.types?.includes("Files")&&x.preventDefault()},f=x=>{x.dataTransfer?.types?.includes("Files")&&x.preventDefault(),x.dataTransfer?.files&&x.dataTransfer.files.length>0&&T(x.dataTransfer.files)};return document.addEventListener("dragover",b),document.addEventListener("drop",f),()=>{document.removeEventListener("dragover",b),document.removeEventListener("drop",f)}},[T,n]);let P=U(async b=>{b.preventDefault();let f=b.currentTarget,R=new FormData(f).get("message")||"";f.reset();let S=await Promise.all(m.map(async({id:D,...E})=>{if(E.url?.startsWith("blob:")){let k=await ht(E.url);return{...E,url:k??E.url}}return E}));try{let D=a({files:S,text:R},b);D instanceof Promise&&await D,l()}catch{}},[m,a,l]),M=gt(()=>({add:T,clear:l,files:m,openFileDialog:d,remove:c}),[m,T,c,l,d]);return Re(Ne.Provider,{value:M,children:[A("input",{accept:e,"aria-label":"Upload files",className:"hidden",multiple:o,onChange:h,ref:i,title:"Upload files",type:"file"}),A("form",{className:u("flex w-full flex-col rounded-lg border border-border bg-background",t),onSubmit:P,ref:g,...C,children:p})]})};var te=({onChange:t,onKeyDown:e,className:o,placeholder:n="What would you like to know?",...r})=>{let s=Le(),[a,p]=Ee(!1),C=U(g=>{if(e?.(g),!g.defaultPrevented){if(g.key==="Enter"){if(a||g.nativeEvent.isComposing||g.shiftKey)return;g.preventDefault();let{form:m}=g.currentTarget;if(m?.querySelector('button[type="submit"]')?.disabled)return;m?.requestSubmit()}if(g.key==="Backspace"&&g.currentTarget.value===""&&s.files.length>0){g.preventDefault();let m=s.files.at(-1);m&&s.remove(m.id)}}},[e,a,s]),i=U(g=>{let m=g.clipboardData?.items;if(!m)return;let v=[];for(let w of m)if(w.kind==="file"){let d=w.getAsFile();d&&v.push(d)}v.length>0&&(g.preventDefault(),s.add(v))},[s]);return A("textarea",{className:u("field-sizing-content max-h-48 min-h-16 w-full resize-none border-0 bg-transparent px-3 py-3 text-sm outline-none placeholder:text-muted-foreground",o),name:"message",onCompositionEnd:()=>p(!1),onCompositionStart:()=>p(!0),onKeyDown:C,onPaste:i,placeholder:n,onChange:t,...r})},oe=({className:t,status:e,onStop:o,onClick:n,children:r,...s})=>{let a=e==="submitted"||e==="streaming",p=A(it,{className:"size-4"});e==="submitted"?p=A(lt,{className:"size-4 animate-spin"}):e==="streaming"&&(p=A(ct,{className:"size-4"}));let C=U(i=>{if(a&&o){i.preventDefault(),o();return}n?.(i)},[a,o,n]);return A(z,{"aria-label":a?"Stop":"Submit",className:u("bg-foreground text-background hover:bg-foreground",t),onClick:C,size:"icon-sm",type:a&&o?"button":"submit",variant:"ghost",...s,children:r??p})},re=({className:t,children:e,...o})=>{let n=Le();return n.files.length>0?Re(z,{className:u("group relative",t),onClick:()=>n.clear(),size:"icon-sm",type:"button",variant:"ghost","aria-label":"Remove all attachments",...o,children:[A("span",{className:"flex size-5 items-center justify-center rounded-full bg-primary text-[10px] font-medium text-primary-foreground transition-opacity group-hover:opacity-0",children:n.files.length}),A(pt,{className:"absolute size-4 opacity-0 transition-opacity group-hover:opacity-100"})]}):A(z,{className:u(t),onClick:()=>n.openFileDialog(),size:"icon-sm",type:"button",variant:"ghost",...o,children:e??A(ut,{className:"size-4"})})};import{FileIcon as bt}from"lucide-react";import{jsx as K,jsxs as Ct}from"react/jsx-runtime";var Ae=({files:t,className:e,...o})=>t.length===0?null:K("div",{className:u("flex flex-wrap gap-1.5",e),...o,children:t.map((n,r)=>K(xt,{file:n},r))});function xt({file:t}){return t.mediaType?.startsWith("image/")&&t.url?K("img",{src:t.url,alt:t.filename??"attachment",className:"h-16 max-w-32 rounded object-cover"}):Ct("span",{className:"inline-flex items-center gap-1.5 rounded bg-background/20 px-2 py-1 text-xs",children:[K(bt,{className:"size-3 shrink-0"}),K("span",{className:"max-w-24 truncate",children:t.filename??"file"})]})}import{jsx as He}from"react/jsx-runtime";var be=({className:t,size:e=5,...o})=>He("div",{className:u("flex items-center gap-1",t),...o,children:[0,1,2].map(n=>He("div",{className:"rounded-full bg-muted-foreground/60",style:{width:e,height:e,animation:"ww-pulse 1.4s ease-in-out infinite",animationDelay:`${n*.2}s`}},n))});import{cjk as yt}from"@streamdown/cjk";import{code as vt}from"@streamdown/code";import{memo as wt}from"react";import{Streamdown as Tt}from"streamdown";import{jsx as xe}from"react/jsx-runtime";var ne=({className:t,from:e,...o})=>xe("div",{className:u("group flex w-full max-w-[95%] flex-col gap-2",e==="user"?"is-user ml-auto justify-end":"is-assistant",t),...o}),se=({children:t,className:e,...o})=>xe("div",{className:u("flex w-fit min-w-0 max-w-full flex-col gap-2 overflow-hidden text-base","group-[.is-user]:ml-auto group-[.is-user]:rounded-lg group-[.is-user]:bg-user-bubble group-[.is-user]:px-4 group-[.is-user]:py-3 group-[.is-user]:text-primary-foreground","group-[.is-assistant]:text-foreground",e),...o,children:t}),Pt={cjk:yt,code:vt},ae=wt(({className:t,...e})=>xe(Tt,{className:u("size-full [&>*:first-child]:mt-0 [&>*:last-child]:mb-0",t),plugins:Pt,...e}),(t,e)=>t.children===e.children);ae.displayName="MessageResponse";import{jsx as Mt}from"react/jsx-runtime";function Be({className:t,text:e,...o}){return e?Mt("pre",{className:u("mb-2 overflow-x-auto whitespace-pre-wrap break-words text-xs font-mono text-muted-foreground",t),...o,children:e}):null}import{BracesIcon as kt,CheckIcon as St,ChevronDownIcon as It,ChevronRightIcon as Et,ClipboardCopyIcon as Nt,ServerIcon as Qo}from"lucide-react";import{createContext as Lt,useCallback as Rt,useContext as Fe,useEffect as At,useMemo as Ht,useRef as Bt,useState as Ce}from"react";import{Fragment as De,jsx as y,jsxs as W}from"react/jsx-runtime";function Dt(t,e=80){if(t==null)return String(t);if(typeof t!="object")return String(t).slice(0,e);if(Array.isArray(t))return`Array(${t.length})`;let o=JSON.stringify(t);if(o.length<=e)return o;let n=Object.entries(t),r=[],s=e-2;for(let[a,p]of n){if(s<=8)break;let C=a.length>4?`${a.slice(0,4)}\u2026`:a,i;typeof p=="string"?i=p.length>2?`'${p.slice(0,1)}\u2026`:`'${p}'`:Array.isArray(p)?i=`Array(${p.length})`:typeof p=="object"&&p!==null?i="{\u2026}":i=String(p);let g=`${C}\u2009${i}`;r.push(g),s-=g.length+3}return`{${r.join(",  ")}}`}function Ft({text:t,className:e}){let[o,n]=Ce(!1),r=Bt(null);At(()=>()=>{r.current&&clearTimeout(r.current)},[]);let s=Rt(async a=>{a.stopPropagation();try{await navigator.clipboard.writeText(t),n(!0),r.current&&clearTimeout(r.current),r.current=setTimeout(()=>n(!1),2e3)}catch{}},[t]);return y(z,{variant:"ghost",size:"sm",onClick:s,className:u("h-auto gap-1 px-1.5 py-0.5 text-xs text-muted-foreground hover:text-foreground",e),children:o?W(De,{children:[y(St,{className:"size-3.5"}),y("span",{children:"Copied"})]}):W(De,{children:[y(Nt,{className:"size-3.5"}),y("span",{children:"Copy"})]})})}function Ue({data:t,label:e,className:o,...n}){let[r,s]=Ce(!1),a=Ht(()=>JSON.stringify(t,null,2),[t]),p=Dt(t);return W("div",{className:u("rounded-lg bg-tool-card",o),...n,children:[W("div",{className:"flex items-center justify-between px-3 pt-2.5 pb-1.5",children:[y("span",{className:"text-xs font-medium text-muted-foreground",children:e}),y(Ft,{text:a})]}),W("button",{type:"button",onClick:()=>s(C=>!C),className:"flex w-full items-start gap-2 px-3 pb-3 text-left",children:[y(Et,{className:u("mt-0.5 size-3.5 shrink-0 text-muted-foreground transition-transform duration-150",r&&"rotate-90")}),r?y("pre",{className:"overflow-x-auto text-xs font-mono text-foreground whitespace-pre-wrap break-all",children:y("code",{children:a})}):y("span",{className:"truncate text-xs font-mono text-foreground/80",children:p})]})]})}var ye=Lt({open:!1,toggle:()=>{}});function Oe({className:t,defaultOpen:e=!1,children:o,...n}){let[r,s]=Ce(e);return y(ye.Provider,{value:{open:r,toggle:()=>s(a=>!a)},children:y("div",{className:u("mb-4 w-full",t),"data-state":r?"open":"closed",...n,children:o})})}function ze({className:t,title:e,state:o,...n}){let{open:r,toggle:s}=Fe(ye),a=o==="input-available"||o==="input-streaming";return W("button",{type:"button",onClick:s,className:u("flex w-full items-center justify-between gap-3 py-1.5",t),"aria-expanded":r,...n,children:[W("div",{className:"flex min-w-0 items-center gap-2",children:[y(kt,{className:"size-4 shrink-0 text-muted-foreground"}),y("span",{className:"truncate text-sm font-medium",children:e}),a&&y("span",{className:"size-2 shrink-0 rounded-full bg-primary animate-pulse"})]}),y(It,{className:u("size-4 shrink-0 text-muted-foreground transition-transform duration-200",r&&"rotate-180")})]})}function We({className:t,children:e,...o}){let{open:n}=Fe(ye);return y("div",{className:u("grid transition-[grid-template-rows,opacity] duration-200 ease-out",n?"grid-rows-[1fr] opacity-100":"grid-rows-[0fr] opacity-0"),children:y("div",{className:"min-h-0 overflow-hidden",children:y("div",{className:u("mt-2 space-y-3 rounded-lg border border-border bg-background p-3",t),...o,children:e})})})}function $e({className:t,input:e,...o}){return y(Ue,{data:e,label:"Request",className:t,...o})}function je(t){if(typeof t!="object"||t===null)return;let e=t._meta;if(typeof e!="object"||e===null)return;let o=e.ui;if(!(typeof o!="object"||o===null))return o}function _e(t){let e=je(t)?.resourceUri;return typeof e=="string"?e:void 0}function Ke(t){return je(t)?.autoHeight===!0}function Ve({className:t,output:e,errorText:o,...n}){return e||o?o?W("div",{className:u("space-y-2",t),...n,children:[y("h4",{className:"text-xs font-medium uppercase tracking-wide text-muted-foreground",children:"Error"}),y("div",{className:"rounded-lg bg-destructive/10 p-3 text-xs text-destructive",children:o})]}):y(Ue,{data:e,label:"Response",className:t,...n}):null}import{useCallback as Ut,useEffect as qe,useMemo as Ot,useRef as $,useState as Je}from"react";import{jsx as Kt}from"react/jsx-runtime";var zt="/api/mcp/resource",Wt=500,$t=300,jt="2026-01-26",_t=300;function ve({resourceUri:t,toolInput:e,toolResult:o,resourceEndpoint:n=zt,isDark:r=!1,className:s,autoHeight:a=!0,onOpenLink:p,onMessage:C}){let i=$(null),g=$(e),m=$(o),v=$({width:0,height:0}),w=$(!1),[d,T]=Je($t),[c,l]=Je(void 0),h=$(p),P=$(C);g.current=e,m.current=o,h.current=p,P.current=C;let M=Ut(x=>a?Math.max(x,0):Math.min(Math.max(x,50),Wt),[a]),b=Ot(()=>`${n}?uri=${encodeURIComponent(t)}`,[n,t]),f=$(r);return f.current=r,qe(()=>{if(!w.current)return;let x=i.current;x?.contentWindow&&x.contentWindow.postMessage({jsonrpc:"2.0",method:"ui/notifications/host-context-changed",params:{theme:r?"dark":"light"}},"*")},[r]),qe(()=>{let x=i.current;if(!x)return;let R=!1,S=E=>{x.contentWindow?.postMessage(E,"*")},D=E=>{if(R||E.source!==x.contentWindow)return;let k=E.data;if(!k||typeof k!="object"||k.jsonrpc!=="2.0")return;let O=k.method,N=k.id;if(O==="ui/initialize"&&N!=null){S({jsonrpc:"2.0",id:N,result:{protocolVersion:k.params?.protocolVersion??jt,hostInfo:{name:"WaniWani Chat",version:"1.0.0"},hostCapabilities:{openLinks:{},message:{}},hostContext:{theme:f.current?"dark":"light",displayMode:"inline"}}});return}if(O==="ui/notifications/initialized"){w.current=!0;let H=g.current,F=m.current;S({jsonrpc:"2.0",method:"ui/notifications/tool-input",params:{arguments:H}});let j=F.content??[{type:"text",text:JSON.stringify(F)}];S({jsonrpc:"2.0",method:"ui/notifications/tool-result",params:{content:j,structuredContent:F.structuredContent}});return}if(O==="ui/notifications/size-changed"){let H=k.params,F=typeof H?.height=="number"?H.height:void 0,j=typeof H?.width=="number"?H.width:void 0,G=v.current,Me=F!==void 0&&F!==G.height,ke=j!==void 0&&j!==G.width;if(!Me&&!ke)return;if(Me&&F!==void 0){G.height=F;let fe=M(F);if(x.animate){let Se=x.getBoundingClientRect().height;Math.abs(Se-fe)>2&&x.animate([{height:`${Se}px`},{height:`${fe}px`}],{duration:_t,easing:"ease-out",fill:"forwards"})}T(fe)}ke&&a&&j!==void 0&&(G.width=j,l(j));return}if(O==="ui/open-link"&&N!=null){let H=k.params?.url;typeof H=="string"&&(h.current?h.current(H):window.open(H,"_blank","noopener,noreferrer")),S({jsonrpc:"2.0",id:N,result:{}});return}if(O==="ui/message"&&N!=null){P.current&&k.params&&P.current(k.params),S({jsonrpc:"2.0",id:N,result:{}});return}if(O==="ui/request-display-mode"&&N!=null){S({jsonrpc:"2.0",id:N,result:{}});return}if(O==="ui/resource-teardown"&&N!=null){S({jsonrpc:"2.0",id:N,result:{}});return}O==="ping"&&N!=null&&S({jsonrpc:"2.0",id:N,result:{}})};return window.addEventListener("message",D),()=>{R=!0,window.removeEventListener("message",D)}},[a,M]),Kt("iframe",{ref:i,src:b,sandbox:"allow-scripts allow-forms allow-same-origin",className:u("rounded-md border border-border",s),style:{height:d||void 0,minWidth:c?`min(${c}px, 100%)`:void 0,width:"100%",border:"none",colorScheme:"auto"},title:"MCP App"})}import{Component as Vt}from"react";import{jsx as Ge,jsxs as qt}from"react/jsx-runtime";var ie=class extends Vt{state={hasError:!1};static getDerivedStateFromError(){return{hasError:!0}}componentDidCatch(e){console.warn("[WaniWani] Widget failed to render:",e.message)}render(){return this.state.hasError?qt("div",{className:"flex items-center justify-between rounded-md border border-border bg-muted/50 px-4 py-3 text-sm text-muted-foreground",children:[Ge("span",{children:"Widget failed to load"}),Ge("button",{type:"button",onClick:()=>this.setState({hasError:!1}),className:"text-xs font-medium text-primary hover:underline",children:"Retry"})]}):this.props.children}};import{Fragment as Gt,jsx as I,jsxs as _}from"react/jsx-runtime";function Jt(t){return t.replace(/[-_]/g," ").replace(/^\w/,e=>e.toUpperCase())}function le({messages:t,status:e,welcomeMessage:o,resourceEndpoint:n,isDark:r}){let s=e==="submitted"||e==="streaming",a=t[t.length-1],p=t.length>0,C=s&&(!p||a.role==="user");return _(Gt,{children:[o&&I(ne,{from:"assistant",children:I(se,{children:I(ae,{children:o})})}),t.map(i=>{let g=i.parts.filter(c=>c.type==="text"),m=i.parts.filter(c=>c.type==="reasoning"),v=i.parts.filter(c=>c.type==="file"),w=i.parts.filter(c=>"toolCallId"in c),d=i===a&&i.role==="assistant",T=g.length>0;return _(ne,{from:i.role,children:[m.map((c,l)=>I(Be,{text:c.text},`reasoning-${i.id}-${l}`)),w.map(c=>{let l="output"in c?c.output:void 0,h=l!==void 0?_e(l):void 0,P=l!==void 0?Ke(l):!1;return _("div",{children:[_(Oe,{defaultOpen:c.state==="output-available",children:[I(ze,{title:c.title??Jt(c.toolName),state:c.state}),_(We,{children:[I($e,{input:c.input}),l!==void 0&&I(Ve,{output:l,errorText:"errorText"in c?c.errorText:void 0})]})]}),h&&l!==void 0&&I(ie,{children:I(ve,{resourceUri:h,toolInput:c.input??{},toolResult:{content:l.content,structuredContent:l.structuredContent},resourceEndpoint:n,isDark:r,autoHeight:P})})]},c.toolCallId)}),_(se,{children:[v.length>0&&I(Ae,{files:v}),T?g.map((c,l)=>I(ae,{children:c.type==="text"?c.text:""},`${i.id}-${l}`)):d&&s&&I(be,{})]})]},i.id)}),C&&I(ne,{from:"assistant",children:I(se,{children:I(be,{})})})]})}import{jsx as we}from"react/jsx-runtime";function ue({suggestions:t,isLoading:e,onSelect:o,className:n,...r}){return t.length===0&&!e?null:we("div",{className:u("flex flex-wrap gap-2 px-3 py-2",n),...r,children:e?[0,1,2].map(s=>we("div",{className:"h-7 rounded-full bg-accent animate-pulse",style:{width:`${60+s*20}px`}},s)):t.map((s,a)=>we("button",{type:"button",onClick:()=>o(s),className:u("rounded-full border border-border bg-background px-3 py-1 text-xs","text-foreground hover:bg-accent hover:border-primary/30","transition-all duration-200 ease-out cursor-pointer","animate-[ww-fade-in_0.2s_ease-out_both]"),style:{animationDelay:`${a*50}ms`},children:s},s))})}import{useChat as Xt}from"@ai-sdk/react";import{DefaultChatTransport as Zt}from"ai";import{useCallback as Xe,useRef as Qt,useState as Yt}from"react";function ce(t){let{api:e="https://app.waniwani.ai/api/chat",headers:o,body:n,onMessageSent:r,onResponseReceived:s}=t,a=Qt(new Zt({api:e,headers:{...o},body:n})),{messages:p,sendMessage:C,status:i}=Xt({transport:a.current,onFinish(){s?.()},onError(h){console.warn("[WaniWani] Chat error:",h.message)}}),[g,m]=Yt(""),v=Xe(h=>{let P=!!h.text?.trim(),M=!!h.files?.length;(P||M)&&(C({text:h.text||"",files:h.files}),r?.(h.text||""),m(""))},[C,r]),w=Xe(h=>{m(h.target.value)},[]),d=i==="submitted"||i==="streaming",T=p[p.length-1],c=p.length>0,l=d&&(!c||T.role==="user");return{messages:p,status:i,text:g,setText:m,handleSubmit:v,handleTextChange:w,isLoading:d,showLoaderBubble:l,lastMessage:T,hasMessages:c,sendMessage:C}}import{useCallback as eo,useEffect as pe,useRef as Ze,useState as Qe}from"react";function to(t){try{let e=new URL(t);return e.pathname="/api/mcp/suggestions",e.toString()}catch{return"/api/mcp/suggestions"}}function me(t){let{messages:e,status:o,initialSuggestions:n,suggestions:r,api:s="https://app.waniwani.ai/api/chat",apiKey:a,headers:p}=t,[C,i]=Qe([]),[g,m]=Qe(!1),v=Ze(o),w=Ze(null),d=!!r,T=typeof r=="object"?r.count??3:3,c=e.some(M=>M.role==="user"),l=to(s),h=eo(()=>{i([]),w.current?.abort(),w.current=null},[]);pe(()=>{!c&&n?.length&&i(n)},[c,n]);let P=e[e.length-1];return pe(()=>{P?.role==="user"&&h()},[P,h]),pe(()=>{let M=v.current;if(v.current=o,M==="streaming"&&o==="ready"&&d){let b=new AbortController;w.current?.abort(),w.current=b,m(!0),fetch(l,{method:"POST",headers:{"Content-Type":"application/json",...a?{Authorization:`Bearer ${a}`}:{},...p},body:JSON.stringify({messages:e,count:T}),signal:b.signal}).then(f=>{if(!f.ok)throw new Error(`Suggestions API error: ${f.status}`);return f.json()}).then(f=>{b.signal.aborted||i(f.suggestions??[])}).catch(f=>{f.name!=="AbortError"&&console.warn("[WaniWani] Failed to fetch suggestions:",f)}).finally(()=>{b.signal.aborted||m(!1)})}},[o,d,l,a,e,T,p]),pe(()=>()=>{w.current?.abort()},[]),{suggestions:C,isLoading:g,clear:h}}var Ye={primaryColor:"#6366f1",primaryForeground:"#1f2937",backgroundColor:"#ffffff",textColor:"#1f2937",mutedColor:"#6b7280",borderColor:"#e5e7eb",assistantBubbleColor:"#f3f4f6",userBubbleColor:"#f4f4f4",inputBackgroundColor:"#f9fafb",borderRadius:16,messageBorderRadius:12,fontFamily:"system-ui, -apple-system, 'Segoe UI', sans-serif",headerBackgroundColor:"#ffffff",headerTextColor:"#1f2937",statusColor:"#22c55e",toolCardColor:"#f4f4f5"},oo={backgroundColor:"#212121",headerBackgroundColor:"#1e1e1e",headerTextColor:"#ececec",textColor:"#ececec",primaryForeground:"#ffffff",mutedColor:"#8e8ea0",borderColor:"#303030",assistantBubbleColor:"#2f2f2f",userBubbleColor:"#303030",inputBackgroundColor:"#2f2f2f",primaryColor:"#6366f1",statusColor:"#22c55e",toolCardColor:"#262626"},ro={primaryColor:["--ww-primary","--color-primary"],primaryForeground:["--ww-primary-fg","--color-primary-foreground"],backgroundColor:["--ww-bg","--color-background"],textColor:["--ww-text","--color-foreground","--color-accent-foreground"],mutedColor:["--ww-muted","--color-muted-foreground"],borderColor:["--ww-border","--color-border"],assistantBubbleColor:["--ww-assistant-bubble","--color-accent"],userBubbleColor:["--ww-user-bubble"],inputBackgroundColor:["--ww-input-bg","--color-input"],borderRadius:["--ww-radius","--radius"],messageBorderRadius:["--ww-msg-radius"],fontFamily:["--ww-font"],headerBackgroundColor:["--ww-header-bg"],headerTextColor:["--ww-header-text"],statusColor:["--ww-status"],toolCardColor:["--ww-tool-card","--color-tool-card"]};function V(t){return{...Ye,...t}}function de(t){let e=t.backgroundColor.replace("#",""),o=parseInt(e.substring(0,2),16),n=parseInt(e.substring(2,4),16),r=parseInt(e.substring(4,6),16);return(o*299+n*587+r*114)/1e3<128}function q(t){let e={};for(let[o,n]of Object.entries(ro)){let r=t[o],s=typeof r=="number"?`${r}px`:String(r);for(let a of n)e[a]=s}return e}import{jsx as B,jsxs as Te}from"react/jsx-runtime";var Pe=no(function(e,o){let{theme:n,width:r=600,expandedHeight:s=400,allowAttachments:a=!1,welcomeMessage:p,resourceEndpoint:C,api:i}=e,g=C??(i?`${i}/resource`:void 0),m=V(n),v=q(m),w=de(m),d=ce(e),T=me({messages:d.messages,status:d.status,initialSuggestions:e.initialSuggestions,suggestions:e.suggestions,api:e.api,apiKey:e.apiKey,headers:e.headers}),c=et(f=>{T.clear(),d.handleSubmit({text:f,files:[]})},[T.clear,d.handleSubmit]);ao(o,()=>({sendMessage:f=>{d.handleSubmit({text:f,files:[]})}}),[d.handleSubmit]);let[l,h]=lo(!1),P=io(null),M=l;so(()=>{if(!l)return;let f=x=>{P.current&&!P.current.contains(x.target)&&h(!1)};return document.addEventListener("mousedown",f),()=>document.removeEventListener("mousedown",f)},[l]);let b=et(()=>{h(!0)},[]);return Te("div",{ref:P,style:{...v,width:r},"data-waniwani-chat":"","data-waniwani-layout":"bar",...w?{"data-waniwani-dark":""}:{},className:"flex flex-col font-[family-name:var(--ww-font)] text-foreground",children:[B("div",{className:u("overflow-hidden bg-background/80 backdrop-blur-xl transition-all duration-300 ease-out",M?"opacity-100 translate-y-0":"opacity-0 translate-y-2 pointer-events-none max-h-0"),style:{...M?{maxHeight:s}:void 0,maskImage:"linear-gradient(to bottom, transparent, black 24px, black calc(100% - 16px), transparent), linear-gradient(to right, transparent, black 16px, black calc(100% - 16px), transparent)",maskComposite:"intersect",WebkitMaskImage:"linear-gradient(to bottom, transparent, black 24px, black calc(100% - 16px), transparent), linear-gradient(to right, transparent, black 16px, black calc(100% - 16px), transparent)",WebkitMaskComposite:"source-in"},children:Te(Z,{className:"flex-1",style:{height:s},children:[B(Q,{children:B(le,{messages:d.messages,status:d.status,welcomeMessage:p,resourceEndpoint:g,isDark:w})}),B(Y,{})]})}),B(ue,{suggestions:T.suggestions,isLoading:T.isLoading,onSelect:c}),B("div",{className:"shrink-0",children:B(ee,{onSubmit:d.handleSubmit,globalDrop:a,multiple:a,className:u("rounded-[var(--ww-radius)] shadow-sm transition-all duration-300 ease-out"),children:Te("div",{className:"flex items-center gap-1 px-3 py-2",children:[a&&B(re,{}),B(te,{onChange:d.handleTextChange,value:d.text,placeholder:"Ask anything...",onFocus:b,className:"min-h-0 py-1.5 px-2"}),B(oe,{status:d.status})]})})})]})});import{forwardRef as uo,useCallback as co,useImperativeHandle as po}from"react";import{jsx as L,jsxs as J}from"react/jsx-runtime";var mo=uo(function(e,o){let{theme:n,title:r="Assistant",subtitle:s,showStatus:a=!0,width:p=500,height:C=600,allowAttachments:i=!1,welcomeMessage:g,resourceEndpoint:m,api:v}=e,w=m??(v?`${v}/resource`:void 0),d=V(n),T=q(d),c=de(d),l=ce(e),h=me({messages:l.messages,status:l.status,initialSuggestions:e.initialSuggestions,suggestions:e.suggestions,api:e.api,apiKey:e.apiKey,headers:e.headers}),P=co(M=>{h.clear(),l.handleSubmit({text:M,files:[]})},[h.clear,l.handleSubmit]);return po(o,()=>({sendMessage:M=>{l.handleSubmit({text:M,files:[]})}}),[l.handleSubmit]),J("div",{style:{...T,width:p,height:C},"data-waniwani-chat":"","data-waniwani-layout":"card",...c?{"data-waniwani-dark":""}:{},className:"flex flex-col font-[family-name:var(--ww-font)] text-foreground bg-background rounded-[var(--ww-radius)] border border-border shadow-md overflow-hidden",children:[J("div",{className:"shrink-0 flex items-center gap-3 px-4 py-2 border-b border-border",style:{backgroundColor:d.headerBackgroundColor,color:d.headerTextColor},children:[a&&L("span",{className:"size-2.5 rounded-full bg-status"}),J("div",{className:"flex-1 min-w-0",children:[L("div",{className:"text-xs font-semibold truncate",children:r}),s&&L("div",{className:"text-[11px] text-muted-foreground truncate",children:s})]})]}),J(Z,{className:"flex-1 min-h-0 bg-background",children:[L(Q,{children:L(le,{messages:l.messages,status:l.status,welcomeMessage:g,resourceEndpoint:w,isDark:c})}),L(Y,{})]}),L(ue,{suggestions:h.suggestions,isLoading:h.isLoading,onSelect:P,className:"border-t border-border"}),L("div",{className:"shrink-0 border-t border-border bg-background",children:L(ee,{onSubmit:l.handleSubmit,globalDrop:i,multiple:i,className:u("rounded-none border-0"),children:J("div",{className:"flex items-center gap-1 px-3 py-2",children:[i&&L(re,{}),L(te,{onChange:l.handleTextChange,value:l.text,placeholder:"Ask anything...",className:"min-h-0 py-1.5 px-2"}),L(oe,{status:l.status})]})})})]})});export{Pe as ChatBar,mo as ChatCard,Pe as ChatWidget,oo as DARK_THEME,Ye as DEFAULT_THEME,ve as McpAppFrame,V as mergeTheme,q as themeToCSSProperties};
+import{forwardRef as So,useCallback as Ce,useEffect as ut,useImperativeHandle as Eo,useRef as ct,useState as pt}from"react";import{ArrowDownIcon as ht}from"lucide-react";import{useCallback as bt}from"react";import{StickToBottom as Fe,useStickToBottomContext as xt}from"use-stick-to-bottom";import{clsx as mt}from"clsx";import{twMerge as ft}from"tailwind-merge";function i(...e){return ft(mt(e))}import{jsx as gt}from"react/jsx-runtime";var J=({className:e,variant:t="default",size:o="default",type:r="button",...n})=>gt("button",{type:r,className:i("inline-flex cursor-pointer items-center justify-center rounded-md font-medium transition-colors disabled:pointer-events-none disabled:opacity-50",t==="default"&&"bg-primary text-primary-foreground hover:bg-primary/90",t==="outline"&&"border border-border bg-background hover:bg-accent hover:text-accent-foreground",t==="ghost"&&"hover:bg-accent hover:text-accent-foreground",o==="default"&&"h-9 px-4 py-2 text-sm",o==="sm"&&"h-8 px-3 text-xs",o==="icon"&&"size-9",o==="icon-sm"&&"size-7",e),...n});import{jsx as oe}from"react/jsx-runtime";var re=({className:e,...t})=>oe(Fe,{className:i("relative flex-1 overflow-y-hidden",e),initial:"smooth",resize:"smooth",role:"log",...t}),ne=({className:e,...t})=>oe(Fe.Content,{className:i("flex flex-col gap-8 p-4",e),...t}),se=({className:e,...t})=>{let{isAtBottom:o,scrollToBottom:r}=xt(),n=bt(()=>{r()},[r]);return!o&&oe(J,{className:i("absolute bottom-4 left-[50%] translate-x-[-50%] rounded-full",e),onClick:n,size:"icon",variant:"outline",...t,children:oe(ht,{className:"size-4"})})};import{ArrowUpIcon as yt,LoaderIcon as Ct,PaperclipIcon as vt,SquareIcon as Tt,XIcon as wt}from"lucide-react";import{nanoid as Pt}from"nanoid";import{createContext as Mt,useCallback as q,useContext as kt,useEffect as Pe,useMemo as St,useRef as Me,useState as Ue}from"react";import{jsx as O,jsxs as _e}from"react/jsx-runtime";var Et=async e=>{try{let o=await(await fetch(e)).blob();return new Promise(r=>{let n=new FileReader;n.onloadend=()=>r(n.result),n.onerror=()=>r(null),n.readAsDataURL(o)})}catch{return null}},Oe=Mt(null),ze=()=>{let e=kt(Oe);if(!e)throw new Error("usePromptInputAttachments must be used within a PromptInput");return e},ae=({className:e,accept:t,multiple:o,globalDrop:r,maxFiles:n,maxFileSize:s,onSubmit:a,children:l,...f})=>{let p=Me(null),u=Me(null),[d,C]=Ue([]),v=Me(d);Pe(()=>{v.current=d},[d]);let E=q(()=>{p.current?.click()},[]),P=q(x=>{let T=[...x];if(T.length===0)return;let M=h=>s?h.size<=s:!0,N=T.filter(M);C(h=>{let I=typeof n=="number"?Math.max(0,n-h.length):void 0,R=typeof I=="number"?N.slice(0,I):N;return[...h,...R.map(k=>({filename:k.name,id:Pt(),mediaType:k.type,type:"file",url:URL.createObjectURL(k)}))]})},[n,s]),g=q(x=>{C(T=>{let M=T.find(N=>N.id===x);return M?.url&&URL.revokeObjectURL(M.url),T.filter(N=>N.id!==x)})},[]),c=q(()=>{C(x=>{for(let T of x)T.url&&URL.revokeObjectURL(T.url);return[]})},[]);Pe(()=>()=>{for(let x of v.current)x.url&&URL.revokeObjectURL(x.url)},[]);let m=q(x=>{x.currentTarget.files&&P(x.currentTarget.files),x.currentTarget.value=""},[P]);Pe(()=>{if(!r)return;let x=M=>{M.dataTransfer?.types?.includes("Files")&&M.preventDefault()},T=M=>{M.dataTransfer?.types?.includes("Files")&&M.preventDefault(),M.dataTransfer?.files&&M.dataTransfer.files.length>0&&P(M.dataTransfer.files)};return document.addEventListener("dragover",x),document.addEventListener("drop",T),()=>{document.removeEventListener("dragover",x),document.removeEventListener("drop",T)}},[P,r]);let y=q(async x=>{x.preventDefault();let T=x.currentTarget,N=new FormData(T).get("message")||"";T.reset();let h=await Promise.all(d.map(async({id:I,...R})=>{if(R.url?.startsWith("blob:")){let k=await Et(R.url);return{...R,url:k??R.url}}return R}));try{let I=a({files:h,text:N},x);I instanceof Promise&&await I,c()}catch{}},[d,a,c]),D=St(()=>({add:P,clear:c,files:d,openFileDialog:E,remove:g}),[d,P,g,c,E]);return _e(Oe.Provider,{value:D,children:[O("input",{accept:t,"aria-label":"Upload files",className:"hidden",multiple:o,onChange:m,ref:p,title:"Upload files",type:"file"}),O("form",{className:i("flex w-full flex-col rounded-lg border border-border bg-background",e),onSubmit:y,ref:u,...f,children:l})]})};var ie=({onChange:e,onKeyDown:t,className:o,placeholder:r="What would you like to know?",...n})=>{let s=ze(),[a,l]=Ue(!1),f=q(u=>{if(t?.(u),!u.defaultPrevented){if(u.key==="Enter"){if(a||u.nativeEvent.isComposing||u.shiftKey)return;u.preventDefault();let{form:d}=u.currentTarget;if(d?.querySelector('button[type="submit"]')?.disabled)return;d?.requestSubmit()}if(u.key==="Backspace"&&u.currentTarget.value===""&&s.files.length>0){u.preventDefault();let d=s.files.at(-1);d&&s.remove(d.id)}}},[t,a,s]),p=q(u=>{let d=u.clipboardData?.items;if(!d)return;let C=[];for(let v of d)if(v.kind==="file"){let E=v.getAsFile();E&&C.push(E)}C.length>0&&(u.preventDefault(),s.add(C))},[s]);return O("textarea",{className:i("field-sizing-content max-h-48 min-h-16 w-full resize-none border-0 bg-transparent px-3 py-3 text-sm outline-none placeholder:text-muted-foreground",o),name:"message",onCompositionEnd:()=>l(!1),onCompositionStart:()=>l(!0),onKeyDown:f,onPaste:p,placeholder:r,onChange:e,...n})},le=({className:e,status:t,onStop:o,onClick:r,children:n,...s})=>{let a=t==="submitted"||t==="streaming",l=O(yt,{className:"size-4"});t==="submitted"?l=O(Ct,{className:"size-4 animate-spin"}):t==="streaming"&&(l=O(Tt,{className:"size-4"}));let f=q(p=>{if(a&&o){p.preventDefault(),o();return}r?.(p)},[a,o,r]);return O(J,{"aria-label":a?"Stop":"Submit",className:i("bg-foreground text-background hover:bg-foreground",e),onClick:f,size:"icon-sm",type:a&&o?"button":"submit",variant:"ghost",...s,children:n??l})},ue=({className:e,children:t,...o})=>{let r=ze();return r.files.length>0?_e(J,{className:i("group relative",e),onClick:()=>r.clear(),size:"icon-sm",type:"button",variant:"ghost","aria-label":"Remove all attachments",...o,children:[O("span",{className:"flex size-5 items-center justify-center rounded-full bg-primary text-[10px] font-medium text-primary-foreground transition-opacity group-hover:opacity-0",children:r.files.length}),O(wt,{className:"absolute size-4 opacity-0 transition-opacity group-hover:opacity-100"})]}):O(J,{className:i(e),onClick:()=>r.openFileDialog(),size:"icon-sm",type:"button",variant:"ghost",...o,children:t??O(vt,{className:"size-4"})})};import{FileIcon as It}from"lucide-react";import{jsx as Y,jsxs as Nt}from"react/jsx-runtime";var We=({files:e,className:t,...o})=>e.length===0?null:Y("div",{className:i("flex flex-wrap gap-1.5",t),...o,children:e.map((r,n)=>Y(Rt,{file:r},n))});function Rt({file:e}){return e.mediaType?.startsWith("image/")&&e.url?Y("img",{src:e.url,alt:e.filename??"attachment",className:"h-16 max-w-32 rounded object-cover"}):Nt("span",{className:"inline-flex items-center gap-1.5 rounded bg-background/20 px-2 py-1 text-xs",children:[Y(It,{className:"size-3 shrink-0"}),Y("span",{className:"max-w-24 truncate",children:e.filename??"file"})]})}import{jsx as $e}from"react/jsx-runtime";var ke=({className:e,size:t=5,...o})=>$e("div",{className:i("flex items-center gap-1",e),...o,children:[0,1,2].map(r=>$e("div",{className:"rounded-full bg-muted-foreground/60",style:{width:t,height:t,animation:"ww-pulse 1.4s ease-in-out infinite",animationDelay:`${r*.2}s`}},r))});import{cjk as Lt}from"@streamdown/cjk";import{code as At}from"@streamdown/code";import{memo as Ht}from"react";import{Streamdown as Bt}from"streamdown";import{jsx as Se}from"react/jsx-runtime";var ce=({className:e,from:t,...o})=>Se("div",{className:i("group flex w-full max-w-[95%] flex-col gap-2",t==="user"?"is-user ml-auto justify-end":"is-assistant",e),...o}),pe=({children:e,className:t,...o})=>Se("div",{className:i("flex w-fit min-w-0 max-w-full flex-col gap-2 overflow-hidden text-base","group-[.is-user]:ml-auto group-[.is-user]:rounded-lg group-[.is-user]:bg-user-bubble group-[.is-user]:px-4 group-[.is-user]:py-3 group-[.is-user]:text-primary-foreground","group-[.is-assistant]:text-foreground",t),...o,children:e}),Dt={cjk:Lt,code:At},de=Ht(({className:e,...t})=>Se(Bt,{className:i("size-full [&>*:first-child]:mt-0 [&>*:last-child]:mb-0",e),plugins:Dt,...t}),(e,t)=>e.children===t.children);de.displayName="MessageResponse";import{jsx as Ft}from"react/jsx-runtime";function je({className:e,text:t,...o}){return t?Ft("pre",{className:i("mb-2 overflow-x-auto whitespace-pre-wrap break-words text-xs font-mono text-muted-foreground",e),...o,children:t}):null}import{BracesIcon as Ut,CheckIcon as Ot,ChevronDownIcon as zt,ChevronRightIcon as _t,ClipboardCopyIcon as Wt,ServerIcon as xr}from"lucide-react";import{createContext as $t,useCallback as jt,useContext as Ve,useEffect as qt,useMemo as Vt,useRef as Jt,useState as Ee}from"react";import{Fragment as qe,jsx as w,jsxs as K}from"react/jsx-runtime";function Kt(e,t=80){if(e==null)return String(e);if(typeof e!="object")return String(e).slice(0,t);if(Array.isArray(e))return`Array(${e.length})`;let o=JSON.stringify(e);if(o.length<=t)return o;let r=Object.entries(e),n=[],s=t-2;for(let[a,l]of r){if(s<=8)break;let f=a.length>4?`${a.slice(0,4)}\u2026`:a,p;typeof l=="string"?p=l.length>2?`'${l.slice(0,1)}\u2026`:`'${l}'`:Array.isArray(l)?p=`Array(${l.length})`:typeof l=="object"&&l!==null?p="{\u2026}":p=String(l);let u=`${f}\u2009${p}`;n.push(u),s-=u.length+3}return`{${n.join(",  ")}}`}function Gt({text:e,className:t}){let[o,r]=Ee(!1),n=Jt(null);qt(()=>()=>{n.current&&clearTimeout(n.current)},[]);let s=jt(async a=>{a.stopPropagation();try{await navigator.clipboard.writeText(e),r(!0),n.current&&clearTimeout(n.current),n.current=setTimeout(()=>r(!1),2e3)}catch{}},[e]);return w(J,{variant:"ghost",size:"sm",onClick:s,className:i("h-auto gap-1 px-1.5 py-0.5 text-xs text-muted-foreground hover:text-foreground",t),children:o?K(qe,{children:[w(Ot,{className:"size-3.5"}),w("span",{children:"Copied"})]}):K(qe,{children:[w(Wt,{className:"size-3.5"}),w("span",{children:"Copy"})]})})}function Je({data:e,label:t,className:o,...r}){let[n,s]=Ee(!1),a=Vt(()=>JSON.stringify(e,null,2),[e]),l=Kt(e);return K("div",{className:i("rounded-lg bg-tool-card",o),...r,children:[K("div",{className:"flex items-center justify-between px-3 pt-2.5 pb-1.5",children:[w("span",{className:"text-xs font-medium text-muted-foreground",children:t}),w(Gt,{text:a})]}),K("button",{type:"button",onClick:()=>s(f=>!f),className:"flex w-full items-start gap-2 px-3 pb-3 text-left",children:[w(_t,{className:i("mt-0.5 size-3.5 shrink-0 text-muted-foreground transition-transform duration-150",n&&"rotate-90")}),n?w("pre",{className:"overflow-x-auto text-xs font-mono text-foreground whitespace-pre-wrap break-all",children:w("code",{children:a})}):w("span",{className:"truncate text-xs font-mono text-foreground/80",children:l})]})]})}var Ie=$t({open:!1,toggle:()=>{}});function Ke({className:e,defaultOpen:t=!1,children:o,...r}){let[n,s]=Ee(t);return w(Ie.Provider,{value:{open:n,toggle:()=>s(a=>!a)},children:w("div",{className:i("mb-4 w-full",e),"data-state":n?"open":"closed",...r,children:o})})}function Ge({className:e,title:t,state:o,...r}){let{open:n,toggle:s}=Ve(Ie),a=o==="input-available"||o==="input-streaming";return K("button",{type:"button",onClick:s,className:i("flex w-full items-center justify-between gap-3 py-1.5",e),"aria-expanded":n,...r,children:[K("div",{className:"flex min-w-0 items-center gap-2",children:[w(Ut,{className:"size-4 shrink-0 text-muted-foreground"}),w("span",{className:"truncate text-sm font-medium",children:t}),a&&w("span",{className:"size-2 shrink-0 rounded-full bg-primary animate-pulse"})]}),w(zt,{className:i("size-4 shrink-0 text-muted-foreground transition-transform duration-200",n&&"rotate-180")})]})}function Xe({className:e,children:t,...o}){let{open:r}=Ve(Ie);return w("div",{className:i("grid transition-[grid-template-rows,opacity] duration-200 ease-out",r?"grid-rows-[1fr] opacity-100":"grid-rows-[0fr] opacity-0"),children:w("div",{className:"min-h-0 overflow-hidden",children:w("div",{className:i("mt-2 space-y-3 rounded-lg border border-border bg-background p-3",e),...o,children:t})})})}function Ye({className:e,input:t,...o}){return w(Je,{data:t,label:"Request",className:e,...o})}function Ze(e){if(typeof e!="object"||e===null)return;let t=e._meta;if(typeof t!="object"||t===null)return;let o=t.ui;if(!(typeof o!="object"||o===null))return o}function Qe(e){let t=Ze(e)?.resourceUri;return typeof t=="string"?t:void 0}function et(e){return Ze(e)?.autoHeight===!0}function tt({className:e,output:t,errorText:o,...r}){return t||o?o?K("div",{className:i("space-y-2",e),...r,children:[w("h4",{className:"text-xs font-medium uppercase tracking-wide text-muted-foreground",children:"Error"}),w("div",{className:"rounded-lg bg-destructive/10 p-3 text-xs text-destructive",children:o})]}):w(Je,{data:t,label:"Response",className:e,...r}):null}import{useCallback as Xt,useEffect as ot,useMemo as Yt,useRef as W,useState as rt}from"react";import{jsx as no}from"react/jsx-runtime";var Zt="/api/mcp/resource",Qt=500,eo=0,to="2026-01-26",oo=300,ro=3e3,Re=3;function Ne({resourceUri:e,toolInput:t,toolResult:o,resourceEndpoint:r=Zt,isDark:n=!1,className:s,autoHeight:a=!0,onOpenLink:l,onFollowUp:f}){let p=W(null),u=W(t),d=W(o),C=W({width:0,height:0}),v=W(null),E=W(!1),P=W(0),[g,c]=rt(eo),[m,y]=rt(void 0),D=W(l),x=W(f);u.current=t,d.current=o,D.current=l,x.current=f;let T=Xt(h=>a?Math.max(h,0):Math.min(Math.max(h,50),Qt),[a]),M=Yt(()=>`${r}?uri=${encodeURIComponent(e)}`,[r,e]),N=W(n);return N.current=n,ot(()=>{if(!E.current)return;let h=p.current;h?.contentWindow&&h.contentWindow.postMessage({jsonrpc:"2.0",method:"ui/notifications/host-context-changed",params:{theme:n?"dark":"light"}},"*")},[n]),ot(()=>{let h=p.current;if(!h)return;let I=!1,R=!1,k=(...S)=>console.debug("[McpAppFrame]",...S);k("effect mounted, waiting for handshake");let L=setTimeout(()=>{if(I||R)return;if(P.current>=Re){k("handshake failed after",Re,"retries, giving up");return}P.current+=1,k("handshake timeout, reloading iframe (retry",P.current,"of",Re,")");let S=new URL(h.src);S.searchParams.set("_retry",String(P.current)),h.src=S.toString()},ro),b=S=>{k("\u2192 send",S.method??`response:${S.id}`,S),h.contentWindow?.postMessage(S,"*")},A=S=>{if(I||S.source!==h.contentWindow)return;let B=S.data;if(!B||typeof B!="object"||B.jsonrpc!=="2.0")return;let j=B.method,F=B.id;if(k("\u2190 recv",j??`response:${F}`,B),j==="ui/initialize"&&F!=null){R=!0,clearTimeout(L),k("handshake started"),b({jsonrpc:"2.0",id:F,result:{protocolVersion:B.params?.protocolVersion??to,hostInfo:{name:"WaniWani Chat",version:"1.0.0"},hostCapabilities:{openLinks:{},message:{}},hostContext:{theme:N.current?"dark":"light",displayMode:"inline"}}});return}if(j==="ui/notifications/initialized"){k("handshake complete, sending tool data"),E.current=!0;let z=u.current,_=d.current;b({jsonrpc:"2.0",method:"ui/notifications/tool-input",params:{arguments:z}});let V=_.content??[{type:"text",text:JSON.stringify(_)}];b({jsonrpc:"2.0",method:"ui/notifications/tool-result",params:{content:V,structuredContent:_.structuredContent}});return}if(j==="ui/notifications/size-changed"){let z=B.params,_=typeof z?.height=="number"?z.height:void 0,V=typeof z?.width=="number"?z.width:void 0,G=C.current,ve=_!==void 0&&_!==G.height,Te=V!==void 0&&V!==G.width;if(k("size-changed",{newHeight:_,newWidth:V,lastHeight:G.height,lastWidth:G.width,heightChanged:ve,widthChanged:Te}),!ve&&!Te)return;if(ve&&_!==void 0){G.height=_;let we=T(_),De=h.getBoundingClientRect().height;if(v.current&&(v.current.cancel(),v.current=null),c(we),h.animate&&Math.abs(De-we)>2){let te=h.animate([{height:`${De}px`},{height:`${we}px`}],{duration:oo,easing:"ease-out",fill:"forwards"});v.current=te,te.onfinish=()=>{v.current===te&&(te.cancel(),v.current=null)}}}Te&&a&&V!==void 0&&(G.width=V,y(V));return}if(j==="ui/open-link"&&F!=null){let z=B.params?.url;typeof z=="string"&&(D.current?D.current(z):window.open(z,"_blank","noopener,noreferrer")),b({jsonrpc:"2.0",id:F,result:{}});return}if(j==="ui/message"&&F!=null){x.current&&B.params&&x.current(B.params),b({jsonrpc:"2.0",id:F,result:{}});return}if(j==="ui/request-display-mode"&&F!=null){b({jsonrpc:"2.0",id:F,result:{}});return}if(j==="ui/resource-teardown"&&F!=null){b({jsonrpc:"2.0",id:F,result:{}});return}j==="ping"&&F!=null&&b({jsonrpc:"2.0",id:F,result:{}})};return window.addEventListener("message",A),()=>{k("effect cleanup (disposed)"),I=!0,clearTimeout(L),window.removeEventListener("message",A)}},[a,T]),no("iframe",{ref:p,src:M,sandbox:"allow-scripts allow-forms allow-same-origin",className:i("rounded-md border border-border",s),style:{height:g,minWidth:m?`min(${m}px, 100%)`:void 0,width:"100%",border:"none",colorScheme:"auto"},title:"MCP App"})}import{Component as so}from"react";import{jsx as nt,jsxs as ao}from"react/jsx-runtime";var me=class extends so{state={hasError:!1};static getDerivedStateFromError(){return{hasError:!0}}componentDidCatch(t){console.warn("[WaniWani] Widget failed to render:",t.message)}render(){return this.state.hasError?ao("div",{className:"flex items-center justify-between rounded-md border border-border bg-muted/50 px-4 py-3 text-sm text-muted-foreground",children:[nt("span",{children:"Widget failed to load"}),nt("button",{type:"button",onClick:()=>this.setState({hasError:!1}),className:"text-xs font-medium text-primary hover:underline",children:"Retry"})]}):this.props.children}};import{Fragment as lo,jsx as H,jsxs as X}from"react/jsx-runtime";function io(e){return e.replace(/[-_]/g," ").replace(/^\w/,t=>t.toUpperCase())}function fe({messages:e,status:t,welcomeMessage:o,resourceEndpoint:r,isDark:n,onFollowUp:s}){let a=t==="submitted"||t==="streaming",l=e[e.length-1],f=e.length>0,p=a&&(!f||l.role==="user");return X(lo,{children:[o&&H(ce,{from:"assistant",children:H(pe,{children:H(de,{children:o})})}),e.map(u=>{let d=u.parts.filter(c=>c.type==="text"),C=u.parts.filter(c=>c.type==="reasoning"),v=u.parts.filter(c=>c.type==="file"),E=u.parts.filter(c=>"toolCallId"in c),P=u===l&&u.role==="assistant",g=d.length>0;return X(ce,{from:u.role,children:[C.map((c,m)=>H(je,{text:c.text},`reasoning-${u.id}-${m}`)),E.map(c=>{let m="output"in c?c.output:void 0,y=m!==void 0?Qe(m):void 0,D=m!==void 0?et(m):!1;return X("div",{children:[X(Ke,{defaultOpen:c.state==="output-available",children:[H(Ge,{title:c.title??io(c.toolName),state:c.state}),X(Xe,{children:[H(Ye,{input:c.input}),m!==void 0&&H(tt,{output:m,errorText:"errorText"in c?c.errorText:void 0})]})]}),y&&m!==void 0&&H(me,{children:H(Ne,{resourceUri:y,toolInput:c.input??{},toolResult:{content:m.content,structuredContent:m.structuredContent},resourceEndpoint:r,isDark:n,autoHeight:D,onFollowUp:s})})]},c.toolCallId)}),X(pe,{children:[v.length>0&&H(We,{files:v}),g?d.map((c,m)=>H(de,{children:c.type==="text"?c.text:""},`${u.id}-${m}`)):P&&a&&H(ke,{})]})]},u.id)}),p&&H(ce,{from:"assistant",children:H(pe,{children:H(ke,{})})})]})}import{jsx as Le}from"react/jsx-runtime";function ge({suggestions:e,isLoading:t,onSelect:o,className:r,...n}){return e.length===0&&!t?null:Le("div",{className:i("flex flex-wrap gap-2 px-3 py-2",r),...n,children:t?[0,1,2].map(s=>Le("div",{className:"h-7 rounded-full bg-accent animate-pulse",style:{width:`${60+s*20}px`}},s)):e.map((s,a)=>Le("button",{type:"button",onClick:()=>o(s),className:i("rounded-full border border-border bg-background px-3 py-1 text-xs","text-foreground hover:bg-accent hover:border-primary/30","transition-all duration-200 ease-out cursor-pointer","animate-[ww-fade-in_0.2s_ease-out_both]"),style:{animationDelay:`${a*50}ms`},children:s},s))})}import{useChat as uo}from"@ai-sdk/react";import{DefaultChatTransport as co}from"ai";import{useCallback as st,useRef as po,useState as mo}from"react";function he(e){let{api:t="https://app.waniwani.ai/api/chat",headers:o,body:r,onMessageSent:n,onResponseReceived:s}=e,a=po(new co({api:t,headers:{...o},body:r})),{messages:l,sendMessage:f,status:p}=uo({transport:a.current,onFinish(){s?.()},onError(m){console.warn("[WaniWani] Chat error:",m.message)}}),[u,d]=mo(""),C=st(m=>{let y=!!m.text?.trim(),D=!!m.files?.length;(y||D)&&(f({text:m.text||"",files:m.files}),n?.(m.text||""),d(""))},[f,n]),v=st(m=>{d(m.target.value)},[]),E=p==="submitted"||p==="streaming",P=l[l.length-1],g=l.length>0,c=E&&(!g||P.role==="user");return{messages:l,status:p,text:u,setText:d,handleSubmit:C,handleTextChange:v,isLoading:E,showLoaderBubble:c,lastMessage:P,hasMessages:g,sendMessage:f}}import{useCallback as fo,useEffect as at,useRef as go,useState as ho}from"react";function bo(e){for(let t of e.parts){let o=t;if(o.type==="data"||o.type==="data-suggestions"){let r=o.data;if(r&&Array.isArray(r.suggestions))return r.suggestions}}return null}function xo(e){return typeof e=="object"&&e!==null&&"initial"in e}function be(e){let{messages:t,status:o,config:r}=e,[n,s]=ho((xo(r)&&r.initial?r.initial:[])??[]),a=go(o),l=!!r,f=fo(()=>{s([])},[]),p=t[t.length-1];return at(()=>{p?.role==="user"&&f()},[p,f]),at(()=>{let u=a.current;if(a.current=o,u==="streaming"&&o==="ready"&&l){let d=[...t].reverse().find(v=>v.role==="assistant");if(!d)return;console.log("[WaniWani] Assistant parts:",d.parts);let C=bo(d);console.log("[WaniWani] Extracted suggestions:",C),C&&s(C)}},[o,l,t]),{suggestions:n,isLoading:!1,clear:f}}import{useEffect as yo,useRef as Co,useState as vo}from"react";var To=50,wo=30,Po=2e3,it=500;function xe(e,t=!0){let[o,r]=vo(""),n=Co(void 0);return yo(()=>{if(!t){r("");return}let s=0,a=!1,l=!1,f=()=>{l||(a?(s--,r(e.slice(0,s)),s<=0?(a=!1,n.current=setTimeout(f,it)):n.current=setTimeout(f,wo)):(s++,r(e.slice(0,s)),s>=e.length?(a=!0,n.current=setTimeout(f,Po)):n.current=setTimeout(f,To)))};return n.current=setTimeout(f,it),()=>{l=!0,clearTimeout(n.current)}},[e,t]),o}var lt={primaryColor:"#6366f1",primaryForeground:"#1f2937",backgroundColor:"#ffffff",textColor:"#1f2937",mutedColor:"#6b7280",borderColor:"#e5e7eb",assistantBubbleColor:"#f3f4f6",userBubbleColor:"#f4f4f4",inputBackgroundColor:"#f9fafb",borderRadius:16,messageBorderRadius:12,fontFamily:"system-ui, -apple-system, 'Segoe UI', sans-serif",headerBackgroundColor:"#ffffff",headerTextColor:"#1f2937",statusColor:"#22c55e",toolCardColor:"#f4f4f5"},Mo={backgroundColor:"#212121",headerBackgroundColor:"#1e1e1e",headerTextColor:"#ececec",textColor:"#ececec",primaryForeground:"#ffffff",mutedColor:"#8e8ea0",borderColor:"#303030",assistantBubbleColor:"#2f2f2f",userBubbleColor:"#303030",inputBackgroundColor:"#2f2f2f",primaryColor:"#6366f1",statusColor:"#22c55e",toolCardColor:"#262626"},ko={primaryColor:["--ww-primary","--color-primary"],primaryForeground:["--ww-primary-fg","--color-primary-foreground"],backgroundColor:["--ww-bg","--color-background"],textColor:["--ww-text","--color-foreground","--color-accent-foreground"],mutedColor:["--ww-muted","--color-muted-foreground"],borderColor:["--ww-border","--color-border"],assistantBubbleColor:["--ww-assistant-bubble","--color-accent"],userBubbleColor:["--ww-user-bubble"],inputBackgroundColor:["--ww-input-bg","--color-input"],borderRadius:["--ww-radius","--radius"],messageBorderRadius:["--ww-msg-radius"],fontFamily:["--ww-font"],headerBackgroundColor:["--ww-header-bg"],headerTextColor:["--ww-header-text"],statusColor:["--ww-status"],toolCardColor:["--ww-tool-card","--color-tool-card"]};function Z(e){return{...lt,...e}}function ye(e){let t=e.backgroundColor.replace("#",""),o=parseInt(t.substring(0,2),16),r=parseInt(t.substring(2,4),16),n=parseInt(t.substring(4,6),16);return(o*299+r*587+n*114)/1e3<128}function Q(e){let t={};for(let[o,r]of Object.entries(ko)){let n=e[o],s=typeof n=="number"?`${n}px`:String(n);for(let a of r)t[a]=s}return t}import{jsx as $,jsxs as Ae}from"react/jsx-runtime";var He=So(function(t,o){let{theme:r,width:n=600,expandedHeight:s=400,allowAttachments:a=!1,welcomeMessage:l,placeholder:f="Ask me anything...",triggerEvent:p="triggerDemoRequest",resourceEndpoint:u,api:d}=t,C=u??(d?`${d}/resource`:void 0),v=Z(r),E=Q(v),P=ye(v),g=he(t),c=be({messages:g.messages,status:g.status,config:t.suggestions}),m=Ce(b=>{let A=b.content.map(S=>S.text??"").join("").trim();A&&g.handleSubmit({text:A,files:[]})},[g.handleSubmit]),y=Ce(b=>{c.clear(),g.handleSubmit({text:b,files:[]})},[c.clear,g.handleSubmit]),D=xe(f,!g.text),[x,T]=pt(!1),[M,N]=pt(!1),h=ct(null),I=ct(void 0),R=Ce(()=>{let b=h.current;if(!b)return;b.scrollIntoView({behavior:"smooth",block:"center"});let A=b.querySelector("textarea");A&&setTimeout(()=>A.focus(),300),T(!0),N(!0),clearTimeout(I.current),I.current=setTimeout(()=>N(!1),2e3)},[]);Eo(o,()=>({sendMessage:b=>{g.handleSubmit({text:b,files:[]}),R()},focus:R}),[g.handleSubmit,R]),ut(()=>{if(!p)return;let b=A=>{let S=A.detail,B=typeof S?.message=="string"?S.message:void 0;B&&g.handleSubmit({text:B,files:[]}),R()};return window.addEventListener(p,b),()=>window.removeEventListener(p,b)},[p,g.handleSubmit,R]);let k=x;ut(()=>{if(!x)return;let b=A=>{h.current&&!h.current.contains(A.target)&&T(!1)};return document.addEventListener("mousedown",b),()=>document.removeEventListener("mousedown",b)},[x]);let L=Ce(()=>{T(!0)},[]);return Ae("div",{ref:h,style:{...E,width:n},"data-waniwani-chat":"","data-waniwani-layout":"bar",...P?{"data-waniwani-dark":""}:{},className:"flex flex-col font-[family-name:var(--ww-font)] text-foreground",children:[$("div",{className:i("overflow-hidden bg-background/80 backdrop-blur-xl transition-all duration-300 ease-out",k?"opacity-100 translate-y-0":"opacity-0 translate-y-2 pointer-events-none max-h-0"),style:{...k?{maxHeight:s}:void 0,maskImage:"linear-gradient(to bottom, transparent, black 24px, black calc(100% - 16px), transparent), linear-gradient(to right, transparent, black 16px, black calc(100% - 16px), transparent)",maskComposite:"intersect",WebkitMaskImage:"linear-gradient(to bottom, transparent, black 24px, black calc(100% - 16px), transparent), linear-gradient(to right, transparent, black 16px, black calc(100% - 16px), transparent)",WebkitMaskComposite:"source-in"},children:Ae(re,{className:"flex-1",style:{height:s},children:[$(ne,{children:$(fe,{messages:g.messages,status:g.status,welcomeMessage:l,resourceEndpoint:C,isDark:P,onFollowUp:m})}),$(se,{})]})}),$(ge,{suggestions:c.suggestions,isLoading:c.isLoading,onSelect:y}),$("div",{className:"shrink-0",children:$(ae,{onSubmit:g.handleSubmit,globalDrop:a,multiple:a,className:i("rounded-[var(--ww-radius)] shadow-sm transition-all duration-300 ease-out",M&&"ring-2 ring-blue-400/70 ring-offset-2 ring-offset-background"),children:Ae("div",{className:"flex items-center gap-1 px-3 py-2",children:[a&&$(ue,{}),$(ie,{onChange:g.handleTextChange,value:g.text,placeholder:D,onFocus:L,className:"min-h-0 py-1.5 px-2"}),$(le,{status:g.status})]})})})]})});import{forwardRef as Io,useCallback as Be,useEffect as Ro,useImperativeHandle as No,useRef as dt,useState as Lo}from"react";import{jsx as U,jsxs as ee}from"react/jsx-runtime";var Ao=Io(function(t,o){let{theme:r,title:n="Assistant",subtitle:s,showStatus:a=!0,width:l=500,height:f=600,allowAttachments:p=!1,welcomeMessage:u,placeholder:d="Ask me anything...",triggerEvent:C="triggerDemoRequest",resourceEndpoint:v,api:E}=t,P=v??(E?`${E}/resource`:void 0),g=Z(r),c=Q(g),m=ye(g),y=he(t),D=xe(d,!y.text),[x,T]=Lo(!1),M=dt(null),N=dt(void 0),h=Be(()=>{let L=M.current;if(!L)return;L.scrollIntoView({behavior:"smooth",block:"center"});let b=L.querySelector("textarea");b&&setTimeout(()=>b.focus(),300),T(!0),clearTimeout(N.current),N.current=setTimeout(()=>T(!1),2e3)},[]),I=be({messages:y.messages,status:y.status,config:t.suggestions}),R=Be(L=>{let b=L.content.map(A=>A.text??"").join("").trim();b&&y.handleSubmit({text:b,files:[]})},[y.handleSubmit]),k=Be(L=>{I.clear(),y.handleSubmit({text:L,files:[]})},[I.clear,y.handleSubmit]);return No(o,()=>({sendMessage:L=>{y.handleSubmit({text:L,files:[]}),h()},focus:h}),[y.handleSubmit,h]),Ro(()=>{if(!C)return;let L=b=>{let A=b.detail,S=typeof A?.message=="string"?A.message:void 0;S&&y.handleSubmit({text:S,files:[]}),h()};return window.addEventListener(C,L),()=>window.removeEventListener(C,L)},[C,y.handleSubmit,h]),ee("div",{ref:M,style:{...c,width:l,height:f},"data-waniwani-chat":"","data-waniwani-layout":"card",...m?{"data-waniwani-dark":""}:{},className:i("flex flex-col font-[family-name:var(--ww-font)] text-foreground bg-background rounded-[var(--ww-radius)] border border-border shadow-md overflow-hidden transition-shadow duration-300",x&&"ring-2 ring-blue-400/70 ring-offset-2 ring-offset-background"),children:[ee("div",{className:"shrink-0 flex items-center gap-3 px-4 py-2 border-b border-border",style:{backgroundColor:g.headerBackgroundColor,color:g.headerTextColor},children:[a&&U("span",{className:"size-2.5 rounded-full bg-status"}),ee("div",{className:"flex-1 min-w-0",children:[U("div",{className:"text-xs font-semibold truncate",children:n}),s&&U("div",{className:"text-[11px] text-muted-foreground truncate",children:s})]})]}),ee(re,{className:"flex-1 min-h-0 bg-background",children:[U(ne,{children:U(fe,{messages:y.messages,status:y.status,welcomeMessage:u,resourceEndpoint:P,isDark:m,onFollowUp:R})}),U(se,{})]}),U(ge,{suggestions:I.suggestions,isLoading:I.isLoading,onSelect:k,className:"border-t border-border"}),U("div",{className:"shrink-0 border-t border-border bg-background",children:U(ae,{onSubmit:y.handleSubmit,globalDrop:p,multiple:p,className:i("rounded-none border-0"),children:ee("div",{className:"flex items-center gap-1 px-3 py-2",children:[p&&U(ue,{}),U(ie,{onChange:y.handleTextChange,value:y.text,placeholder:D,className:"min-h-0 py-1.5 px-2"}),U(le,{status:y.status})]})})})]})});export{He as ChatBar,Ao as ChatCard,He as ChatWidget,Mo as DARK_THEME,lt as DEFAULT_THEME,Ne as McpAppFrame,Z as mergeTheme,Q as themeToCSSProperties};
 //# sourceMappingURL=index.js.map