super-agent-sdk 1.0.1 → 1.0.3

package/dist/widget.cjs

@@ -1,6 +1,6 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("react"),he=require("react-dom"),e=require("react/jsx-runtime");var _,A=he;if(process.env.NODE_ENV==="production")_=A.createRoot,A.hydrateRoot;else{var U=A.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;_=function(a,s){U.usingClientEntryPoint=!0;try{return A.createRoot(a,s)}finally{U.usingClientEntryPoint=!1}}}function Y(a){const{sdk:s,sessionId:l,onSessionCreated:r,onStreamStart:t,onStreamEnd:i,onError:d,onMessageSend:n}=a,[o,x]=c.useState([]),[f,m]=c.useState("ready"),[v,g]=c.useState(null),p=c.useRef(null),h=c.useRef(!1),b=c.useRef(l);b.current=l;const u=c.useCallback(j=>{if(h.current)return;h.current=!0,n==null||n(j);const L={id:`user_${Date.now()}`,role:"user",parts:[{type:"text",content:j}],timestamp:Date.now()},z=`assistant_${Date.now()}`,xe={id:z,role:"assistant",parts:[],timestamp:Date.now()};x(N=>[...N,L,xe]),m("submitted"),g(null);const F=N=>{let $="",I="",M=[],q=!1;const O=()=>{const w=[...M];if($){const E=w.findIndex(R=>R.type==="thinking");E>=0?w[E]={type:"thinking",content:$}:w.unshift({type:"thinking",content:$})}if(I){const E=w.findLastIndex(R=>R.type==="text");E>=0?w[E]={type:"text",content:I}:w.push({type:"text",content:I})}x(E=>E.map(R=>R.id===z?{...R,parts:w}:R))};p.current=s.chat({sessionId:N,message:j,stream:!0,onMessage:w=>{switch(q||(q=!0,m("streaming")),w.type){case"thinking":$+=w.content;break;case"ai":I+=w.content;break;case"tool_call":M.push({type:"tool_call",toolName:w.toolName,toolCallId:w.toolCallId,args:w.args??"{}"});break;case"tool_result":M.push({type:"tool_result",toolName:w.toolName??"",toolCallId:w.toolCallId,content:w.content}),I&&(M.push({type:"text",content:I}),I="");break}O()},onDone:w=>{(I||M.length>0||$)&&O(),w.sessionId&&w.sessionId!==b.current&&(r==null||r(w.sessionId)),i==null||i(w.sessionId||N),m("ready"),h.current=!1,p.current=null},onError:w=>{M.push({type:"error",content:w.message}),O(),g(w),m("error"),d==null||d(w),h.current=!1,p.current=null}}),t==null||t(N)};b.current?F(b.current):s.createSession().then(N=>{b.current=N,r==null||r(N),F(N)}).catch(N=>{g(N instanceof Error?N:new Error(String(N))),m("error"),d==null||d(N instanceof Error?N:new Error(String(N))),h.current=!1})},[s,r,t,i,d,n]),y=c.useCallback(()=>{var j;(j=p.current)==null||j.abort(),p.current=null,m("ready"),h.current=!1},[]),C=c.useCallback(()=>{if(h.current)return;const j=o.findLastIndex(z=>z.role==="user");if(j<0)return;const L=o[j].parts.filter(z=>z.type==="text").map(z=>z.content).join("");x(z=>z.slice(0,j)),u(L)},[o,u]);return{messages:o,status:f,error:v,sendMessage:u,stop:y,regenerate:C,setMessages:x}}const D="sa_active_conversation";function K(){try{return localStorage.getItem(D)}catch{return null}}function me(a){try{a?localStorage.setItem(D,a):localStorage.removeItem(D)}catch{}}function J(a){const{sdk:s,onConversationChange:l}=a,[r,t]=c.useState([]),[i,d]=c.useState(()=>K()),[n,o]=c.useState(!1),x=c.useRef(!0);c.useEffect(()=>()=>{x.current=!1},[]);const f=c.useCallback(u=>{d(u),me(u),u&&(l==null||l(u))},[l]),m=c.useCallback(async()=>{o(!0);try{const u=await s.listConversations({page:1,size:100});if(!x.current)return;t(u.items);const y=K();y&&!u.items.find(C=>C.sessionId===y)&&f(null)}catch{}finally{x.current&&o(!1)}},[s,f]),v=c.useCallback(async u=>(f(u),await s.getMessages(u)),[s,f]),g=c.useCallback(()=>{f(null)},[f]),p=c.useCallback(async u=>{await s.deleteConversation(u),t(y=>y.filter(C=>C.sessionId!==u)),i===u&&f(null)},[s,i,f]),h=c.useCallback(async(u,y)=>{await s.renameConversation(u,y),t(C=>C.map(j=>j.sessionId===u?{...j,title:y}:j))},[s]),{enabled:b=!0}=a;return c.useEffect(()=>{b&&m()},[b,m]),{conversations:r,activeConversationId:i,loading:n,loadConversations:m,switchConversation:v,newConversation:g,deleteConversation:p,renameConversation:h,setActiveConversationId:f}}const X=c.createContext(null);function T(){const a=c.useContext(X);if(!a)throw new Error("useChatContext must be used within ChatProvider");return a}function H({sdk:a,hooks:s,children:l}){const[r,t]=c.useState(!1),[i,d]=c.useState(!1);c.useEffect(()=>{a.getToken().then(()=>{d(!0)}).catch(()=>{d(!0)})},[a]);const n=J({sdk:a,onConversationChange:s==null?void 0:s.onConversationChange,enabled:i}),o=Y({sdk:a,sessionId:n.activeConversationId,onSessionCreated:p=>{n.setActiveConversationId(p),n.loadConversations()},onStreamStart:s==null?void 0:s.onStreamStart,onStreamEnd:p=>{var h;(h=s==null?void 0:s.onStreamEnd)==null||h.call(s,p),n.loadConversations()},onError:s==null?void 0:s.onError,onMessageSend:s==null?void 0:s.onMessageSend}),x=c.useCallback(async p=>{const h=await n.switchConversation(p);o.setMessages(h),t(!1)},[n,o]),f=c.useCallback(()=>{n.newConversation(),o.setMessages([]),t(!1)},[n,o]),m=c.useCallback(async p=>{await n.deleteConversation(p),n.activeConversationId===p&&o.setMessages([])},[n,o]);c.useEffect(()=>{n.activeConversationId&&o.messages.length===0&&a.getMessages(n.activeConversationId).then(p=>{o.setMessages(p)}).catch(()=>{})},[]);const v=c.useCallback(()=>{t(p=>!p)},[]),g={status:o.status,error:o.error,messages:o.messages,conversations:n.conversations,activeConversationId:n.activeConversationId,isThreadListOpen:r,sendMessage:o.sendMessage,stop:o.stop,regenerate:o.regenerate,switchConversation:x,newConversation:f,deleteConversation:m,renameConversation:n.renameConversation,toggleThreadList:v,feedback:(p,h)=>{a.feedback(p,h)}};return e.jsx(X.Provider,{value:g,children:l})}function k({name:a,size:s=16,color:l="currentColor",className:r,style:t}){return e.jsx("svg",{className:r,style:{width:s,height:s,fill:l,verticalAlign:"middle",...t},"aria-hidden":"true",children:e.jsx("use",{href:`#icon-${a}`})})}function G({isOpen:a,onClick:s}){return e.jsx("button",{className:`sa-trigger ${a?"sa-trigger-open":""}`,onClick:s,children:a?e.jsx(k,{name:"x",size:24,color:"#fff"}):e.jsx(k,{name:"message-square",size:24,color:"#fff"})})}function Z({title:a,onClose:s,onToggleThreadList:l,showClose:r=!0}){return e.jsxs("div",{className:"sa-header",children:[e.jsxs("div",{className:"sa-header-left",children:[e.jsx("div",{className:"sa-header-avatar",children:"A"}),e.jsxs("div",{className:"sa-header-info",children:[e.jsx("div",{className:"sa-header-title",children:a}),e.jsx("div",{className:"sa-header-status",children:"● Online"})]})]}),e.jsxs("div",{className:"sa-header-actions",children:[e.jsx("button",{className:"sa-header-btn",onClick:l,title:"会话列表",children:e.jsx(k,{name:"menu",size:16})}),r&&e.jsx("button",{className:"sa-header-btn",onClick:s,title:"关闭",children:e.jsx(k,{name:"x",size:16})})]})]})}function Q(){const{conversations:a,activeConversationId:s,switchConversation:l,newConversation:r,deleteConversation:t,renameConversation:i,isThreadListOpen:d,toggleThreadList:n}=T(),[o,x]=c.useState(null),[f,m]=c.useState(""),v=c.useCallback((p,h)=>{x(p),m(h??"")},[]),g=c.useCallback(p=>{f.trim()&&i(p,f.trim()),x(null)},[f,i]);return d?e.jsxs(e.Fragment,{children:[e.jsx("div",{className:"sa-thread-list-overlay",onClick:n}),e.jsxs("div",{className:"sa-thread-list",children:[e.jsxs("div",{className:"sa-thread-list-header",children:[e.jsx("span",{children:"会话列表"}),e.jsxs("button",{className:"sa-thread-list-new",onClick:r,children:[e.jsx(k,{name:"plus",size:14})," 新会话"]})]}),e.jsxs("div",{className:"sa-thread-list-items",children:[a.length===0&&e.jsx("div",{className:"sa-thread-list-empty",children:"暂无会话"}),a.map(p=>e.jsxs("div",{className:`sa-thread-item ${p.sessionId===s?"active":""}`,onClick:()=>l(p.sessionId),children:[o===p.sessionId?e.jsx("input",{className:"sa-thread-item-edit",value:f,onChange:h=>m(h.target.value),onBlur:()=>g(p.sessionId),onKeyDown:h=>{h.key==="Enter"&&g(p.sessionId),h.key==="Escape"&&x(null)},onClick:h=>h.stopPropagation(),autoFocus:!0}):e.jsx("span",{className:"sa-thread-item-title",onDoubleClick:h=>{h.stopPropagation(),v(p.sessionId,p.title)},children:p.title||"新会话"}),e.jsx("button",{className:"sa-thread-item-delete",onClick:h=>{h.stopPropagation(),t(p.sessionId)},title:"删除",children:e.jsx(k,{name:"trash2",size:14})})]},p.sessionId))]})]})]}):null}function ee(a){const s=c.useRef(null),l=c.useRef(!1),r=c.useRef(0),t=c.useCallback(()=>{const d=s.current;if(!d)return;const{scrollTop:n,scrollHeight:o,clientHeight:x}=d,f=o-n-x<40;n<r.current&&!f&&(l.current=!0),f&&(l.current=!1),r.current=n},[]);c.useEffect(()=>{const d=s.current;if(d)return d.addEventListener("scroll",t,{passive:!0}),()=>d.removeEventListener("scroll",t)},[t]),c.useEffect(()=>{if(l.current)return;const d=s.current;d&&requestAnimationFrame(()=>{d.scrollTop=d.scrollHeight})},a);const i=c.useCallback(()=>{l.current=!1;const d=s.current;d&&(d.scrollTop=d.scrollHeight)},[]);return{containerRef:s,scrollToBottom:i}}function S(a){return a.value++}function P(a,s){const l=[],r=[],t=()=>{r.length>0&&(l.push(r.join("")),r.length=0)};let i=0;for(;i<a.length;){const d=a[i];if(d==="`"){const n=a.indexOf("`",i+1);if(n!==-1){t(),l.push(e.jsx("code",{className:"sa-inline-code",children:a.slice(i+1,n)},S(s))),i=n+1;continue}}else if(d==="*"&&a[i+1]==="*"){const n=a.indexOf("**",i+2);if(n!==-1){t(),l.push(e.jsx("strong",{children:P(a.slice(i+2,n),s)},S(s))),i=n+2;continue}}else if(d==="*"){const n=a.indexOf("*",i+1);if(n!==-1){t(),l.push(e.jsx("em",{children:P(a.slice(i+1,n),s)},S(s))),i=n+1;continue}}else if(d==="["){const n=a.indexOf("]",i+1);if(n!==-1&&a[n+1]==="("){const o=a.indexOf(")",n+2);if(o!==-1){const x=a.slice(i+1,n),f=a.slice(n+2,o);t(),l.push(e.jsx("a",{href:f,target:"_blank",rel:"noreferrer",children:P(x,s)},S(s))),i=o+1;continue}}}r.push(d),i++}return t(),l}function ge(a,s){const l=[],r=a.split(`
-`);let t=0;const i=o=>o.trim()==="",d=o=>/^#{1,6}\s+\S/.test(o.trim()),n=o=>/^(?:[-*+]|\d+[.)])\s+\S/.test(o.trim());for(;t<r.length;){const o=r[t],x=o.trim();if(i(o)){t++;continue}if(d(o)){const m=x.match(/^(#{1,6})\s+(.*)$/);if(m){const g=`h${Math.min(m[1].length,6)}`;l.push(c.createElement(g,{key:S(s)},P(m[2],s)))}t++;continue}if(n(o)){const m=/^\d+[.)]/.test(x),v=[];for(;t<r.length&&n(r[t]);){const g=r[t].trim().match(/^(?:[-*+]|\d+[.)])\s+(.*)$/);g&&v.push(e.jsx("li",{children:P(g[1],s)},S(s))),t++}l.push(m?e.jsx("ol",{className:"sa-list",children:v},S(s)):e.jsx("ul",{className:"sa-list",children:v},S(s)));continue}const f=[];for(;t<r.length&&!i(r[t])&&!d(r[t])&&!n(r[t]);)f.push(r[t]),t++;l.push(e.jsx("p",{className:"sa-text-paragraph",children:P(f.join(" "),s)},S(s)))}return l}function be(a){const s={value:0},l=[],r=a.split("```");for(let t=0;t<r.length;t++)if(t%2===0)l.push(...ge(r[t],s));else if(r[t].trim()!==""){let i=r[t].replace(/^\r?\n/,"");i=i.replace(/^[a-zA-Z0-9_+#.-]+\r?\n/,""),i=i.replace(/\r?\n$/,""),l.push(e.jsx("pre",{className:"sa-code-block",children:e.jsx("code",{children:i})},S(s)))}return l}function se({content:a}){return e.jsx("div",{className:"sa-text-part",children:be(a)})}function ae({content:a}){const[s,l]=c.useState(!1);return e.jsxs("div",{className:"sa-thinking-part",onClick:()=>l(!s),children:[e.jsxs("div",{className:"sa-thinking-header",children:[e.jsx("span",{className:"sa-thinking-icon",children:e.jsx(k,{name:"brain",size:14})}),e.jsx("span",{className:"sa-thinking-label",children:"思考过程"}),e.jsx("span",{className:`sa-thinking-arrow ${s?"expanded":""}`,children:e.jsx(k,{name:"chevron-right",size:12})})]}),s&&e.jsx("div",{className:"sa-thinking-content",children:a})]})}function te({toolName:a,toolCallId:s,args:l}){const[r,t]=c.useState(!1);let i=l;try{i=JSON.stringify(JSON.parse(l),null,2)}catch{}return e.jsxs("div",{className:"sa-tool-call-part",children:[e.jsxs("div",{className:"sa-tool-call-header",onClick:()=>t(!r),children:[e.jsx("span",{className:"sa-tool-icon",children:e.jsx(k,{name:"zap",size:14})}),e.jsxs("span",{className:"sa-tool-name",children:["调用工具: ",a]}),e.jsx("span",{className:`sa-thinking-arrow ${r?"expanded":""}`,children:e.jsx(k,{name:"chevron-right",size:12})})]}),r&&e.jsx("pre",{className:"sa-tool-args",children:i})]})}function re({toolName:a,toolCallId:s,content:l}){return e.jsxs("div",{className:"sa-tool-result-part",children:[e.jsxs("div",{className:"sa-tool-result-header",children:[e.jsx("span",{className:"sa-tool-icon",children:e.jsx(k,{name:"circle-check",size:14,color:"#10b981"})}),e.jsx("span",{className:"sa-tool-result-label",children:a||"工具返回"})]}),e.jsx("div",{className:"sa-tool-result-content",children:l})]})}function ne({content:a,onRetry:s}){return e.jsxs("div",{className:"sa-error-part",children:[e.jsxs("div",{className:"sa-error-content",children:[e.jsx("span",{className:"sa-error-icon",children:e.jsx(k,{name:"triangle-alert",size:14})}),e.jsx("span",{children:a})]}),s&&e.jsx("button",{className:"sa-error-retry",onClick:s,children:"重试"})]})}function ie({message:a,onCopy:s,onRegenerate:l,onFeedback:r}){const{status:t}=T(),[i,d]=c.useState(null),[n,o]=c.useState(!1);if(t!=="ready"&&t!=="error")return null;const x=c.useCallback(()=>{s(),o(!0),setTimeout(()=>o(!1),2e3)},[s]),f=c.useCallback(m=>{const v=i===m?null:m;d(v),v&&(r==null||r(a.id,v))},[i,a.id,r]);return e.jsxs("div",{className:"sa-action-bar",children:[e.jsxs("button",{className:"sa-action-btn",onClick:x,title:"复制",children:[e.jsx(k,{name:n?"circle-check":"copy",size:14})," ",n?"已复制":"复制"]}),e.jsxs("button",{className:"sa-action-btn",onClick:l,title:"重新生成",children:[e.jsx(k,{name:"refresh-cw",size:14})," 重新生成"]}),e.jsx("span",{className:"sa-action-divider"}),e.jsx("button",{className:`sa-action-btn ${i==="like"?"sa-action-btn-active":""}`,onClick:()=>f("like"),title:"有用",children:e.jsx(k,{name:"thumbs-up",size:14})}),e.jsx("button",{className:`sa-action-btn ${i==="dislike"?"sa-action-btn-active":""}`,onClick:()=>f("dislike"),title:"无用",children:e.jsx(k,{name:"thumbs-down",size:14})})]})}function V({src:a,role:s}){const l=s==="assistant"?"A":"U";return a?a.startsWith("http")||a.startsWith("/")||a.startsWith("data:")?e.jsx("div",{className:`sa-avatar sa-avatar-${s}`,children:e.jsx("img",{src:a,alt:s,style:{width:"100%",height:"100%",borderRadius:"inherit",objectFit:"cover"}})}):e.jsx("div",{className:`sa-avatar sa-avatar-${s}`,children:a}):e.jsx("div",{className:`sa-avatar sa-avatar-${s}`,children:l})}function oe({message:a,isStreaming:s,isLast:l,slots:r,avatar:t}){const{regenerate:i,feedback:d}=T(),n=c.useCallback(()=>{var u;const b=a.parts.filter(y=>y.type==="text").map(y=>y.content).join(`
-`);(u=navigator.clipboard)==null||u.writeText(b).catch(()=>{})},[a]),o=a.role==="user",x=r.Message;if(x)return e.jsx(x,{message:a,isStreaming:s,isLast:l,avatar:t,slots:r,onCopy:n,onRegenerate:i,onFeedback:d});const f=r.TextPart??se,m=r.ThinkingPart??ae,v=r.ToolCallPart??te,g=r.ToolResultPart??re,p=r.ErrorPart??ne,h=r.ActionBar??ie;return e.jsxs("div",{className:`sa-message ${o?"sa-message-user":"sa-message-assistant"}`,children:[!o&&e.jsx(V,{src:t==null?void 0:t.assistant,role:"assistant"}),e.jsxs("div",{className:"sa-message-body",children:[a.parts.map((b,u)=>{switch(b.type){case"text":return e.jsx(f,{content:b.content},u);case"thinking":return e.jsx(m,{content:b.content},u);case"tool_call":return e.jsx(v,{toolName:b.toolName,toolCallId:b.toolCallId,args:b.args},u);case"tool_result":return e.jsx(g,{toolName:b.toolName,toolCallId:b.toolCallId,content:b.content},u);case"error":return e.jsx(p,{content:b.content,onRetry:i},u);default:return null}}),s&&l&&!o&&e.jsx("span",{className:"sa-streaming-cursor",children:"|"}),!o&&!s&&a.parts.length>0&&e.jsx(h,{message:a,onCopy:n,onRegenerate:i,onFeedback:d})]}),o&&e.jsx(V,{src:t==null?void 0:t.user,role:"user"})]})}function le({message:a,suggestedPrompts:s,onPromptClick:l}){return e.jsxs("div",{className:"sa-welcome",children:[e.jsx("div",{className:"sa-welcome-icon",children:e.jsx(k,{name:"sparkles",size:40})}),e.jsx("p",{className:"sa-welcome-message",children:a||"你好！有什么可以帮你的？"}),s&&s.length>0&&e.jsx("div",{className:"sa-welcome-prompts",children:s.map((r,t)=>e.jsx("button",{className:"sa-welcome-prompt",onClick:()=>l(r),children:r},t))})]})}function B({slots:a,welcomeMessage:s,suggestedPrompts:l,avatar:r}){const{messages:t,status:i,sendMessage:d}=T(),{containerRef:n}=ee([t]),o=i==="streaming",x=a.WelcomeScreen??le;return t.length===0?e.jsx("div",{className:"sa-thread",ref:n,children:e.jsx(x,{message:s,suggestedPrompts:l,onPromptClick:d})}):e.jsx("div",{className:"sa-thread",ref:n,children:t.map((f,m)=>e.jsx(oe,{message:f,isStreaming:o,isLast:m===t.length-1,slots:a,avatar:r},f.id))})}function W(){const{status:a,sendMessage:s,stop:l}=T(),[r,t]=c.useState(""),i=c.useRef(null),d=a==="streaming"||a==="submitted",n=c.useCallback(()=>{const f=r.trim();!f||d||(s(f),t(""),i.current&&(i.current.style.height="auto"))},[r,d,s]),o=c.useCallback(f=>{f.key==="Enter"&&!f.shiftKey&&(f.preventDefault(),n())},[n]),x=c.useCallback(f=>{t(f.target.value);const m=f.target;m.style.height="auto",m.style.height=Math.min(m.scrollHeight,120)+"px"},[]);return e.jsxs("div",{className:"sa-composer",children:[e.jsx("textarea",{ref:i,className:"sa-composer-input",value:r,onChange:x,onKeyDown:o,placeholder:"输入消息...",rows:1,disabled:a==="submitted"}),d?e.jsx("button",{className:"sa-composer-stop",onClick:l,title:"停止",children:e.jsx(k,{name:"circle-stop",size:16,color:"#fff"})}):e.jsx("button",{className:"sa-composer-send",onClick:n,disabled:!r.trim(),title:"发送",children:e.jsx(k,{name:"arrow-up",size:16,color:"#fff"})})]})}function ve({isOpen:a,onClose:s,title:l,slots:r,welcomeMessage:t,suggestedPrompts:i,avatar:d}){const{status:n,sendMessage:o,stop:x,toggleThreadList:f,conversations:m,activeConversationId:v,switchConversation:g,newConversation:p,deleteConversation:h,renameConversation:b,isThreadListOpen:u}=T();if(!a)return null;const y=r.Header,C=r.Composer,j=r.ThreadList;return e.jsxs("div",{className:"sa-panel",children:[y?e.jsx(y,{title:l,onClose:s,onToggleThreadList:f}):e.jsx(Z,{title:l,onClose:s,onToggleThreadList:f}),j&&u?e.jsx(j,{conversations:m,activeSessionId:v,onSwitch:g,onNew:p,onDelete:h,onRename:b}):e.jsx(Q,{}),e.jsx(B,{slots:r,welcomeMessage:t,suggestedPrompts:i,avatar:d}),C?e.jsx(C,{status:n,onSend:o,onStop:x}):e.jsx(W,{})]})}function ye({conversations:a,activeSessionId:s,onSwitch:l,onNew:r,onDelete:t,isCollapsed:i,onToggleCollapse:d}){const[n,o]=c.useState(null),[x,f]=c.useState(null),m=c.useCallback((g,p)=>{p.stopPropagation(),x===g?(t(g),f(null)):(f(g),setTimeout(()=>f(null),3e3))},[x,t]),v=(()=>{const g=Date.now(),p=[],h=[],b=[];for(const y of a){const C=g-new Date(y.updateTime).getTime();C<864e5?p.push(y):C<6048e5?h.push(y):b.push(y)}const u=[];return p.length&&u.push({label:"今天",items:p}),h.length&&u.push({label:"最近 7 天",items:h}),b.length&&u.push({label:"更早",items:b}),u})();return i?e.jsxs("div",{className:"sa-fp-sidebar sa-fp-sidebar-collapsed",children:[e.jsx("button",{className:"sa-fp-sidebar-toggle",onClick:d,title:"展开",children:e.jsx(k,{name:"panel-left",size:18})}),e.jsx("button",{className:"sa-fp-sidebar-toggle",onClick:r,title:"新会话",style:{marginTop:4},children:e.jsx(k,{name:"plus",size:18})})]}):e.jsxs("div",{className:"sa-fp-sidebar",children:[e.jsxs("div",{className:"sa-fp-sidebar-header",children:[e.jsxs("button",{className:"sa-fp-sidebar-new",onClick:r,children:[e.jsx(k,{name:"plus",size:15})," ",e.jsx("span",{children:"新会话"})]}),e.jsx("button",{className:"sa-fp-sidebar-toggle",onClick:d,title:"收起侧边栏",children:e.jsx(k,{name:"panel-left-close",size:18})})]}),e.jsxs("div",{className:"sa-fp-sidebar-list",children:[a.length===0&&e.jsx("div",{className:"sa-fp-sidebar-empty",children:"开始你的第一个对话"}),v.map(g=>e.jsxs("div",{children:[e.jsx("div",{className:"sa-fp-sidebar-group",children:g.label}),g.items.map(p=>{const h=p.sessionId===s,b=n===p.sessionId,u=x===p.sessionId;return e.jsxs("div",{className:`sa-fp-sidebar-item ${h?"active":""}`,onClick:()=>l(p.sessionId),onMouseEnter:()=>o(p.sessionId),onMouseLeave:()=>o(null),children:[e.jsx("span",{className:"sa-fp-sidebar-item-title",children:p.title||"新会话"}),b&&e.jsx("button",{className:`sa-fp-sidebar-item-action ${u?"danger":""}`,onClick:y=>m(p.sessionId,y),title:u?"确认删除":"删除",children:e.jsx(k,{name:u?"x":"trash2",size:14})})]},p.sessionId)})]},g.label))]})]})}function ce({title:a,slots:s,welcomeMessage:l,suggestedPrompts:r,sidebarDefaultOpen:t=!0,onClose:i,avatar:d}){const{status:n,sendMessage:o,stop:x,conversations:f,activeConversationId:m,switchConversation:v,newConversation:g,deleteConversation:p,renameConversation:h}=T(),[b,u]=c.useState(t),y=c.useCallback(()=>u(L=>!L),[]),C=s.ThreadList,j=s.Composer;return e.jsxs("div",{className:"sa-fullpage",children:[C?e.jsx("div",{className:`sa-fp-sidebar-wrapper ${b?"":"sa-fp-sidebar-wrapper-collapsed"}`,children:e.jsx(C,{conversations:f,activeSessionId:m,onSwitch:v,onNew:g,onDelete:p,onRename:h})}):e.jsx(ye,{conversations:f,activeSessionId:m,onSwitch:v,onNew:g,onDelete:p,onRename:h,isCollapsed:!b,onToggleCollapse:y}),e.jsxs("div",{className:"sa-fp-main",children:[e.jsxs("div",{className:"sa-fp-header",children:[!b&&!C&&e.jsx("button",{className:"sa-fp-header-btn",onClick:y,title:"展开侧边栏",children:e.jsx(k,{name:"panel-left",size:18})}),e.jsx("div",{className:"sa-fp-header-title",children:a}),e.jsx("div",{className:"sa-fp-header-actions",children:i&&e.jsx("button",{className:"sa-fp-header-btn",onClick:i,title:"关闭",children:e.jsx(k,{name:"x",size:18})})})]}),e.jsx(B,{slots:s,welcomeMessage:l,suggestedPrompts:r,avatar:d}),j?e.jsx(j,{status:n,onSend:o,onStop:x}):e.jsx(W,{})]})]})}function de(a){const{sdk:s,mode:l="floating",slots:r={},hooks:t={},welcomeMessage:i,suggestedPrompts:d,title:n="AI Assistant",initialOpen:o=!1,onOpenChange:x,sidebarDefaultOpen:f,avatar:m}=a,[v,g]=c.useState(o);c.useEffect(()=>{g(o)},[o]);const p=c.useCallback(()=>{var y,C;const u=!v;g(u),x==null||x(u),u?(y=t.onOpen)==null||y.call(t):(C=t.onClose)==null||C.call(t)},[v,t,x]),h=c.useCallback(()=>{var u;g(!1),x==null||x(!1),(u=t.onClose)==null||u.call(t)},[t,x]),b=r.Trigger??G;return l==="fullpage"?v?e.jsx(H,{sdk:s,hooks:t,children:e.jsx(ce,{title:n,slots:r,welcomeMessage:i,suggestedPrompts:d,sidebarDefaultOpen:f,onClose:h,avatar:m})}):null:e.jsxs(H,{sdk:s,hooks:t,children:[e.jsx(b,{isOpen:v,onClick:p}),e.jsx(ve,{isOpen:v,onClose:h,title:n,slots:r,welcomeMessage:i,suggestedPrompts:d,avatar:m})]})}const pe=`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const d=require("react"),fe=require("react-dom/client"),e=require("react/jsx-runtime");function K(a){const{sdk:s,sessionId:l,onSessionCreated:r,onStreamStart:t,onStreamEnd:i,onError:c,onMessageSend:n}=a,[o,u]=d.useState([]),[f,m]=d.useState("ready"),[v,b]=d.useState(null),x=d.useRef(null),g=d.useRef(!1),h=d.useRef(l);h.current=l;const p=d.useCallback(C=>{if(g.current)return;g.current=!0,n==null||n(C);const L={id:`user_${Date.now()}`,role:"user",parts:[{type:"text",content:C}],timestamp:Date.now()},z=`assistant_${Date.now()}`,pe={id:z,role:"assistant",parts:[],timestamp:Date.now()};u(N=>[...N,L,pe]),m("submitted"),b(null);const _=N=>{let A="",T="",R=[],F=!1;const $=()=>{const y=[...R];if(A){const E=y.findIndex(M=>M.type==="thinking");E>=0?y[E]={type:"thinking",content:A}:y.unshift({type:"thinking",content:A})}if(T){const E=y.findLastIndex(M=>M.type==="text");E>=0?y[E]={type:"text",content:T}:y.push({type:"text",content:T})}u(E=>E.map(M=>M.id===z?{...M,parts:y}:M))};x.current=s.chat({sessionId:N,message:C,stream:!0,onMessage:y=>{switch(F||(F=!0,m("streaming")),y.type){case"thinking":A+=y.content;break;case"ai":T+=y.content;break;case"tool_call":R.push({type:"tool_call",toolName:y.toolName,toolCallId:y.toolCallId,args:y.args??"{}"});break;case"tool_result":R.push({type:"tool_result",toolName:y.toolName??"",toolCallId:y.toolCallId,content:y.content}),T&&(R.push({type:"text",content:T}),T="");break}$()},onDone:y=>{(T||R.length>0||A)&&$(),y.sessionId&&y.sessionId!==h.current&&(r==null||r(y.sessionId)),i==null||i(y.sessionId||N),m("ready"),g.current=!1,x.current=null},onError:y=>{R.push({type:"error",content:y.message}),$(),b(y),m("error"),c==null||c(y),g.current=!1,x.current=null}}),t==null||t(N)};h.current?_(h.current):s.createSession().then(N=>{h.current=N,r==null||r(N),_(N)}).catch(N=>{b(N instanceof Error?N:new Error(String(N))),m("error"),c==null||c(N instanceof Error?N:new Error(String(N))),g.current=!1})},[s,r,t,i,c,n]),w=d.useCallback(()=>{var C;(C=x.current)==null||C.abort(),x.current=null,m("ready"),g.current=!1},[]),j=d.useCallback(()=>{if(g.current)return;const C=o.findLastIndex(z=>z.role==="user");if(C<0)return;const L=o[C].parts.filter(z=>z.type==="text").map(z=>z.content).join("");u(z=>z.slice(0,C)),p(L)},[o,p]);return{messages:o,status:f,error:v,sendMessage:p,stop:w,regenerate:j,setMessages:u}}const D="sa_active_conversation";function W(){try{return localStorage.getItem(D)}catch{return null}}function ue(a){try{a?localStorage.setItem(D,a):localStorage.removeItem(D)}catch{}}function U(a){const{sdk:s,onConversationChange:l}=a,[r,t]=d.useState([]),[i,c]=d.useState(()=>W()),[n,o]=d.useState(!1),u=d.useRef(!0);d.useEffect(()=>()=>{u.current=!1},[]);const f=d.useCallback(p=>{c(p),ue(p),p&&(l==null||l(p))},[l]),m=d.useCallback(async()=>{o(!0);try{const p=await s.listConversations({page:1,size:100});if(!u.current)return;t(p.items);const w=W();w&&!p.items.find(j=>j.sessionId===w)&&f(null)}catch{}finally{u.current&&o(!1)}},[s,f]),v=d.useCallback(async p=>(f(p),await s.getMessages(p)),[s,f]),b=d.useCallback(()=>{f(null)},[f]),x=d.useCallback(async p=>{await s.deleteConversation(p),t(w=>w.filter(j=>j.sessionId!==p)),i===p&&f(null)},[s,i,f]),g=d.useCallback(async(p,w)=>{await s.renameConversation(p,w),t(j=>j.map(C=>C.sessionId===p?{...C,title:w}:C))},[s]),{enabled:h=!0}=a;return d.useEffect(()=>{h&&m()},[h,m]),{conversations:r,activeConversationId:i,loading:n,loadConversations:m,switchConversation:v,newConversation:b,deleteConversation:x,renameConversation:g,setActiveConversationId:f}}const V=d.createContext(null);function I(){const a=d.useContext(V);if(!a)throw new Error("useChatContext must be used within ChatProvider");return a}function O({sdk:a,hooks:s,children:l}){const[r,t]=d.useState(!1),[i,c]=d.useState(!1);d.useEffect(()=>{a.getToken().then(()=>{c(!0)}).catch(()=>{c(!0)})},[a]);const n=U({sdk:a,onConversationChange:s==null?void 0:s.onConversationChange,enabled:i}),o=K({sdk:a,sessionId:n.activeConversationId,onSessionCreated:x=>{n.setActiveConversationId(x),n.loadConversations()},onStreamStart:s==null?void 0:s.onStreamStart,onStreamEnd:x=>{var g;(g=s==null?void 0:s.onStreamEnd)==null||g.call(s,x),n.loadConversations()},onError:s==null?void 0:s.onError,onMessageSend:s==null?void 0:s.onMessageSend}),u=d.useCallback(async x=>{const g=await n.switchConversation(x);o.setMessages(g),t(!1)},[n,o]),f=d.useCallback(()=>{n.newConversation(),o.setMessages([]),t(!1)},[n,o]),m=d.useCallback(async x=>{await n.deleteConversation(x),n.activeConversationId===x&&o.setMessages([])},[n,o]);d.useEffect(()=>{n.activeConversationId&&o.messages.length===0&&a.getMessages(n.activeConversationId).then(x=>{o.setMessages(x)}).catch(()=>{})},[]);const v=d.useCallback(()=>{t(x=>!x)},[]),b={status:o.status,error:o.error,messages:o.messages,conversations:n.conversations,activeConversationId:n.activeConversationId,isThreadListOpen:r,sendMessage:o.sendMessage,stop:o.stop,regenerate:o.regenerate,switchConversation:u,newConversation:f,deleteConversation:m,renameConversation:n.renameConversation,toggleThreadList:v,feedback:(x,g)=>{a.feedback(x,g)}};return e.jsx(V.Provider,{value:b,children:l})}function k({name:a,size:s=16,color:l="currentColor",className:r,style:t}){return e.jsx("svg",{className:r,style:{width:s,height:s,fill:l,verticalAlign:"middle",...t},"aria-hidden":"true",children:e.jsx("use",{href:`#icon-${a}`})})}function Y({isOpen:a,onClick:s}){return e.jsx("button",{className:`sa-trigger ${a?"sa-trigger-open":""}`,onClick:s,children:a?e.jsx(k,{name:"x",size:24,color:"#fff"}):e.jsx(k,{name:"message-square",size:24,color:"#fff"})})}function J({title:a,onClose:s,onToggleThreadList:l,showClose:r=!0}){return e.jsxs("div",{className:"sa-header",children:[e.jsxs("div",{className:"sa-header-left",children:[e.jsx("div",{className:"sa-header-avatar",children:"A"}),e.jsxs("div",{className:"sa-header-info",children:[e.jsx("div",{className:"sa-header-title",children:a}),e.jsx("div",{className:"sa-header-status",children:"● Online"})]})]}),e.jsxs("div",{className:"sa-header-actions",children:[e.jsx("button",{className:"sa-header-btn",onClick:l,title:"会话列表",children:e.jsx(k,{name:"menu",size:16})}),r&&e.jsx("button",{className:"sa-header-btn",onClick:s,title:"关闭",children:e.jsx(k,{name:"x",size:16})})]})]})}function xe(a){const s=new Date,l=new Date(s.getFullYear(),s.getMonth(),s.getDate()).getTime(),r=l-6*864e5,t=[],i=[],c=[];for(const o of a){const u=new Date(o.updateTime).getTime();u>=l?t.push(o):u>=r?i.push(o):c.push(o)}const n=[];return t.length&&n.push({label:"今天",items:t}),i.length&&n.push({label:"最近 7 天",items:i}),c.length&&n.push({label:"更早",items:c}),n}function X(){const{conversations:a,activeConversationId:s,switchConversation:l,newConversation:r,deleteConversation:t,renameConversation:i,isThreadListOpen:c,toggleThreadList:n}=I(),[o,u]=d.useState(null),[f,m]=d.useState(""),v=d.useCallback((g,h)=>{u(g),m(h??"")},[]),b=d.useCallback(g=>{f.trim()&&i(g,f.trim()),u(null)},[f,i]),x=d.useMemo(()=>xe(a),[a]);return c?e.jsxs(e.Fragment,{children:[e.jsx("div",{className:"sa-thread-list-overlay",onClick:n}),e.jsxs("div",{className:"sa-thread-list",children:[e.jsxs("div",{className:"sa-thread-list-header",children:[e.jsx("span",{className:"sa-thread-list-title",children:"会话记录"}),e.jsxs("button",{className:"sa-thread-list-new",onClick:r,children:[e.jsx(k,{name:"plus",size:14})," 新会话"]})]}),e.jsxs("div",{className:"sa-thread-list-items",children:[a.length===0&&e.jsx("div",{className:"sa-thread-list-empty",children:"暂无会话"}),x.map(g=>e.jsxs("div",{className:"sa-thread-group",children:[e.jsx("div",{className:"sa-thread-group-label",children:g.label}),g.items.map(h=>e.jsxs("div",{className:`sa-thread-item ${h.sessionId===s?"active":""}`,onClick:()=>l(h.sessionId),children:[o===h.sessionId?e.jsx("input",{className:"sa-thread-item-edit",value:f,onChange:p=>m(p.target.value),onBlur:()=>b(h.sessionId),onKeyDown:p=>{p.key==="Enter"&&b(h.sessionId),p.key==="Escape"&&u(null)},onClick:p=>p.stopPropagation(),autoFocus:!0}):e.jsx("span",{className:"sa-thread-item-title",onDoubleClick:p=>{p.stopPropagation(),v(h.sessionId,h.title)},children:h.title||"新会话"}),e.jsx("button",{className:"sa-thread-item-delete",onClick:p=>{p.stopPropagation(),t(h.sessionId)},title:"删除",children:e.jsx(k,{name:"trash2",size:14})})]},h.sessionId))]},g.label))]})]})]}):null}function G(a){const s=d.useRef(null),l=d.useRef(!1),r=d.useRef(0),t=d.useCallback(()=>{const c=s.current;if(!c)return;const{scrollTop:n,scrollHeight:o,clientHeight:u}=c,f=o-n-u<40;n<r.current&&!f&&(l.current=!0),f&&(l.current=!1),r.current=n},[]);d.useEffect(()=>{const c=s.current;if(c)return c.addEventListener("scroll",t,{passive:!0}),()=>c.removeEventListener("scroll",t)},[t]),d.useEffect(()=>{if(l.current)return;const c=s.current;c&&requestAnimationFrame(()=>{c.scrollTop=c.scrollHeight})},a);const i=d.useCallback(()=>{l.current=!1;const c=s.current;c&&(c.scrollTop=c.scrollHeight)},[]);return{containerRef:s,scrollToBottom:i}}function S(a){return a.value++}function P(a,s){const l=[],r=[],t=()=>{r.length>0&&(l.push(r.join("")),r.length=0)};let i=0;for(;i<a.length;){const c=a[i];if(c==="`"){const n=a.indexOf("`",i+1);if(n!==-1){t(),l.push(e.jsx("code",{className:"sa-inline-code",children:a.slice(i+1,n)},S(s))),i=n+1;continue}}else if(c==="*"&&a[i+1]==="*"){const n=a.indexOf("**",i+2);if(n!==-1){t(),l.push(e.jsx("strong",{children:P(a.slice(i+2,n),s)},S(s))),i=n+2;continue}}else if(c==="*"){const n=a.indexOf("*",i+1);if(n!==-1){t(),l.push(e.jsx("em",{children:P(a.slice(i+1,n),s)},S(s))),i=n+1;continue}}else if(c==="["){const n=a.indexOf("]",i+1);if(n!==-1&&a[n+1]==="("){const o=a.indexOf(")",n+2);if(o!==-1){const u=a.slice(i+1,n),f=a.slice(n+2,o);t(),l.push(e.jsx("a",{href:f,target:"_blank",rel:"noreferrer",children:P(u,s)},S(s))),i=o+1;continue}}}r.push(c),i++}return t(),l}function he(a,s){const l=[],r=a.split(`
+`);let t=0;const i=o=>o.trim()==="",c=o=>/^#{1,6}\s+\S/.test(o.trim()),n=o=>/^(?:[-*+]|\d+[.)])\s+\S/.test(o.trim());for(;t<r.length;){const o=r[t],u=o.trim();if(i(o)){t++;continue}if(c(o)){const m=u.match(/^(#{1,6})\s+(.*)$/);if(m){const b=`h${Math.min(m[1].length,6)}`;l.push(d.createElement(b,{key:S(s)},P(m[2],s)))}t++;continue}if(n(o)){const m=/^\d+[.)]/.test(u),v=[];for(;t<r.length&&n(r[t]);){const b=r[t].trim().match(/^(?:[-*+]|\d+[.)])\s+(.*)$/);b&&v.push(e.jsx("li",{children:P(b[1],s)},S(s))),t++}l.push(m?e.jsx("ol",{className:"sa-list",children:v},S(s)):e.jsx("ul",{className:"sa-list",children:v},S(s)));continue}const f=[];for(;t<r.length&&!i(r[t])&&!c(r[t])&&!n(r[t]);)f.push(r[t]),t++;l.push(e.jsx("p",{className:"sa-text-paragraph",children:P(f.join(" "),s)},S(s)))}return l}function me(a){const s={value:0},l=[],r=a.split("```");for(let t=0;t<r.length;t++)if(t%2===0)l.push(...he(r[t],s));else if(r[t].trim()!==""){let i=r[t].replace(/^\r?\n/,"");i=i.replace(/^[a-zA-Z0-9_+#.-]+\r?\n/,""),i=i.replace(/\r?\n$/,""),l.push(e.jsx("pre",{className:"sa-code-block",children:e.jsx("code",{children:i})},S(s)))}return l}function Z({content:a}){return e.jsx("div",{className:"sa-text-part",children:me(a)})}function Q({content:a}){const[s,l]=d.useState(!1);return e.jsxs("div",{className:"sa-thinking-part",onClick:()=>l(!s),children:[e.jsxs("div",{className:"sa-thinking-header",children:[e.jsx("span",{className:"sa-thinking-icon",children:e.jsx(k,{name:"brain",size:14})}),e.jsx("span",{className:"sa-thinking-label",children:"思考过程"}),e.jsx("span",{className:`sa-thinking-arrow ${s?"expanded":""}`,children:e.jsx(k,{name:"chevron-right",size:12})})]}),s&&e.jsx("div",{className:"sa-thinking-content",children:a})]})}function ee({toolName:a,toolCallId:s,args:l}){const[r,t]=d.useState(!1);let i=l;try{i=JSON.stringify(JSON.parse(l),null,2)}catch{}return e.jsxs("div",{className:"sa-tool-call-part",children:[e.jsxs("div",{className:"sa-tool-call-header",onClick:()=>t(!r),children:[e.jsx("span",{className:"sa-tool-icon",children:e.jsx(k,{name:"zap",size:14})}),e.jsxs("span",{className:"sa-tool-name",children:["调用工具: ",a]}),e.jsx("span",{className:`sa-thinking-arrow ${r?"expanded":""}`,children:e.jsx(k,{name:"chevron-right",size:12})})]}),r&&e.jsx("pre",{className:"sa-tool-args",children:i})]})}function se({toolName:a,toolCallId:s,content:l}){return e.jsxs("div",{className:"sa-tool-result-part",children:[e.jsxs("div",{className:"sa-tool-result-header",children:[e.jsx("span",{className:"sa-tool-icon",children:e.jsx(k,{name:"circle-check",size:14,color:"#10b981"})}),e.jsx("span",{className:"sa-tool-result-label",children:a||"工具返回"})]}),e.jsx("div",{className:"sa-tool-result-content",children:l})]})}function ae({content:a,onRetry:s}){return e.jsxs("div",{className:"sa-error-part",children:[e.jsxs("div",{className:"sa-error-content",children:[e.jsx("span",{className:"sa-error-icon",children:e.jsx(k,{name:"triangle-alert",size:14})}),e.jsx("span",{children:a})]}),s&&e.jsx("button",{className:"sa-error-retry",onClick:s,children:"重试"})]})}function te({message:a,onCopy:s,onRegenerate:l,onFeedback:r}){const{status:t}=I(),[i,c]=d.useState(null),[n,o]=d.useState(!1);if(t!=="ready"&&t!=="error")return null;const u=d.useCallback(()=>{s(),o(!0),setTimeout(()=>o(!1),2e3)},[s]),f=d.useCallback(m=>{const v=i===m?null:m;c(v),v&&(r==null||r(a.id,v))},[i,a.id,r]);return e.jsxs("div",{className:"sa-action-bar",children:[e.jsxs("button",{className:"sa-action-btn",onClick:u,title:"复制",children:[e.jsx(k,{name:n?"circle-check":"copy",size:14})," ",n?"已复制":"复制"]}),e.jsxs("button",{className:"sa-action-btn",onClick:l,title:"重新生成",children:[e.jsx(k,{name:"refresh-cw",size:14})," 重新生成"]}),e.jsx("span",{className:"sa-action-divider"}),e.jsx("button",{className:`sa-action-btn ${i==="like"?"sa-action-btn-active":""}`,onClick:()=>f("like"),title:"有用",children:e.jsx(k,{name:"thumbs-up",size:14})}),e.jsx("button",{className:`sa-action-btn ${i==="dislike"?"sa-action-btn-active":""}`,onClick:()=>f("dislike"),title:"无用",children:e.jsx(k,{name:"thumbs-down",size:14})})]})}function q({src:a,role:s}){const l=s==="assistant"?"A":"U";return a?a.startsWith("http")||a.startsWith("/")||a.startsWith("data:")?e.jsx("div",{className:`sa-avatar sa-avatar-${s}`,children:e.jsx("img",{src:a,alt:s,style:{width:"100%",height:"100%",borderRadius:"inherit",objectFit:"cover"}})}):e.jsx("div",{className:`sa-avatar sa-avatar-${s}`,children:a}):e.jsx("div",{className:`sa-avatar sa-avatar-${s}`,children:l})}function re({message:a,isStreaming:s,isLast:l,slots:r,avatar:t}){const{regenerate:i,feedback:c}=I(),n=d.useCallback(()=>{var p;const h=a.parts.filter(w=>w.type==="text").map(w=>w.content).join(`
+`);(p=navigator.clipboard)==null||p.writeText(h).catch(()=>{})},[a]),o=a.role==="user",u=r.Message;if(u)return e.jsx(u,{message:a,isStreaming:s,isLast:l,avatar:t,slots:r,onCopy:n,onRegenerate:i,onFeedback:c});const f=r.TextPart??Z,m=r.ThinkingPart??Q,v=r.ToolCallPart??ee,b=r.ToolResultPart??se,x=r.ErrorPart??ae,g=r.ActionBar??te;return e.jsxs("div",{className:`sa-message ${o?"sa-message-user":"sa-message-assistant"}`,children:[!o&&e.jsx(q,{src:t==null?void 0:t.assistant,role:"assistant"}),e.jsxs("div",{className:"sa-message-body",children:[a.parts.map((h,p)=>{switch(h.type){case"text":return e.jsx(f,{content:h.content},p);case"thinking":return e.jsx(m,{content:h.content},p);case"tool_call":return e.jsx(v,{toolName:h.toolName,toolCallId:h.toolCallId,args:h.args},p);case"tool_result":return e.jsx(b,{toolName:h.toolName,toolCallId:h.toolCallId,content:h.content},p);case"error":return e.jsx(x,{content:h.content,onRetry:i},p);default:return null}}),s&&l&&!o&&e.jsx("span",{className:"sa-streaming-cursor",children:"|"}),!o&&!s&&a.parts.length>0&&e.jsx(g,{message:a,onCopy:n,onRegenerate:i,onFeedback:c})]}),o&&e.jsx(q,{src:t==null?void 0:t.user,role:"user"})]})}function ne({message:a,suggestedPrompts:s,onPromptClick:l}){return e.jsxs("div",{className:"sa-welcome",children:[e.jsx("div",{className:"sa-welcome-icon",children:e.jsx(k,{name:"sparkles",size:40})}),e.jsx("p",{className:"sa-welcome-message",children:a||"你好！有什么可以帮你的？"}),s&&s.length>0&&e.jsx("div",{className:"sa-welcome-prompts",children:s.map((r,t)=>e.jsx("button",{className:"sa-welcome-prompt",onClick:()=>l(r),children:r},t))})]})}function H({slots:a,welcomeMessage:s,suggestedPrompts:l,avatar:r}){const{messages:t,status:i,sendMessage:c}=I(),{containerRef:n}=G([t]),o=i==="streaming",u=a.WelcomeScreen??ne;return t.length===0?e.jsx("div",{className:"sa-thread",ref:n,children:e.jsx(u,{message:s,suggestedPrompts:l,onPromptClick:c})}):e.jsx("div",{className:"sa-thread",ref:n,children:t.map((f,m)=>e.jsx(re,{message:f,isStreaming:o,isLast:m===t.length-1,slots:a,avatar:r},f.id))})}function B(){const{status:a,sendMessage:s,stop:l}=I(),[r,t]=d.useState(""),i=d.useRef(null),c=a==="streaming"||a==="submitted",n=d.useCallback(()=>{const f=r.trim();!f||c||(s(f),t(""),i.current&&(i.current.style.height="auto"))},[r,c,s]),o=d.useCallback(f=>{f.key==="Enter"&&!f.shiftKey&&(f.preventDefault(),n())},[n]),u=d.useCallback(f=>{t(f.target.value);const m=f.target;m.style.height="auto",m.style.height=Math.min(m.scrollHeight,120)+"px"},[]);return e.jsxs("div",{className:"sa-composer",children:[e.jsx("textarea",{ref:i,className:"sa-composer-input",value:r,onChange:u,onKeyDown:o,placeholder:"输入消息...",rows:1,disabled:a==="submitted"}),c?e.jsx("button",{className:"sa-composer-stop",onClick:l,title:"停止",children:e.jsx(k,{name:"circle-stop",size:16,color:"#fff"})}):e.jsx("button",{className:"sa-composer-send",onClick:n,disabled:!r.trim(),title:"发送",children:e.jsx(k,{name:"arrow-up",size:16,color:"#fff"})})]})}function ge({isOpen:a,onClose:s,title:l,slots:r,welcomeMessage:t,suggestedPrompts:i,avatar:c}){const{status:n,sendMessage:o,stop:u,toggleThreadList:f,conversations:m,activeConversationId:v,switchConversation:b,newConversation:x,deleteConversation:g,renameConversation:h,isThreadListOpen:p}=I();if(!a)return null;const w=r.Header,j=r.Composer,C=r.ThreadList;return e.jsxs("div",{className:"sa-panel",children:[w?e.jsx(w,{title:l,onClose:s,onToggleThreadList:f}):e.jsx(J,{title:l,onClose:s,onToggleThreadList:f}),C&&p?e.jsx(C,{conversations:m,activeSessionId:v,onSwitch:b,onNew:x,onDelete:g,onRename:h}):e.jsx(X,{}),e.jsx(H,{slots:r,welcomeMessage:t,suggestedPrompts:i,avatar:c}),j?e.jsx(j,{status:n,onSend:o,onStop:u}):e.jsx(B,{})]})}function be({conversations:a,activeSessionId:s,onSwitch:l,onNew:r,onDelete:t,isCollapsed:i,onToggleCollapse:c}){const[n,o]=d.useState(null),[u,f]=d.useState(null),m=d.useCallback((b,x)=>{x.stopPropagation(),u===b?(t(b),f(null)):(f(b),setTimeout(()=>f(null),3e3))},[u,t]),v=(()=>{const b=Date.now(),x=[],g=[],h=[];for(const w of a){const j=b-new Date(w.updateTime).getTime();j<864e5?x.push(w):j<6048e5?g.push(w):h.push(w)}const p=[];return x.length&&p.push({label:"今天",items:x}),g.length&&p.push({label:"最近 7 天",items:g}),h.length&&p.push({label:"更早",items:h}),p})();return i?e.jsxs("div",{className:"sa-fp-sidebar sa-fp-sidebar-collapsed",children:[e.jsx("button",{className:"sa-fp-sidebar-toggle",onClick:c,title:"展开",children:e.jsx(k,{name:"panel-left",size:18})}),e.jsx("button",{className:"sa-fp-sidebar-toggle",onClick:r,title:"新会话",style:{marginTop:4},children:e.jsx(k,{name:"plus",size:18})})]}):e.jsxs("div",{className:"sa-fp-sidebar",children:[e.jsxs("div",{className:"sa-fp-sidebar-header",children:[e.jsxs("button",{className:"sa-fp-sidebar-new",onClick:r,children:[e.jsx(k,{name:"plus",size:15})," ",e.jsx("span",{children:"新会话"})]}),e.jsx("button",{className:"sa-fp-sidebar-toggle",onClick:c,title:"收起侧边栏",children:e.jsx(k,{name:"panel-left-close",size:18})})]}),e.jsxs("div",{className:"sa-fp-sidebar-list",children:[a.length===0&&e.jsx("div",{className:"sa-fp-sidebar-empty",children:"开始你的第一个对话"}),v.map(b=>e.jsxs("div",{children:[e.jsx("div",{className:"sa-fp-sidebar-group",children:b.label}),b.items.map(x=>{const g=x.sessionId===s,h=n===x.sessionId,p=u===x.sessionId;return e.jsxs("div",{className:`sa-fp-sidebar-item ${g?"active":""}`,onClick:()=>l(x.sessionId),onMouseEnter:()=>o(x.sessionId),onMouseLeave:()=>o(null),children:[e.jsx("span",{className:"sa-fp-sidebar-item-title",children:x.title||"新会话"}),h&&e.jsx("button",{className:`sa-fp-sidebar-item-action ${p?"danger":""}`,onClick:w=>m(x.sessionId,w),title:p?"确认删除":"删除",children:e.jsx(k,{name:p?"x":"trash2",size:14})})]},x.sessionId)})]},b.label))]})]})}function ie({title:a,slots:s,welcomeMessage:l,suggestedPrompts:r,sidebarDefaultOpen:t=!0,onClose:i,avatar:c}){const{status:n,sendMessage:o,stop:u,conversations:f,activeConversationId:m,switchConversation:v,newConversation:b,deleteConversation:x,renameConversation:g}=I(),[h,p]=d.useState(t),w=d.useCallback(()=>p(L=>!L),[]),j=s.ThreadList,C=s.Composer;return e.jsxs("div",{className:"sa-fullpage",children:[j?e.jsx("div",{className:`sa-fp-sidebar-wrapper ${h?"":"sa-fp-sidebar-wrapper-collapsed"}`,children:e.jsx(j,{conversations:f,activeSessionId:m,onSwitch:v,onNew:b,onDelete:x,onRename:g})}):e.jsx(be,{conversations:f,activeSessionId:m,onSwitch:v,onNew:b,onDelete:x,onRename:g,isCollapsed:!h,onToggleCollapse:w}),e.jsxs("div",{className:"sa-fp-main",children:[e.jsxs("div",{className:"sa-fp-header",children:[!h&&!j&&e.jsx("button",{className:"sa-fp-header-btn",onClick:w,title:"展开侧边栏",children:e.jsx(k,{name:"panel-left",size:18})}),e.jsx("div",{className:"sa-fp-header-title",children:a}),e.jsx("div",{className:"sa-fp-header-actions",children:i&&e.jsx("button",{className:"sa-fp-header-btn",onClick:i,title:"关闭",children:e.jsx(k,{name:"x",size:18})})})]}),e.jsx(H,{slots:s,welcomeMessage:l,suggestedPrompts:r,avatar:c}),C?e.jsx(C,{status:n,onSend:o,onStop:u}):e.jsx(B,{})]})]})}function oe(a){const{sdk:s,mode:l="floating",slots:r={},hooks:t={},welcomeMessage:i,suggestedPrompts:c,title:n="AI Assistant",initialOpen:o=!1,onOpenChange:u,sidebarDefaultOpen:f,avatar:m}=a,[v,b]=d.useState(o);d.useEffect(()=>{b(o)},[o]);const x=d.useCallback(()=>{var w,j;const p=!v;b(p),u==null||u(p),p?(w=t.onOpen)==null||w.call(t):(j=t.onClose)==null||j.call(t)},[v,t,u]),g=d.useCallback(()=>{var p;b(!1),u==null||u(!1),(p=t.onClose)==null||p.call(t)},[t,u]),h=r.Trigger??Y;return l==="fullpage"?v?e.jsx(O,{sdk:s,hooks:t,children:e.jsx(ie,{title:n,slots:r,welcomeMessage:i,suggestedPrompts:c,sidebarDefaultOpen:f,onClose:g,avatar:m})}):null:e.jsxs(O,{sdk:s,hooks:t,children:[e.jsx(h,{isOpen:v,onClick:x}),e.jsx(ge,{isOpen:v,onClose:g,title:n,slots:r,welcomeMessage:i,suggestedPrompts:c,avatar:m})]})}const le=`
   [data-super-agent-widget] {
     --sa-primary-dark: color-mix(in srgb, var(--sa-primary) 82%, #000);
     --sa-primary-light: color-mix(in srgb, var(--sa-primary) 10%, #fff);
@@ -659,42 +659,55 @@
   .sa-thread-list-header {
     display: flex;
     align-items: center;
-    gap: 10px;
-    padding: 14px 16px;
-    border-bottom: 1px solid var(--sa-border);
+    justify-content: space-between;
+    padding: 20px 20px 16px;
     flex-shrink: 0;
   }
 
+  .sa-thread-list-title {
+    font-size: 17px;
+    font-weight: 700;
+    color: #18181b;
+    letter-spacing: -0.2px;
+  }
+
+  .sa-thread-list-new {
+    display: flex;
+    align-items: center;
+    gap: 6px;
+    padding: 8px 16px;
+    border: none;
+    border-radius: 20px;
+    background: #f4f4f5;
+    color: #3f3f46;
+    font-size: 13px;
+    font-weight: 500;
+    cursor: pointer;
+    transition: background 0.15s;
+  }
+
+  .sa-thread-list-new:hover {
+    background: #e4e4e7;
+  }
+
   .sa-thread-list-items {
     flex: 1;
     overflow-y: auto;
+    padding: 0 12px 12px;
   }
 
   .sa-thread-list-empty {
-    padding: 24px 16px;
+    padding: 48px 16px;
     text-align: center;
     color: var(--sa-text-muted);
-    font-size: 13px;
-  }
-
-  .sa-thread-list-new {
-    display: block;
-    width: calc(100% - 24px);
-    margin: 12px;
-    padding: 10px;
-    border: 1px dashed var(--sa-border);
-    border-radius: 10px;
-    background: transparent;
-    color: var(--sa-primary);
     font-size: 14px;
-    cursor: pointer;
-    text-align: center;
-    transition: background 0.15s, border-color 0.15s;
   }
 
-  .sa-thread-list-new:hover {
-    background: var(--sa-primary-light);
-    border-color: var(--sa-primary);
+  .sa-thread-group-label {
+    padding: 16px 8px 6px;
+    font-size: 12px;
+    font-weight: 500;
+    color: #a1a1aa;
   }
 
   .sa-thread-item {
@@ -702,8 +715,9 @@
     align-items: center;
     justify-content: space-between;
     gap: 8px;
-    padding: 12px 16px;
-    border-bottom: 1px solid #f3f4f6;
+    padding: 10px 12px;
+    margin: 2px 0;
+    border-radius: 8px;
     color: #374151;
     font-size: 14px;
     cursor: pointer;
@@ -711,7 +725,7 @@
   }
 
   .sa-thread-item:hover {
-    background: var(--sa-surface);
+    background: #f9fafb;
   }
 
   .sa-thread-item.active {
@@ -1121,4 +1135,4 @@
     border-color: #d4d4d8;
     box-shadow: 0 0 0 3px rgba(99,102,241,0.08);
   }
-`,fe={primaryColor:"#6366f1",backgroundColor:"#ffffff",fontFamily:"system-ui, -apple-system, sans-serif",borderRadius:16,panelWidth:380,panelHeight:520,zIndex:9999};function ue(a){const s={...fe,...a};return[`--sa-primary: ${s.primaryColor}`,`--sa-bg: ${s.backgroundColor}`,`--sa-font: ${s.fontFamily}`,`--sa-radius: ${s.borderRadius}px`,`--sa-panel-width: ${s.panelWidth}px`,`--sa-panel-height: ${s.panelHeight}px`,`--sa-z-index: ${s.zIndex}`].join("; ")}function ke(a,s){const l=typeof a=="string"?document.querySelector(a):a;if(!l)throw new Error(`Target element not found: ${a}`);const r=document.createElement("div");r.setAttribute("data-super-agent-widget","");const t=ue(s.theme??{});if(r.setAttribute("style",t),l.appendChild(r),!document.getElementById("sa-widget-styles")){const o=document.createElement("style");o.id="sa-widget-styles",o.textContent=pe,document.head.appendChild(o)}let i=_(r),d=!1;const n=o=>{i&&i.render(c.createElement(de,{...s,initialOpen:o??d,onOpenChange:x=>{d=x}}))};return n(!1),{open(){d=!0,n(!0)},close(){d=!1,n(!1)},destroy(){i&&(i.unmount(),i=null),r.remove()}}}exports.ActionBar=ie;exports.ChatProvider=H;exports.ChatWidget=de;exports.Composer=W;exports.ErrorPart=ne;exports.FullpageLayout=ce;exports.Header=Z;exports.Icon=k;exports.Message=oe;exports.TextPart=se;exports.ThinkingPart=ae;exports.Thread=B;exports.ThreadList=Q;exports.ToolCallPart=te;exports.ToolResultPart=re;exports.Trigger=G;exports.WelcomeScreen=le;exports.defaultTheme=fe;exports.mount=ke;exports.themeToCSSVars=ue;exports.useAutoScroll=ee;exports.useChat=Y;exports.useChatContext=T;exports.useConversations=J;exports.widgetStyles=pe;
+`,ce={primaryColor:"#6366f1",backgroundColor:"#ffffff",fontFamily:"system-ui, -apple-system, sans-serif",borderRadius:16,panelWidth:380,panelHeight:520,zIndex:9999};function de(a){const s={...ce,...a};return[`--sa-primary: ${s.primaryColor}`,`--sa-bg: ${s.backgroundColor}`,`--sa-font: ${s.fontFamily}`,`--sa-radius: ${s.borderRadius}px`,`--sa-panel-width: ${s.panelWidth}px`,`--sa-panel-height: ${s.panelHeight}px`,`--sa-z-index: ${s.zIndex}`].join("; ")}function ve(a,s){const l=typeof a=="string"?document.querySelector(a):a;if(!l)throw new Error(`Target element not found: ${a}`);const r=document.createElement("div");r.setAttribute("data-super-agent-widget","");const t=de(s.theme??{});if(r.setAttribute("style",t),l.appendChild(r),!document.getElementById("sa-widget-styles")){const o=document.createElement("style");o.id="sa-widget-styles",o.textContent=le,document.head.appendChild(o)}let i=fe.createRoot(r),c=!1;const n=o=>{i&&i.render(d.createElement(oe,{...s,initialOpen:o??c,onOpenChange:u=>{c=u}}))};return n(!1),{open(){c=!0,n(!0)},close(){c=!1,n(!1)},destroy(){i&&(i.unmount(),i=null),r.remove()}}}exports.ActionBar=te;exports.ChatProvider=O;exports.ChatWidget=oe;exports.Composer=B;exports.ErrorPart=ae;exports.FullpageLayout=ie;exports.Header=J;exports.Icon=k;exports.Message=re;exports.TextPart=Z;exports.ThinkingPart=Q;exports.Thread=H;exports.ThreadList=X;exports.ToolCallPart=ee;exports.ToolResultPart=se;exports.Trigger=Y;exports.WelcomeScreen=ne;exports.defaultTheme=ce;exports.mount=ve;exports.themeToCSSVars=de;exports.useAutoScroll=G;exports.useChat=K;exports.useChatContext=I;exports.useConversations=U;exports.widgetStyles=le;

package/dist/widget.d.ts

@@ -389,6 +389,6 @@ export declare interface WidgetInstance {
 
 export declare type WidgetMode = 'floating' | 'fullpage';
 
-export declare const widgetStyles = "\n  [data-super-agent-widget] {\n    --sa-primary-dark: color-mix(in srgb, var(--sa-primary) 82%, #000);\n    --sa-primary-light: color-mix(in srgb, var(--sa-primary) 10%, #fff);\n    --sa-text: #1f2937;\n    --sa-text-muted: #6b7280;\n    --sa-border: #e5e7eb;\n    --sa-surface: #f9fafb;\n\n    font-family: var(--sa-font);\n    color: var(--sa-text);\n    line-height: 1.5;\n    -webkit-font-smoothing: antialiased;\n    text-rendering: optimizeLegibility;\n  }\n\n  [data-super-agent-widget] *,\n  [data-super-agent-widget] *::before,\n  [data-super-agent-widget] *::after {\n    box-sizing: border-box;\n    margin: 0;\n    padding: 0;\n  }\n\n  [data-super-agent-widget] button {\n    font-family: inherit;\n  }\n\n  /* \u2500\u2500 Trigger \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n  .sa-trigger {\n    position: fixed;\n    bottom: 24px;\n    right: 24px;\n    width: 56px;\n    height: 56px;\n    border: none;\n    border-radius: 50%;\n    cursor: pointer;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    background: linear-gradient(135deg, var(--sa-primary), var(--sa-primary-dark));\n    color: #ffffff;\n    font-size: 24px;\n    box-shadow: 0 8px 24px color-mix(in srgb, var(--sa-primary) 35%, transparent);\n    z-index: var(--sa-z-index, 9999);\n    transition: transform 0.2s ease, box-shadow 0.2s ease;\n  }\n\n  .sa-trigger:hover {\n    transform: scale(1.08);\n    box-shadow: 0 12px 32px color-mix(in srgb, var(--sa-primary) 45%, transparent);\n  }\n\n  .sa-trigger:active {\n    transform: scale(0.94);\n  }\n\n  .sa-trigger-open {\n    transform: rotate(90deg);\n  }\n\n  /* \u2500\u2500 Panel \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n  .sa-panel {\n    position: fixed;\n    bottom: 96px;\n    right: 24px;\n    width: var(--sa-panel-width, 380px);\n    height: var(--sa-panel-height, 520px);\n    max-height: calc(100vh - 120px);\n    display: flex;\n    flex-direction: column;\n    overflow: hidden;\n    background: var(--sa-bg);\n    border: 1px solid var(--sa-border);\n    border-radius: var(--sa-radius, 16px);\n    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.18);\n    z-index: var(--sa-z-index, 9999);\n    animation: sa-slide-up 0.25s cubic-bezier(0.16, 1, 0.3, 1);\n  }\n\n  /* \u2500\u2500 Header \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n  .sa-header {\n    display: flex;\n    align-items: center;\n    gap: 10px;\n    padding: 14px 16px;\n    color: #ffffff;\n    background: linear-gradient(135deg, var(--sa-primary), var(--sa-primary-dark));\n    flex-shrink: 0;\n  }\n\n  .sa-header-left {\n    display: flex;\n    align-items: center;\n    gap: 10px;\n    flex: 1;\n  }\n\n  .sa-header-avatar {\n    width: 28px;\n    height: 28px;\n    border-radius: 50%;\n    background: rgba(255,255,255,0.2);\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    font-size: 12px;\n    font-weight: 600;\n  }\n\n  .sa-header-info {\n    display: flex;\n    flex-direction: column;\n  }\n\n  .sa-header-status {\n    font-size: 11px;\n    opacity: 0.8;\n    color: #a5f3a6;\n  }\n\n  .sa-header-actions {\n    display: flex;\n    gap: 4px;\n  }\n\n  .sa-header-title {\n    flex: 1;\n    font-size: 16px;\n    font-weight: 600;\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n  }\n\n  .sa-header-btn {\n    width: 30px;\n    height: 30px;\n    border: none;\n    border-radius: 8px;\n    background: transparent;\n    color: #ffffff;\n    font-size: 16px;\n    cursor: pointer;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    transition: background 0.15s ease;\n  }\n\n  .sa-header-btn:hover {\n    background: rgba(255, 255, 255, 0.18);\n  }\n\n  /* \u2500\u2500 Thread / messages \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n  .sa-thread {\n    flex: 1;\n    display: flex;\n    flex-direction: column;\n    gap: 14px;\n    overflow-y: auto;\n    padding: 16px;\n    background: var(--sa-surface);\n    scroll-behavior: smooth;\n  }\n\n  .sa-thread::-webkit-scrollbar {\n    width: 6px;\n  }\n\n  .sa-thread::-webkit-scrollbar-thumb {\n    background: rgba(0, 0, 0, 0.14);\n    border-radius: 3px;\n  }\n\n  .sa-thread::-webkit-scrollbar-thumb:hover {\n    background: rgba(0, 0, 0, 0.24);\n  }\n\n  .sa-message {\n    display: flex;\n    align-items: flex-start;\n    gap: 10px;\n    width: 100%;\n  }\n\n  .sa-message-user {\n    justify-content: flex-end;\n  }\n\n  .sa-message-body {\n    max-width: 78%;\n    display: flex;\n    flex-direction: column;\n    gap: 4px;\n  }\n\n  .sa-message-user .sa-message-body {\n    padding: 10px 14px;\n    border-radius: 16px;\n    border-bottom-right-radius: 4px;\n    background: var(--sa-primary);\n    color: #ffffff;\n    font-size: 14px;\n    line-height: 1.55;\n    word-break: break-word;\n  }\n\n  .sa-message-assistant .sa-message-body {\n    padding: 10px 14px;\n    border-radius: 16px;\n    border-bottom-left-radius: 4px;\n    background: #ffffff;\n    color: var(--sa-text);\n    font-size: 14px;\n    line-height: 1.55;\n    word-break: break-word;\n    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);\n  }\n\n  .sa-avatar {\n    width: 28px;\n    height: 28px;\n    flex-shrink: 0;\n    border-radius: 50%;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    color: #ffffff;\n    font-size: 12px;\n    font-weight: 600;\n    overflow: hidden;\n  }\n\n  .sa-avatar-assistant {\n    background: linear-gradient(135deg, var(--sa-primary), var(--sa-primary-dark));\n  }\n\n  .sa-avatar-user {\n    background: linear-gradient(135deg, #64748b, #475569);\n  }\n\n  /* \u2500\u2500 Text part (markdown) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n  .sa-text-part {\n    font-size: 14px;\n    line-height: 1.6;\n    word-break: break-word;\n  }\n\n  .sa-text-part p {\n    margin: 0 0 8px;\n  }\n\n  .sa-text-part p:last-child {\n    margin-bottom: 0;\n  }\n\n  .sa-text-part strong {\n    font-weight: 600;\n  }\n\n  .sa-text-part em {\n    font-style: italic;\n  }\n\n  .sa-text-part h1,\n  .sa-text-part h2,\n  .sa-text-part h3,\n  .sa-text-part h4,\n  .sa-text-part h5,\n  .sa-text-part h6 {\n    margin: 12px 0 6px;\n    font-weight: 600;\n    line-height: 1.3;\n  }\n\n  .sa-text-part h1 {\n    font-size: 1.4em;\n  }\n\n  .sa-text-part h2 {\n    font-size: 1.25em;\n  }\n\n  .sa-text-part h3 {\n    font-size: 1.1em;\n  }\n\n  .sa-text-part h4,\n  .sa-text-part h5,\n  .sa-text-part h6 {\n    font-size: 1em;\n  }\n\n  .sa-text-part a {\n    color: var(--sa-primary);\n    text-decoration: underline;\n    text-underline-offset: 2px;\n  }\n\n  .sa-text-part a:hover {\n    color: var(--sa-primary-dark);\n  }\n\n  .sa-inline-code {\n    padding: 2px 5px;\n    border-radius: 4px;\n    background: rgba(0, 0, 0, 0.06);\n    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;\n    font-size: 0.9em;\n  }\n\n  .sa-code-block {\n    margin: 8px 0;\n    padding: 12px 14px;\n    border-radius: 10px;\n    background: #1e293b;\n    color: #e2e8f0;\n    overflow-x: auto;\n    font-size: 13px;\n    line-height: 1.55;\n  }\n\n  .sa-code-block code {\n    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;\n    white-space: pre;\n  }\n\n  .sa-list {\n    margin: 6px 0;\n    padding-left: 22px;\n  }\n\n  .sa-list li {\n    margin: 3px 0;\n    line-height: 1.5;\n  }\n\n  ul.sa-list {\n    list-style: disc;\n  }\n\n  ol.sa-list {\n    list-style: decimal;\n  }\n\n  /* \u2500\u2500 Thinking part \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n  .sa-thinking-part {\n    margin: 6px 0;\n    padding: 8px 12px;\n    border-left: 3px solid var(--sa-primary);\n    border-radius: 8px;\n    background: var(--sa-primary-light);\n    cursor: pointer;\n    font-size: 13px;\n  }\n\n  .sa-thinking-header {\n    display: flex;\n    align-items: center;\n    gap: 6px;\n    color: var(--sa-primary-dark);\n    font-weight: 500;\n    user-select: none;\n  }\n\n  .sa-thinking-icon {\n    font-size: 14px;\n    line-height: 1;\n  }\n\n  .sa-thinking-label {\n    flex: 1;\n  }\n\n  .sa-thinking-arrow {\n    font-size: 12px;\n    transition: transform 0.2s ease;\n  }\n\n  .sa-thinking-arrow.expanded {\n    transform: rotate(90deg);\n  }\n\n  .sa-thinking-content {\n    margin-top: 8px;\n    color: #4b5563;\n    white-space: pre-wrap;\n    line-height: 1.55;\n  }\n\n  /* \u2500\u2500 Tool call / result \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n  .sa-tool-call-part {\n    margin: 6px 0;\n    border: 1px solid var(--sa-border);\n    border-radius: 10px;\n    overflow: hidden;\n    background: #ffffff;\n  }\n\n  .sa-tool-call-header {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    padding: 8px 12px;\n    cursor: pointer;\n    font-size: 13px;\n    user-select: none;\n  }\n\n  .sa-tool-call-header:hover {\n    background: var(--sa-surface);\n  }\n\n  .sa-tool-icon {\n    font-size: 14px;\n    line-height: 1;\n  }\n\n  .sa-tool-name {\n    flex: 1;\n    color: #374151;\n    font-weight: 500;\n    overflow: hidden;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n  }\n\n  .sa-tool-args {\n    margin: 0;\n    padding: 10px 12px;\n    border-top: 1px solid var(--sa-border);\n    background: var(--sa-surface);\n    color: #374151;\n    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;\n    font-size: 12px;\n    line-height: 1.5;\n    white-space: pre;\n    overflow-x: auto;\n  }\n\n  .sa-tool-result-part {\n    margin: 6px 0;\n    border: 1px solid var(--sa-border);\n    border-radius: 10px;\n    overflow: hidden;\n    background: #ffffff;\n  }\n\n  .sa-tool-result-header {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    padding: 8px 12px;\n    border-bottom: 1px solid var(--sa-border);\n    background: var(--sa-surface);\n    color: #374151;\n    font-size: 13px;\n    font-weight: 500;\n  }\n\n  .sa-tool-result-content {\n    padding: 10px 12px;\n    color: #4b5563;\n    font-size: 13px;\n    line-height: 1.55;\n    white-space: pre-wrap;\n    word-break: break-word;\n  }\n\n  /* \u2500\u2500 Error part \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n  .sa-error-part {\n    margin: 6px 0;\n    padding: 10px 12px;\n    border: 1px solid #fecaca;\n    border-radius: 10px;\n    background: #fef2f2;\n    color: #b91c1c;\n  }\n\n  .sa-error-content {\n    display: flex;\n    align-items: flex-start;\n    gap: 8px;\n    font-size: 13px;\n    line-height: 1.5;\n  }\n\n  .sa-error-icon {\n    font-size: 14px;\n    line-height: 1.4;\n  }\n\n  .sa-error-retry {\n    margin-top: 8px;\n    padding: 6px 14px;\n    border: none;\n    border-radius: 8px;\n    background: #ef4444;\n    color: #ffffff;\n    font-size: 13px;\n    cursor: pointer;\n    transition: background 0.2s ease;\n  }\n\n  .sa-error-retry:hover {\n    background: #dc2626;\n  }\n\n  /* \u2500\u2500 Action bar \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n  .sa-action-bar {\n    display: flex;\n    gap: 6px;\n    margin-top: 6px;\n  }\n\n  .sa-action-btn {\n    padding: 4px 10px;\n    border: none;\n    border-radius: 6px;\n    background: transparent;\n    color: var(--sa-text-muted);\n    font-size: 12px;\n    cursor: pointer;\n    transition: color 0.15s ease, background 0.15s ease;\n  }\n\n  .sa-action-btn:hover {\n    color: var(--sa-text);\n    background: rgba(0, 0, 0, 0.05);\n  }\n\n  .sa-action-btn-active {\n    color: var(--sa-primary) !important;\n    background: var(--sa-primary-light) !important;\n  }\n\n  .sa-action-divider {\n    width: 1px;\n    height: 16px;\n    background: var(--sa-border);\n    margin: 0 2px;\n    align-self: center;\n  }\n\n  /* \u2500\u2500 Composer \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n  .sa-composer {\n    display: flex;\n    align-items: flex-end;\n    gap: 10px;\n    padding: 12px 14px;\n    border-top: 1px solid var(--sa-border);\n    background: var(--sa-bg);\n    flex-shrink: 0;\n  }\n\n  .sa-composer-input {\n    flex: 1;\n    min-height: 38px;\n    max-height: 120px;\n    padding: 9px 14px;\n    border: 1px solid var(--sa-border);\n    border-radius: 19px;\n    background: var(--sa-surface);\n    color: var(--sa-text);\n    font-family: var(--sa-font);\n    font-size: 14px;\n    line-height: 1.5;\n    resize: none;\n    outline: none;\n    transition: border-color 0.2s ease, background 0.2s ease;\n  }\n\n  .sa-composer-input::placeholder {\n    color: #9ca3af;\n  }\n\n  .sa-composer-input:focus {\n    border-color: var(--sa-primary);\n    background: #ffffff;\n  }\n\n  .sa-composer-send,\n  .sa-composer-stop {\n    width: 38px;\n    height: 38px;\n    flex-shrink: 0;\n    border: none;\n    border-radius: 50%;\n    cursor: pointer;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    color: #ffffff;\n    font-size: 16px;\n    transition: transform 0.15s ease, background 0.2s ease;\n  }\n\n  .sa-composer-send {\n    background: var(--sa-primary);\n  }\n\n  .sa-composer-send:hover {\n    background: var(--sa-primary-dark);\n    transform: scale(1.05);\n  }\n\n  .sa-composer-send:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n    transform: none;\n  }\n\n  .sa-composer-stop {\n    background: #ef4444;\n  }\n\n  .sa-composer-stop:hover {\n    background: #dc2626;\n    transform: scale(1.05);\n  }\n\n  /* \u2500\u2500 Thread list \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n  .sa-thread-list-overlay {\n    position: absolute;\n    inset: 0;\n    background: rgba(0,0,0,0.3);\n    z-index: 19;\n  }\n\n  .sa-thread-list {\n    position: absolute;\n    top: 0;\n    left: 0;\n    bottom: 0;\n    width: 100%;\n    display: flex;\n    flex-direction: column;\n    background: #ffffff;\n    z-index: 20;\n    box-shadow: 0 0 40px rgba(0, 0, 0, 0.15);\n    animation: sa-slide-in-left 0.25s cubic-bezier(0.16, 1, 0.3, 1);\n  }\n\n  .sa-thread-list-header {\n    display: flex;\n    align-items: center;\n    gap: 10px;\n    padding: 14px 16px;\n    border-bottom: 1px solid var(--sa-border);\n    flex-shrink: 0;\n  }\n\n  .sa-thread-list-items {\n    flex: 1;\n    overflow-y: auto;\n  }\n\n  .sa-thread-list-empty {\n    padding: 24px 16px;\n    text-align: center;\n    color: var(--sa-text-muted);\n    font-size: 13px;\n  }\n\n  .sa-thread-list-new {\n    display: block;\n    width: calc(100% - 24px);\n    margin: 12px;\n    padding: 10px;\n    border: 1px dashed var(--sa-border);\n    border-radius: 10px;\n    background: transparent;\n    color: var(--sa-primary);\n    font-size: 14px;\n    cursor: pointer;\n    text-align: center;\n    transition: background 0.15s, border-color 0.15s;\n  }\n\n  .sa-thread-list-new:hover {\n    background: var(--sa-primary-light);\n    border-color: var(--sa-primary);\n  }\n\n  .sa-thread-item {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: 8px;\n    padding: 12px 16px;\n    border-bottom: 1px solid #f3f4f6;\n    color: #374151;\n    font-size: 14px;\n    cursor: pointer;\n    transition: background 0.15s ease;\n  }\n\n  .sa-thread-item:hover {\n    background: var(--sa-surface);\n  }\n\n  .sa-thread-item.active {\n    background: var(--sa-primary-light);\n    color: var(--sa-primary-dark);\n    font-weight: 500;\n  }\n\n  .sa-thread-item-title {\n    flex: 1;\n    overflow: hidden;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n  }\n\n  .sa-thread-item-edit {\n    width: 100%;\n    padding: 4px 8px;\n    border: 1px solid var(--sa-primary);\n    border-radius: 6px;\n    font-size: 13px;\n    outline: none;\n    background: var(--sa-bg);\n    color: var(--sa-text);\n  }\n\n  .sa-thread-item-delete {\n    border: none;\n    background: transparent;\n    color: var(--sa-text-muted);\n    font-size: 14px;\n    cursor: pointer;\n    opacity: 0;\n    transition: opacity 0.15s ease, color 0.15s ease;\n  }\n\n  .sa-thread-item:hover .sa-thread-item-delete {\n    opacity: 1;\n  }\n\n  .sa-thread-item-delete:hover {\n    color: #ef4444;\n  }\n\n  /* \u2500\u2500 Welcome \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n  .sa-welcome {\n    flex: 1;\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    padding: 24px;\n    text-align: center;\n  }\n\n  .sa-welcome-icon {\n    font-size: 40px;\n    margin-bottom: 12px;\n  }\n\n  .sa-welcome-message {\n    margin-bottom: 20px;\n    font-size: 14px;\n    color: var(--sa-text-muted);\n    line-height: 1.6;\n  }\n\n  .sa-welcome-prompts {\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n    width: 100%;\n  }\n\n  .sa-welcome-prompt {\n    padding: 10px 16px;\n    border: 1px solid var(--sa-border);\n    border-radius: 999px;\n    background: #ffffff;\n    color: #374151;\n    font-size: 13px;\n    cursor: pointer;\n    transition: border-color 0.2s ease, background 0.2s ease, color 0.2s ease;\n  }\n\n  .sa-welcome-prompt:hover {\n    border-color: var(--sa-primary);\n    background: var(--sa-primary-light);\n    color: var(--sa-primary-dark);\n  }\n\n  /* \u2500\u2500 Streaming cursor \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n  .sa-streaming-cursor {\n    display: inline-block;\n    width: 2px;\n    height: 1em;\n    margin-left: 2px;\n    background: var(--sa-primary);\n    vertical-align: text-bottom;\n    animation: sa-blink 1s steps(2, start) infinite;\n  }\n\n  /* \u2500\u2500 Animations \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n  @keyframes sa-slide-up {\n    from {\n      opacity: 0;\n      transform: translateY(16px) scale(0.98);\n    }\n    to {\n      opacity: 1;\n      transform: translateY(0) scale(1);\n    }\n  }\n\n  @keyframes sa-blink {\n    0%,\n    100% {\n      opacity: 1;\n    }\n    50% {\n      opacity: 0;\n    }\n  }\n\n  @keyframes sa-slide-in-left {\n    from {\n      opacity: 0;\n      transform: translateX(-100%);\n    }\n    to {\n      opacity: 1;\n      transform: translateX(0);\n    }\n  }\n\n  /* \u2500\u2500 Fullpage Layout (DeepSeek-style) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n  .sa-fullpage {\n    position: fixed;\n    inset: 0;\n    width: 100vw;\n    height: 100vh;\n    display: flex;\n    background: #f7f7f8;\n    z-index: var(--sa-z-index, 9999);\n  }\n\n  /* Sidebar */\n  .sa-fp-sidebar {\n    width: 260px;\n    display: flex;\n    flex-direction: column;\n    background: #f2f2f3;\n    flex-shrink: 0;\n    transition: width 0.2s cubic-bezier(0.16,1,0.3,1);\n    overflow: hidden;\n    border-right: 1px solid #e8e8ea;\n  }\n\n  .sa-fp-sidebar-collapsed {\n    width: 52px;\n    align-items: center;\n    padding-top: 12px;\n    gap: 4px;\n    border-right: 1px solid #e8e8ea;\n  }\n\n  .sa-fp-sidebar-header {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    padding: 12px 12px 8px;\n    flex-shrink: 0;\n  }\n\n  .sa-fp-sidebar-toggle {\n    width: 32px;\n    height: 32px;\n    border: none;\n    border-radius: 8px;\n    background: transparent;\n    color: #71717a;\n    cursor: pointer;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    transition: background 0.12s, color 0.12s;\n    flex-shrink: 0;\n  }\n\n  .sa-fp-sidebar-toggle:hover {\n    background: #e4e4e7;\n    color: #18181b;\n  }\n\n  .sa-fp-sidebar-new {\n    flex: 1;\n    padding: 7px 12px;\n    border: 1px solid #d4d4d8;\n    border-radius: 8px;\n    background: #fff;\n    color: #3f3f46;\n    font-size: 13px;\n    font-weight: 500;\n    cursor: pointer;\n    display: flex;\n    align-items: center;\n    gap: 6px;\n    transition: border-color 0.12s, box-shadow 0.12s;\n  }\n\n  .sa-fp-sidebar-new:hover {\n    border-color: #a1a1aa;\n    box-shadow: 0 1px 3px rgba(0,0,0,0.06);\n  }\n\n  .sa-fp-sidebar-new span {\n    font-size: 13px;\n  }\n\n  .sa-fp-sidebar-list {\n    flex: 1;\n    overflow-y: auto;\n    padding: 4px 8px 12px;\n  }\n\n  .sa-fp-sidebar-list::-webkit-scrollbar {\n    width: 4px;\n  }\n\n  .sa-fp-sidebar-list::-webkit-scrollbar-thumb {\n    background: rgba(0,0,0,0.08);\n    border-radius: 2px;\n  }\n\n  .sa-fp-sidebar-list::-webkit-scrollbar-thumb:hover {\n    background: rgba(0,0,0,0.15);\n  }\n\n  .sa-fp-sidebar-group {\n    padding: 12px 8px 4px;\n    font-size: 11px;\n    font-weight: 500;\n    color: #a1a1aa;\n    letter-spacing: 0.3px;\n  }\n\n  .sa-fp-sidebar-item {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    padding: 8px 10px;\n    margin: 1px 0;\n    border-radius: 8px;\n    cursor: pointer;\n    color: #3f3f46;\n    font-size: 13px;\n    line-height: 1.4;\n    transition: background 0.1s;\n  }\n\n  .sa-fp-sidebar-item:hover {\n    background: #e8e8ea;\n  }\n\n  .sa-fp-sidebar-item.active {\n    background: #e4e4e7;\n    color: #18181b;\n    font-weight: 500;\n  }\n\n  .sa-fp-sidebar-item-title {\n    flex: 1;\n    overflow: hidden;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n  }\n\n  .sa-fp-sidebar-item-action {\n    width: 24px;\n    height: 24px;\n    border: none;\n    border-radius: 6px;\n    background: transparent;\n    color: #a1a1aa;\n    cursor: pointer;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n    transition: color 0.1s, background 0.1s;\n  }\n\n  .sa-fp-sidebar-item-action:hover {\n    color: #71717a;\n    background: rgba(0,0,0,0.05);\n  }\n\n  .sa-fp-sidebar-item-action.danger {\n    color: #ef4444;\n  }\n\n  .sa-fp-sidebar-item-action.danger:hover {\n    color: #dc2626;\n    background: rgba(239,68,68,0.08);\n  }\n\n  .sa-fp-sidebar-empty {\n    padding: 32px 12px;\n    text-align: center;\n    color: #a1a1aa;\n    font-size: 13px;\n  }\n\n  /* Sidebar wrapper (for custom ThreadList slot) */\n  .sa-fp-sidebar-wrapper {\n    width: 260px;\n    flex-shrink: 0;\n    overflow: hidden;\n    border-right: 1px solid #e8e8ea;\n    background: #f2f2f3;\n    transition: width 0.2s cubic-bezier(0.16,1,0.3,1);\n  }\n\n  .sa-fp-sidebar-wrapper-collapsed {\n    width: 0;\n  }\n\n  /* Main area */\n  .sa-fp-main {\n    flex: 1;\n    display: flex;\n    flex-direction: column;\n    min-width: 0;\n    background: #fff;\n  }\n\n  .sa-fp-header {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n    padding: 10px 16px;\n    border-bottom: 1px solid #f0f0f0;\n    background: #fff;\n    flex-shrink: 0;\n    min-height: 52px;\n  }\n\n  .sa-fp-header-title {\n    flex: 1;\n    font-size: 15px;\n    font-weight: 500;\n    color: #18181b;\n    letter-spacing: -0.2px;\n  }\n\n  .sa-fp-header-actions {\n    display: flex;\n    gap: 4px;\n  }\n\n  .sa-fp-header-btn {\n    width: 34px;\n    height: 34px;\n    border: none;\n    border-radius: 8px;\n    background: transparent;\n    color: #71717a;\n    cursor: pointer;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    transition: background 0.12s, color 0.12s;\n  }\n\n  .sa-fp-header-btn:hover {\n    background: #f4f4f5;\n    color: #18181b;\n  }\n\n  /* Fullpage thread/composer override */\n  .sa-fp-main .sa-thread {\n    margin: 0 auto;\n    width: 100%;\n    padding: 24px 24px;\n  }\n\n  .sa-fp-main .sa-composer {\n    margin: 0 auto;\n    width: 100%;\n    padding: 12px 24px 20px;\n    border-top: none;\n    background: transparent;\n  }\n\n  .sa-fp-main .sa-composer-input {\n    background: #f7f7f8;\n    border: 1px solid #e4e4e7;\n    box-shadow: none;\n  }\n\n  .sa-fp-main .sa-composer-input:focus {\n    background: #fff;\n    border-color: #d4d4d8;\n    box-shadow: 0 0 0 3px rgba(99,102,241,0.08);\n  }\n";
+export declare const widgetStyles = "\n  [data-super-agent-widget] {\n    --sa-primary-dark: color-mix(in srgb, var(--sa-primary) 82%, #000);\n    --sa-primary-light: color-mix(in srgb, var(--sa-primary) 10%, #fff);\n    --sa-text: #1f2937;\n    --sa-text-muted: #6b7280;\n    --sa-border: #e5e7eb;\n    --sa-surface: #f9fafb;\n\n    font-family: var(--sa-font);\n    color: var(--sa-text);\n    line-height: 1.5;\n    -webkit-font-smoothing: antialiased;\n    text-rendering: optimizeLegibility;\n  }\n\n  [data-super-agent-widget] *,\n  [data-super-agent-widget] *::before,\n  [data-super-agent-widget] *::after {\n    box-sizing: border-box;\n    margin: 0;\n    padding: 0;\n  }\n\n  [data-super-agent-widget] button {\n    font-family: inherit;\n  }\n\n  /* \u2500\u2500 Trigger \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n  .sa-trigger {\n    position: fixed;\n    bottom: 24px;\n    right: 24px;\n    width: 56px;\n    height: 56px;\n    border: none;\n    border-radius: 50%;\n    cursor: pointer;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    background: linear-gradient(135deg, var(--sa-primary), var(--sa-primary-dark));\n    color: #ffffff;\n    font-size: 24px;\n    box-shadow: 0 8px 24px color-mix(in srgb, var(--sa-primary) 35%, transparent);\n    z-index: var(--sa-z-index, 9999);\n    transition: transform 0.2s ease, box-shadow 0.2s ease;\n  }\n\n  .sa-trigger:hover {\n    transform: scale(1.08);\n    box-shadow: 0 12px 32px color-mix(in srgb, var(--sa-primary) 45%, transparent);\n  }\n\n  .sa-trigger:active {\n    transform: scale(0.94);\n  }\n\n  .sa-trigger-open {\n    transform: rotate(90deg);\n  }\n\n  /* \u2500\u2500 Panel \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n  .sa-panel {\n    position: fixed;\n    bottom: 96px;\n    right: 24px;\n    width: var(--sa-panel-width, 380px);\n    height: var(--sa-panel-height, 520px);\n    max-height: calc(100vh - 120px);\n    display: flex;\n    flex-direction: column;\n    overflow: hidden;\n    background: var(--sa-bg);\n    border: 1px solid var(--sa-border);\n    border-radius: var(--sa-radius, 16px);\n    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.18);\n    z-index: var(--sa-z-index, 9999);\n    animation: sa-slide-up 0.25s cubic-bezier(0.16, 1, 0.3, 1);\n  }\n\n  /* \u2500\u2500 Header \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n  .sa-header {\n    display: flex;\n    align-items: center;\n    gap: 10px;\n    padding: 14px 16px;\n    color: #ffffff;\n    background: linear-gradient(135deg, var(--sa-primary), var(--sa-primary-dark));\n    flex-shrink: 0;\n  }\n\n  .sa-header-left {\n    display: flex;\n    align-items: center;\n    gap: 10px;\n    flex: 1;\n  }\n\n  .sa-header-avatar {\n    width: 28px;\n    height: 28px;\n    border-radius: 50%;\n    background: rgba(255,255,255,0.2);\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    font-size: 12px;\n    font-weight: 600;\n  }\n\n  .sa-header-info {\n    display: flex;\n    flex-direction: column;\n  }\n\n  .sa-header-status {\n    font-size: 11px;\n    opacity: 0.8;\n    color: #a5f3a6;\n  }\n\n  .sa-header-actions {\n    display: flex;\n    gap: 4px;\n  }\n\n  .sa-header-title {\n    flex: 1;\n    font-size: 16px;\n    font-weight: 600;\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n  }\n\n  .sa-header-btn {\n    width: 30px;\n    height: 30px;\n    border: none;\n    border-radius: 8px;\n    background: transparent;\n    color: #ffffff;\n    font-size: 16px;\n    cursor: pointer;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    transition: background 0.15s ease;\n  }\n\n  .sa-header-btn:hover {\n    background: rgba(255, 255, 255, 0.18);\n  }\n\n  /* \u2500\u2500 Thread / messages \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n  .sa-thread {\n    flex: 1;\n    display: flex;\n    flex-direction: column;\n    gap: 14px;\n    overflow-y: auto;\n    padding: 16px;\n    background: var(--sa-surface);\n    scroll-behavior: smooth;\n  }\n\n  .sa-thread::-webkit-scrollbar {\n    width: 6px;\n  }\n\n  .sa-thread::-webkit-scrollbar-thumb {\n    background: rgba(0, 0, 0, 0.14);\n    border-radius: 3px;\n  }\n\n  .sa-thread::-webkit-scrollbar-thumb:hover {\n    background: rgba(0, 0, 0, 0.24);\n  }\n\n  .sa-message {\n    display: flex;\n    align-items: flex-start;\n    gap: 10px;\n    width: 100%;\n  }\n\n  .sa-message-user {\n    justify-content: flex-end;\n  }\n\n  .sa-message-body {\n    max-width: 78%;\n    display: flex;\n    flex-direction: column;\n    gap: 4px;\n  }\n\n  .sa-message-user .sa-message-body {\n    padding: 10px 14px;\n    border-radius: 16px;\n    border-bottom-right-radius: 4px;\n    background: var(--sa-primary);\n    color: #ffffff;\n    font-size: 14px;\n    line-height: 1.55;\n    word-break: break-word;\n  }\n\n  .sa-message-assistant .sa-message-body {\n    padding: 10px 14px;\n    border-radius: 16px;\n    border-bottom-left-radius: 4px;\n    background: #ffffff;\n    color: var(--sa-text);\n    font-size: 14px;\n    line-height: 1.55;\n    word-break: break-word;\n    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);\n  }\n\n  .sa-avatar {\n    width: 28px;\n    height: 28px;\n    flex-shrink: 0;\n    border-radius: 50%;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    color: #ffffff;\n    font-size: 12px;\n    font-weight: 600;\n    overflow: hidden;\n  }\n\n  .sa-avatar-assistant {\n    background: linear-gradient(135deg, var(--sa-primary), var(--sa-primary-dark));\n  }\n\n  .sa-avatar-user {\n    background: linear-gradient(135deg, #64748b, #475569);\n  }\n\n  /* \u2500\u2500 Text part (markdown) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n  .sa-text-part {\n    font-size: 14px;\n    line-height: 1.6;\n    word-break: break-word;\n  }\n\n  .sa-text-part p {\n    margin: 0 0 8px;\n  }\n\n  .sa-text-part p:last-child {\n    margin-bottom: 0;\n  }\n\n  .sa-text-part strong {\n    font-weight: 600;\n  }\n\n  .sa-text-part em {\n    font-style: italic;\n  }\n\n  .sa-text-part h1,\n  .sa-text-part h2,\n  .sa-text-part h3,\n  .sa-text-part h4,\n  .sa-text-part h5,\n  .sa-text-part h6 {\n    margin: 12px 0 6px;\n    font-weight: 600;\n    line-height: 1.3;\n  }\n\n  .sa-text-part h1 {\n    font-size: 1.4em;\n  }\n\n  .sa-text-part h2 {\n    font-size: 1.25em;\n  }\n\n  .sa-text-part h3 {\n    font-size: 1.1em;\n  }\n\n  .sa-text-part h4,\n  .sa-text-part h5,\n  .sa-text-part h6 {\n    font-size: 1em;\n  }\n\n  .sa-text-part a {\n    color: var(--sa-primary);\n    text-decoration: underline;\n    text-underline-offset: 2px;\n  }\n\n  .sa-text-part a:hover {\n    color: var(--sa-primary-dark);\n  }\n\n  .sa-inline-code {\n    padding: 2px 5px;\n    border-radius: 4px;\n    background: rgba(0, 0, 0, 0.06);\n    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;\n    font-size: 0.9em;\n  }\n\n  .sa-code-block {\n    margin: 8px 0;\n    padding: 12px 14px;\n    border-radius: 10px;\n    background: #1e293b;\n    color: #e2e8f0;\n    overflow-x: auto;\n    font-size: 13px;\n    line-height: 1.55;\n  }\n\n  .sa-code-block code {\n    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;\n    white-space: pre;\n  }\n\n  .sa-list {\n    margin: 6px 0;\n    padding-left: 22px;\n  }\n\n  .sa-list li {\n    margin: 3px 0;\n    line-height: 1.5;\n  }\n\n  ul.sa-list {\n    list-style: disc;\n  }\n\n  ol.sa-list {\n    list-style: decimal;\n  }\n\n  /* \u2500\u2500 Thinking part \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n  .sa-thinking-part {\n    margin: 6px 0;\n    padding: 8px 12px;\n    border-left: 3px solid var(--sa-primary);\n    border-radius: 8px;\n    background: var(--sa-primary-light);\n    cursor: pointer;\n    font-size: 13px;\n  }\n\n  .sa-thinking-header {\n    display: flex;\n    align-items: center;\n    gap: 6px;\n    color: var(--sa-primary-dark);\n    font-weight: 500;\n    user-select: none;\n  }\n\n  .sa-thinking-icon {\n    font-size: 14px;\n    line-height: 1;\n  }\n\n  .sa-thinking-label {\n    flex: 1;\n  }\n\n  .sa-thinking-arrow {\n    font-size: 12px;\n    transition: transform 0.2s ease;\n  }\n\n  .sa-thinking-arrow.expanded {\n    transform: rotate(90deg);\n  }\n\n  .sa-thinking-content {\n    margin-top: 8px;\n    color: #4b5563;\n    white-space: pre-wrap;\n    line-height: 1.55;\n  }\n\n  /* \u2500\u2500 Tool call / result \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n  .sa-tool-call-part {\n    margin: 6px 0;\n    border: 1px solid var(--sa-border);\n    border-radius: 10px;\n    overflow: hidden;\n    background: #ffffff;\n  }\n\n  .sa-tool-call-header {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    padding: 8px 12px;\n    cursor: pointer;\n    font-size: 13px;\n    user-select: none;\n  }\n\n  .sa-tool-call-header:hover {\n    background: var(--sa-surface);\n  }\n\n  .sa-tool-icon {\n    font-size: 14px;\n    line-height: 1;\n  }\n\n  .sa-tool-name {\n    flex: 1;\n    color: #374151;\n    font-weight: 500;\n    overflow: hidden;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n  }\n\n  .sa-tool-args {\n    margin: 0;\n    padding: 10px 12px;\n    border-top: 1px solid var(--sa-border);\n    background: var(--sa-surface);\n    color: #374151;\n    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;\n    font-size: 12px;\n    line-height: 1.5;\n    white-space: pre;\n    overflow-x: auto;\n  }\n\n  .sa-tool-result-part {\n    margin: 6px 0;\n    border: 1px solid var(--sa-border);\n    border-radius: 10px;\n    overflow: hidden;\n    background: #ffffff;\n  }\n\n  .sa-tool-result-header {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    padding: 8px 12px;\n    border-bottom: 1px solid var(--sa-border);\n    background: var(--sa-surface);\n    color: #374151;\n    font-size: 13px;\n    font-weight: 500;\n  }\n\n  .sa-tool-result-content {\n    padding: 10px 12px;\n    color: #4b5563;\n    font-size: 13px;\n    line-height: 1.55;\n    white-space: pre-wrap;\n    word-break: break-word;\n  }\n\n  /* \u2500\u2500 Error part \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n  .sa-error-part {\n    margin: 6px 0;\n    padding: 10px 12px;\n    border: 1px solid #fecaca;\n    border-radius: 10px;\n    background: #fef2f2;\n    color: #b91c1c;\n  }\n\n  .sa-error-content {\n    display: flex;\n    align-items: flex-start;\n    gap: 8px;\n    font-size: 13px;\n    line-height: 1.5;\n  }\n\n  .sa-error-icon {\n    font-size: 14px;\n    line-height: 1.4;\n  }\n\n  .sa-error-retry {\n    margin-top: 8px;\n    padding: 6px 14px;\n    border: none;\n    border-radius: 8px;\n    background: #ef4444;\n    color: #ffffff;\n    font-size: 13px;\n    cursor: pointer;\n    transition: background 0.2s ease;\n  }\n\n  .sa-error-retry:hover {\n    background: #dc2626;\n  }\n\n  /* \u2500\u2500 Action bar \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n  .sa-action-bar {\n    display: flex;\n    gap: 6px;\n    margin-top: 6px;\n  }\n\n  .sa-action-btn {\n    padding: 4px 10px;\n    border: none;\n    border-radius: 6px;\n    background: transparent;\n    color: var(--sa-text-muted);\n    font-size: 12px;\n    cursor: pointer;\n    transition: color 0.15s ease, background 0.15s ease;\n  }\n\n  .sa-action-btn:hover {\n    color: var(--sa-text);\n    background: rgba(0, 0, 0, 0.05);\n  }\n\n  .sa-action-btn-active {\n    color: var(--sa-primary) !important;\n    background: var(--sa-primary-light) !important;\n  }\n\n  .sa-action-divider {\n    width: 1px;\n    height: 16px;\n    background: var(--sa-border);\n    margin: 0 2px;\n    align-self: center;\n  }\n\n  /* \u2500\u2500 Composer \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n  .sa-composer {\n    display: flex;\n    align-items: flex-end;\n    gap: 10px;\n    padding: 12px 14px;\n    border-top: 1px solid var(--sa-border);\n    background: var(--sa-bg);\n    flex-shrink: 0;\n  }\n\n  .sa-composer-input {\n    flex: 1;\n    min-height: 38px;\n    max-height: 120px;\n    padding: 9px 14px;\n    border: 1px solid var(--sa-border);\n    border-radius: 19px;\n    background: var(--sa-surface);\n    color: var(--sa-text);\n    font-family: var(--sa-font);\n    font-size: 14px;\n    line-height: 1.5;\n    resize: none;\n    outline: none;\n    transition: border-color 0.2s ease, background 0.2s ease;\n  }\n\n  .sa-composer-input::placeholder {\n    color: #9ca3af;\n  }\n\n  .sa-composer-input:focus {\n    border-color: var(--sa-primary);\n    background: #ffffff;\n  }\n\n  .sa-composer-send,\n  .sa-composer-stop {\n    width: 38px;\n    height: 38px;\n    flex-shrink: 0;\n    border: none;\n    border-radius: 50%;\n    cursor: pointer;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    color: #ffffff;\n    font-size: 16px;\n    transition: transform 0.15s ease, background 0.2s ease;\n  }\n\n  .sa-composer-send {\n    background: var(--sa-primary);\n  }\n\n  .sa-composer-send:hover {\n    background: var(--sa-primary-dark);\n    transform: scale(1.05);\n  }\n\n  .sa-composer-send:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n    transform: none;\n  }\n\n  .sa-composer-stop {\n    background: #ef4444;\n  }\n\n  .sa-composer-stop:hover {\n    background: #dc2626;\n    transform: scale(1.05);\n  }\n\n  /* \u2500\u2500 Thread list \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n  .sa-thread-list-overlay {\n    position: absolute;\n    inset: 0;\n    background: rgba(0,0,0,0.3);\n    z-index: 19;\n  }\n\n  .sa-thread-list {\n    position: absolute;\n    top: 0;\n    left: 0;\n    bottom: 0;\n    width: 100%;\n    display: flex;\n    flex-direction: column;\n    background: #ffffff;\n    z-index: 20;\n    box-shadow: 0 0 40px rgba(0, 0, 0, 0.15);\n    animation: sa-slide-in-left 0.25s cubic-bezier(0.16, 1, 0.3, 1);\n  }\n\n  .sa-thread-list-header {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    padding: 20px 20px 16px;\n    flex-shrink: 0;\n  }\n\n  .sa-thread-list-title {\n    font-size: 17px;\n    font-weight: 700;\n    color: #18181b;\n    letter-spacing: -0.2px;\n  }\n\n  .sa-thread-list-new {\n    display: flex;\n    align-items: center;\n    gap: 6px;\n    padding: 8px 16px;\n    border: none;\n    border-radius: 20px;\n    background: #f4f4f5;\n    color: #3f3f46;\n    font-size: 13px;\n    font-weight: 500;\n    cursor: pointer;\n    transition: background 0.15s;\n  }\n\n  .sa-thread-list-new:hover {\n    background: #e4e4e7;\n  }\n\n  .sa-thread-list-items {\n    flex: 1;\n    overflow-y: auto;\n    padding: 0 12px 12px;\n  }\n\n  .sa-thread-list-empty {\n    padding: 48px 16px;\n    text-align: center;\n    color: var(--sa-text-muted);\n    font-size: 14px;\n  }\n\n  .sa-thread-group-label {\n    padding: 16px 8px 6px;\n    font-size: 12px;\n    font-weight: 500;\n    color: #a1a1aa;\n  }\n\n  .sa-thread-item {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: 8px;\n    padding: 10px 12px;\n    margin: 2px 0;\n    border-radius: 8px;\n    color: #374151;\n    font-size: 14px;\n    cursor: pointer;\n    transition: background 0.15s ease;\n  }\n\n  .sa-thread-item:hover {\n    background: #f9fafb;\n  }\n\n  .sa-thread-item.active {\n    background: var(--sa-primary-light);\n    color: var(--sa-primary-dark);\n    font-weight: 500;\n  }\n\n  .sa-thread-item-title {\n    flex: 1;\n    overflow: hidden;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n  }\n\n  .sa-thread-item-edit {\n    width: 100%;\n    padding: 4px 8px;\n    border: 1px solid var(--sa-primary);\n    border-radius: 6px;\n    font-size: 13px;\n    outline: none;\n    background: var(--sa-bg);\n    color: var(--sa-text);\n  }\n\n  .sa-thread-item-delete {\n    border: none;\n    background: transparent;\n    color: var(--sa-text-muted);\n    font-size: 14px;\n    cursor: pointer;\n    opacity: 0;\n    transition: opacity 0.15s ease, color 0.15s ease;\n  }\n\n  .sa-thread-item:hover .sa-thread-item-delete {\n    opacity: 1;\n  }\n\n  .sa-thread-item-delete:hover {\n    color: #ef4444;\n  }\n\n  /* \u2500\u2500 Welcome \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n  .sa-welcome {\n    flex: 1;\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    padding: 24px;\n    text-align: center;\n  }\n\n  .sa-welcome-icon {\n    font-size: 40px;\n    margin-bottom: 12px;\n  }\n\n  .sa-welcome-message {\n    margin-bottom: 20px;\n    font-size: 14px;\n    color: var(--sa-text-muted);\n    line-height: 1.6;\n  }\n\n  .sa-welcome-prompts {\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n    width: 100%;\n  }\n\n  .sa-welcome-prompt {\n    padding: 10px 16px;\n    border: 1px solid var(--sa-border);\n    border-radius: 999px;\n    background: #ffffff;\n    color: #374151;\n    font-size: 13px;\n    cursor: pointer;\n    transition: border-color 0.2s ease, background 0.2s ease, color 0.2s ease;\n  }\n\n  .sa-welcome-prompt:hover {\n    border-color: var(--sa-primary);\n    background: var(--sa-primary-light);\n    color: var(--sa-primary-dark);\n  }\n\n  /* \u2500\u2500 Streaming cursor \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n  .sa-streaming-cursor {\n    display: inline-block;\n    width: 2px;\n    height: 1em;\n    margin-left: 2px;\n    background: var(--sa-primary);\n    vertical-align: text-bottom;\n    animation: sa-blink 1s steps(2, start) infinite;\n  }\n\n  /* \u2500\u2500 Animations \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n  @keyframes sa-slide-up {\n    from {\n      opacity: 0;\n      transform: translateY(16px) scale(0.98);\n    }\n    to {\n      opacity: 1;\n      transform: translateY(0) scale(1);\n    }\n  }\n\n  @keyframes sa-blink {\n    0%,\n    100% {\n      opacity: 1;\n    }\n    50% {\n      opacity: 0;\n    }\n  }\n\n  @keyframes sa-slide-in-left {\n    from {\n      opacity: 0;\n      transform: translateX(-100%);\n    }\n    to {\n      opacity: 1;\n      transform: translateX(0);\n    }\n  }\n\n  /* \u2500\u2500 Fullpage Layout (DeepSeek-style) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n\n  .sa-fullpage {\n    position: fixed;\n    inset: 0;\n    width: 100vw;\n    height: 100vh;\n    display: flex;\n    background: #f7f7f8;\n    z-index: var(--sa-z-index, 9999);\n  }\n\n  /* Sidebar */\n  .sa-fp-sidebar {\n    width: 260px;\n    display: flex;\n    flex-direction: column;\n    background: #f2f2f3;\n    flex-shrink: 0;\n    transition: width 0.2s cubic-bezier(0.16,1,0.3,1);\n    overflow: hidden;\n    border-right: 1px solid #e8e8ea;\n  }\n\n  .sa-fp-sidebar-collapsed {\n    width: 52px;\n    align-items: center;\n    padding-top: 12px;\n    gap: 4px;\n    border-right: 1px solid #e8e8ea;\n  }\n\n  .sa-fp-sidebar-header {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    padding: 12px 12px 8px;\n    flex-shrink: 0;\n  }\n\n  .sa-fp-sidebar-toggle {\n    width: 32px;\n    height: 32px;\n    border: none;\n    border-radius: 8px;\n    background: transparent;\n    color: #71717a;\n    cursor: pointer;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    transition: background 0.12s, color 0.12s;\n    flex-shrink: 0;\n  }\n\n  .sa-fp-sidebar-toggle:hover {\n    background: #e4e4e7;\n    color: #18181b;\n  }\n\n  .sa-fp-sidebar-new {\n    flex: 1;\n    padding: 7px 12px;\n    border: 1px solid #d4d4d8;\n    border-radius: 8px;\n    background: #fff;\n    color: #3f3f46;\n    font-size: 13px;\n    font-weight: 500;\n    cursor: pointer;\n    display: flex;\n    align-items: center;\n    gap: 6px;\n    transition: border-color 0.12s, box-shadow 0.12s;\n  }\n\n  .sa-fp-sidebar-new:hover {\n    border-color: #a1a1aa;\n    box-shadow: 0 1px 3px rgba(0,0,0,0.06);\n  }\n\n  .sa-fp-sidebar-new span {\n    font-size: 13px;\n  }\n\n  .sa-fp-sidebar-list {\n    flex: 1;\n    overflow-y: auto;\n    padding: 4px 8px 12px;\n  }\n\n  .sa-fp-sidebar-list::-webkit-scrollbar {\n    width: 4px;\n  }\n\n  .sa-fp-sidebar-list::-webkit-scrollbar-thumb {\n    background: rgba(0,0,0,0.08);\n    border-radius: 2px;\n  }\n\n  .sa-fp-sidebar-list::-webkit-scrollbar-thumb:hover {\n    background: rgba(0,0,0,0.15);\n  }\n\n  .sa-fp-sidebar-group {\n    padding: 12px 8px 4px;\n    font-size: 11px;\n    font-weight: 500;\n    color: #a1a1aa;\n    letter-spacing: 0.3px;\n  }\n\n  .sa-fp-sidebar-item {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    padding: 8px 10px;\n    margin: 1px 0;\n    border-radius: 8px;\n    cursor: pointer;\n    color: #3f3f46;\n    font-size: 13px;\n    line-height: 1.4;\n    transition: background 0.1s;\n  }\n\n  .sa-fp-sidebar-item:hover {\n    background: #e8e8ea;\n  }\n\n  .sa-fp-sidebar-item.active {\n    background: #e4e4e7;\n    color: #18181b;\n    font-weight: 500;\n  }\n\n  .sa-fp-sidebar-item-title {\n    flex: 1;\n    overflow: hidden;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n  }\n\n  .sa-fp-sidebar-item-action {\n    width: 24px;\n    height: 24px;\n    border: none;\n    border-radius: 6px;\n    background: transparent;\n    color: #a1a1aa;\n    cursor: pointer;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n    transition: color 0.1s, background 0.1s;\n  }\n\n  .sa-fp-sidebar-item-action:hover {\n    color: #71717a;\n    background: rgba(0,0,0,0.05);\n  }\n\n  .sa-fp-sidebar-item-action.danger {\n    color: #ef4444;\n  }\n\n  .sa-fp-sidebar-item-action.danger:hover {\n    color: #dc2626;\n    background: rgba(239,68,68,0.08);\n  }\n\n  .sa-fp-sidebar-empty {\n    padding: 32px 12px;\n    text-align: center;\n    color: #a1a1aa;\n    font-size: 13px;\n  }\n\n  /* Sidebar wrapper (for custom ThreadList slot) */\n  .sa-fp-sidebar-wrapper {\n    width: 260px;\n    flex-shrink: 0;\n    overflow: hidden;\n    border-right: 1px solid #e8e8ea;\n    background: #f2f2f3;\n    transition: width 0.2s cubic-bezier(0.16,1,0.3,1);\n  }\n\n  .sa-fp-sidebar-wrapper-collapsed {\n    width: 0;\n  }\n\n  /* Main area */\n  .sa-fp-main {\n    flex: 1;\n    display: flex;\n    flex-direction: column;\n    min-width: 0;\n    background: #fff;\n  }\n\n  .sa-fp-header {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n    padding: 10px 16px;\n    border-bottom: 1px solid #f0f0f0;\n    background: #fff;\n    flex-shrink: 0;\n    min-height: 52px;\n  }\n\n  .sa-fp-header-title {\n    flex: 1;\n    font-size: 15px;\n    font-weight: 500;\n    color: #18181b;\n    letter-spacing: -0.2px;\n  }\n\n  .sa-fp-header-actions {\n    display: flex;\n    gap: 4px;\n  }\n\n  .sa-fp-header-btn {\n    width: 34px;\n    height: 34px;\n    border: none;\n    border-radius: 8px;\n    background: transparent;\n    color: #71717a;\n    cursor: pointer;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    transition: background 0.12s, color 0.12s;\n  }\n\n  .sa-fp-header-btn:hover {\n    background: #f4f4f5;\n    color: #18181b;\n  }\n\n  /* Fullpage thread/composer override */\n  .sa-fp-main .sa-thread {\n    margin: 0 auto;\n    width: 100%;\n    padding: 24px 24px;\n  }\n\n  .sa-fp-main .sa-composer {\n    margin: 0 auto;\n    width: 100%;\n    padding: 12px 24px 20px;\n    border-top: none;\n    background: transparent;\n  }\n\n  .sa-fp-main .sa-composer-input {\n    background: #f7f7f8;\n    border: 1px solid #e4e4e7;\n    box-shadow: none;\n  }\n\n  .sa-fp-main .sa-composer-input:focus {\n    background: #fff;\n    border-color: #d4d4d8;\n    box-shadow: 0 0 0 3px rgba(99,102,241,0.08);\n  }\n";
 
 export { }