diff --git a/dist/copilot_web/App-Dp5pJunx.js b/dist/copilot_web/App-C_jxBl2D.js similarity index 86% rename from dist/copilot_web/App-Dp5pJunx.js rename to dist/copilot_web/App-C_jxBl2D.js index 13794ba..8c4fda2 100644 --- a/dist/copilot_web/App-Dp5pJunx.js +++ b/dist/copilot_web/App-C_jxBl2D.js @@ -1,6 +1,6 @@ -const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["copilot_web/workflowChat-CjDaET6O.js","copilot_web/input.js","copilot_web/vendor-markdown-Dek94WS0.js","copilot_web/vendor-react-V04_Axys.js","copilot_web/message-components-DHkIj9qD.js","copilot_web/assets/input-0GzdDP_m.css","copilot_web/fonts.css"].map(path => { +const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["copilot_web/workflowChat-DP_exkAV.js","copilot_web/input.js","copilot_web/vendor-markdown-Dek94WS0.js","copilot_web/vendor-react-V04_Axys.js","copilot_web/message-components-DHkIj9qD.js","copilot_web/assets/input-T2ACqglr.css","copilot_web/fonts.css"].map(path => { const apiBase = window.comfyAPI?.api?.api?.api_base; const prefix = apiBase ? `${apiBase.substring(1)}/` : ''; return `${prefix}${path}`; }))))=>i.map(i=>d[i]); -import{_ as a}from"./input.js";import{j as t}from"./vendor-markdown-Dek94WS0.js";import{r,R as i}from"./vendor-react-V04_Axys.js";import{C as n}from"./message-components-DHkIj9qD.js";/* empty css */const o={EXPLAIN_NODE:"copilot:explain-node"},d=i.lazy(()=>a(()=>import("./workflowChat-CjDaET6O.js").then(e=>e.w),__vite__mapDeps([0,1,2,3,4,5,6])).then(e=>({default:e.default})));function p(){const[e,s]=r.useState(!1);return r.useEffect(()=>{const l=()=>{s(!0)};return window.addEventListener(o.EXPLAIN_NODE,l),()=>window.removeEventListener(o.EXPLAIN_NODE,l)},[]),t.jsx(n,{children:t.jsx("div",{className:"h-full w-full flex flex-col",children:t.jsx(r.Suspense,{fallback:t.jsx("div",{className:"h-full w-full flex items-center justify-center",children:"Loading..."}),children:t.jsx(d,{visible:!0,triggerUsage:e,onUsageTriggered:()=>s(!1)})})})})}export{p as default}; +import{_ as a}from"./input.js";import{j as t}from"./vendor-markdown-Dek94WS0.js";import{r,R as i}from"./vendor-react-V04_Axys.js";import{C as n}from"./message-components-DHkIj9qD.js";/* empty css */const o={EXPLAIN_NODE:"copilot:explain-node"},d=i.lazy(()=>a(()=>import("./workflowChat-DP_exkAV.js").then(e=>e.w),__vite__mapDeps([0,1,2,3,4,5,6])).then(e=>({default:e.default})));function p(){const[e,s]=r.useState(!1);return r.useEffect(()=>{const l=()=>{s(!0)};return window.addEventListener(o.EXPLAIN_NODE,l),()=>window.removeEventListener(o.EXPLAIN_NODE,l)},[]),t.jsx(n,{children:t.jsx("div",{className:"h-full w-full flex flex-col",children:t.jsx(r.Suspense,{fallback:t.jsx("div",{className:"h-full w-full flex items-center justify-center",children:"Loading..."}),children:t.jsx(d,{visible:!0,triggerUsage:e,onUsageTriggered:()=>s(!1)})})})})}export{p as default}; diff --git a/dist/copilot_web/ParameterDebugInterfaceNew-Bll5geLy.js b/dist/copilot_web/ParameterDebugInterfaceNew-Bll5geLy.js deleted file mode 100644 index 6060836..0000000 --- a/dist/copilot_web/ParameterDebugInterfaceNew-Bll5geLy.js +++ /dev/null @@ -1,35 +0,0 @@ -import{j as e}from"./vendor-markdown-Dek94WS0.js";import{r as y}from"./vendor-react-V04_Axys.js";import{r as nt,g as ot,m as at,i as lt}from"./workflowChat-CjDaET6O.js";import{a as Z,u as De,g as ke,W as ue}from"./message-components-DHkIj9qD.js";import"./input.js";/* empty css */function it(a,n){try{if(!a)return console.error("Invalid prompt_output: ",a),a;for(const r of n){if(!a[r.nodeId]){console.error(`Node with ID ${r.nodeId} not found`);continue}if(!a[r.nodeId].inputs){console.error(`Inputs not found for node with ID ${r.nodeId}`);continue}a[r.nodeId].inputs[r.paramName]=r.paramValue}return a}catch(r){return console.error("Error updating prompt:",r),a}}async function ct(a){const n=await Z.graphToPrompt(),r=it(n.output,a);console.log("queuePrompt updated_prompt:",r);const u={prompt:r,client_id:Z.api.clientId,extra_data:{extra_pageinfo:{workflow:n.workflow}}};console.debug("queuePrompt request_body.prompt:",r);const p=await nt(u);return console.debug("queuePrompt response:",p),p}function Oe(a){const n=document.createElement("canvas"),r=n.getContext("2d");if(n.width=512,n.height=512,r){r.fillStyle="#f8d7da",r.fillRect(0,0,n.width,n.height),r.strokeStyle="#dc3545",r.lineWidth=4,r.strokeRect(10,10,n.width-20,n.height-20),r.fillStyle="#dc3545",r.beginPath(),r.arc(n.width/2,150,50,0,2*Math.PI),r.fill(),r.fillStyle="white",r.font="bold 80px Arial",r.textAlign="center",r.textBaseline="middle",r.fillText("!",n.width/2,150),r.fillStyle="#721c24",r.font="20px Arial",r.textAlign="center",r.textBaseline="middle";const u=n.width-60,p=30,x=a.split(" ");let d="",h=250;for(let v=0;vu&&v>0?(r.fillText(d,n.width/2,h),d=x[v]+" ",h+=p):d=I}r.fillText(d,n.width/2,h)}return n.toDataURL("image/png")}async function dt(a){try{if(!a||a==="")return console.log("No prompt ID provided"),{1:[Oe("Fail to generate prompt ID")]};const n=await ot(a);if(!n||!n[a])return console.log("Not finished for prompt ID:",a),{};const r=n[a];if(r.status&&r.status.status_str==="error"){console.error("Error for prompt ID:",a);const p=r.status.messages;if(p&&p.length>0){const x=p[p.length-1];if(x&&x.length>0){const d=x[0];return{1:[Oe(d)]}}}}const u={};if(r.outputs)for(const p in r.outputs){const x=r.outputs[p];if(x&&x.images){u[p]=[];for(const d of x.images)if(d&&d.filename&&d.type){const h=Z.graph._nodes_by_id[p].imgs[0].currentSrc.split("?")[0];u[p].push(h+"?filename="+encodeURIComponent(d.filename)+"&type="+encodeURIComponent(d.type)+(d.subfolder?"&subfolder="+encodeURIComponent(d.subfolder):""))}console.log("outputImages for nodeId:",p,u[p])}}return u}catch(n){throw console.error("Error getting output images from prompt:",n),n}}function ut(){const a=Object.values(Z.graph._nodes_by_id),n=[],r=[];for(const u of a)u.type==="SaveImage"?n.push(u.id):u.type==="PreviewImage"&&r.push(u.id);if(console.log("saveNodeIds:",n),console.log("previewNodeIds:",r),n.length===0&&r.length===0)throw new Error("No SaveImage or PreviewImage node found, please add one to the graph");return n.length===1?n[0]:n.length==0&&r.length===1?r[0]:null}async function xt(a,n){const r=await dt(a);return Object.keys(r).length===0?null:r[n.toString()]&&r[n.toString()].length>0?r[n.toString()][0]:null}const mt=({selectedNodes:a,handleParamSelect:n,selectedParams:r,handleNext:u,handleClose:p})=>{const d=a.flatMap(h=>(h.widgets||[]).map(v=>v.name)).some(h=>r[h]===!0);return e.jsxs("div",{className:"bg-white rounded-lg shadow-sm border border-gray-200 p-4",children:[e.jsxs("div",{className:"mb-4 border-b pb-2 flex justify-between items-center",children:[e.jsxs("div",{children:[e.jsx("h3",{className:"text-base font-medium text-gray-800",children:"Select Parameters for Testing"}),e.jsx("p",{className:"text-xs text-gray-500",children:"Choose the parameters you want to include in your batch test"})]}),e.jsx("button",{className:"text-gray-400 hover:text-gray-600",onClick:p,children:e.jsx("svg",{className:"w-4 h-4",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M6 18L18 6M6 6l12 12"})})})]}),a.map((h,v)=>{const I=h.title||"Unknown Node",S=h.widgets||[];return e.jsxs("div",{className:"border rounded-md mb-4 overflow-hidden",children:[e.jsx("div",{className:"bg-gray-50 px-3 py-2 text-sm font-medium text-gray-700 border-b",children:I}),e.jsx("div",{className:"p-4 space-y-3",children:e.jsx("div",{className:"flex items-center gap-3 flex-wrap",children:S.map((k,E)=>{const R=k.name;return e.jsxs("div",{className:"flex items-center",children:[e.jsx("div",{className:`w-5 h-5 rounded-full border flex items-center justify-center ${r[R]?"border-red-500 bg-red-100":"border-gray-300"}`,onClick:$=>n(R,$),children:r[R]&&e.jsx("div",{className:"w-3 h-3 rounded-full bg-red-500"})}),e.jsx("span",{className:"ml-2 text-gray-700 text-xs",children:R})]},`widget-${E}`)})})})]},`node-${v}`)}),e.jsx("div",{className:"mt-6 flex justify-center",children:e.jsx("button",{onClick:h=>u(h),disabled:!d,className:`px-3 py-1.5 text-xs ${d?"bg-pink-200 text-pink-700 hover:bg-pink-300":"bg-gray-200 text-gray-500 cursor-not-allowed"} rounded-md transition-colors`,children:"Next"})})]})},ht=({selectedNodes:a,paramTestValues:n,selectedParams:r,updateParamTestValues:u,toggleDropdown:p,openDropdowns:x,handleTestValueSelect:d,searchTerms:h,handleSearch:v,handleSelectAll:I,handleNext:S,handlePrevious:k,handleClose:E,inputValues:R,setInputValues:$,textInputs:G,handleTextInputChange:O,handleAddTextInput:T,handleRemoveTextInput:w,openAiWritingModal:W})=>{const D=(c,C,H,Q=0)=>{if(c=isNaN(c)?0:c,C=isNaN(C)?100:C,H=isNaN(H)||H<=0?1:H,C{!a||a.length===0||a.forEach(c=>{const C=c.id.toString(),H=c.widgets||{};Object.values(H).forEach(g=>{const M=g.name;if(!r[M])return;if(!(n[C]?.[M]?.length>0)&&g.type==="number"){const m=g.options?.min||0,z=g.options?.max||100;let L=(g.options?.step||10)/10;L<.1&&(L=.1);const P=g.options?.precision||0,A=D(m,z,L,P);if(A.length>0){u(C,M,A);const F=`${C}_${M}`;$(f=>({...f,[F]:{min:m.toString(),max:z.toString(),step:L.toString()}}))}}if(g.type==="customtext"||g.type.toLowerCase().includes("text")){const m=`${C}_${M}`,z=G[m]||[""];JSON.stringify(z)!==JSON.stringify(n[C]?.[M]||[""])&&u(C,M,z)}})})},[a,r,n,G,u,$,D]),e.jsxs("div",{className:"bg-white rounded-lg shadow-sm border border-gray-200 p-4",children:[e.jsxs("div",{className:"mb-4 border-b pb-2 flex justify-between items-center",children:[e.jsxs("div",{children:[e.jsx("h3",{className:"text-base font-medium text-gray-800",children:"Parameter Options"}),e.jsx("p",{className:"text-xs text-gray-500",children:"Configure the test values for each parameter"})]}),e.jsx("button",{className:"text-gray-400 hover:text-gray-600",onClick:E,children:e.jsx("svg",{className:"w-4 h-4",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M6 18L18 6M6 6l12 12"})})})]}),a.length>0?a.map((c,C)=>{const H=c.widgets||{},Q=Object.values(H),g=c.id;return e.jsxs("div",{className:"border rounded-md mb-4 overflow-hidden",children:[e.jsxs("div",{className:"bg-gray-50 px-3 py-2 text-xs font-medium text-gray-700 border-b flex justify-between items-center",children:[e.jsxs("span",{children:[c.type," (ID: ",g,")"]}),e.jsx("button",{className:"text-gray-400 hover:text-gray-600",onClick:M=>E(M,C),children:e.jsx("svg",{className:"w-3 h-3",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M6 18L18 6M6 6l12 12"})})})]}),e.jsx("div",{className:"p-4 space-y-4",children:Q.map((M,Y)=>{const m=M.name;if(!r[m])return null;const z=`${g}_${m}`;if(M.type==="customtext"||M.type.toLowerCase().includes("text")){const L=G[z]||[""];return e.jsxs("div",{className:"border-b pb-3",children:[e.jsxs("div",{className:"flex justify-between items-center mb-2",children:[e.jsxs("label",{className:"text-xs font-medium text-gray-700",children:[m,":"]}),e.jsxs("button",{className:"px-2 py-1 bg-blue-100 text-blue-700 rounded text-xs flex items-center hover:bg-blue-200 transition-colors",onClick:()=>W(g,m),children:[e.jsx("svg",{className:"w-3 h-3 mr-1",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M15.232 5.232l3.536 3.536m-2.036-5.036a2.5 2.5 0 113.536 3.536L6.5 21.036H3v-3.572L16.732 3.732z"})}),"AI Writing"]})]}),e.jsx("div",{className:"space-y-2",children:L.map((P,A)=>e.jsxs("div",{className:"flex items-start",children:[e.jsx("textarea",{className:`flex-1 border ${P?"border-gray-300":"border-red-500"} rounded p-2 text-xs resize-y`,rows:2,placeholder:"Enter text...",value:P,onChange:F=>O(g,m,A,F.target.value),required:!0}),e.jsx("button",{className:"ml-2 text-red-500 hover:text-red-700",onClick:()=>w(g,m,A),title:"Remove",children:e.jsx("svg",{className:"w-4 h-4",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M6 18L18 6M6 6l12 12"})})})]},A))}),e.jsxs("button",{className:"mt-2 px-2 py-1 border border-dashed border-gray-300 rounded text-xs text-gray-600 hover:bg-gray-50 flex items-center",onClick:()=>T(g,m),children:[e.jsx("svg",{className:"w-3 h-3 mr-1",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M12 6v6m0 0v6m0-6h6m-6 0H6"})}),"Add Text"]})]},Y)}if(M.type==="number"){const L=M.options?.min||0,P=M.options?.max||100,A=(M.options?.step||10)/10,F=M.options?.precision||0,f=D(L,P,A,F),q=R[z]||{min:L.toString(),max:P.toString(),step:A.toString()};return e.jsxs("div",{className:"border-b pb-3",children:[e.jsxs("div",{className:"flex justify-between items-center",children:[e.jsxs("label",{className:"text-xs font-medium text-gray-700",children:[m,":"]}),e.jsx("div",{className:"w-4"})]}),e.jsxs("div",{className:"flex space-x-2 items-center",children:[e.jsx("label",{className:"text-xs text-gray-600",children:"Min"}),e.jsx("input",{type:"text",className:"w-12 h-6 border border-gray-300 rounded text-xs px-2",value:q.min,required:!0,onClick:N=>{N.preventDefault(),N.stopPropagation()},onChange:N=>{N.preventDefault(),N.stopPropagation();const _=N.target.value;if($(V=>({...V,[z]:{...V[z],min:_}})),_===""||!isNaN(parseFloat(_))){const V=_===""?0:parseFloat(_),K=parseFloat(q.max||P.toString()),B=parseFloat(q.step||A.toString()),J=D(V,K,B,F);u(g,m,J)}}}),e.jsx("label",{className:"text-xs text-gray-600",children:"Max"}),e.jsx("input",{type:"text",className:"w-12 h-6 border border-gray-300 rounded text-xs px-2",value:q.max,onClick:N=>{N.preventDefault(),N.stopPropagation()},required:!0,onChange:N=>{N.preventDefault(),N.stopPropagation();const _=N.target.value;if($(V=>({...V,[z]:{...V[z],max:_}})),_===""||!isNaN(parseFloat(_))){const V=parseFloat(q.min||L.toString()),K=_===""?V:parseFloat(_),B=parseFloat(q.step||A.toString()),J=D(V,K,B,F);u(g,m,J)}}}),e.jsx("label",{className:"text-xs text-gray-600",children:"Step"}),e.jsx("input",{type:"text",className:"w-12 h-6 border border-gray-300 rounded text-xs px-2",value:q.step,required:!0,onClick:N=>{N.preventDefault(),N.stopPropagation()},onChange:N=>{N.preventDefault(),N.stopPropagation();const _=N.target.value;if($(V=>({...V,[z]:{...V[z],step:_}})),_===""||!isNaN(parseFloat(_))&&parseFloat(_)>0){const V=parseFloat(q.min||L.toString()),K=parseFloat(q.max||P.toString());let B=_===""?1:parseFloat(_);B<.1&&(B=.1);const J=D(V,K,B,F);u(g,m,J)}}})]}),e.jsxs("div",{className:"mt-1",children:[e.jsx("label",{className:"text-xs text-gray-600",children:"Test values"}),e.jsx("div",{className:"mt-1 flex flex-wrap gap-1",children:(()=>{const N=n[g]?.[m]||f;if(N.length<=10)return N.map((_,V)=>e.jsxs("div",{className:"px-2 py-0.5 bg-blue-100 text-blue-800 rounded-md flex items-center text-xs cursor-pointer hover:bg-blue-200",onClick:K=>{K.stopPropagation(),d(g,m,_,K)},children:[e.jsx("span",{children:_}),e.jsx("svg",{className:"w-4 h-4 ml-1",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M6 18L18 6M6 6l12 12"})})]},V));{const _=N.slice(0,5),V=N.slice(N.length-5);return e.jsxs(e.Fragment,{children:[_.map((K,B)=>e.jsxs("div",{className:"px-2 py-0.5 bg-blue-100 text-blue-800 rounded-md flex items-center text-xs cursor-pointer hover:bg-blue-200",onClick:J=>{J.stopPropagation(),d(g,m,K,J)},children:[e.jsx("span",{children:K}),e.jsx("svg",{className:"w-4 h-4 ml-1",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M6 18L18 6M6 6l12 12"})})]},`first-${B}`)),e.jsx("div",{className:"px-2 py-0.5 bg-gray-100 text-gray-600 rounded-md flex items-center text-xs",children:"..."}),V.map((K,B)=>e.jsxs("div",{className:"px-2 py-0.5 bg-blue-100 text-blue-800 rounded-md flex items-center text-xs cursor-pointer hover:bg-blue-200",onClick:J=>{J.stopPropagation(),d(g,m,K,J)},children:[e.jsx("span",{children:K}),e.jsx("svg",{className:"w-4 h-4 ml-1",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M6 18L18 6M6 6l12 12"})})]},`last-${B}`))]})}})()})]}),e.jsx("div",{className:"mt-1",children:e.jsx("p",{className:"text-xs text-gray-500",children:"Values are distributed evenly between Min and Max"})})]},Y)}else if(M.type==="combo"){const L=M.options?.values||[],P=`${g}_${m}`,A=f=>typeof f=="string"?f:f&&typeof f=="object"&&"name"in f?f.name:String(f),F=f=>typeof f=="object"&&f!==null&&"name"in f?f.name:f;return e.jsxs("div",{className:"border-b pb-3",children:[e.jsxs("div",{className:"flex justify-between items-center",children:[e.jsx("label",{className:"text-xs font-medium text-gray-700",children:m}),e.jsxs("div",{className:"relative dropdown-container",children:[e.jsxs("button",{className:`appearance-none border ${(n[g]?.[m]||[]).length===0?"border-red-500":"border-gray-300"} rounded px-2 py-0.5 pr-6 text-xs flex items-center bg-white text-gray-700`,onClick:f=>{f.preventDefault(),f.stopPropagation(),p(g,m,f)},"data-dropdown":P,children:[e.jsx("span",{children:(n[g]?.[m]||[]).length>0?`${m}: ${(n[g]?.[m]||[]).length} selected`:`Select ${m}`}),e.jsx("div",{className:"ml-2",children:e.jsx("svg",{className:"fill-current h-4 w-4",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 20 20",children:e.jsx("path",{d:"M9.293 12.95l.707.707L15.657 8l-1.414-1.414L10 10.828 5.757 6.586 4.343 8z"})})})]}),x[P]&&e.jsxs("div",{className:"absolute z-[9999] mt-1 w-64 bg-white border border-gray-300 rounded-md shadow-lg dropdown-menu",style:{position:"fixed",top:typeof x[P]=="object"?`${x[P].y}px`:"0px",left:typeof x[P]=="object"?`${x[P].x}px`:"0px",maxHeight:"300px",overflowY:"auto"},children:[e.jsx("div",{className:"p-2 border-b sticky top-0 bg-white",children:e.jsx("input",{type:"text",className:"w-full px-2 py-0.5 text-xs border border-gray-300 rounded",placeholder:"Search...",value:h[P]||"",onChange:f=>{f.preventDefault(),f.stopPropagation(),v(g,m,f.target.value)},onClick:f=>{f.preventDefault(),f.stopPropagation()},autoFocus:!0})}),e.jsxs("div",{className:"px-3 py-1.5 bg-gray-50 border-b cursor-pointer text-xs flex items-center text-gray-700 hover:bg-gray-100",onClick:f=>{f.preventDefault(),f.stopPropagation();const N=L.filter(_=>!h[P]||A(_).toLowerCase().includes((h[P]||"").toLowerCase())).map(F);I(g,m,N)},children:[e.jsx("div",{className:`w-4 h-4 mr-2 border rounded-sm flex items-center justify-center ${L.length>0&&(n[g]?.[m]||[]).length===L.length?"bg-blue-500 border-blue-500":(n[g]?.[m]||[]).length>0?"bg-blue-500 border-blue-500 opacity-50":"border-gray-300"}`,children:(n[g]?.[m]||[]).length>0&&e.jsx("svg",{className:"w-3 h-3 text-white",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M5 13l4 4L19 7"})})}),e.jsx("span",{className:"font-medium",children:L.length>0&&(n[g]?.[m]||[]).length===L.length?"Deselect All":"Select All"})]}),e.jsxs("div",{className:"max-h-60 overflow-y-auto",children:[L.filter(f=>!h[P]||A(f).toLowerCase().includes((h[P]||"").toLowerCase())).map((f,q)=>e.jsxs("div",{className:"px-3 py-1.5 hover:bg-gray-100 cursor-pointer text-xs flex items-center text-gray-700",onClick:N=>{N.preventDefault(),N.stopPropagation(),d(g,m,F(f),N)},children:[e.jsx("div",{className:`w-4 h-4 mr-2 border rounded-sm flex items-center justify-center ${(n[g]?.[m]||[]).includes(F(f))?"bg-blue-500 border-blue-500":"border-gray-300"}`,children:(n[g]?.[m]||[]).includes(F(f))&&e.jsx("svg",{className:"w-3 h-3 text-white",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M5 13l4 4L19 7"})})}),e.jsx("span",{className:"whitespace-normal overflow-hidden text-ellipsis",children:A(f)})]},q)),L.filter(f=>!h[P]||A(f).toLowerCase().includes((h[P]||"").toLowerCase())).length===0&&e.jsx("div",{className:"px-3 py-4 text-sm text-gray-500 text-center",children:"No matching options"})]})]})]})]}),e.jsxs("div",{className:"mt-2",children:[e.jsx("label",{className:"text-xs text-gray-600",children:"Test values"}),(n[g]?.[m]||[]).length===0&&e.jsx("div",{className:"text-xs text-red-500 mt-1",children:"Please select at least one value"}),e.jsx("div",{className:"mt-1 flex flex-wrap gap-1",children:(n[g]?.[m]||[]).map((f,q)=>e.jsxs("div",{className:"px-2 py-0.5 bg-blue-100 text-blue-800 rounded-md flex items-center text-xs",children:[e.jsx("span",{children:f}),e.jsx("svg",{className:"w-4 h-4 ml-1 cursor-pointer hover:text-blue-600",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",onClick:N=>{N.preventDefault(),N.stopPropagation(),d(g,m,f,N)},children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M6 18L18 6M6 6l12 12"})})]},q))})]})]},Y)}else return e.jsxs("div",{className:"border-b pb-3",children:[e.jsx("div",{className:"flex justify-between items-center",children:e.jsx("label",{className:"text-xs font-medium text-gray-700",children:m})}),e.jsxs("div",{className:"mt-2",children:[e.jsx("label",{className:"text-xs text-gray-600",children:"Test values"}),e.jsxs("div",{className:"mt-1 flex flex-wrap gap-1",children:[(n[g]?.[m]||[]).map((L,P)=>e.jsxs("div",{className:"px-2 py-0.5 bg-blue-100 text-blue-800 rounded-md flex items-center text-xs",children:[e.jsx("span",{children:L}),e.jsx("svg",{className:"w-4 h-4 ml-1 cursor-pointer hover:text-blue-600",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",onClick:A=>{A.preventDefault(),A.stopPropagation(),d(g,m,L,A)},children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M6 18L18 6M6 6l12 12"})})]},P)),e.jsxs("button",{className:"px-2 py-0.5 border border-dashed border-blue-300 text-blue-600 rounded-md text-xs flex items-center hover:bg-blue-50",onClick:L=>{L.preventDefault(),L.stopPropagation();const P=`${m}${(n[g]?.[m]||[]).length+1}`;u(g,m,[...n[g]?.[m]||[],P])},children:[e.jsx("svg",{className:"w-4 h-4 mr-1",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M12 6v6m0 0v6m0-6h6m-6 0H6"})}),e.jsx("span",{children:"Add"})]})]})]})]},Y)})})]},C)}):e.jsx("div",{className:"border rounded-md mb-4 p-4 text-center text-gray-500",children:"No nodes selected. Please select a node in the workflow to configure parameters."}),e.jsxs("div",{className:"mt-6 flex justify-between",children:[e.jsx("button",{onClick:c=>k(c),className:"px-3 py-1.5 text-xs bg-gray-100 text-gray-800 rounded-md hover:bg-gray-200 transition-colors",children:"Previous"}),e.jsx("button",{onClick:c=>S(c),className:"px-3 py-1.5 text-xs bg-pink-200 text-pink-700 rounded-md hover:bg-pink-300 transition-colors",children:"Next"})]})]})},gt=({selectedNodes:a,paramTestValues:n,selectedParams:r,totalCount:u,errorMessage:p,handlePrevious:x,handleStartGeneration:d,handleClose:h})=>{const[v,I]=y.useState([]),[S,k]=y.useState(null),[E,R]=y.useState(!1);De();const $=()=>{const O=Object.values(Z.graph._nodes_by_id),T=[],w=[];for(const D of O)D.type==="SaveImage"?T.push(D.id):D.type==="PreviewImage"&&w.push(D.id);const W=[...T,...w];I(W),W.length===1?k(W[0]):W.length>1&&(R(!0),k(null))};y.useEffect(()=>{$()},[]),y.useEffect(()=>{const O=()=>{if(!Z.canvas.selected_nodes)return;const T=Object.values(Z.canvas.selected_nodes);if(T.length===0)return;const w=T[0];w&&(w.type==="SaveImage"||w.type==="PreviewImage")&&(console.log("Selected image node:",w.id),k(w.id))};return document.addEventListener("click",O),()=>{document.removeEventListener("click",O)}},[]);const G=O=>{if(O&&(O.preventDefault(),O.stopPropagation()),v.length>1&&!S){R(!0);return}d(O,S||void 0)};return e.jsxs("div",{className:"bg-white rounded-lg shadow-sm border border-gray-200 p-4",children:[e.jsxs("div",{className:"mb-4 border-b pb-2 flex justify-between items-center",children:[e.jsxs("div",{children:[e.jsx("h3",{className:"text-base font-medium text-gray-800",children:"Confirm Test Configuration"}),e.jsxs("p",{className:"text-xs text-gray-500",children:["In the selected parameter combinations, there are ",u," total runs. Each run will generate a separate image."]})]}),e.jsx("button",{className:"text-gray-400 hover:text-gray-600",onClick:h,children:e.jsx("svg",{className:"w-4 h-4",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M6 18L18 6M6 6l12 12"})})})]}),E&&v.length>1&&e.jsx("div",{className:"mb-4 p-3 bg-yellow-50 border border-yellow-200 rounded-md text-amber-600 text-xs",children:e.jsxs("div",{className:"flex items-start",children:[e.jsx("div",{className:"flex-shrink-0 mt-0.5",children:e.jsx("svg",{className:"h-3 w-3",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"})})}),e.jsx("div",{className:"ml-2",children:S===null?`Multiple SaveImage and PreviewImage nodes detected with IDs ${v.join(",")}. Please click the node on canvas.`:`Current node ID is ${S}, please click Start Generation again`})]})}),p&&e.jsx("div",{className:"mb-4 p-3 bg-red-50 border border-red-200 rounded-md text-red-600 text-xs",children:e.jsxs("div",{className:"flex items-start",children:[e.jsx("div",{className:"flex-shrink-0 mt-0.5",children:e.jsx("svg",{className:"h-3 w-3",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"})})}),e.jsx("div",{className:"ml-2",children:p})]})}),a.length>0?a.map((O,T)=>{const w=O.type||"Unknown Node",W=O.widgets||[],D=O.id;return e.jsxs("div",{className:"border rounded-md mb-4 overflow-hidden",children:[e.jsxs("div",{className:"bg-gray-50 px-3 py-2 text-xs font-medium text-gray-700 border-b",children:[w," (ID: ",D,")"]}),e.jsx("div",{className:"p-4 space-y-3",children:W.map((c,C)=>{const H=c.name;if(!r[H])return null;const Q=n[D]?.[H]||[],g=Array.isArray(Q)?`[${Q.join(", ")}]`:JSON.stringify(Q);return e.jsxs("div",{className:CM.preventDefault()})})]},C)})})]},T)}):e.jsx("div",{className:"border rounded-md mb-4 p-4 text-center text-gray-500 text-xs",children:"No nodes selected. Please select a node in the workflow to configure parameters."}),e.jsxs("div",{className:"mt-6 flex justify-between",children:[e.jsx("button",{onClick:O=>x(O),className:"px-3 py-1.5 text-xs bg-gray-100 text-gray-800 rounded-md hover:bg-gray-200 transition-colors",children:"Previous"}),e.jsx("button",{onClick:O=>G(O),className:`px-3 py-1.5 text-xs rounded-md transition-colors ${v.length>1&&!S?"bg-gray-200 text-gray-500 cursor-not-allowed":"bg-pink-200 text-pink-700 hover:bg-pink-300"}`,disabled:v.length>1&&!S,children:"Start Generation"})]})]})},pt=({selectedNodes:a,paramTestValues:n,selectedParams:r,totalCount:u,completedCount:p,errorMessage:x,handleClose:d,setIsProcessing:h,setCurrentScreen:v,cleanupPolling:I})=>{const S=k=>{k.preventDefault(),k.stopPropagation(),at({clear:!0}),lt(),I&&I(),h(!1),v(2)};return e.jsxs("div",{className:"bg-white rounded-lg shadow-sm border border-gray-200 p-4 relative",children:[e.jsx("div",{className:"absolute inset-0 bg-gray-500 bg-opacity-30 flex flex-col items-center justify-center z-10",children:e.jsxs("div",{className:"text-center text-gray-800 bg-white p-4 rounded-lg shadow-lg",children:[e.jsx("div",{className:"mb-2 text-sm font-medium",children:"Processing..."}),e.jsxs("div",{className:"text-xs mb-3",children:["Completed ",p," of ",u," runs"]}),e.jsx("div",{className:"w-48 h-2 bg-gray-200 rounded-full overflow-hidden",children:e.jsx("div",{className:"h-full bg-pink-500 transition-all duration-200",style:{width:`${p/u*100}%`}})}),e.jsxs("div",{className:"mt-2 text-xs text-gray-600",children:["Already generated ",p," images"]}),e.jsx("button",{onClick:S,className:"mt-4 px-3 py-1.5 text-xs bg-gray-200 text-gray-800 rounded-md hover:bg-gray-300 transition-colors",children:"Cancel"})]})}),e.jsxs("div",{className:"mb-4 border-b pb-2 flex justify-between items-center",children:[e.jsxs("div",{children:[e.jsx("h3",{className:"text-base font-medium text-gray-800",children:"Confirm Test Configuration"}),e.jsxs("p",{className:"text-xs text-gray-500",children:["In the selected parameter combinations, there are ",u," total runs. Each run will generate a separate image."]})]}),e.jsx("button",{className:"text-gray-400 hover:text-gray-600",onClick:d,children:e.jsx("svg",{className:"w-4 h-4",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M6 18L18 6M6 6l12 12"})})})]}),x&&e.jsx("div",{className:"mb-4 p-3 bg-red-50 border border-red-200 rounded-md text-red-600 text-xs",children:e.jsxs("div",{className:"flex items-start",children:[e.jsx("div",{className:"flex-shrink-0 mt-0.5",children:e.jsx("svg",{className:"h-3 w-3",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"})})}),e.jsx("div",{className:"ml-2",children:x})]})}),a.length>0?a.map((k,E)=>{const R=k.type||"Unknown Node",$=k.widgets||[],G=k.id;return e.jsxs("div",{className:"border rounded-md mb-4 overflow-hidden",children:[e.jsxs("div",{className:"bg-gray-50 px-3 py-2 text-xs font-medium text-gray-700 border-b",children:[R," (ID: ",G,")"]}),e.jsx("div",{className:"p-4 space-y-3",children:$.map((O,T)=>{const w=O.name;if(!r[w])return null;const W=n[G]?.[w]||[],D=Array.isArray(W)?`[${W.join(", ")}]`:JSON.stringify(W);return e.jsxs("div",{className:T<$.length-1?"flex justify-between items-center border-b pb-2":"flex justify-between items-center",children:[e.jsx("label",{className:"font-medium text-gray-700",children:w}),e.jsx("div",{className:"flex space-x-2 items-center",children:e.jsx("input",{type:"text",className:"w-64 h-7 border border-gray-300 rounded text-sm px-2 bg-gray-50 cursor-not-allowed text-gray-500",readOnly:!0,disabled:!0,value:D,onClick:c=>c.preventDefault()})})]},T)})})]},E)}):e.jsx("div",{className:"border rounded-md mb-4 p-4 text-center text-gray-500",children:"No nodes selected. Please select a node in the workflow to configure parameters."})]})},ft=({generatedImages:a,selectedImageIndex:n,handleSelectImage:r,handleApplySelected:u,handlePrevious:p,handleClose:x,currentPage:d,handlePageChange:h,imagesPerPage:v,notificationVisible:I,modalVisible:S,modalImageUrl:k,openImageModal:E,closeImageModal:R})=>{const $=Math.ceil(a.length/v),G=(d-1)*v,O=Math.min(G+v,a.length),T=a.slice(G,O);return e.jsxs("div",{className:"bg-white rounded-lg shadow-sm border border-gray-200 p-4",children:[e.jsxs("div",{className:"mb-4 border-b pb-2 flex justify-between items-center",children:[e.jsxs("div",{children:[e.jsx("h3",{className:"text-base font-medium text-gray-800",children:"Generation Complete"}),e.jsxs("p",{className:"text-xs text-gray-500",children:["All ",a.length," images have been generated."]})]}),e.jsx("button",{className:"text-gray-400 hover:text-gray-600",onClick:x,children:e.jsx("svg",{className:"w-4 h-4",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M6 18L18 6M6 6l12 12"})})})]}),I&&e.jsx("div",{className:"fixed top-4 right-4 bg-green-100 border-l-4 border-green-500 text-green-700 p-3 shadow-md rounded animate-fade-in-out z-50",children:e.jsxs("div",{className:"flex items-center",children:[e.jsx("div",{className:"py-1",children:e.jsx("svg",{className:"h-4 w-4 text-green-500 mr-3",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M5 13l4 4L19 7"})})}),e.jsx("p",{className:"text-xs",children:"Parameters has been applied."})]})}),S&&e.jsx("div",{className:"fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50",onClick:R,children:e.jsxs("div",{className:"bg-white rounded-lg p-2 max-w-4xl max-h-[90vh] relative",onClick:w=>w.stopPropagation(),children:[e.jsx("button",{className:"absolute top-2 right-2 text-gray-700 hover:text-gray-900 rounded-full hover:bg-gray-200 p-1",onClick:R,children:e.jsx("svg",{className:"w-5 h-5",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M6 18L18 6M6 6l12 12"})})}),e.jsx("div",{className:"overflow-auto max-h-[calc(90vh-4rem)]",children:e.jsx("img",{src:k,alt:"Enlarged image",className:"max-w-full object-contain w-auto h-auto"})})]})}),e.jsx("div",{className:"grid grid-cols-3 gap-4 mb-6",children:T.map((w,W)=>{const D=G+W;return e.jsxs("div",{className:`relative rounded-lg overflow-hidden border ${n===D?"border-pink-500 ring-2 ring-pink-300":"border-gray-200"}`,onClick:c=>r(D,c),children:[e.jsx("button",{className:"absolute top-2 right-2 bg-white bg-opacity-75 rounded-full p-0.5 text-gray-600 hover:text-gray-900 shadow-sm z-10",onClick:c=>E(w.url,c),children:e.jsx("svg",{className:"w-3 h-3",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M4 8V4m0 0h4M4 4l5 5m11-1V4m0 0h-4m4 0l-5 5M4 16v4m0 0h4m-4 0l5-5m11 5v-4m0 4h-4m4 0l-5-5"})})}),e.jsx("div",{className:"aspect-square",children:e.jsx("img",{src:w.url,alt:`Generated image ${D+1}`,className:"w-full h-full object-cover"})}),e.jsx("div",{className:"p-2 text-xs text-gray-600 bg-white max-h-16 overflow-y-auto",children:Object.entries(w.params).filter(([c,C])=>c!=="nodeParams"&&typeof C!="object").map(([c,C])=>e.jsxs("div",{children:[c,": ",String(C)]},c))})]},D)})}),$>1&&e.jsxs("div",{className:"flex justify-center items-center space-x-2 mt-4 mb-4",children:[e.jsx("button",{onClick:w=>h(1,w),disabled:d===1,className:`px-2 py-1 rounded ${d===1?"text-gray-400 cursor-not-allowed":"text-gray-700 hover:bg-gray-100"}`,children:e.jsxs("svg",{xmlns:"http://www.w3.org/2000/svg",className:"h-5 w-5",viewBox:"0 0 20 20",fill:"currentColor",children:[e.jsx("path",{fillRule:"evenodd",d:"M15.707 15.707a1 1 0 01-1.414 0l-5-5a1 1 0 010-1.414l5-5a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 010 1.414z",clipRule:"evenodd"}),e.jsx("path",{fillRule:"evenodd",d:"M8.707 15.707a1 1 0 01-1.414 0l-5-5a1 1 0 010-1.414l5-5a1 1 0 111.414 1.414L4.414 10l4.293 4.293a1 1 0 010 1.414z",clipRule:"evenodd"})]})}),e.jsx("button",{onClick:w=>h(d-1,w),disabled:d===1,className:`px-2 py-1 rounded ${d===1?"text-gray-400 cursor-not-allowed":"text-gray-700 hover:bg-gray-100"}`,children:e.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",className:"h-5 w-5",viewBox:"0 0 20 20",fill:"currentColor",children:e.jsx("path",{fillRule:"evenodd",d:"M12.707 5.293a1 1 0 010 1.414L9.414 10l3.293 3.293a1 1 0 01-1.414 1.414l-4-4a1 1 0 010-1.414l4-4a1 1 0 011.414 0z",clipRule:"evenodd"})})}),e.jsxs("div",{className:"px-2 py-1 text-xs text-gray-800",children:["Page ",d," of ",$]}),e.jsx("button",{onClick:w=>h(d+1,w),disabled:d===$,className:`px-2 py-1 rounded ${d===$?"text-gray-400 cursor-not-allowed":"text-gray-700 hover:bg-gray-100"}`,children:e.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",className:"h-5 w-5",viewBox:"0 0 20 20",fill:"currentColor",children:e.jsx("path",{fillRule:"evenodd",d:"M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z",clipRule:"evenodd"})})}),e.jsx("button",{onClick:w=>h($,w),disabled:d===$,className:`px-2 py-1 rounded ${d===$?"text-gray-400 cursor-not-allowed":"text-gray-700 hover:bg-gray-100"}`,children:e.jsxs("svg",{xmlns:"http://www.w3.org/2000/svg",className:"h-5 w-5",viewBox:"0 0 20 20",fill:"currentColor",children:[e.jsx("path",{fillRule:"evenodd",d:"M4.293 15.707a1 1 0 001.414 0l5-5a1 1 0 000-1.414l-5-5a1 1 0 00-1.414 1.414L8.586 10 4.293 14.293a1 1 0 000 1.414z",clipRule:"evenodd"}),e.jsx("path",{fillRule:"evenodd",d:"M11.293 15.707a1 1 0 001.414 0l5-5a1 1 0 000-1.414l-5-5a1 1 0 00-1.414 1.414L15.586 10l-4.293 4.293a1 1 0 000 1.414z",clipRule:"evenodd"})]})})]}),e.jsxs("div",{className:"mt-6 flex justify-between",children:[e.jsx("button",{onClick:w=>p(w),className:"px-3 py-1.5 text-xs bg-gray-100 text-gray-800 rounded-md hover:bg-gray-200 transition-colors",children:"Previous"}),e.jsx("button",{onClick:w=>u(w),className:"px-3 py-1.5 text-xs bg-pink-200 text-pink-700 rounded-md hover:bg-pink-300 transition-colors",disabled:n===null,children:"Apply Selected"})]})]})},bt=({visible:a,aiWritingModalText:n,setAiWritingModalText:r,aiGeneratedTexts:u,aiSelectedTexts:p,aiWritingLoading:x,aiWritingError:d,handleAiWriting:h,toggleTextSelection:v,addSelectedTexts:I,onClose:S})=>a?e.jsx("div",{className:"fixed inset-0 bg-black flex items-center justify-center z-50",children:e.jsxs("div",{className:"bg-white dark:bg-gray-800 rounded-xl shadow-2xl w-full max-w-2xl max-h-[90vh] flex flex-col",children:[e.jsxs("div",{className:"p-4 border-b border-gray-200 dark:border-gray-700 flex justify-between items-center",children:[e.jsx("h3",{className:"text-lg font-semibold text-gray-900 dark:text-white",children:"AI Writing Assistant"}),e.jsx("button",{className:"text-gray-500 dark:text-gray-400 hover:text-gray-700 dark:hover:text-gray-200",onClick:S,children:e.jsx("svg",{className:"w-5 h-5",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M6 18L18 6M6 6l12 12"})})})]}),e.jsxs("div",{className:"p-4 overflow-y-auto flex-1",children:[e.jsxs("div",{className:"mb-4",children:[e.jsx("p",{className:"text-sm text-gray-700 dark:text-gray-300 mb-2",children:"Enter text and AI will generate variations"}),e.jsx("textarea",{className:`w-full px-4 py-3 border border-gray-200 dark:border-gray-600 rounded-lg text-gray-900 dark:text-white - bg-gray-50 dark:bg-gray-700 - placeholder-gray-500 dark:placeholder-gray-400 - focus:border-blue-500 dark:focus:border-blue-400 - focus:ring-2 focus:ring-blue-500/20 dark:focus:ring-blue-400/20 - focus:outline-none`,rows:3,placeholder:"Enter some text here...",value:n,onChange:k=>r(k.target.value)}),e.jsx("button",{className:`mt-2 px-4 py-2 rounded-lg text-sm flex items-center transition-colors ${x?"bg-gray-300 dark:bg-gray-600 text-gray-500 dark:text-gray-400 cursor-not-allowed":"bg-blue-600 hover:bg-blue-700 dark:bg-blue-500 dark:hover:bg-blue-600 text-white"}`,onClick:h,disabled:x,children:x?e.jsxs(e.Fragment,{children:[e.jsxs("svg",{className:"animate-spin -ml-1 mr-2 h-4 w-4 text-gray-500 dark:text-gray-400",xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24",children:[e.jsx("circle",{className:"opacity-25",cx:"12",cy:"12",r:"10",stroke:"currentColor",strokeWidth:"4"}),e.jsx("path",{className:"opacity-75",fill:"currentColor",d:"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"})]}),"Generating..."]}):e.jsx(e.Fragment,{children:"Generate"})})]}),d&&e.jsx("div",{className:"mb-4 p-3 bg-red-50 dark:bg-red-900/20 border border-red-200 dark:border-red-800/20 rounded-md text-red-700 dark:text-red-400 text-sm",children:d}),u.length>0&&e.jsxs("div",{className:"mb-4",children:[e.jsx("p",{className:"text-sm font-medium text-gray-700 dark:text-gray-300 mb-2",children:"Generated variations (select items to add):"}),e.jsx("div",{className:"space-y-2 max-h-[40vh] overflow-y-auto p-2",children:u.map((k,E)=>e.jsxs("div",{className:"flex items-start border border-gray-200 dark:border-gray-600 rounded-md p-2",children:[e.jsx("div",{className:"mr-2 mt-1",children:e.jsxs("div",{className:"relative",children:[e.jsx("input",{type:"checkbox",id:`text${E+1}`,checked:!!p[`text${E+1}`],onChange:()=>v(`text${E+1}`),className:"sr-only"}),e.jsx("div",{className:`h-4 w-4 rounded border ${p[`text${E+1}`]?"bg-blue-600 dark:bg-blue-500 border-blue-600 dark:border-blue-500":"border-gray-300 dark:border-gray-600"} flex items-center justify-center cursor-pointer`,onClick:()=>v(`text${E+1}`),children:p[`text${E+1}`]&&e.jsx("svg",{className:"h-3 w-3 text-white",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M5 13l4 4L19 7"})})})]})}),e.jsx("label",{htmlFor:`text${E+1}`,className:"text-sm text-gray-700 dark:text-gray-300 cursor-pointer flex-1",children:k})]},E))})]})]}),e.jsxs("div",{className:"p-4 border-t border-gray-200 dark:border-gray-700 flex justify-end flex-shrink-0",children:[e.jsx("button",{className:`px-5 py-2.5 text-gray-700 dark:text-gray-200 bg-white dark:bg-gray-800 hover:bg-gray-100 dark:hover:bg-gray-700 - rounded-lg font-medium transition-colors mr-3`,onClick:S,children:"Cancel"}),e.jsx("button",{className:`px-5 py-2.5 rounded-lg font-medium transition-colors ${Object.values(p).every(k=>!k)?"bg-gray-300 dark:bg-gray-600 text-gray-500 dark:text-gray-400 cursor-not-allowed":"bg-blue-600 hover:bg-blue-700 dark:bg-blue-500 dark:hover:bg-blue-600 text-white"}`,onClick:I,disabled:Object.values(p).every(k=>!k),children:"Add Selected"})]})]})}):null,Ce=a=>{const n=[],r={};if(Object.keys(a).forEach(x=>{const d=parseInt(x),h=a[x]||{},v=Object.keys(h).filter(S=>h[S]&&h[S].length>0);if(v.length===0)return;const I=[[]];v.forEach(S=>{const k=h[S],E=[];I.forEach(R=>{k.forEach($=>{const G=[...R,{nodeId:d,paramName:S,paramValue:String($)}];E.push(G)})}),I.length=0,I.push(...E)}),r[x]=I}),Object.keys(r).length===0)return n;if(Object.keys(r).length===1){const x=Object.keys(r)[0];return r[x]}const u=Object.keys(r);let p=r[u[0]];for(let x=1;x{d.forEach(I=>{h.push([...v,...I])})}),p=h}return p},yt=(a,n)=>{const r={};r.nodeParams={};const u=Ce(a);return n{const d=x.nodeId.toString(),h=x.paramName,v=x.paramValue;r.nodeParams[d]||(r.nodeParams[d]={}),r.nodeParams[d][h]=v,r[h]=v}),r},ye="parameter_debug_state",jt=` - @keyframes highlight-pulse { - 0% { - box-shadow: 0 0 0 0 rgba(59, 130, 246, 0.5); - } - 70% { - box-shadow: 0 0 0 15px rgba(59, 130, 246, 0); - } - 100% { - box-shadow: 0 0 0 0 rgba(59, 130, 246, 0); - } - } - - .highlight-pulse { - animation: highlight-pulse 1.5s infinite; - border: 2px solid #3b82f6; - } - - @keyframes fade-in-out { - 0% { opacity: 0; transform: translateY(-20px); } - 10% { opacity: 1; transform: translateY(0); } - 90% { opacity: 1; transform: translateY(0); } - 100% { opacity: 0; transform: translateY(-20px); } - } - - .animate-fade-in-out { - animation: fade-in-out 3s forwards; - } -`,Lt=({selectedNodes:a,visible:n,onClose:r})=>{const[u,p]=y.useState(0),[x,d]=y.useState({Steps:!0,CFG:!0,sampler_name:!0,threshold:!1,prompt:!1}),[h,v]=y.useState(ke()),[I,S]=y.useState(!1),[k,E]=y.useState(!1),[R,$]=y.useState(0),[G,O]=y.useState(12),[T,w]=y.useState(null),[W,D]=y.useState(()=>Array(12).fill(null).map((s,t)=>({url:`https://source.unsplash.com/random/300x300?sig=${Math.random()}`,params:{step:t%3===0?5:t%3===1?10:15,sampler_name:"euler",cfg:1}}))),[c,C]=y.useState({}),[H,Q]=y.useState({}),[g,M]=y.useState({}),[Y,m]=y.useState({}),[z,L]=y.useState(1),P=6,[A,F]=y.useState(null),[f,q]=y.useState(!1),[N,_]=y.useState(!1),[V,K]=y.useState(""),[B,J]=y.useState({}),[Te,xe]=y.useState(!1),[ne,je]=y.useState(""),[ve,me]=y.useState([]),[We,he]=y.useState(!1),[Se,Le]=y.useState(""),[Pe,Ie]=y.useState(""),[Ae,oe]=y.useState(null),[Me,ae]=y.useState({}),{dispatch:le}=De(),ge=y.useRef(null),ie=y.useRef(null),[Be,pe]=y.useState(()=>n),_e=s=>{try{localStorage.setItem(ye,JSON.stringify(s))}catch(t){console.error("Error saving parameter debug state:",t)}},Re=async()=>{if(!ne.trim()){oe("Please enter some text to generate variations");return}he(!0),oe(null),me([]),ae({});try{const s=await ue.generateSDPrompts(ne);me(s),ue.trackEvent({event_type:"prompt_generate",message_type:"parameter_debug",message_id:h,data:{input_text:ne,generated_texts:s}});const t={};s.forEach((i,o)=>{t[`text${o+1}`]=!1}),ae(t)}catch(s){console.error("Error generating text:",s),oe("Failed to generate text variations. Please try again.")}finally{he(!1)}},ze=(s,t,i,o)=>{const l=`${s}_${t}`;J(j=>{const U=[...j[l]||[]];return U[i]=o,{...j,[l]:U}});const b=[...B[l]||[]];b[i]=o,te(s,t,b)},Fe=(s,t)=>{const i=`${s}_${t}`;J(l=>{const b=[...l[i]||[]];return b.push(""),{...l,[i]:b}});const o=[...B[i]||[],""];te(s,t,o)},Ve=(s,t,i)=>{const o=`${s}_${t}`;J(b=>{const j=[...b[o]||[]];return j.splice(i,1),{...b,[o]:j}});const l=[...B[o]||[]];l.splice(i,1),te(s,t,l)},Ge=s=>{ae(t=>({...t,[s]:!t[s]}))},Ue=()=>{const s=`${Se}_${Pe}`,t=Object.entries(Me).filter(([o,l])=>l).map(([o])=>{const l=parseInt(o.replace("text",""))-1;return ve[l]});if(t.length===0)return;J(o=>{const l=[...o[s]||[]];return{...o,[s]:[...l,...t]}}),ue.trackEvent({event_type:"prompt_apply",message_type:"parameter_debug",message_id:h,data:{input_text:ne,generated_texts:ve,selected_texts:t}});const i=[...B[s]||[],...t];te(Se,Pe,i),xe(!1)},He=(s,t)=>{xe(!0),Le(s),Ie(t),je(""),me([]),ae({}),he(!1),oe(null)};y.useEffect(()=>{if(!a||a.length===0)return;const s={...c},t=a.map(o=>o.id.toString());Object.keys(s).forEach(o=>{t.includes(o)||delete s[o]}),a.forEach(o=>{const l=o.id.toString();s[l]||(s[l]={})}),JSON.stringify(s)!==JSON.stringify(c)&&C(s)},[a,c]),y.useEffect(()=>{le({type:"SET_SCREEN_STATE",payload:{currentScreen:u,isProcessing:I,isCompleted:k}})},[u,I,k,le]),y.useEffect(()=>{const s=document.createElement("style");return s.textContent=jt,document.head.appendChild(s),()=>{document.head.removeChild(s)}},[]),y.useEffect(()=>{const s=t=>{if(Object.values(H).some(i=>i)){const i=t.target,o=!!i.closest(".dropdown-menu"),l=!!i.closest("[data-dropdown]");!o&&!l&&Q({})}};return document.addEventListener("mousedown",s),()=>{document.removeEventListener("mousedown",s)}},[H]),y.useEffect(()=>{n&&(JSON.parse(localStorage.getItem(ye)||"{}").task_id||v(ke()))},[n]),y.useEffect(()=>{if(n){pe(!0);try{const s=localStorage.getItem(ye);if(s){const t=JSON.parse(s);if(!a||a.length===0){console.log("Not restoring parameter debug state: no nodes selected"),pe(!1);return}t.currentScreen!==void 0&&p(t.currentScreen),t.selectedParams&&d(t.selectedParams),t.task_id&&v(t.task_id);const i=t.generatedImages&&t.generatedImages.length>0;t.isProcessing!==void 0&&!t.isProcessing&&S(!1),t.isCompleted!==void 0&&i&&E(t.isCompleted),t.completedCount!==void 0&&$(t.completedCount),t.totalCount!==void 0&&O(t.totalCount),t.selectedImageIndex!==void 0&&w(t.selectedImageIndex),t.generatedImages&&D(t.generatedImages),t.paramTestValues&&C(t.paramTestValues),t.searchTerms&&M(t.searchTerms),t.inputValues&&m(t.inputValues),t.currentPage!==void 0&&L(t.currentPage),t.textInputs&&J(t.textInputs)}}catch(s){console.error("Error loading parameter debug state:",s)}finally{setTimeout(()=>{pe(!1)},50)}}else pe(!0);return()=>{if(!n)return;_e({currentScreen:u,selectedParams:x,task_id:h,isProcessing:I,isCompleted:k,completedCount:R,totalCount:G,selectedImageIndex:T,generatedImages:W,paramTestValues:c,searchTerms:g,inputValues:Y,currentPage:z,textInputs:B})}},[n]),y.useEffect(()=>{if(!n)return;const s=setTimeout(()=>{_e({currentScreen:u,selectedParams:x,task_id:h,isProcessing:I,isCompleted:k,completedCount:R,totalCount:G,selectedImageIndex:T,generatedImages:W,paramTestValues:c,searchTerms:g,inputValues:Y,currentPage:z,textInputs:B})},500);return()=>clearTimeout(s)},[n,u,x,h,I,k,R,G,T,W,c,g,Y,z,B]);const Ee=s=>{if(s&&(s.preventDefault(),s.stopPropagation()),u===0){const t={...c};Object.keys(t).forEach(i=>{const o=t[i];Object.keys(o).forEach(l=>{x[l]||delete o[l]})}),C(t)}if(u===1){const t={...c};a.forEach(o=>{const l=o.id.toString(),b=o.widgets||{};Object.values(b).forEach(j=>{const U=j.name;if(x[U]&&(j.type==="customtext"||j.type.toLowerCase().includes("text"))){const ee=`${l}_${U}`,se=B[ee]||[""];t[l]=t[l]||{},t[l][U]=se}})}),C(t);const i=Ce(t);O(i.length)}F(null),p(t=>Math.min(t+1,2))},we=s=>{if(s&&(s.preventDefault(),s.stopPropagation()),F(null),k&&E(!1),u===1){const t=a.map(l=>l.id.toString()),i=Object.keys(c),o={...c};i.forEach(l=>{t.includes(l)||delete o[l]}),C(o)}if(u===2||k){const t={...c};Object.entries(B).forEach(([i,o])=>{if(!o||o.length===0)return;const[l,b]=i.split("_");a.some(j=>j.id.toString()===l)&&(t[l]=t[l]||{},JSON.stringify(t[l][b])!==JSON.stringify(o)&&(t[l][b]=o))}),C(t)}p(t=>Math.max(t-1,0))},qe=(s,t)=>{t&&(t.preventDefault(),t.stopPropagation());const i=x[s];if(d(o=>({...o,[s]:!i})),i){const o={...c};Object.keys(o).forEach(l=>{o[l][s]&&delete o[l][s]}),C(o)}},Je=(s,t,i)=>{i.preventDefault(),i.stopPropagation();const o=`${s}_${t}`;Q(l=>{if(l[o]&&typeof l[o]=="object"?l[o].isOpen:!!l[o])return{...l,[o]:!1};{let j=0,U=0;if(i.currentTarget){const de=i.currentTarget.getBoundingClientRect();j=de.left,U=de.bottom}else j=i.clientX,U=i.clientY+20;const ee=window.innerWidth,se=250;return j+se>ee&&(j=ee-se-10),j<0&&(j=10),{...l,[o]:{isOpen:!0,x:j,y:U}}}})},te=(s,t,i)=>{C(o=>{const l={...o};return l[s]||(l[s]={}),l[s][t]=i,l})},Ke=(s,t,i,o)=>{o&&(o.preventDefault(),o.stopPropagation()),C(l=>{const b={...l};b[s]||(b[s]={}),b[s][t]||(b[s][t]=[]);const j=b[s][t];return j.includes(i)?b[s][t]=j.filter(U=>U!==i):b[s][t]=[...j,i],b})},Ye=(s,t,i)=>{const o=`${s}_${t}`;M(l=>({...l,[o]:i}))},Qe=(s,t,i)=>{if(!c[s]){te(s,t,i);return}const o=c[s][t]||[];i.length===o.length?te(s,t,[]):te(s,t,[...i])},Xe=(s,t)=>{t&&(t.preventDefault(),t.stopPropagation()),L(Math.max(1,Math.min(s,Math.ceil(W.length/P))))},fe=()=>{ge.current&&(clearTimeout(ge.current),ge.current=null),ie.current=null};y.useEffect(()=>()=>{fe()},[]);const Ze=async(s,t)=>{s&&(s.preventDefault(),s.stopPropagation()),fe();const i=Ce(c),o=i.length;if(o>100){F(`Cannot generate more than 100 images at once (currently: ${o} images)`);return}if(F(null),S(!0),$(0),console.log("Generated parameter combinations:",i),ue.trackEvent({event_type:"start_generation",message_type:"parameter_debug",message_id:h,data:{workflow:(await Z.graphToPrompt()).output,all_params:c,count:o}}),i.length===0){F("No valid parameter combinations found. Please check your parameter selections."),S(!1);return}let l=t||null;if(l===null){const j=ut();j!==null&&(l=j)}if(l===null){F("Please select a SaveImage or PreviewImage node first."),S(!1);return}const b=[];try{const j=Date.now().toString();ie.current=j;for(const re of i){const X=await ct(re);X.prompt_id?b.push(X.prompt_id):(console.error("Failed to get prompt_id from response:",X),b.push(""))}const U=Array(i.length).fill(null).map((re,X)=>({url:`https://source.unsplash.com/random/300x300?sig=${Math.random()}`,params:yt(c,X)}));D(U);const ee=Date.now(),se=5*60*1e3,de=async()=>{if(ie.current!==j){console.log("Another polling session has started, stopping this one");return}if(Date.now()-ee>se){console.log("Timeout reached while waiting for images"),ie.current===j&&(S(!1),E(!0),L(1));return}let re=0;for(let X=0;X{t&&(t.preventDefault(),t.stopPropagation()),w(s)},tt=(s,t)=>{t.preventDefault(),t.stopPropagation(),K(s),_(!0)},st=s=>{s&&(s.preventDefault(),s.stopPropagation()),_(!1)},rt=async s=>{if(s&&(s.preventDefault(),s.stopPropagation()),T!==null){console.log(`Applied image ${T+1} with parameters:`,W[T].params);let t=1;if(c){for(const o in c)if(c[o])for(const l in c[o]){const b=c[o][l];if(b){let j=1;Array.isArray(b)?j=b.length>0?b.length:1:typeof b=="object"&&b!==null&&(j=Object.keys(b).length>0?Object.keys(b).length:1),t=t*j}}}ue.trackEvent({event_type:"parameter_debug_apply",message_type:"parameter_debug",message_id:h,data:{workflow:(await Z.graphToPrompt()).output,selected_params:W[T].params,all_params:c,count:t}});const i=W[T].params;i.nodeParams&&(Object.entries(i.nodeParams).forEach(([o,l])=>{const b=Z.graph._nodes_by_id[o];!b||!b.widgets||Object.entries(l).forEach(([j,U])=>{for(const ee of b.widgets)if(ee.name===j){ee.value=U;break}})}),Z.graph.setDirtyCanvas(!1,!0),q(!0),setTimeout(()=>{q(!1)},3e3))}},ce=(s,t)=>{if(s&&(s.preventDefault(),s.stopPropagation()),u===1&&t!==void 0){const i=[...a],o=i[t];if(i.splice(t,1),o){const l=o.id.toString();C(b=>{const j={...b};return delete j[l],j})}i.length===0?r&&(le({type:"SET_SCREEN_STATE",payload:null}),$e(!0),r()):le({type:"SET_SELECTED_NODE",payload:i});return}r&&(le({type:"SET_SCREEN_STATE",payload:null}),$e(!0),r())},$e=(s=!1)=>{p(0),d({Steps:!0,CFG:!0,sampler_name:!0,threshold:!1,prompt:!1}),v(ke()),fe(),S(!1),E(!1),$(0),O(12),w(null),D(Array(12).fill(null).map((t,i)=>({url:`https://source.unsplash.com/random/300x300?sig=${Math.random()}`,params:{step:i%3===0?5:i%3===1?10:15,sampler_name:"euler",cfg:1}}))),C({}),Q({}),M({}),m({}),L(1),F(null),q(!1),_(!1),K(""),J({}),xe(!1),je(""),me([]),he(!1),Le(""),Ie(""),oe(null),ae({}),s&&localStorage.removeItem(ye)};return Be&&n&&a.length>0?e.jsx("div",{className:"flex-1 flex flex-col items-center justify-center p-8 bg-gray-50 overflow-y-auto",onClick:s=>s.stopPropagation(),children:e.jsxs("div",{className:"p-8 rounded-lg shadow-sm relative flex flex-col items-center",children:[e.jsx("div",{className:"w-8 h-8 border-4 border-blue-500 border-t-transparent rounded-full animate-spin"}),e.jsx("div",{className:"mt-4 text-gray-600 text-sm",children:"Loading interface..."})]})}):!n||a.length===0?e.jsx("div",{className:"flex-1 flex flex-col items-center justify-center p-8 bg-gray-50 overflow-y-auto",onClick:s=>s.stopPropagation(),children:e.jsxs("div",{className:"max-w-lg p-8 rounded-lg shadow-sm border border-blue-100 relative",children:[e.jsxs("div",{className:"mb-6 text-center",children:[e.jsx("h3",{className:"text-base font-bold text-blue-800 mb-2",children:"GenLab"}),e.jsx("div",{className:"h-1 w-16 bg-blue-500 mx-auto rounded-full mb-4"})]}),e.jsxs("div",{className:"space-y-4",children:[e.jsxs("div",{className:"flex items-start space-x-3",children:[e.jsx("div",{className:"bg-blue-100 p-2 rounded-full text-blue-600",children:e.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",className:"h-4 w-4",viewBox:"0 0 20 20",fill:"currentColor",children:e.jsx("path",{d:"M5 3a2 2 0 00-2 2v2a2 2 0 002 2h2a2 2 0 002-2V5a2 2 0 00-2-2H5zM5 11a2 2 0 00-2 2v2a2 2 0 002 2h2a2 2 0 002-2v-2a2 2 0 00-2-2H5zM11 5a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2V5zM11 13a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2v-2z"})})}),e.jsxs("div",{children:[e.jsx("h4",{className:"text-sm font-medium text-gray-800",children:"Batch Test Parameter Pairs"}),e.jsx("p",{className:"text-xs text-gray-600",children:"Select a node to batch test parameter pairs"})]})]}),e.jsxs("div",{className:"flex items-start space-x-3",children:[e.jsx("div",{className:"bg-indigo-100 p-2 rounded-full text-indigo-600",children:e.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",className:"h-4 w-4",viewBox:"0 0 20 20",fill:"currentColor",children:e.jsx("path",{fillRule:"evenodd",d:"M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a1 1 0 000 2v3a1 1 0 001 1h1a1 1 0 100-2v-3a1 1 0 00-1-1H9z",clipRule:"evenodd"})})}),e.jsxs("div",{children:[e.jsx("h4",{className:"text-sm font-medium text-gray-800",children:"How To Use"}),e.jsx("p",{className:"text-xs text-gray-600",children:"Click on any node in your workflow to start the parameter testing process"})]})]}),e.jsx("div",{className:"mt-6 text-center",children:e.jsx("p",{className:"text-xs text-gray-600 mb-3",children:"No node is currently selected"})})]})]})}):k?e.jsx("div",{className:"flex-1 overflow-y-auto bg-gray-50 p-4",onClick:s=>s.stopPropagation(),children:e.jsx(ft,{generatedImages:W,selectedImageIndex:T,handleSelectImage:et,handleApplySelected:rt,handlePrevious:we,handleClose:ce,currentPage:z,handlePageChange:Xe,imagesPerPage:P,notificationVisible:f,modalVisible:N,modalImageUrl:V,openImageModal:tt,closeImageModal:st})}):I?e.jsx("div",{className:"flex-1 overflow-y-auto bg-gray-50 p-4",onClick:s=>s.stopPropagation(),children:e.jsx(pt,{selectedNodes:a,paramTestValues:c,selectedParams:x,totalCount:G,completedCount:R,errorMessage:A,handleClose:ce,setIsProcessing:S,setCurrentScreen:p,cleanupPolling:fe})}):u===0?e.jsx("div",{className:"flex-1 overflow-y-auto bg-gray-50 p-4 flex flex-col h-full max-h-[80vh]",onClick:s=>s.stopPropagation(),children:e.jsx(mt,{selectedNodes:a,handleParamSelect:qe,selectedParams:x,handleNext:Ee,handleClose:ce})}):u===1?e.jsxs("div",{className:"flex-1 overflow-y-auto bg-gray-50 p-4 flex flex-col h-full max-h-[80vh]",onClick:s=>s.stopPropagation(),children:[e.jsx(ht,{selectedNodes:a,paramTestValues:c,selectedParams:x,updateParamTestValues:te,toggleDropdown:Je,openDropdowns:H,handleTestValueSelect:Ke,searchTerms:g,handleSearch:Ye,handleSelectAll:Qe,handleNext:Ee,handlePrevious:we,handleClose:ce,inputValues:Y,setInputValues:m,textInputs:B,handleTextInputChange:ze,handleAddTextInput:Fe,handleRemoveTextInput:Ve,openAiWritingModal:He}),e.jsx(bt,{visible:Te,aiWritingModalText:ne,setAiWritingModalText:je,aiGeneratedTexts:ve,aiSelectedTexts:Me,aiWritingLoading:We,aiWritingError:Ae,handleAiWriting:Re,toggleTextSelection:Ge,addSelectedTexts:Ue,onClose:()=>xe(!1)})]}):e.jsx("div",{className:"flex-1 overflow-y-auto bg-gray-50 p-4 flex flex-col h-full max-h-[80vh]",onClick:s=>s.stopPropagation(),children:e.jsx(gt,{selectedNodes:a,paramTestValues:c,selectedParams:x,totalCount:G,errorMessage:A,handlePrevious:we,handleStartGeneration:Ze,handleClose:ce})})};export{Lt as ParameterDebugInterface}; diff --git a/dist/copilot_web/ParameterDebugInterfaceV2-CiC0RieE.js b/dist/copilot_web/ParameterDebugInterfaceV2-CiC0RieE.js new file mode 100644 index 0000000..1ed49db --- /dev/null +++ b/dist/copilot_web/ParameterDebugInterfaceV2-CiC0RieE.js @@ -0,0 +1,35 @@ +import{j as e}from"./vendor-markdown-Dek94WS0.js";import{r as w}from"./vendor-react-V04_Axys.js";import{u as ve,a as q,g as ie,W as se}from"./message-components-DHkIj9qD.js";import{m as ht,i as gt,r as pt,g as ft}from"./workflowChat-DP_exkAV.js";import"./input.js";/* empty css */const bt=({selectedNodes:t,handleParamSelect:r,selectedParams:s,handleNext:l,handleClose:a})=>{const n=t.flatMap(i=>(i.widgets||[]).map(d=>d.name)).some(i=>s[i]===!0);return e.jsxs("div",{className:"bg-white rounded-lg shadow-sm border border-gray-200 p-4",children:[e.jsxs("div",{className:"mb-4 border-b pb-2 flex justify-between items-center",children:[e.jsxs("div",{children:[e.jsx("h3",{className:"text-base font-medium text-gray-800",children:"Select parameters"}),e.jsx("p",{className:"text-xs text-gray-500",children:"multiple selections supported"})]}),e.jsx("button",{className:"text-gray-400 hover:text-gray-600",onClick:a,children:e.jsx("svg",{className:"w-4 h-4",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M6 18L18 6M6 6l12 12"})})})]}),t.map((i,d)=>{const m=i.title||"Unknown Node",u=i.widgets||[];return e.jsxs("div",{className:"border rounded-md mb-4 overflow-hidden",children:[e.jsx("div",{className:"bg-gray-50 px-3 py-2 text-sm font-medium text-gray-700 border-b",children:m}),e.jsx("div",{className:"p-4 space-y-3",children:e.jsx("div",{className:"flex items-center gap-3 flex-wrap",children:u.map((x,f)=>{const b=x.name;return e.jsxs("div",{className:"flex items-center",children:[e.jsx("div",{className:`w-5 h-5 rounded-full border flex items-center justify-center ${s[b]?"border-red-500 bg-red-100":"border-gray-300"}`,onClick:y=>r(b,y),children:s[b]&&e.jsx("div",{className:"w-3 h-3 rounded-full bg-red-500"})}),e.jsx("span",{className:"ml-2 text-gray-700 text-xs",children:b})]},`widget-${f}`)})})})]},`node-${d}`)}),e.jsx("div",{className:"mt-6 flex justify-center",children:e.jsx("button",{onClick:i=>l(i),disabled:!n,className:`px-3 py-1.5 text-xs ${n?"bg-pink-200 text-pink-700 hover:bg-pink-300":"bg-gray-200 text-gray-500 cursor-not-allowed"} rounded-md transition-colors`,children:"Next"})})]})},yt=({selectedNodes:t,paramTestValues:r,selectedParams:s,updateParamTestValues:l,toggleDropdown:a,openDropdowns:o,handleTestValueSelect:n,searchTerms:i,handleSearch:d,handleSelectAll:m,handleNext:u,handlePrevious:x,handleClose:f,inputValues:b,setInputValues:y,textInputs:N,handleTextInputChange:k,handleAddTextInput:$,handleRemoveTextInput:P,openAiWritingModal:g})=>{const C=(p,M,B,G=0)=>{if(p=isNaN(p)?0:p,M=isNaN(M)?100:M,B=isNaN(B)||B<=0?1:B,M{!t||t.length===0||t.forEach(p=>{const M=p.id.toString(),B=p.widgets||{};Object.values(B).forEach(j=>{const E=j.name;if(!s[E])return;if(!(r[M]?.[E]?.length>0)&&j.type==="number"){const v=j.options?.min||0,W=j.options?.max||100;let I=(j.options?.step||10)/10;I<.1&&(I=.1);const _=j.options?.precision||0,T=C(v,W,I,_);if(T.length>0){l(M,E,T);const z=`${M}_${E}`;y(S=>({...S,[z]:{min:v.toString(),max:W.toString(),step:I.toString()}}))}}if(j.type==="customtext"||j.type.toLowerCase().includes("text")){const v=`${M}_${E}`,W=N[v]||[""];JSON.stringify(W)!==JSON.stringify(r[M]?.[E]||[""])&&l(M,E,W)}})})},[t,s,r,N,l,y,C]),e.jsxs("div",{className:"bg-white rounded-lg shadow-sm border border-gray-200 p-4",children:[e.jsxs("div",{className:"mb-4 border-b pb-2 flex justify-between items-center",children:[e.jsxs("div",{children:[e.jsx("h3",{className:"text-base font-medium text-gray-800",children:"Set test values"}),e.jsx("p",{className:"text-xs text-gray-500",children:"Configure the test values for each parameter"})]}),e.jsx("button",{className:"text-gray-400 hover:text-gray-600",onClick:f,children:e.jsx("svg",{className:"w-4 h-4",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M6 18L18 6M6 6l12 12"})})})]}),t.length>0?t.map((p,M)=>{const B=p.widgets||{},G=Object.values(B),j=p.id;return e.jsxs("div",{className:"border rounded-md mb-4 overflow-hidden",children:[e.jsxs("div",{className:"bg-gray-50 px-3 py-2 text-xs font-medium text-gray-700 border-b flex justify-between items-center",children:[e.jsxs("span",{children:[p.type," (ID: ",j,")"]}),e.jsx("button",{className:"text-gray-400 hover:text-gray-600",onClick:E=>f(E,M),children:e.jsx("svg",{className:"w-3 h-3",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M6 18L18 6M6 6l12 12"})})})]}),e.jsx("div",{className:"p-4 space-y-4",children:G.map((E,R)=>{const v=E.name;if(!s[v])return null;const W=`${j}_${v}`;if(E.type==="customtext"||E.type.toLowerCase().includes("text")){const I=N[W]||[""];return e.jsxs("div",{className:"border-b pb-3",children:[e.jsxs("div",{className:"flex justify-between items-center mb-2",children:[e.jsxs("label",{className:"text-xs font-medium text-gray-700",children:[v,":"]}),e.jsxs("button",{className:"px-2 py-1 bg-blue-100 text-blue-700 rounded text-xs flex items-center hover:bg-blue-200 transition-colors",onClick:()=>g(j,v),children:[e.jsx("svg",{className:"w-3 h-3 mr-1",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M15.232 5.232l3.536 3.536m-2.036-5.036a2.5 2.5 0 113.536 3.536L6.5 21.036H3v-3.572L16.732 3.732z"})}),"AI Writing"]})]}),e.jsx("div",{className:"space-y-2",children:I.map((_,T)=>e.jsxs("div",{className:"flex items-start",children:[e.jsx("textarea",{className:`flex-1 border ${_?"border-gray-300":"border-red-500"} rounded p-2 text-xs resize-y`,rows:2,placeholder:"Enter text...",value:_,onChange:z=>k(j,v,T,z.target.value),required:!0}),e.jsx("button",{className:"ml-2 text-red-500 hover:text-red-700",onClick:()=>P(j,v,T),title:"Remove",children:e.jsx("svg",{className:"w-4 h-4",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M6 18L18 6M6 6l12 12"})})})]},T))}),e.jsxs("button",{className:"mt-2 px-2 py-1 border border-dashed border-gray-300 rounded text-xs text-gray-600 hover:bg-gray-50 flex items-center",onClick:()=>$(j,v),children:[e.jsx("svg",{className:"w-3 h-3 mr-1",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M12 6v6m0 0v6m0-6h6m-6 0H6"})}),"Add Text"]})]},R)}if(E.type==="number"){const I=E.options?.min||0,_=E.options?.max||100,T=(E.options?.step||10)/10,z=E.options?.precision||0,S=C(I,_,T,z),F=b[W]||{min:I.toString(),max:_.toString(),step:T.toString()};return e.jsxs("div",{className:"border-b pb-3",children:[e.jsxs("div",{className:"flex justify-between items-center",children:[e.jsxs("label",{className:"text-xs font-medium text-gray-700",children:[v,":"]}),e.jsx("div",{className:"w-4"})]}),e.jsxs("div",{className:"flex space-x-2 items-center",children:[e.jsx("label",{className:"text-xs text-gray-600",children:"Min"}),e.jsx("input",{type:"text",className:"w-12 h-6 border border-gray-300 rounded text-xs px-2",value:F.min,required:!0,onClick:L=>{L.preventDefault(),L.stopPropagation()},onChange:L=>{L.preventDefault(),L.stopPropagation();const O=L.target.value;if(y(D=>({...D,[W]:{...D[W],min:O}})),O===""||!isNaN(parseFloat(O))){const D=O===""?0:parseFloat(O),H=parseFloat(F.max||_.toString()),U=parseFloat(F.step||T.toString()),J=C(D,H,U,z);l(j,v,J)}}}),e.jsx("label",{className:"text-xs text-gray-600",children:"Max"}),e.jsx("input",{type:"text",className:"w-12 h-6 border border-gray-300 rounded text-xs px-2",value:F.max,onClick:L=>{L.preventDefault(),L.stopPropagation()},required:!0,onChange:L=>{L.preventDefault(),L.stopPropagation();const O=L.target.value;if(y(D=>({...D,[W]:{...D[W],max:O}})),O===""||!isNaN(parseFloat(O))){const D=parseFloat(F.min||I.toString()),H=O===""?D:parseFloat(O),U=parseFloat(F.step||T.toString()),J=C(D,H,U,z);l(j,v,J)}}}),e.jsx("label",{className:"text-xs text-gray-600",children:"Step"}),e.jsx("input",{type:"text",className:"w-12 h-6 border border-gray-300 rounded text-xs px-2",value:F.step,required:!0,onClick:L=>{L.preventDefault(),L.stopPropagation()},onChange:L=>{L.preventDefault(),L.stopPropagation();const O=L.target.value;if(y(D=>({...D,[W]:{...D[W],step:O}})),O===""||!isNaN(parseFloat(O))&&parseFloat(O)>0){const D=parseFloat(F.min||I.toString()),H=parseFloat(F.max||_.toString());let U=O===""?1:parseFloat(O);U<.1&&(U=.1);const J=C(D,H,U,z);l(j,v,J)}}})]}),e.jsxs("div",{className:"mt-1",children:[e.jsx("label",{className:"text-xs text-gray-600",children:"Test values"}),e.jsx("div",{className:"mt-1 flex flex-wrap gap-1",children:(()=>{const L=r[j]?.[v]||S;if(L.length<=10)return L.map((O,D)=>e.jsxs("div",{className:"px-2 py-0.5 bg-blue-100 text-blue-800 rounded-md flex items-center text-xs cursor-pointer hover:bg-blue-200",onClick:H=>{H.stopPropagation(),n(j,v,O,H)},children:[e.jsx("span",{children:O}),e.jsx("svg",{className:"w-4 h-4 ml-1",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M6 18L18 6M6 6l12 12"})})]},D));{const O=L.slice(0,5),D=L.slice(L.length-5);return e.jsxs(e.Fragment,{children:[O.map((H,U)=>e.jsxs("div",{className:"px-2 py-0.5 bg-blue-100 text-blue-800 rounded-md flex items-center text-xs cursor-pointer hover:bg-blue-200",onClick:J=>{J.stopPropagation(),n(j,v,H,J)},children:[e.jsx("span",{children:H}),e.jsx("svg",{className:"w-4 h-4 ml-1",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M6 18L18 6M6 6l12 12"})})]},`first-${U}`)),e.jsx("div",{className:"px-2 py-0.5 bg-gray-100 text-gray-600 rounded-md flex items-center text-xs",children:"..."}),D.map((H,U)=>e.jsxs("div",{className:"px-2 py-0.5 bg-blue-100 text-blue-800 rounded-md flex items-center text-xs cursor-pointer hover:bg-blue-200",onClick:J=>{J.stopPropagation(),n(j,v,H,J)},children:[e.jsx("span",{children:H}),e.jsx("svg",{className:"w-4 h-4 ml-1",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M6 18L18 6M6 6l12 12"})})]},`last-${U}`))]})}})()})]}),e.jsx("div",{className:"mt-1",children:e.jsx("p",{className:"text-xs text-gray-500",children:"Values are distributed evenly between Min and Max"})})]},R)}else if(E.type==="combo"){const I=E.options?.values||[],_=`${j}_${v}`,T=S=>typeof S=="string"?S:S&&typeof S=="object"&&"name"in S?S.name:String(S),z=S=>typeof S=="object"&&S!==null&&"name"in S?S.name:S;return e.jsxs("div",{className:"border-b pb-3",children:[e.jsxs("div",{className:"flex justify-between items-center",children:[e.jsx("label",{className:"text-xs font-medium text-gray-700",children:v}),e.jsxs("div",{className:"relative dropdown-container",children:[e.jsxs("button",{className:`appearance-none border ${(r[j]?.[v]||[]).length===0?"border-red-500":"border-gray-300"} rounded px-2 py-0.5 pr-6 text-xs flex items-center bg-white text-gray-700`,onClick:S=>{S.preventDefault(),S.stopPropagation(),a(j,v,S)},"data-dropdown":_,children:[e.jsx("span",{children:(r[j]?.[v]||[]).length>0?`${v}: ${(r[j]?.[v]||[]).length} selected`:`Select ${v}`}),e.jsx("div",{className:"ml-2",children:e.jsx("svg",{className:"fill-current h-4 w-4",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 20 20",children:e.jsx("path",{d:"M9.293 12.95l.707.707L15.657 8l-1.414-1.414L10 10.828 5.757 6.586 4.343 8z"})})})]}),o[_]&&e.jsxs("div",{className:"absolute z-[9999] mt-1 w-64 bg-white border border-gray-300 rounded-md shadow-lg dropdown-menu",style:{position:"fixed",top:typeof o[_]=="object"?`${o[_].y}px`:"0px",left:typeof o[_]=="object"?`${o[_].x}px`:"0px",maxHeight:"300px",overflowY:"auto"},children:[e.jsx("div",{className:"p-2 border-b sticky top-0 bg-white",children:e.jsx("input",{type:"text",className:"w-full px-2 py-0.5 text-xs border border-gray-300 rounded",placeholder:"Search...",value:i[_]||"",onChange:S=>{S.preventDefault(),S.stopPropagation(),d(j,v,S.target.value)},onClick:S=>{S.preventDefault(),S.stopPropagation()},autoFocus:!0})}),e.jsxs("div",{className:"px-3 py-1.5 bg-gray-50 border-b cursor-pointer text-xs flex items-center text-gray-700 hover:bg-gray-100",onClick:S=>{S.preventDefault(),S.stopPropagation();const L=I.filter(O=>!i[_]||T(O).toLowerCase().includes((i[_]||"").toLowerCase())).map(z);m(j,v,L)},children:[e.jsx("div",{className:`w-4 h-4 mr-2 border rounded-sm flex items-center justify-center ${I.length>0&&(r[j]?.[v]||[]).length===I.length?"bg-blue-500 border-blue-500":(r[j]?.[v]||[]).length>0?"bg-blue-500 border-blue-500 opacity-50":"border-gray-300"}`,children:(r[j]?.[v]||[]).length>0&&e.jsx("svg",{className:"w-3 h-3 text-white",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M5 13l4 4L19 7"})})}),e.jsx("span",{className:"font-medium",children:I.length>0&&(r[j]?.[v]||[]).length===I.length?"Deselect All":"Select All"})]}),e.jsxs("div",{className:"max-h-60 overflow-y-auto",children:[I.filter(S=>!i[_]||T(S).toLowerCase().includes((i[_]||"").toLowerCase())).map((S,F)=>e.jsxs("div",{className:"px-3 py-1.5 hover:bg-gray-100 cursor-pointer text-xs flex items-center text-gray-700",onClick:L=>{L.preventDefault(),L.stopPropagation(),n(j,v,z(S),L)},children:[e.jsx("div",{className:`w-4 h-4 mr-2 border rounded-sm flex items-center justify-center ${(r[j]?.[v]||[]).includes(z(S))?"bg-blue-500 border-blue-500":"border-gray-300"}`,children:(r[j]?.[v]||[]).includes(z(S))&&e.jsx("svg",{className:"w-3 h-3 text-white",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M5 13l4 4L19 7"})})}),e.jsx("span",{className:"whitespace-normal overflow-hidden text-ellipsis",children:T(S)})]},F)),I.filter(S=>!i[_]||T(S).toLowerCase().includes((i[_]||"").toLowerCase())).length===0&&e.jsx("div",{className:"px-3 py-4 text-sm text-gray-500 text-center",children:"No matching options"})]})]})]})]}),e.jsxs("div",{className:"mt-2",children:[e.jsx("label",{className:"text-xs text-gray-600",children:"Test values"}),(r[j]?.[v]||[]).length===0&&e.jsx("div",{className:"text-xs text-red-500 mt-1",children:"Please select at least one value"}),e.jsx("div",{className:"mt-1 flex flex-wrap gap-1",children:(r[j]?.[v]||[]).map((S,F)=>e.jsxs("div",{className:"px-2 py-0.5 bg-blue-100 text-blue-800 rounded-md flex items-center text-xs",children:[e.jsx("span",{children:S}),e.jsx("svg",{className:"w-4 h-4 ml-1 cursor-pointer hover:text-blue-600",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",onClick:L=>{L.preventDefault(),L.stopPropagation(),n(j,v,S,L)},children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M6 18L18 6M6 6l12 12"})})]},F))})]})]},R)}else return e.jsxs("div",{className:"border-b pb-3",children:[e.jsx("div",{className:"flex justify-between items-center",children:e.jsx("label",{className:"text-xs font-medium text-gray-700",children:v})}),e.jsxs("div",{className:"mt-2",children:[e.jsx("label",{className:"text-xs text-gray-600",children:"Test values"}),e.jsxs("div",{className:"mt-1 flex flex-wrap gap-1",children:[(r[j]?.[v]||[]).map((I,_)=>e.jsxs("div",{className:"px-2 py-0.5 bg-blue-100 text-blue-800 rounded-md flex items-center text-xs",children:[e.jsx("span",{children:I}),e.jsx("svg",{className:"w-4 h-4 ml-1 cursor-pointer hover:text-blue-600",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",onClick:T=>{T.preventDefault(),T.stopPropagation(),n(j,v,I,T)},children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M6 18L18 6M6 6l12 12"})})]},_)),e.jsxs("button",{className:"px-2 py-0.5 border border-dashed border-blue-300 text-blue-600 rounded-md text-xs flex items-center hover:bg-blue-50",onClick:I=>{I.preventDefault(),I.stopPropagation();const _=`${v}${(r[j]?.[v]||[]).length+1}`;l(j,v,[...r[j]?.[v]||[],_])},children:[e.jsx("svg",{className:"w-4 h-4 mr-1",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M12 6v6m0 0v6m0-6h6m-6 0H6"})}),e.jsx("span",{children:"Add"})]})]})]})]},R)})})]},M)}):e.jsx("div",{className:"border rounded-md mb-4 p-4 text-center text-gray-500",children:"No nodes selected. Please select a node in the workflow to configure parameters."}),e.jsxs("div",{className:"mt-6 flex justify-between",children:[e.jsx("button",{onClick:p=>x(p),className:"px-3 py-1.5 text-xs bg-gray-100 text-gray-800 rounded-md hover:bg-gray-200 transition-colors",children:"Previous"}),e.jsx("button",{onClick:p=>u(p),className:"px-3 py-1.5 text-xs bg-pink-200 text-pink-700 rounded-md hover:bg-pink-300 transition-colors",children:"Next"})]})]})},jt=({selectedNodes:t,paramTestValues:r,selectedParams:s,totalCount:l,errorMessage:a,handlePrevious:o,handleStartGeneration:n,handleClose:i})=>{const[d,m]=w.useState([]),[u,x]=w.useState(null),[f,b]=w.useState(!1);ve();const y=()=>{const k=Object.values(q.graph._nodes_by_id),$=[],P=[];for(const C of k)C.type==="SaveImage"?$.push(C.id):C.type==="PreviewImage"&&P.push(C.id);const g=[...$,...P];m(g),g.length===1?x(g[0]):g.length>1&&(b(!0),x(null))};w.useEffect(()=>{y()},[]),w.useEffect(()=>{const k=()=>{if(!q.canvas.selected_nodes)return;const $=Object.values(q.canvas.selected_nodes);if($.length===0)return;const P=$[0];P&&(P.type==="SaveImage"||P.type==="PreviewImage")&&(console.log("Selected image node:",P.id),x(P.id))};return document.addEventListener("click",k),()=>{document.removeEventListener("click",k)}},[]);const N=k=>{if(k&&(k.preventDefault(),k.stopPropagation()),d.length>1&&!u){b(!0);return}n(k,u||void 0)};return e.jsxs("div",{className:"bg-white rounded-lg shadow-sm border border-gray-200 p-4",children:[e.jsxs("div",{className:"mb-4 border-b pb-2 flex justify-between items-center",children:[e.jsxs("div",{children:[e.jsx("h3",{className:"text-base font-medium text-gray-800",children:"Conform combinations"}),e.jsxs("p",{className:"text-xs text-gray-500",children:["In the selected parameter combinations, there are ",l," total runs. Each run will generate a separate image."]})]}),e.jsx("button",{className:"text-gray-400 hover:text-gray-600",onClick:i,children:e.jsx("svg",{className:"w-4 h-4",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M6 18L18 6M6 6l12 12"})})})]}),f&&d.length>1&&e.jsx("div",{className:"mb-4 p-3 bg-yellow-50 border border-yellow-200 rounded-md text-amber-600 text-xs",children:e.jsxs("div",{className:"flex items-start",children:[e.jsx("div",{className:"flex-shrink-0 mt-0.5",children:e.jsx("svg",{className:"h-3 w-3",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"})})}),e.jsx("div",{className:"ml-2",children:u===null?`Multiple SaveImage and PreviewImage nodes detected with IDs ${d.join(",")}. Please click the node on canvas.`:`Current node ID is ${u}, please click Start Generation again`})]})}),a&&e.jsx("div",{className:"mb-4 p-3 bg-red-50 border border-red-200 rounded-md text-red-600 text-xs",children:e.jsxs("div",{className:"flex items-start",children:[e.jsx("div",{className:"flex-shrink-0 mt-0.5",children:e.jsx("svg",{className:"h-3 w-3",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"})})}),e.jsx("div",{className:"ml-2",children:a})]})}),t.length>0?t.map((k,$)=>{const P=k.type||"Unknown Node",g=k.widgets||[],C=k.id;return e.jsxs("div",{className:"border rounded-md mb-4 overflow-hidden",children:[e.jsxs("div",{className:"bg-gray-50 px-3 py-2 text-xs font-medium text-gray-700 border-b",children:[P," (ID: ",C,")"]}),e.jsx("div",{className:"p-4 space-y-3",children:g.map((p,M)=>{const B=p.name;if(!s[B])return null;const G=r[C]?.[B]||[],j=Array.isArray(G)?`[${G.join(", ")}]`:JSON.stringify(G);return e.jsxs("div",{className:ME.preventDefault()})})]},M)})})]},$)}):e.jsx("div",{className:"border rounded-md mb-4 p-4 text-center text-gray-500 text-xs",children:"No nodes selected. Please select a node in the workflow to configure parameters."}),e.jsxs("div",{className:"mt-6 flex justify-between",children:[e.jsx("button",{onClick:k=>o(k),className:"px-3 py-1.5 text-xs bg-gray-100 text-gray-800 rounded-md hover:bg-gray-200 transition-colors",children:"Previous"}),e.jsx("button",{onClick:k=>N(k),className:`px-3 py-1.5 text-xs rounded-md transition-colors ${d.length>1&&!u?"bg-gray-200 text-gray-500 cursor-not-allowed":"bg-pink-200 text-pink-700 hover:bg-pink-300"}`,disabled:d.length>1&&!u,children:"Generate & Compare"})]})]})},vt=({selectedNodes:t,paramTestValues:r,selectedParams:s,totalCount:l,completedCount:a,errorMessage:o,handleClose:n,setIsProcessing:i,setCurrentScreen:d,cleanupPolling:m})=>{const u=x=>{x.preventDefault(),x.stopPropagation(),ht({clear:!0}),gt(),m&&m(),i(!1),d(2)};return e.jsxs("div",{className:"bg-white rounded-lg shadow-sm border border-gray-200 p-4 relative",children:[e.jsx("div",{className:"absolute inset-0 bg-gray-500 bg-opacity-30 flex flex-col items-center justify-center z-10",children:e.jsxs("div",{className:"text-center text-gray-800 bg-white p-4 rounded-lg shadow-lg",children:[e.jsx("div",{className:"mb-2 text-sm font-medium",children:"Processing..."}),e.jsxs("div",{className:"text-xs mb-3",children:["Completed ",a," of ",l," runs"]}),e.jsx("div",{className:"w-48 h-2 bg-gray-200 rounded-full overflow-hidden",children:e.jsx("div",{className:"h-full bg-pink-500 transition-all duration-200",style:{width:`${a/l*100}%`}})}),e.jsxs("div",{className:"mt-2 text-xs text-gray-600",children:["Already generated ",a," images"]}),e.jsx("button",{onClick:u,className:"mt-4 px-3 py-1.5 text-xs bg-gray-200 text-gray-800 rounded-md hover:bg-gray-300 transition-colors",children:"Cancel"})]})}),e.jsxs("div",{className:"mb-4 border-b pb-2 flex justify-between items-center",children:[e.jsxs("div",{children:[e.jsx("h3",{className:"text-base font-medium text-gray-800",children:"Confirm Test Configuration"}),e.jsxs("p",{className:"text-xs text-gray-500",children:["In the selected parameter combinations, there are ",l," total runs. Each run will generate a separate image."]})]}),e.jsx("button",{className:"text-gray-400 hover:text-gray-600",onClick:n,children:e.jsx("svg",{className:"w-4 h-4",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M6 18L18 6M6 6l12 12"})})})]}),o&&e.jsx("div",{className:"mb-4 p-3 bg-red-50 border border-red-200 rounded-md text-red-600 text-xs",children:e.jsxs("div",{className:"flex items-start",children:[e.jsx("div",{className:"flex-shrink-0 mt-0.5",children:e.jsx("svg",{className:"h-3 w-3",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"})})}),e.jsx("div",{className:"ml-2",children:o})]})}),t.length>0?t.map((x,f)=>{const b=x.type||"Unknown Node",y=x.widgets||[],N=x.id;return e.jsxs("div",{className:"border rounded-md mb-4 overflow-hidden",children:[e.jsxs("div",{className:"bg-gray-50 px-3 py-2 text-xs font-medium text-gray-700 border-b",children:[b," (ID: ",N,")"]}),e.jsx("div",{className:"p-4 space-y-3",children:y.map((k,$)=>{const P=k.name;if(!s[P])return null;const g=r[N]?.[P]||[],C=Array.isArray(g)?`[${g.join(", ")}]`:JSON.stringify(g);return e.jsxs("div",{className:$p.preventDefault()})})]},$)})})]},f)}):e.jsx("div",{className:"border rounded-md mb-4 p-4 text-center text-gray-500",children:"No nodes selected. Please select a node in the workflow to configure parameters."})]})},te=({visible:t,imageUrl:r,params:s,onClose:l})=>{if(!t)return null;const a=()=>{if(!s||!s.nodeParams)return null;const o=Object.entries(s.nodeParams).map(([n,i])=>{const d=s.nodeNames?.[n]||`Node ${n}`,m=Object.entries(i).filter(([u,x])=>typeof x!="object"||x===null).map(([u,x])=>e.jsxs("div",{className:"pl-4 text-sm py-1 flex",children:[e.jsx("span",{className:"text-gray-600 dark:text-gray-400 mr-2",children:"-"}),e.jsxs("span",{className:"font-medium mr-1",children:[u,":"]}),e.jsx("span",{className:"text-gray-700 dark:text-gray-300 break-all",children:String(x)})]},u));return e.jsxs("div",{className:"mb-4",children:[e.jsx("div",{className:"font-semibold text-pink-600 dark:text-pink-400 text-base py-1 border-b border-gray-200 dark:border-gray-700 mb-2",children:d}),m.length>0?m:e.jsx("div",{className:"pl-4 text-sm text-gray-500 italic",children:"nodeParams is null"})]},n)});return e.jsx("div",{className:"overflow-y-auto max-h-full",children:o.length>0?o:e.jsx("div",{className:"text-sm text-gray-500 italic",children:"nodeParams is null"})})};return e.jsx("div",{className:"fixed inset-0 bg-black/40 backdrop-blur-sm flex items-center justify-center z-50",onClick:l,children:e.jsxs("div",{className:"bg-white dark:bg-gray-800 rounded-xl shadow-2xl flex flex-row w-[90%] max-w-6xl max-h-[90vh] relative m-4 overflow-hidden",onClick:o=>o.stopPropagation(),style:{display:"flex",flexDirection:"row"},children:[e.jsx("button",{className:"absolute top-2 right-2 text-gray-500 dark:text-gray-400 hover:text-gray-700 dark:hover:text-gray-200 rounded-full hover:bg-gray-100 dark:hover:bg-gray-700 p-1 z-10",onClick:l,children:e.jsx("svg",{className:"w-5 h-5",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M6 18L18 6M6 6l12 12"})})}),e.jsx("div",{className:"w-[65%] border-r border-gray-200 dark:border-gray-700",children:e.jsx("div",{className:"p-4 h-full flex items-center justify-center",children:e.jsx("img",{src:r,alt:"Enlarged image",className:"max-w-full max-h-[calc(90vh-2rem)] object-contain"})})}),e.jsx("div",{className:"w-[35%] h-full overflow-hidden flex flex-col",children:e.jsxs("div",{className:"p-4 flex-1 overflow-y-auto",children:[e.jsx("h3",{className:"text-lg font-medium text-gray-800 dark:text-gray-200 mb-4",children:"parameters"}),s&&!s.nodeParams&&Object.entries(s).filter(([o,n])=>o!=="nodeParams"&&typeof n!="object").map(([o,n])=>e.jsxs("div",{className:"py-1 text-sm text-gray-600 dark:text-gray-300",children:[e.jsxs("span",{className:"font-medium",children:[o,":"]})," ",String(n)]},o)),e.jsx("div",{className:"text-sm text-gray-600 dark:text-gray-300",children:a()})]})})]})})},wt=({generatedImages:t,selectedImageIndex:r,handleSelectImage:s,handleApplySelected:l,handlePrevious:a,handleClose:o,currentPage:n,handlePageChange:i,imagesPerPage:d,notificationVisible:m,modalVisible:u,modalImageUrl:x,modalImageParams:f,openImageModal:b,closeImageModal:y})=>{const N=Math.ceil(t.length/d),k=(n-1)*d,$=Math.min(k+d,t.length),P=t.slice(k,$);return e.jsxs("div",{className:"bg-white rounded-lg shadow-sm border border-gray-200 p-4",children:[e.jsxs("div",{className:"mb-4 border-b pb-2 flex justify-between items-center",children:[e.jsxs("div",{children:[e.jsx("h3",{className:"text-base font-medium text-gray-800",children:"Generation Complete"}),e.jsxs("p",{className:"text-xs text-gray-500",children:["All ",t.length," images have been generated."]})]}),e.jsx("button",{className:"text-gray-400 hover:text-gray-600",onClick:o,children:e.jsx("svg",{className:"w-4 h-4",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M6 18L18 6M6 6l12 12"})})})]}),m&&e.jsx("div",{className:"fixed top-4 right-4 bg-green-100 border-l-4 border-green-500 text-green-700 p-3 shadow-md rounded animate-fade-in-out z-50",children:e.jsxs("div",{className:"flex items-center",children:[e.jsx("div",{className:"py-1",children:e.jsx("svg",{className:"h-4 w-4 text-green-500 mr-3",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M5 13l4 4L19 7"})})}),e.jsx("p",{className:"text-xs",children:"Parameters has been applied."})]})}),e.jsx(te,{visible:u,imageUrl:x,params:f||{},onClose:y}),e.jsx("div",{className:"grid grid-cols-3 gap-4 mb-6",children:P.map((g,C)=>{const p=k+C;return e.jsxs("div",{className:`relative rounded-lg overflow-hidden border ${r===p?"border-pink-500 ring-2 ring-pink-300":"border-gray-200"}`,onClick:M=>s(p,M),children:[e.jsx("button",{className:"absolute top-2 right-2 bg-white bg-opacity-75 rounded-full p-0.5 text-gray-600 hover:text-gray-900 shadow-sm z-10",onClick:M=>b(g.url,g.params,M),children:e.jsx("svg",{className:"w-3 h-3",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M4 8V4m0 0h4M4 4l5 5m11-1V4m0 0h-4m4 0l-5 5M4 16v4m0 0h4m-4 0l5-5m11 5v-4m0 4h-4m4 0l-5-5"})})}),e.jsx("div",{className:"aspect-square",children:e.jsx("img",{src:g.url,alt:`Generated image ${p+1}`,className:"w-full h-full object-cover"})})]},p)})}),N>1&&e.jsxs("div",{className:"flex justify-center items-center space-x-2 mt-4 mb-4",children:[e.jsx("button",{onClick:g=>i(1,g),disabled:n===1,className:`px-2 py-1 rounded ${n===1?"text-gray-400 cursor-not-allowed":"text-gray-700 hover:bg-gray-100"}`,children:e.jsxs("svg",{xmlns:"http://www.w3.org/2000/svg",className:"h-5 w-5",viewBox:"0 0 20 20",fill:"currentColor",children:[e.jsx("path",{fillRule:"evenodd",d:"M15.707 15.707a1 1 0 01-1.414 0l-5-5a1 1 0 010-1.414l5-5a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 010 1.414z",clipRule:"evenodd"}),e.jsx("path",{fillRule:"evenodd",d:"M8.707 15.707a1 1 0 01-1.414 0l-5-5a1 1 0 010-1.414l5-5a1 1 0 111.414 1.414L4.414 10l4.293 4.293a1 1 0 010 1.414z",clipRule:"evenodd"})]})}),e.jsx("button",{onClick:g=>i(n-1,g),disabled:n===1,className:`px-2 py-1 rounded ${n===1?"text-gray-400 cursor-not-allowed":"text-gray-700 hover:bg-gray-100"}`,children:e.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",className:"h-5 w-5",viewBox:"0 0 20 20",fill:"currentColor",children:e.jsx("path",{fillRule:"evenodd",d:"M12.707 5.293a1 1 0 010 1.414L9.414 10l3.293 3.293a1 1 0 01-1.414 1.414l-4-4a1 1 0 010-1.414l4-4a1 1 0 011.414 0z",clipRule:"evenodd"})})}),e.jsxs("div",{className:"px-2 py-1 text-xs text-gray-800",children:["Page ",n," of ",N]}),e.jsx("button",{onClick:g=>i(n+1,g),disabled:n===N,className:`px-2 py-1 rounded ${n===N?"text-gray-400 cursor-not-allowed":"text-gray-700 hover:bg-gray-100"}`,children:e.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",className:"h-5 w-5",viewBox:"0 0 20 20",fill:"currentColor",children:e.jsx("path",{fillRule:"evenodd",d:"M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z",clipRule:"evenodd"})})}),e.jsx("button",{onClick:g=>i(N,g),disabled:n===N,className:`px-2 py-1 rounded ${n===N?"text-gray-400 cursor-not-allowed":"text-gray-700 hover:bg-gray-100"}`,children:e.jsxs("svg",{xmlns:"http://www.w3.org/2000/svg",className:"h-5 w-5",viewBox:"0 0 20 20",fill:"currentColor",children:[e.jsx("path",{fillRule:"evenodd",d:"M4.293 15.707a1 1 0 001.414 0l5-5a1 1 0 000-1.414l-5-5a1 1 0 00-1.414 1.414L8.586 10 4.293 14.293a1 1 0 000 1.414z",clipRule:"evenodd"}),e.jsx("path",{fillRule:"evenodd",d:"M11.293 15.707a1 1 0 001.414 0l5-5a1 1 0 000-1.414l-5-5a1 1 0 00-1.414 1.414L15.586 10l-4.293 4.293a1 1 0 000 1.414z",clipRule:"evenodd"})]})})]}),e.jsx("div",{className:"mt-6 flex justify-end",children:e.jsx("button",{onClick:g=>l(g),className:"px-3 py-1.5 text-xs bg-pink-200 text-pink-700 rounded-md hover:bg-pink-300 transition-colors",disabled:r===null,children:"Apply Selected"})})]})},Nt=({visible:t,aiWritingModalText:r,setAiWritingModalText:s,aiGeneratedTexts:l,aiSelectedTexts:a,aiWritingLoading:o,aiWritingError:n,handleAiWriting:i,toggleTextSelection:d,addSelectedTexts:m,onClose:u})=>t?e.jsx("div",{className:"fixed inset-0 bg-black flex items-center justify-center z-50",children:e.jsxs("div",{className:"bg-white dark:bg-gray-800 rounded-xl shadow-2xl w-full max-w-2xl max-h-[90vh] flex flex-col",children:[e.jsxs("div",{className:"p-4 border-b border-gray-200 dark:border-gray-700 flex justify-between items-center",children:[e.jsx("h3",{className:"text-lg font-semibold text-gray-900 dark:text-white",children:"AI Writing Assistant"}),e.jsx("button",{className:"text-gray-500 dark:text-gray-400 hover:text-gray-700 dark:hover:text-gray-200",onClick:u,children:e.jsx("svg",{className:"w-5 h-5",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M6 18L18 6M6 6l12 12"})})})]}),e.jsxs("div",{className:"p-4 overflow-y-auto flex-1",children:[e.jsxs("div",{className:"mb-4",children:[e.jsx("p",{className:"text-sm text-gray-700 dark:text-gray-300 mb-2",children:"Enter text and AI will generate variations"}),e.jsx("textarea",{className:`w-full px-4 py-3 border border-gray-200 dark:border-gray-600 rounded-lg text-gray-900 dark:text-white + bg-gray-50 dark:bg-gray-700 + placeholder-gray-500 dark:placeholder-gray-400 + focus:border-blue-500 dark:focus:border-blue-400 + focus:ring-2 focus:ring-blue-500/20 dark:focus:ring-blue-400/20 + focus:outline-none`,rows:3,placeholder:"Enter some text here...",value:r,onChange:x=>s(x.target.value)}),e.jsx("button",{className:`mt-2 px-4 py-2 rounded-lg text-sm flex items-center transition-colors ${o?"bg-gray-300 dark:bg-gray-600 text-gray-500 dark:text-gray-400 cursor-not-allowed":"bg-blue-600 hover:bg-blue-700 dark:bg-blue-500 dark:hover:bg-blue-600 text-white"}`,onClick:i,disabled:o,children:o?e.jsxs(e.Fragment,{children:[e.jsxs("svg",{className:"animate-spin -ml-1 mr-2 h-4 w-4 text-gray-500 dark:text-gray-400",xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24",children:[e.jsx("circle",{className:"opacity-25",cx:"12",cy:"12",r:"10",stroke:"currentColor",strokeWidth:"4"}),e.jsx("path",{className:"opacity-75",fill:"currentColor",d:"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"})]}),"Generating..."]}):e.jsx(e.Fragment,{children:"Generate"})})]}),n&&e.jsx("div",{className:"mb-4 p-3 bg-red-50 dark:bg-red-900/20 border border-red-200 dark:border-red-800/20 rounded-md text-red-700 dark:text-red-400 text-sm",children:n}),l.length>0&&e.jsxs("div",{className:"mb-4",children:[e.jsx("p",{className:"text-sm font-medium text-gray-700 dark:text-gray-300 mb-2",children:"Generated variations (select items to add):"}),e.jsx("div",{className:"space-y-2 max-h-[40vh] overflow-y-auto p-2",children:l.map((x,f)=>e.jsxs("div",{className:"flex items-start border border-gray-200 dark:border-gray-600 rounded-md p-2",children:[e.jsx("div",{className:"mr-2 mt-1",children:e.jsxs("div",{className:"relative",children:[e.jsx("input",{type:"checkbox",id:`text${f+1}`,checked:!!a[`text${f+1}`],onChange:()=>d(`text${f+1}`),className:"sr-only"}),e.jsx("div",{className:`h-4 w-4 rounded border ${a[`text${f+1}`]?"bg-blue-600 dark:bg-blue-500 border-blue-600 dark:border-blue-500":"border-gray-300 dark:border-gray-600"} flex items-center justify-center cursor-pointer`,onClick:()=>d(`text${f+1}`),children:a[`text${f+1}`]&&e.jsx("svg",{className:"h-3 w-3 text-white",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M5 13l4 4L19 7"})})})]})}),e.jsx("label",{htmlFor:`text${f+1}`,className:"text-sm text-gray-700 dark:text-gray-300 cursor-pointer flex-1",children:x})]},f))})]})]}),e.jsxs("div",{className:"p-4 border-t border-gray-200 dark:border-gray-700 flex justify-end flex-shrink-0",children:[e.jsx("button",{className:`px-5 py-2.5 text-gray-700 dark:text-gray-200 bg-white dark:bg-gray-800 hover:bg-gray-100 dark:hover:bg-gray-700 + rounded-lg font-medium transition-colors mr-3`,onClick:u,children:"Cancel"}),e.jsx("button",{className:`px-5 py-2.5 rounded-lg font-medium transition-colors ${Object.values(a).every(x=>!x)?"bg-gray-300 dark:bg-gray-600 text-gray-500 dark:text-gray-400 cursor-not-allowed":"bg-blue-600 hover:bg-blue-700 dark:bg-blue-500 dark:hover:bg-blue-600 text-white"}`,onClick:m,disabled:Object.values(a).every(x=>!x),children:"Add Selected"})]})]})}):null,je=t=>{const r=[],s={};if(Object.keys(t).forEach(o=>{const n=parseInt(o),i=t[o]||{},d=Object.keys(i).filter(u=>i[u]&&i[u].length>0);if(d.length===0)return;const m=[[]];d.forEach(u=>{const x=i[u],f=[];m.forEach(b=>{x.forEach(y=>{const N=[...b,{nodeId:n,paramName:u,paramValue:String(y)}];f.push(N)})}),m.length=0,m.push(...f)}),s[o]=m}),Object.keys(s).length===0)return r;if(Object.keys(s).length===1){const o=Object.keys(s)[0];return s[o]}const l=Object.keys(s);let a=s[l[0]];for(let o=1;o{n.forEach(m=>{i.push([...d,...m])})}),a=i}return a},kt=(t,r)=>{const s={};s.nodeParams={};const l=je(t);return r{const n=o.nodeId.toString(),i=o.paramName,d=o.paramValue;s.nodeParams[n]||(s.nodeParams[n]={}),s.nodeParams[n][i]=d,s[i]=d}),s},Be="parameter_debug_history",Oe=30,De=async(t,r,s,l,a)=>{try{const o=Te(),n={id:ie(),timestamp:Date.now(),nodeName:t,params:r,generatedImages:s,totalCount:l,workflow:a};return o.unshift(n),o.length>Oe&&o.splice(Oe),localStorage.setItem(Be,JSON.stringify(o)),n}catch(o){return console.error("Error saving parameter debug history:",o),null}},Te=()=>{try{const t=localStorage.getItem(Be);if(t)return JSON.parse(t)}catch(t){console.error("Error loading parameter debug history:",t)}return[]},Re=t=>{const r=new Date(t);return`${r.getFullYear()}-${String(r.getMonth()+1).padStart(2,"0")}-${String(r.getDate()).padStart(2,"0")} ${String(r.getHours()).padStart(2,"0")}:${String(r.getMinutes()).padStart(2,"0")}`},St=(t,r)=>{if(r.nodeParams)return Object.entries(r.nodeParams).map(([o,n])=>{let i=t;r.selectedNodeInfoMap&&r.selectedNodeInfoMap[o]&&(i=r.selectedNodeInfoMap[o]);const d=Object.keys(n).slice(0,3);return`${i}<${d.join(",")}>`}).join(";");const s=Object.keys(r).filter(l=>l!=="nodeParams"&&l!=="selectedNodeInfoMap").slice(0,3);return`${t}<${s.join(",")}>`},Ct=({historyItems:t,onViewHistoryItem:r,onClose:s})=>e.jsxs("div",{className:"bg-white rounded-lg shadow-sm border border-gray-200 p-4 flex flex-col h-full",children:[e.jsxs("div",{className:"mb-4 border-b pb-2 flex justify-between items-center",children:[e.jsxs("div",{children:[e.jsx("h3",{className:"text-base font-medium text-gray-800",children:"Generation History"}),e.jsxs("p",{className:"text-xs text-gray-500",children:["Last ",t.length," generation runs"]})]}),e.jsx("button",{className:"text-gray-400 hover:text-gray-600",onClick:s,children:e.jsx("svg",{className:"w-4 h-4",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M6 18L18 6M6 6l12 12"})})})]}),t.length===0?e.jsx("div",{className:"flex-1 flex items-center justify-center text-gray-500 text-sm",children:"No history items found"}):e.jsx("div",{className:"flex-1 overflow-y-auto",children:t.map(l=>e.jsxs("div",{className:"border border-gray-200 rounded-lg mb-3 overflow-hidden",children:[e.jsxs("div",{className:"bg-gray-50 py-2 px-3 flex items-center justify-between border-b",children:[e.jsx("div",{className:"text-[14px] text-gray-600",children:Re(l.timestamp)}),e.jsx("button",{onClick:()=>r(l),className:"px-3 py-1 text-xs bg-pink-200 text-pink-700 rounded-md hover:bg-pink-300 transition-colors",children:"view"})]}),e.jsx("div",{className:"p-3",children:e.jsx("div",{className:"text-[10px] font-medium text-gray-700",children:St(l.nodeName,l.params)})})]},l.id))})]}),Lt=({historyItem:t,selectedImageIndex:r,handleSelectImage:s,handleClose:l,currentPage:a,handlePageChange:o,imagesPerPage:n,modalVisible:i,modalImageUrl:d,modalImageParams:m,openImageModal:u,closeImageModal:x})=>{const{timestamp:f,nodeName:b,generatedImages:y}=t,N=Math.ceil(y.length/n),k=(a-1)*n,$=Math.min(k+n,y.length),P=y.slice(k,$);return e.jsxs("div",{className:"bg-white rounded-lg shadow-sm border border-gray-200 p-4",children:[e.jsxs("div",{className:"mb-4 border-b pb-2 flex justify-between items-center",children:[e.jsxs("div",{children:[e.jsx("h3",{className:"text-base font-medium text-gray-800",children:b}),e.jsxs("p",{className:"text-xs text-gray-500",children:[Re(f)," • ",y.length," images"]})]}),e.jsx("button",{className:"text-gray-400 hover:text-gray-600",onClick:l,children:e.jsx("svg",{className:"w-4 h-4",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M6 18L18 6M6 6l12 12"})})})]}),e.jsx(te,{visible:i,imageUrl:d,params:m||{},onClose:x}),e.jsx("div",{className:"grid grid-cols-3 gap-4 mb-6",children:P.map((g,C)=>{const p=k+C;return e.jsxs("div",{className:`relative rounded-lg overflow-hidden border ${r===p?"border-pink-500 ring-2 ring-pink-300":"border-gray-200"}`,onClick:M=>s(p,M),children:[e.jsx("button",{className:"absolute top-2 right-2 bg-white bg-opacity-75 rounded-full p-0.5 text-gray-600 hover:text-gray-900 shadow-sm z-10",onClick:M=>u(g.url,g.params,M),children:e.jsx("svg",{className:"w-3 h-3",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M4 8V4m0 0h4M4 4l5 5m11-1V4m0 0h-4m4 0l-5 5M4 16v4m0 0h4m-4 0l5-5m11 5v-4m0 4h-4m4 0l-5-5"})})}),e.jsx("div",{className:"aspect-square",children:e.jsx("img",{src:g.url,alt:`Generated image ${p+1}`,className:"w-full h-full object-cover"})})]},p)})}),N>1&&e.jsxs("div",{className:"flex justify-center items-center space-x-2 mt-4 mb-4",children:[e.jsx("button",{onClick:g=>o(1,g),disabled:a===1,className:`px-2 py-1 rounded ${a===1?"text-gray-400 cursor-not-allowed":"text-gray-700 hover:bg-gray-100"}`,children:e.jsxs("svg",{xmlns:"http://www.w3.org/2000/svg",className:"h-5 w-5",viewBox:"0 0 20 20",fill:"currentColor",children:[e.jsx("path",{fillRule:"evenodd",d:"M15.707 15.707a1 1 0 01-1.414 0l-5-5a1 1 0 010-1.414l5-5a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 010 1.414z",clipRule:"evenodd"}),e.jsx("path",{fillRule:"evenodd",d:"M8.707 15.707a1 1 0 01-1.414 0l-5-5a1 1 0 010-1.414l5-5a1 1 0 111.414 1.414L4.414 10l4.293 4.293a1 1 0 010 1.414z",clipRule:"evenodd"})]})}),e.jsx("button",{onClick:g=>o(a-1,g),disabled:a===1,className:`px-2 py-1 rounded ${a===1?"text-gray-400 cursor-not-allowed":"text-gray-700 hover:bg-gray-100"}`,children:e.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",className:"h-5 w-5",viewBox:"0 0 20 20",fill:"currentColor",children:e.jsx("path",{fillRule:"evenodd",d:"M12.707 5.293a1 1 0 010 1.414L9.414 10l3.293 3.293a1 1 0 01-1.414 1.414l-4-4a1 1 0 010-1.414l4-4a1 1 0 011.414 0z",clipRule:"evenodd"})})}),e.jsxs("div",{className:"px-2 py-1 text-xs text-gray-800",children:["Page ",a," of ",N]}),e.jsx("button",{onClick:g=>o(a+1,g),disabled:a===N,className:`px-2 py-1 rounded ${a===N?"text-gray-400 cursor-not-allowed":"text-gray-700 hover:bg-gray-100"}`,children:e.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",className:"h-5 w-5",viewBox:"0 0 20 20",fill:"currentColor",children:e.jsx("path",{fillRule:"evenodd",d:"M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z",clipRule:"evenodd"})})}),e.jsx("button",{onClick:g=>o(N,g),disabled:a===N,className:`px-2 py-1 rounded ${a===N?"text-gray-400 cursor-not-allowed":"text-gray-700 hover:bg-gray-100"}`,children:e.jsxs("svg",{xmlns:"http://www.w3.org/2000/svg",className:"h-5 w-5",viewBox:"0 0 20 20",fill:"currentColor",children:[e.jsx("path",{fillRule:"evenodd",d:"M4.293 15.707a1 1 0 001.414 0l5-5a1 1 0 000-1.414l-5-5a1 1 0 00-1.414 1.414L8.586 10 4.293 14.293a1 1 0 000 1.414z",clipRule:"evenodd"}),e.jsx("path",{fillRule:"evenodd",d:"M11.293 15.707a1 1 0 001.414 0l5-5a1 1 0 000-1.414l-5-5a1 1 0 00-1.414 1.414L15.586 10l-4.293 4.293a1 1 0 000 1.414z",clipRule:"evenodd"})]})})]})]})},Mt=` + @keyframes highlight-pulse { + 0% { + box-shadow: 0 0 0 0 rgba(59, 130, 246, 0.5); + } + 70% { + box-shadow: 0 0 0 15px rgba(59, 130, 246, 0); + } + 100% { + box-shadow: 0 0 0 0 rgba(59, 130, 246, 0); + } + } + + .highlight-pulse { + animation: highlight-pulse 1.5s infinite; + border: 2px solid #3b82f6; + } + + @keyframes fade-in-out { + 0% { opacity: 0; transform: translateY(-20px); } + 10% { opacity: 1; transform: translateY(0); } + 90% { opacity: 1; transform: translateY(0); } + 100% { opacity: 0; transform: translateY(-20px); } + } + + .animate-fade-in-out { + animation: fade-in-out 3s forwards; + } +`,re="parameter_debug_state",Ae=t=>{try{localStorage.setItem(re,JSON.stringify(t))}catch(r){console.error("Error saving parameter debug state:",r)}},$t=()=>{try{const t=localStorage.getItem(re);if(t)return JSON.parse(t)}catch(t){console.error("Error loading parameter debug state:",t)}return null},Pt=()=>{try{localStorage.removeItem(re)}catch(t){console.error("Error clearing parameter debug state:",t)}},Et=(t,r,s,l,a,o)=>{const n=`${t}_${r}`;o(d=>{const m=[...d[n]||[]];return m[s]=l,{...d,[n]:m}});const i=[...a[n]||[]];return i[s]=l,i},_t=(t,r,s,l)=>{const a=`${t}_${r}`;return l(o=>{const n=[...o[a]||[]];return n.push(""),{...o,[a]:n}}),[...s[a]||[],""]},It=(t,r,s,l,a)=>{const o=`${t}_${r}`;a(i=>{const d=[...i[o]||[]];return d.splice(s,1),{...i,[o]:d}});const n=[...l[o]||[]];return n.splice(s,1),n},Ot=(t,r,s,l,a)=>{s.preventDefault(),s.stopPropagation();const o=`${t}_${r}`;a(n=>{if(n[o]&&typeof n[o]=="object"?n[o].isOpen:!!n[o])return{...n,[o]:!1};{let d=0,m=0;if(s.currentTarget){const f=s.currentTarget.getBoundingClientRect();d=f.left,m=f.bottom}else d=s.clientX,m=s.clientY+20;const u=window.innerWidth,x=250;return d+x>u&&(d=u-x-10),d<0&&(d=10),{...n,[o]:{isOpen:!0,x:d,y:m}}}})},Dt=(t,r,s,l,a)=>{a(o=>{const n={...o};return n[t]||(n[t]={}),n[t][r]=s,n})},At=(t,r,s,l,a,o)=>{o&&(o.preventDefault(),o.stopPropagation()),a(n=>{const i={...n};i[t]||(i[t]={}),i[t][r]||(i[t][r]=[]);const d=i[t][r];return d.includes(s)?i[t][r]=d.filter(m=>m!==s):i[t][r]=[...d,s],i})},Wt=(t,r,s,l,a)=>{const o=`${t}_${r}`;a(n=>({...n,[o]:s}))},Bt=(t,r,s,l,a)=>{if(!l[t]){a(t,r,s);return}const o=l[t][r]||[];s.length===o.length?a(t,r,[]):a(t,r,[...s])},Tt=(t,r,s,l,a,o)=>{o&&(o.preventDefault(),o.stopPropagation());const n=r[t];if(s(i=>({...i,[t]:!n})),n){const i={...l};Object.keys(i).forEach(d=>{i[d][t]&&delete i[d][t]}),a(i)}},Rt=(t,r,s,l,a,o,n)=>{n.preventDefault(),n.stopPropagation();const i={...r};if(r.nodeParams){const d={};Object.keys(r.nodeParams).forEach(m=>{const u=s.find(x=>x.id.toString()===m);d[m]=u?u.title||`Node ${m}`:`Node ${m}`}),i.nodeNames=d}else if(Object.keys(r).length>0){const d={};Object.entries(r).forEach(([m,u])=>{(typeof u!="object"||u===null)&&(d[m]=u)}),Object.keys(d).length>0&&(i.nodeParams={default:d},i.nodeNames={default:r.node_name||r.nodeName||"参数"})}l(t),a(i),o(!0)},zt=(t,r)=>{r&&(r.preventDefault(),r.stopPropagation()),t(!1)},Ft=(t,r,s,l,a,o,n,i,d,m,u)=>{if(u&&(u.preventDefault(),u.stopPropagation()),t===0){const x={...l};Object.keys(x).forEach(f=>{const b=x[f];Object.keys(b).forEach(y=>{s[y]||delete b[y]})}),a(x)}if(t===1){const x={...l};n.forEach(b=>{const y=b.id.toString(),N=b.widgets||{};Object.values(N).forEach(k=>{const $=k.name;if(s[$]&&(k.type==="customtext"||k.type.toLowerCase().includes("text"))){const P=`${y}_${$}`,g=o[P]||[""];x[y]=x[y]||{},x[y][$]=g}})}),a(x);const f=m(x);i(f.length)}d(null),r(x=>Math.min(x+1,2))},Ht=(t,r,s,l,a,o,n,i,d,m)=>{if(m&&(m.preventDefault(),m.stopPropagation()),d(null),n&&i(!1),t===1){const u=s.map(b=>b.id.toString()),x=Object.keys(l),f={...l};x.forEach(b=>{u.includes(b)||delete f[b]}),a(f)}if(t===2||n){const u={...l};Object.entries(o).forEach(([x,f])=>{if(!f||f.length===0)return;const[b,y]=x.split("_");s.some(N=>N.id.toString()===b)&&(u[b]=u[b]||{},JSON.stringify(u[b][y])!==JSON.stringify(f)&&(u[b][y]=f))}),a(u)}r(u=>Math.max(u-1,0))},Ut=(t,r,s,l,a)=>{a&&(a.preventDefault(),a.stopPropagation()),l(Math.max(1,Math.min(t,Math.ceil(s.length/r))))};function Gt(t,r){try{if(!t)return console.error("Invalid prompt_output: ",t),t;for(const s of r){if(!t[s.nodeId]){console.error(`Node with ID ${s.nodeId} not found`);continue}if(!t[s.nodeId].inputs){console.error(`Inputs not found for node with ID ${s.nodeId}`);continue}t[s.nodeId].inputs[s.paramName]=s.paramValue}return t}catch(s){return console.error("Error updating prompt:",s),t}}async function Jt(t){const r=await q.graphToPrompt(),s=Gt(r.output,t);console.log("queuePrompt updated_prompt:",s);const l={prompt:s,client_id:q.api.clientId,extra_data:{extra_pageinfo:{workflow:r.workflow}}};console.debug("queuePrompt request_body.prompt:",s);const a=await pt(l);return console.debug("queuePrompt response:",a),a}function We(t){const r=document.createElement("canvas"),s=r.getContext("2d");if(r.width=512,r.height=512,s){s.fillStyle="#f8d7da",s.fillRect(0,0,r.width,r.height),s.strokeStyle="#dc3545",s.lineWidth=4,s.strokeRect(10,10,r.width-20,r.height-20),s.fillStyle="#dc3545",s.beginPath(),s.arc(r.width/2,150,50,0,2*Math.PI),s.fill(),s.fillStyle="white",s.font="bold 80px Arial",s.textAlign="center",s.textBaseline="middle",s.fillText("!",r.width/2,150),s.fillStyle="#721c24",s.font="20px Arial",s.textAlign="center",s.textBaseline="middle";const l=r.width-60,a=30,o=t.split(" ");let n="",i=250;for(let d=0;dl&&d>0?(s.fillText(n,r.width/2,i),n=o[d]+" ",i+=a):n=m}s.fillText(n,r.width/2,i)}return r.toDataURL("image/png")}async function Kt(t){try{if(!t||t==="")return console.log("No prompt ID provided"),{1:[We("Fail to generate prompt ID")]};const r=await ft(t);if(!r||!r[t])return console.log("Not finished for prompt ID:",t),{};const s=r[t];if(s.status&&s.status.status_str==="error"){console.error("Error for prompt ID:",t);const a=s.status.messages;if(a&&a.length>0){const o=a[a.length-1];if(o&&o.length>0){const n=o[0];return{1:[We(n)]}}}}const l={};if(s.outputs)for(const a in s.outputs){const o=s.outputs[a];if(o&&o.images){l[a]=[];for(const n of o.images)if(n&&n.filename&&n.type){const i=q.graph._nodes_by_id[a].imgs[0].currentSrc.split("?")[0];l[a].push(i+"?filename="+encodeURIComponent(n.filename)+"&type="+encodeURIComponent(n.type)+(n.subfolder?"&subfolder="+encodeURIComponent(n.subfolder):""))}console.log("outputImages for nodeId:",a,l[a])}}return l}catch(r){throw console.error("Error getting output images from prompt:",r),r}}function Vt(){const t=Object.values(q.graph._nodes_by_id),r=[],s=[];for(const l of t)l.type==="SaveImage"?r.push(l.id):l.type==="PreviewImage"&&s.push(l.id);if(console.log("saveNodeIds:",r),console.log("previewNodeIds:",s),r.length===0&&s.length===0)throw new Error("No SaveImage or PreviewImage node found, please add one to the graph");return r.length===1?r[0]:r.length==0&&s.length===1?s[0]:null}async function qt(t,r){const s=await Kt(t);return Object.keys(s).length===0?null:s[r.toString()]&&s[r.toString()].length>0?s[r.toString()][0]:null}const Yt=async(t,r,s,l,a,o,n,i,d,m,u,x,f,b)=>{f&&(f.preventDefault(),f.stopPropagation()),Fe(m,d);const y=u(t),N=y.length;if(N>100){a(`Cannot generate more than 100 images at once (currently: ${N} images)`);return}a(null),s(!0),l(0),console.log("Generated parameter combinations:",y);let k=null;try{k=(await x.graphToPrompt()).output}catch(C){console.error("Error capturing workflow data:",C)}if(se.trackEvent({event_type:"start_generation",message_type:"parameter_debug",message_id:r,data:{workflow:k,all_params:t,count:N}}),y.length===0){a("No valid parameter combinations found. Please check your parameter selections."),s(!1);return}let $=b||null;if($===null){const C=Vt();C!==null&&($=C)}if($===null){a("Please select a SaveImage or PreviewImage node first."),s(!1);return}const P={};Object.keys(t).forEach(C=>{const p=x.graph._nodes_by_id[C];p&&(P[C]=p.type||p.comfyClass||"Unknown Node")});const g=[];try{const C=Date.now().toString();d.current=C;for(const E of y){const R=await Jt(E);R.prompt_id?g.push(R.prompt_id):(console.error("Failed to get prompt_id from response:",R),g.push(""))}const p=Array(y.length).fill(null).map((E,R)=>({url:`https://source.unsplash.com/random/300x300?sig=${Math.random()}`,params:kt(t,R)}));o(p);const M=Date.now(),B=5*60*1e3,G=Object.keys(t)[0],j=P[G]||"Unknown Node";ze(g,$,p,C,M,B,d,m,o,l,s,n,i,j,t,N,k,P)}catch(C){console.error("Error generating images:",C),s(!1)}},ze=async(t,r,s,l,a,o,n,i,d,m,u,x,f,b,y,N,k,$)=>{if(n.current!==l){console.log("Another polling session has started, stopping this one");return}if(Date.now()-a>o){if(console.log("Timeout reached while waiting for images"),n.current===l&&(u(!1),x(!0),f(1),s.length>0&&b&&y)){const g=s[0].params;$&&(g.selectedNodeInfoMap=$),De(b,g,s,N||s.length,k)}return}let P=0;for(let g=0;g0&&b&&y)){const g=s[0].params;$&&(g.selectedNodeInfoMap=$),De(b,g,s,N||s.length,k)}return}n.current===l&&(i.current=setTimeout(()=>{ze(t,r,s,l,a,o,n,i,d,m,u,x,f,b,y,N,k,$)},2e3))},Fe=(t,r)=>{t.current&&(clearTimeout(t.current),t.current=null),r.current=null},Xt=async(t,r,s,l,a,o)=>{if(!t.trim()){l("Please enter some text to generate variations");return}s(!0),l(null),a([]),o({});try{const n=await se.generateSDPrompts(t);a(n),se.trackEvent({event_type:"prompt_generate",message_type:"parameter_debug",message_id:r,data:{input_text:t,generated_texts:n}});const i={};n.forEach((d,m)=>{i[`text${m+1}`]=!1}),o(i)}catch(n){console.error("Error generating text:",n),l("Failed to generate text variations. Please try again.")}finally{s(!1)}},Qt=(t,r)=>{r(s=>({...s,[t]:!s[t]}))},Zt=(t,r,s,l,a,o,n,i,d,m)=>{const u=`${t}_${r}`,x=Object.entries(s).filter(([b,y])=>y).map(([b])=>{const y=parseInt(b.replace("text",""))-1;return l[y]});if(x.length===0)return;i(b=>{const y=[...b[u]||[]];return{...b,[u]:[...y,...x]}}),se.trackEvent({event_type:"prompt_apply",message_type:"parameter_debug",message_id:o,data:{input_text:a,generated_texts:l,selected_texts:x}});const f=[...n[u]||[],...x];d(t,r,f),m(!1)},es=(t,r,s,l,a,o,n,i,d,m)=>{s(!0),l(t),a(r),o(""),n([]),i({}),d(!1),m(null)},ts=(t,r,s,l,a,o,n,i,d,m,u,x,f,b,y,N,k,$,P,g,C,p,M,B,G,j,E,R,v,W=!1)=>{t(0),r({Steps:!0,CFG:!0,sampler_name:!0,threshold:!1,prompt:!1}),s(ie()),l(),a(!1),o(!1),n(0),i(12),d(null),m(Array(12).fill(null).map((I,_)=>({url:`https://source.unsplash.com/random/300x300?sig=${Math.random()}`,params:{step:_%3===0?5:_%3===1?10:15,sampler_name:"euler",cfg:1}}))),u({}),x({}),f({}),b({}),y(1),N(null),k(!1),$(!1),P(""),g(null),C({}),p(!1),M(""),B([]),G(!1),j(""),E(""),R(null),v({}),W&&Pt()},ss=(t,r,s)=>{s&&(s.preventDefault(),s.stopPropagation()),r(t)},rs=async(t,r,s,l,a,o,n)=>{if(n&&(n.preventDefault(),n.stopPropagation()),t!==null){console.log(`Applied image ${t+1} with parameters:`,r[t].params);let i=1;if(a){for(const m in a)if(a[m])for(const u in a[m]){const x=a[m][u];if(x){let f=1;Array.isArray(x)?f=x.length>0?x.length:1:typeof x=="object"&&x!==null&&(f=Object.keys(x).length>0?Object.keys(x).length:1),i=i*f}}}se.trackEvent({event_type:"parameter_debug_apply",message_type:"parameter_debug",message_id:l,data:{workflow:(await s.graphToPrompt()).output,selected_params:r[t].params,all_params:a,count:i}});const d=r[t].params;d.nodeParams&&(Object.entries(d.nodeParams).forEach(([m,u])=>{const x=s.graph._nodes_by_id[m];!x||!x.widgets||Object.entries(u).forEach(([f,b])=>{for(const y of x.widgets)if(y.name===f){y.value=b;break}})}),s.graph.setDirtyCanvas(!1,!0),o(!0),setTimeout(()=>{o(!1)},3e3))}},ns=(t,r,s,l,a,o,n)=>{if(n&&(n.preventDefault(),n.stopPropagation()),t===1&&s!==void 0){const i=[...r];i[s],i.splice(s,1),i.length===0?a&&(l({type:"SET_SCREEN_STATE",payload:null}),o(!0),a()):l({type:"SET_SELECTED_NODE",payload:i});return}a&&(l({type:"SET_SCREEN_STATE",payload:null}),o(!0),a())},os=({selectedNodes:t,visible:r,onClose:s})=>{const[l,a]=w.useState(0),[o,n]=w.useState({Steps:!0,CFG:!0,sampler_name:!0,threshold:!1,prompt:!1}),[i,d]=w.useState(ie()),[m,u]=w.useState(!1),[x,f]=w.useState(!1),[b,y]=w.useState(0),[N,k]=w.useState(12),[$,P]=w.useState(null),[g,C]=w.useState(()=>Array(12).fill(null).map((c,h)=>({url:`https://source.unsplash.com/random/300x300?sig=${Math.random()}`,params:{step:h%3===0?5:h%3===1?10:15,sampler_name:"euler",cfg:1}}))),[p,M]=w.useState({}),[B,G]=w.useState({}),[j,E]=w.useState({}),[R,v]=w.useState({}),[W,I]=w.useState(1),_=6,[T,z]=w.useState(null),[S,F]=w.useState(!1),[L,O]=w.useState(!1),[D,H]=w.useState(""),[U,J]=w.useState(null),[V,Y]=w.useState({}),[He,ne]=w.useState(!1),[ce,de]=w.useState(""),[we,xe]=w.useState([]),[Ue,me]=w.useState(!1),[Ge,Ne]=w.useState(""),[Je,ke]=w.useState(""),[Ke,ue]=w.useState(null),[Se,oe]=w.useState({}),[he,ge]=w.useState(!1),[Ve,qe]=w.useState([]),[Ce,pe]=w.useState(null),{dispatch:fe}=ve(),Le=w.useRef(null),Me=w.useRef(null),[Ye,ae]=w.useState(()=>r);w.useEffect(()=>{if(he){const c=Te();qe(c)}},[he]);const Xe=async()=>{Xt(ce,i,me,ue,xe,oe)},Qe=(c,h,A,K)=>{const Z=Et(c,h,A,K,V,Y);X(c,h,Z)},Ze=(c,h)=>{const A=_t(c,h,V,Y);X(c,h,A)},et=(c,h,A)=>{const K=It(c,h,A,V,Y);X(c,h,K)},tt=c=>{Qt(c,oe)},st=()=>{Zt(Ge,Je,Se,we,ce,i,V,Y,X,ne)},rt=(c,h)=>{es(c,h,ne,Ne,ke,de,xe,oe,me,ue)},$e=c=>{c&&(c.preventDefault(),c.stopPropagation()),ge(h=>!h)},nt=c=>{pe(c),ge(!1),C(c.generatedImages||[]),P(null),I(1)},ot=c=>{c&&(c.preventDefault(),c.stopPropagation()),pe(null)};w.useEffect(()=>{if(!t||t.length===0)return;const c={...p},h=t.map(K=>K.id.toString());Object.keys(c).forEach(K=>{h.includes(K)||delete c[K]}),t.forEach(K=>{const Z=K.id.toString();c[Z]||(c[Z]={})}),JSON.stringify(c)!==JSON.stringify(p)&&M(c)},[t,p]),w.useEffect(()=>{fe({type:"SET_SCREEN_STATE",payload:{currentScreen:l,isProcessing:m,isCompleted:x}})},[l,m,x,fe]),w.useEffect(()=>{const c=document.createElement("style");return c.textContent=Mt,document.head.appendChild(c),()=>{document.head.removeChild(c)}},[]),w.useEffect(()=>{const c=h=>{if(Object.values(B).some(A=>A)){const A=h.target,K=!!A.closest(".dropdown-menu"),Z=!!A.closest("[data-dropdown]");!K&&!Z&&G({})}};return document.addEventListener("mousedown",c),()=>{document.removeEventListener("mousedown",c)}},[B]),w.useEffect(()=>{r&&(JSON.parse(localStorage.getItem(re)||"{}").task_id||d(ie()))},[r]),w.useEffect(()=>{if(r){ae(!0);try{const c=localStorage.getItem(re);if(c){const h=JSON.parse(c);if(!t||t.length===0){console.log("Not restoring parameter debug state: no nodes selected"),ae(!1);return}h.currentScreen!==void 0&&a(h.currentScreen),h.selectedParams&&n(h.selectedParams),h.task_id&&d(h.task_id);const A=h.generatedImages&&h.generatedImages.length>0;h.isProcessing!==void 0&&!h.isProcessing&&u(!1),h.isCompleted!==void 0&&A&&f(h.isCompleted),h.completedCount!==void 0&&y(h.completedCount),h.totalCount!==void 0&&k(h.totalCount),h.selectedImageIndex!==void 0&&P(h.selectedImageIndex),h.generatedImages&&C(h.generatedImages),h.paramTestValues&&M(h.paramTestValues),h.searchTerms&&E(h.searchTerms),h.inputValues&&v(h.inputValues),h.currentPage!==void 0&&I(h.currentPage),h.textInputs&&Y(h.textInputs)}}catch(c){console.error("Error loading parameter debug state:",c)}finally{setTimeout(()=>{ae(!1)},50)}}else ae(!0);return()=>{if(!r)return;Ae({currentScreen:l,selectedParams:o,task_id:i,isProcessing:m,isCompleted:x,completedCount:b,totalCount:N,selectedImageIndex:$,generatedImages:g,paramTestValues:p,searchTerms:j,inputValues:R,currentPage:W,textInputs:V})}},[r]);const at=(c=!1)=>{ts(a,n,d,ye,u,f,y,k,P,C,M,G,E,v,I,z,F,O,H,J,Y,ne,de,xe,me,Ne,ke,ue,oe,c),ge(!1),pe(null)};w.useEffect(()=>{if(!r)return;const c=setTimeout(()=>{Ae({currentScreen:l,selectedParams:o,task_id:i,isProcessing:m,isCompleted:x,completedCount:b,totalCount:N,selectedImageIndex:$,generatedImages:g,paramTestValues:p,searchTerms:j,inputValues:R,currentPage:W,textInputs:V})},500);return()=>clearTimeout(c)},[r,l,o,i,m,x,b,N,$,g,p,j,R,W,V]);const Pe=c=>{Ft(l,a,o,p,M,V,t,k,z,je,c)},be=c=>{Ht(l,a,t,p,M,V,x,f,z,c)},lt=(c,h)=>{Tt(c,o,n,p,M,h)},it=(c,h,A)=>{Ot(c,h,A,B,G)},X=(c,h,A)=>{Dt(c,h,A,p,M)},ct=(c,h,A,K)=>{At(c,h,A,p,M,K)},dt=(c,h,A)=>{Wt(c,h,A,j,E)},xt=(c,h,A)=>{Bt(c,h,A,p,X)},Ee=(c,h)=>{Ut(c,_,g,I,h)},ye=()=>{Fe(Le,Me)};w.useEffect(()=>()=>{ye()},[]);const mt=async(c,h)=>{Yt(p,i,u,y,z,C,f,I,Me,Le,je,q,c,h)},_e=(c,h)=>{ss(c,P,h)},Ie=(c,h,A)=>{Rt(c,h,t,H,J,O,A)},ee=c=>{zt(O,c)},ut=async c=>{rs($,g,q,i,p,F,c)},Q=(c,h)=>{ns(l,t,h,fe,s,at,c)},le=()=>e.jsx(e.Fragment,{children:e.jsx(te,{visible:L,imageUrl:D,params:U||{},onClose:ee})});return Ce?e.jsx("div",{className:"flex-1 overflow-y-auto bg-gray-50 p-4",onClick:c=>c.stopPropagation(),children:e.jsx(Lt,{historyItem:Ce,selectedImageIndex:$,handleSelectImage:_e,handleClose:ot,currentPage:W,handlePageChange:Ee,imagesPerPage:_,modalVisible:L,modalImageUrl:D,modalImageParams:U,openImageModal:Ie,closeImageModal:ee})}):he?e.jsx("div",{className:"flex-1 overflow-y-auto bg-gray-50 p-4 flex flex-col h-full max-h-[80vh]",onClick:c=>c.stopPropagation(),children:e.jsx(Ct,{historyItems:Ve,onViewHistoryItem:nt,onClose:$e})}):Ye&&r&&t.length>0?e.jsxs("div",{className:"flex-1 flex flex-col items-center justify-center p-8 bg-gray-50 overflow-y-auto",onClick:c=>c.stopPropagation(),children:[e.jsxs("div",{className:"p-8 rounded-lg shadow-sm relative flex flex-col items-center",children:[e.jsx("div",{className:"w-8 h-8 border-4 border-blue-500 border-t-transparent rounded-full animate-spin"}),e.jsx("div",{className:"mt-4 text-gray-600 text-sm",children:"Loading interface..."})]}),e.jsx(te,{visible:L,imageUrl:D,params:U||{},onClose:ee})]}):!r||t.length===0?e.jsxs("div",{className:"flex-1 flex flex-col items-center justify-center p-8 bg-gray-50 overflow-y-auto",onClick:c=>c.stopPropagation(),children:[e.jsxs("div",{className:"max-w-lg p-8 rounded-lg shadow-sm border border-blue-100 relative",children:[e.jsxs("div",{className:"absolute top-3 right-3 flex",children:[e.jsx("button",{className:"text-blue-500 hover:text-blue-700 mr-2",onClick:$e,title:"Show history",children:e.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",className:"h-5 w-5",viewBox:"0 0 20 20",fill:"currentColor",children:e.jsx("path",{fillRule:"evenodd",d:"M10 18a8 8 0 100-16 8 8 0 000 16zm1-12a1 1 0 10-2 0v4a1 1 0 00.293.707l2.828 2.829a1 1 0 101.415-1.415L11 9.586V6z",clipRule:"evenodd"})})}),e.jsx("button",{className:"text-gray-400 hover:text-gray-600",onClick:Q,children:e.jsx("svg",{className:"h-5 w-5",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M6 18L18 6M6 6l12 12"})})})]}),e.jsxs("div",{className:"mb-6 text-center",children:[e.jsx("h3",{className:"text-base font-bold text-blue-800 mb-2",children:"GenLab"}),e.jsx("div",{className:"h-1 w-16 bg-blue-500 mx-auto rounded-full mb-4"})]}),e.jsxs("div",{className:"space-y-4",children:[e.jsxs("div",{className:"flex items-start space-x-3",children:[e.jsx("div",{className:"bg-blue-100 p-2 rounded-full text-blue-600",children:e.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",className:"h-4 w-4",viewBox:"0 0 20 20",fill:"currentColor",children:e.jsx("path",{d:"M5 3a2 2 0 00-2 2v2a2 2 0 002 2h2a2 2 0 002-2V5a2 2 0 00-2-2H5zM5 11a2 2 0 00-2 2v2a2 2 0 002 2h2a2 2 0 002-2v-2a2 2 0 00-2-2H5zM11 5a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2V5zM11 13a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2v-2z"})})}),e.jsxs("div",{children:[e.jsx("h4",{className:"text-sm font-medium text-gray-800",children:"Parameter Lab GenLab"}),e.jsx("p",{className:"text-xs text-gray-600",children:"Batch‑test parameters & find the optimal combo in one click"})]})]}),e.jsxs("div",{className:"flex items-start space-x-3",children:[e.jsx("div",{className:"bg-indigo-100 p-2 rounded-full text-indigo-600",children:e.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",className:"h-4 w-4",viewBox:"0 0 20 20",fill:"currentColor",children:e.jsx("path",{fillRule:"evenodd",d:"M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a1 1 0 000 2v3a1 1 0 001 1h1a1 1 0 100-2v-3a1 1 0 00-1-1H9z",clipRule:"evenodd"})})}),e.jsxs("div",{children:[e.jsx("h4",{className:"text-sm font-medium text-gray-800",children:"How To Use"}),e.jsx("p",{className:"text-xs text-gray-600",children:"Click any node (hold Shift to select multiple nodes)."}),e.jsx("p",{className:"text-xs text-gray-600",children:"Set parameter ranges and start batch generation."})]})]}),e.jsx("div",{className:"mt-6 text-center",children:e.jsx("p",{className:"text-xs text-gray-600 mb-3",children:"Let’s select a node to begin!"})})]})]}),e.jsx(te,{visible:L,imageUrl:D,params:U||{},onClose:ee})]}):x?e.jsx("div",{className:"flex-1 overflow-y-auto bg-gray-50 p-4",onClick:c=>c.stopPropagation(),children:e.jsx(wt,{generatedImages:g,selectedImageIndex:$,handleSelectImage:_e,handleApplySelected:ut,handlePrevious:be,handleClose:Q,currentPage:W,handlePageChange:Ee,imagesPerPage:_,notificationVisible:S,modalVisible:L,modalImageUrl:D,modalImageParams:U,openImageModal:Ie,closeImageModal:ee})}):m?e.jsxs("div",{className:"flex-1 overflow-y-auto bg-gray-50 p-4",onClick:c=>c.stopPropagation(),children:[e.jsx(vt,{selectedNodes:t,paramTestValues:p,selectedParams:o,totalCount:N,completedCount:b,errorMessage:T,handleClose:Q,setIsProcessing:u,setCurrentScreen:a,cleanupPolling:ye}),e.jsx(le,{})]}):l===0?e.jsxs("div",{className:"flex-1 overflow-y-auto bg-gray-50 p-4 flex flex-col h-full max-h-[80vh]",onClick:c=>c.stopPropagation(),children:[e.jsx(bt,{selectedNodes:t,handleParamSelect:lt,selectedParams:o,handleNext:Pe,handleClose:Q}),e.jsx(le,{})]}):l===1?e.jsxs("div",{className:"flex-1 overflow-y-auto bg-gray-50 p-4 flex flex-col h-full max-h-[80vh]",onClick:c=>c.stopPropagation(),children:[e.jsx(yt,{selectedNodes:t,paramTestValues:p,selectedParams:o,updateParamTestValues:X,toggleDropdown:it,openDropdowns:B,handleTestValueSelect:ct,searchTerms:j,handleSearch:dt,handleSelectAll:xt,handleNext:Pe,handlePrevious:be,handleClose:Q,inputValues:R,setInputValues:v,textInputs:V,handleTextInputChange:Qe,handleAddTextInput:Ze,handleRemoveTextInput:et,openAiWritingModal:rt}),e.jsx(Nt,{visible:He,aiWritingModalText:ce,setAiWritingModalText:de,aiGeneratedTexts:we,aiSelectedTexts:Se,aiWritingLoading:Ue,aiWritingError:Ke,handleAiWriting:Xe,toggleTextSelection:tt,addSelectedTexts:st,onClose:()=>ne(!1)}),e.jsx(le,{})]}):e.jsxs("div",{className:"flex-1 overflow-y-auto bg-gray-50 p-4 flex flex-col h-full max-h-[80vh]",onClick:c=>c.stopPropagation(),children:[e.jsx(jt,{selectedNodes:t,paramTestValues:p,selectedParams:o,totalCount:N,errorMessage:T,handlePrevious:be,handleStartGeneration:mt,handleClose:Q}),e.jsx(le,{})]})},ms=t=>{const{dispatch:r}=ve(),[s,l]=w.useState(!1);return w.useEffect(()=>{if(t.visible&&!s){const a=$t();a&&a.screenState&&r({type:"SET_SCREEN_STATE",payload:{currentScreen:a.currentScreen,isProcessing:a.isProcessing,isCompleted:a.isCompleted}}),l(!0)}},[t.visible,s,r]),w.useEffect(()=>()=>{t.visible||r({type:"SET_SCREEN_STATE",payload:null})},[t.visible,r]),e.jsx(os,{...t})};export{ms as ParameterDebugInterface}; diff --git a/dist/copilot_web/assets/input-0GzdDP_m.css b/dist/copilot_web/assets/input-0GzdDP_m.css deleted file mode 100644 index 3cd2139..0000000 --- a/dist/copilot_web/assets/input-0GzdDP_m.css +++ /dev/null @@ -1 +0,0 @@ -#comfyui-copilot-plugin *,#comfyui-copilot-plugin :before,#comfyui-copilot-plugin :after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }#comfyui-copilot-plugin ::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }#comfyui-copilot-plugin .container{width:100%}@media (min-width: 640px){#comfyui-copilot-plugin .container{max-width:640px}}@media (min-width: 768px){#comfyui-copilot-plugin .container{max-width:768px}}@media (min-width: 1024px){#comfyui-copilot-plugin .container{max-width:1024px}}@media (min-width: 1280px){#comfyui-copilot-plugin .container{max-width:1280px}}@media (min-width: 1536px){#comfyui-copilot-plugin .container{max-width:1536px}}#comfyui-copilot-plugin .prose,#comfyui-copilot-plugin .prose-neutral{--tw-prose-links: inherit;--tw-prose-headings: inherit}#comfyui-copilot-plugin .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}#comfyui-copilot-plugin .\!visible{visibility:visible!important}#comfyui-copilot-plugin .visible{visibility:visible}#comfyui-copilot-plugin .invisible{visibility:hidden}#comfyui-copilot-plugin .collapse{visibility:collapse}#comfyui-copilot-plugin .static{position:static}#comfyui-copilot-plugin .fixed{position:fixed}#comfyui-copilot-plugin .absolute{position:absolute}#comfyui-copilot-plugin .relative{position:relative}#comfyui-copilot-plugin .sticky{position:sticky}#comfyui-copilot-plugin .inset-0{inset:0}#comfyui-copilot-plugin .inset-y-0{top:0;bottom:0}#comfyui-copilot-plugin .-bottom-1{bottom:-.25rem}#comfyui-copilot-plugin .-right-1{right:-.25rem}#comfyui-copilot-plugin .-top-1{top:-.25rem}#comfyui-copilot-plugin .-top-10{top:-2.5rem}#comfyui-copilot-plugin .-top-6{top:-1.5rem}#comfyui-copilot-plugin .bottom-0{bottom:0}#comfyui-copilot-plugin .bottom-1{bottom:.25rem}#comfyui-copilot-plugin .bottom-2{bottom:.5rem}#comfyui-copilot-plugin .bottom-3{bottom:.75rem}#comfyui-copilot-plugin .bottom-full{bottom:100%}#comfyui-copilot-plugin .left-0{left:0}#comfyui-copilot-plugin .left-1\/2{left:50%}#comfyui-copilot-plugin .left-3{left:.75rem}#comfyui-copilot-plugin .right-0{right:0}#comfyui-copilot-plugin .right-1\.5{right:.375rem}#comfyui-copilot-plugin .right-12{right:3rem}#comfyui-copilot-plugin .right-2{right:.5rem}#comfyui-copilot-plugin .right-3{right:.75rem}#comfyui-copilot-plugin .right-4{right:1rem}#comfyui-copilot-plugin .top-0{top:0}#comfyui-copilot-plugin .top-1\/2{top:50%}#comfyui-copilot-plugin .top-2{top:.5rem}#comfyui-copilot-plugin .top-4{top:1rem}#comfyui-copilot-plugin .z-10{z-index:10}#comfyui-copilot-plugin .z-50{z-index:50}#comfyui-copilot-plugin .z-\[9999\]{z-index:9999}#comfyui-copilot-plugin .\!my-0\.5{margin-top:.125rem!important;margin-bottom:.125rem!important}#comfyui-copilot-plugin .\!my-1{margin-top:.25rem!important;margin-bottom:.25rem!important}#comfyui-copilot-plugin .mx-auto{margin-left:auto;margin-right:auto}#comfyui-copilot-plugin .-ml-1{margin-left:-.25rem}#comfyui-copilot-plugin .mb-1{margin-bottom:.25rem}#comfyui-copilot-plugin .mb-2{margin-bottom:.5rem}#comfyui-copilot-plugin .mb-3{margin-bottom:.75rem}#comfyui-copilot-plugin .mb-4{margin-bottom:1rem}#comfyui-copilot-plugin .mb-6{margin-bottom:1.5rem}#comfyui-copilot-plugin .ml-1{margin-left:.25rem}#comfyui-copilot-plugin .ml-2{margin-left:.5rem}#comfyui-copilot-plugin .ml-3{margin-left:.75rem}#comfyui-copilot-plugin .mr-1{margin-right:.25rem}#comfyui-copilot-plugin .mr-2{margin-right:.5rem}#comfyui-copilot-plugin .mr-3{margin-right:.75rem}#comfyui-copilot-plugin .mt-0\.5{margin-top:.125rem}#comfyui-copilot-plugin .mt-1{margin-top:.25rem}#comfyui-copilot-plugin .mt-12{margin-top:3rem}#comfyui-copilot-plugin .mt-2{margin-top:.5rem}#comfyui-copilot-plugin .mt-4{margin-top:1rem}#comfyui-copilot-plugin .mt-6{margin-top:1.5rem}#comfyui-copilot-plugin .line-clamp-2{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}#comfyui-copilot-plugin .block{display:block}#comfyui-copilot-plugin .inline{display:inline}#comfyui-copilot-plugin .flex{display:flex}#comfyui-copilot-plugin .inline-flex{display:inline-flex}#comfyui-copilot-plugin .table{display:table}#comfyui-copilot-plugin .grid{display:grid}#comfyui-copilot-plugin .contents{display:contents}#comfyui-copilot-plugin .hidden{display:none}#comfyui-copilot-plugin .aspect-square{aspect-ratio:1 / 1}#comfyui-copilot-plugin .h-0{height:0px}#comfyui-copilot-plugin .h-1{height:.25rem}#comfyui-copilot-plugin .h-10{height:2.5rem}#comfyui-copilot-plugin .h-14{height:3.5rem}#comfyui-copilot-plugin .h-2{height:.5rem}#comfyui-copilot-plugin .h-20{height:5rem}#comfyui-copilot-plugin .h-3{height:.75rem}#comfyui-copilot-plugin .h-3\.5{height:.875rem}#comfyui-copilot-plugin .h-4{height:1rem}#comfyui-copilot-plugin .h-5{height:1.25rem}#comfyui-copilot-plugin .h-6{height:1.5rem}#comfyui-copilot-plugin .h-7{height:1.75rem}#comfyui-copilot-plugin .h-8{height:2rem}#comfyui-copilot-plugin .h-\[4\.5rem\]{height:4.5rem}#comfyui-copilot-plugin .h-auto{height:auto}#comfyui-copilot-plugin .h-full{height:100%}#comfyui-copilot-plugin .max-h-16{max-height:4rem}#comfyui-copilot-plugin .max-h-60{max-height:15rem}#comfyui-copilot-plugin .max-h-\[400px\]{max-height:400px}#comfyui-copilot-plugin .max-h-\[40vh\]{max-height:40vh}#comfyui-copilot-plugin .max-h-\[80vh\]{max-height:80vh}#comfyui-copilot-plugin .max-h-\[90vh\]{max-height:90vh}#comfyui-copilot-plugin .max-h-\[calc\(90vh-4rem\)\]{max-height:calc(90vh - 4rem)}#comfyui-copilot-plugin .min-h-\[80px\]{min-height:80px}#comfyui-copilot-plugin .w-1{width:.25rem}#comfyui-copilot-plugin .w-1\/2{width:50%}#comfyui-copilot-plugin .w-10{width:2.5rem}#comfyui-copilot-plugin .w-12{width:3rem}#comfyui-copilot-plugin .w-14{width:3.5rem}#comfyui-copilot-plugin .w-16{width:4rem}#comfyui-copilot-plugin .w-2{width:.5rem}#comfyui-copilot-plugin .w-3{width:.75rem}#comfyui-copilot-plugin .w-3\.5{width:.875rem}#comfyui-copilot-plugin .w-4{width:1rem}#comfyui-copilot-plugin .w-48{width:12rem}#comfyui-copilot-plugin .w-5{width:1.25rem}#comfyui-copilot-plugin .w-64{width:16rem}#comfyui-copilot-plugin .w-8{width:2rem}#comfyui-copilot-plugin .w-96{width:24rem}#comfyui-copilot-plugin .w-\[100\%\]{width:100%}#comfyui-copilot-plugin .w-\[480px\]{width:480px}#comfyui-copilot-plugin .w-\[500px\]{width:500px}#comfyui-copilot-plugin .w-\[calc\(50\%-0\.25rem\)\]{width:calc(50% - .25rem)}#comfyui-copilot-plugin .w-auto{width:auto}#comfyui-copilot-plugin .w-full{width:100%}#comfyui-copilot-plugin .min-w-\[400px\]{min-width:400px}#comfyui-copilot-plugin .max-w-2xl{max-width:42rem}#comfyui-copilot-plugin .max-w-4xl{max-width:56rem}#comfyui-copilot-plugin .max-w-full{max-width:100%}#comfyui-copilot-plugin .max-w-lg{max-width:32rem}#comfyui-copilot-plugin .flex-1{flex:1 1 0%}#comfyui-copilot-plugin .flex-shrink-0{flex-shrink:0}#comfyui-copilot-plugin .-translate-x-1\/2{--tw-translate-x: -50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}#comfyui-copilot-plugin .-translate-y-1\/2{--tw-translate-y: -50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}#comfyui-copilot-plugin .-translate-y-full{--tw-translate-y: -100%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}#comfyui-copilot-plugin .transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}#comfyui-copilot-plugin{@keyframes bounce{0%,to{transform:translateY(-25%);animation-timing-function:cubic-bezier(.8,0,1,1)}50%{transform:none;animation-timing-function:cubic-bezier(0,0,.2,1)}}}#comfyui-copilot-plugin .animate-bounce{animation:bounce 1s infinite}#comfyui-copilot-plugin{@keyframes spin{to{transform:rotate(360deg)}}}#comfyui-copilot-plugin .animate-spin{animation:spin 1s linear infinite}#comfyui-copilot-plugin .cursor-ew-resize{cursor:ew-resize}#comfyui-copilot-plugin .cursor-help{cursor:help}#comfyui-copilot-plugin .cursor-not-allowed{cursor:not-allowed}#comfyui-copilot-plugin .cursor-pointer{cursor:pointer}#comfyui-copilot-plugin .resize-none{resize:none}#comfyui-copilot-plugin .resize-y{resize:vertical}#comfyui-copilot-plugin .resize{resize:both}#comfyui-copilot-plugin .appearance-none{-webkit-appearance:none;-moz-appearance:none;appearance:none}#comfyui-copilot-plugin .grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}#comfyui-copilot-plugin .grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}#comfyui-copilot-plugin .flex-col{flex-direction:column}#comfyui-copilot-plugin .flex-wrap{flex-wrap:wrap}#comfyui-copilot-plugin .items-start{align-items:flex-start}#comfyui-copilot-plugin .items-center{align-items:center}#comfyui-copilot-plugin .justify-end{justify-content:flex-end}#comfyui-copilot-plugin .justify-center{justify-content:center}#comfyui-copilot-plugin .justify-between{justify-content:space-between}#comfyui-copilot-plugin .gap-1{gap:.25rem}#comfyui-copilot-plugin .gap-2{gap:.5rem}#comfyui-copilot-plugin .gap-3{gap:.75rem}#comfyui-copilot-plugin .gap-4{gap:1rem}#comfyui-copilot-plugin .space-x-1>:not([hidden])~:not([hidden]){--tw-space-x-reverse: 0;margin-right:calc(.25rem * var(--tw-space-x-reverse));margin-left:calc(.25rem * calc(1 - var(--tw-space-x-reverse)))}#comfyui-copilot-plugin .space-x-2>:not([hidden])~:not([hidden]){--tw-space-x-reverse: 0;margin-right:calc(.5rem * var(--tw-space-x-reverse));margin-left:calc(.5rem * calc(1 - var(--tw-space-x-reverse)))}#comfyui-copilot-plugin .space-x-3>:not([hidden])~:not([hidden]){--tw-space-x-reverse: 0;margin-right:calc(.75rem * var(--tw-space-x-reverse));margin-left:calc(.75rem * calc(1 - var(--tw-space-x-reverse)))}#comfyui-copilot-plugin .space-y-2>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.5rem * var(--tw-space-y-reverse))}#comfyui-copilot-plugin .space-y-3>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.75rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.75rem * var(--tw-space-y-reverse))}#comfyui-copilot-plugin .space-y-4>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(1rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem * var(--tw-space-y-reverse))}#comfyui-copilot-plugin .overflow-auto{overflow:auto}#comfyui-copilot-plugin .overflow-hidden{overflow:hidden}#comfyui-copilot-plugin .overflow-visible{overflow:visible}#comfyui-copilot-plugin .overflow-x-auto{overflow-x:auto}#comfyui-copilot-plugin .overflow-y-auto{overflow-y:auto}#comfyui-copilot-plugin .scroll-smooth{scroll-behavior:smooth}#comfyui-copilot-plugin .text-ellipsis{text-overflow:ellipsis}#comfyui-copilot-plugin .whitespace-normal{white-space:normal}#comfyui-copilot-plugin .whitespace-nowrap{white-space:nowrap}#comfyui-copilot-plugin .whitespace-pre-wrap{white-space:pre-wrap}#comfyui-copilot-plugin .break-words{overflow-wrap:break-word}#comfyui-copilot-plugin .rounded{border-radius:.25rem}#comfyui-copilot-plugin .rounded-full{border-radius:9999px}#comfyui-copilot-plugin .rounded-lg{border-radius:.5rem}#comfyui-copilot-plugin .rounded-md{border-radius:.375rem}#comfyui-copilot-plugin .rounded-sm{border-radius:.125rem}#comfyui-copilot-plugin .rounded-xl{border-radius:.75rem}#comfyui-copilot-plugin .border{border-width:1px}#comfyui-copilot-plugin .border-0{border-width:0px}#comfyui-copilot-plugin .border-2{border-width:2px}#comfyui-copilot-plugin .border-4{border-width:4px}#comfyui-copilot-plugin .border-b{border-bottom-width:1px}#comfyui-copilot-plugin .border-b-2{border-bottom-width:2px}#comfyui-copilot-plugin .border-l-4{border-left-width:4px}#comfyui-copilot-plugin .border-t{border-top-width:1px}#comfyui-copilot-plugin .border-solid{border-style:solid}#comfyui-copilot-plugin .border-dashed{border-style:dashed}#comfyui-copilot-plugin .border-none{border-style:none}#comfyui-copilot-plugin .border-\[\#979797\]{--tw-border-opacity: 1;border-color:rgb(151 151 151 / var(--tw-border-opacity, 1))}#comfyui-copilot-plugin .border-amber-200{--tw-border-opacity: 1;border-color:rgb(253 230 138 / var(--tw-border-opacity, 1))}#comfyui-copilot-plugin .border-blue-100{--tw-border-opacity: 1;border-color:rgb(219 234 254 / var(--tw-border-opacity, 1))}#comfyui-copilot-plugin .border-blue-200{--tw-border-opacity: 1;border-color:rgb(191 219 254 / var(--tw-border-opacity, 1))}#comfyui-copilot-plugin .border-blue-300{--tw-border-opacity: 1;border-color:rgb(147 197 253 / var(--tw-border-opacity, 1))}#comfyui-copilot-plugin .border-blue-500{--tw-border-opacity: 1;border-color:rgb(59 130 246 / var(--tw-border-opacity, 1))}#comfyui-copilot-plugin .border-blue-600{--tw-border-opacity: 1;border-color:rgb(37 99 235 / var(--tw-border-opacity, 1))}#comfyui-copilot-plugin .border-gray-100{border-color:color-mix(in srgb,var(--p-text-color) 10%,transparent)}#comfyui-copilot-plugin .border-gray-200{border-color:color-mix(in srgb,var(--p-text-color) 20%,transparent)}#comfyui-copilot-plugin .border-gray-300{border-color:color-mix(in srgb,var(--p-text-color) 30%,transparent)}#comfyui-copilot-plugin .border-gray-700{border-color:color-mix(in srgb,var(--p-text-color) 70%,transparent)}#comfyui-copilot-plugin .border-gray-900{border-color:color-mix(in srgb,var(--p-text-color) 90%,transparent)}#comfyui-copilot-plugin .border-green-200{--tw-border-opacity: 1;border-color:rgb(187 247 208 / var(--tw-border-opacity, 1))}#comfyui-copilot-plugin .border-green-500{--tw-border-opacity: 1;border-color:rgb(34 197 94 / var(--tw-border-opacity, 1))}#comfyui-copilot-plugin .border-pink-500{--tw-border-opacity: 1;border-color:rgb(236 72 153 / var(--tw-border-opacity, 1))}#comfyui-copilot-plugin .border-red-200{--tw-border-opacity: 1;border-color:rgb(254 202 202 / var(--tw-border-opacity, 1))}#comfyui-copilot-plugin .border-red-500{--tw-border-opacity: 1;border-color:rgb(239 68 68 / var(--tw-border-opacity, 1))}#comfyui-copilot-plugin .border-transparent{border-color:transparent}#comfyui-copilot-plugin .border-yellow-200{--tw-border-opacity: 1;border-color:rgb(254 240 138 / var(--tw-border-opacity, 1))}#comfyui-copilot-plugin .border-t-blue-500{--tw-border-opacity: 1;border-top-color:rgb(59 130 246 / var(--tw-border-opacity, 1))}#comfyui-copilot-plugin .border-t-gray-800{border-top-color:color-mix(in srgb,var(--p-text-color) 80%,transparent)}#comfyui-copilot-plugin .border-t-transparent{border-top-color:transparent}#comfyui-copilot-plugin .bg-black{--tw-bg-opacity: 1;background-color:rgb(0 0 0 / var(--tw-bg-opacity, 1))}#comfyui-copilot-plugin .bg-black\/40{background-color:#0006}#comfyui-copilot-plugin .bg-blue-100{--tw-bg-opacity: 1;background-color:rgb(219 234 254 / var(--tw-bg-opacity, 1))}#comfyui-copilot-plugin .bg-blue-50{--tw-bg-opacity: 1;background-color:rgb(239 246 255 / var(--tw-bg-opacity, 1))}#comfyui-copilot-plugin .bg-blue-500{--tw-bg-opacity: 1;background-color:rgb(59 130 246 / var(--tw-bg-opacity, 1))}#comfyui-copilot-plugin .bg-blue-600{--tw-bg-opacity: 1;background-color:rgb(37 99 235 / var(--tw-bg-opacity, 1))}#comfyui-copilot-plugin .bg-gray-100{background-color:color-mix(in srgb,var(--p-text-color) 10%,transparent)}#comfyui-copilot-plugin .bg-gray-200{background-color:color-mix(in srgb,var(--p-text-color) 20%,transparent)}#comfyui-copilot-plugin .bg-gray-300{background-color:color-mix(in srgb,var(--p-text-color) 30%,transparent)}#comfyui-copilot-plugin .bg-gray-400{background-color:color-mix(in srgb,var(--p-text-color) 40%,transparent)}#comfyui-copilot-plugin .bg-gray-50{background-color:color-mix(in srgb,var(--p-text-color) 5%,transparent)}#comfyui-copilot-plugin .bg-gray-500{background-color:color-mix(in srgb,var(--p-text-color) 50%,transparent)}#comfyui-copilot-plugin .bg-gray-700{background-color:color-mix(in srgb,var(--p-text-color) 70%,transparent)}#comfyui-copilot-plugin .bg-gray-800{background-color:color-mix(in srgb,var(--p-text-color) 80%,transparent)}#comfyui-copilot-plugin .bg-gray-900{background-color:color-mix(in srgb,var(--p-text-color) 90%,transparent)}#comfyui-copilot-plugin .bg-green-100{--tw-bg-opacity: 1;background-color:rgb(220 252 231 / var(--tw-bg-opacity, 1))}#comfyui-copilot-plugin .bg-green-50{--tw-bg-opacity: 1;background-color:rgb(240 253 244 / var(--tw-bg-opacity, 1))}#comfyui-copilot-plugin .bg-indigo-100{--tw-bg-opacity: 1;background-color:rgb(224 231 255 / var(--tw-bg-opacity, 1))}#comfyui-copilot-plugin .bg-pink-200{--tw-bg-opacity: 1;background-color:rgb(251 207 232 / var(--tw-bg-opacity, 1))}#comfyui-copilot-plugin .bg-pink-500{--tw-bg-opacity: 1;background-color:rgb(236 72 153 / var(--tw-bg-opacity, 1))}#comfyui-copilot-plugin .bg-purple-100{--tw-bg-opacity: 1;background-color:rgb(243 232 255 / var(--tw-bg-opacity, 1))}#comfyui-copilot-plugin .bg-red-100{--tw-bg-opacity: 1;background-color:rgb(254 226 226 / var(--tw-bg-opacity, 1))}#comfyui-copilot-plugin .bg-red-50{--tw-bg-opacity: 1;background-color:rgb(254 242 242 / var(--tw-bg-opacity, 1))}#comfyui-copilot-plugin .bg-red-500{--tw-bg-opacity: 1;background-color:rgb(239 68 68 / var(--tw-bg-opacity, 1))}#comfyui-copilot-plugin .bg-transparent{background-color:transparent}#comfyui-copilot-plugin .bg-white{background-color:var(--p-panel-background)}#comfyui-copilot-plugin .bg-yellow-50{--tw-bg-opacity: 1;background-color:rgb(254 252 232 / var(--tw-bg-opacity, 1))}#comfyui-copilot-plugin .bg-opacity-30{--tw-bg-opacity: .3}#comfyui-copilot-plugin .bg-opacity-50{--tw-bg-opacity: .5}#comfyui-copilot-plugin .bg-opacity-75{--tw-bg-opacity: .75}#comfyui-copilot-plugin .bg-gradient-to-r{background-image:linear-gradient(to right,var(--tw-gradient-stops))}#comfyui-copilot-plugin .from-amber-50{--tw-gradient-from: #fffbeb var(--tw-gradient-from-position);--tw-gradient-to: rgb(255 251 235 / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)}#comfyui-copilot-plugin .to-amber-100{--tw-gradient-to: #fef3c7 var(--tw-gradient-to-position)}#comfyui-copilot-plugin .fill-current{fill:currentColor}#comfyui-copilot-plugin .object-contain{-o-object-fit:contain;object-fit:contain}#comfyui-copilot-plugin .object-cover{-o-object-fit:cover;object-fit:cover}#comfyui-copilot-plugin .p-0\.5{padding:.125rem}#comfyui-copilot-plugin .p-1{padding:.25rem}#comfyui-copilot-plugin .p-1\.5{padding:.375rem}#comfyui-copilot-plugin .p-2{padding:.5rem}#comfyui-copilot-plugin .p-3{padding:.75rem}#comfyui-copilot-plugin .p-4{padding:1rem}#comfyui-copilot-plugin .p-6{padding:1.5rem}#comfyui-copilot-plugin .p-8{padding:2rem}#comfyui-copilot-plugin .px-1{padding-left:.25rem;padding-right:.25rem}#comfyui-copilot-plugin .px-1\.5{padding-left:.375rem;padding-right:.375rem}#comfyui-copilot-plugin .px-2{padding-left:.5rem;padding-right:.5rem}#comfyui-copilot-plugin .px-3{padding-left:.75rem;padding-right:.75rem}#comfyui-copilot-plugin .px-4{padding-left:1rem;padding-right:1rem}#comfyui-copilot-plugin .px-5{padding-left:1.25rem;padding-right:1.25rem}#comfyui-copilot-plugin .py-0\.5{padding-top:.125rem;padding-bottom:.125rem}#comfyui-copilot-plugin .py-1{padding-top:.25rem;padding-bottom:.25rem}#comfyui-copilot-plugin .py-1\.5{padding-top:.375rem;padding-bottom:.375rem}#comfyui-copilot-plugin .py-2{padding-top:.5rem;padding-bottom:.5rem}#comfyui-copilot-plugin .py-2\.5{padding-top:.625rem;padding-bottom:.625rem}#comfyui-copilot-plugin .py-3{padding-top:.75rem;padding-bottom:.75rem}#comfyui-copilot-plugin .py-4{padding-top:1rem;padding-bottom:1rem}#comfyui-copilot-plugin .pb-10{padding-bottom:2.5rem}#comfyui-copilot-plugin .pb-2{padding-bottom:.5rem}#comfyui-copilot-plugin .pb-3{padding-bottom:.75rem}#comfyui-copilot-plugin .pr-12{padding-right:3rem}#comfyui-copilot-plugin .pr-4{padding-right:1rem}#comfyui-copilot-plugin .pr-6{padding-right:1.5rem}#comfyui-copilot-plugin .pt-1{padding-top:.25rem}#comfyui-copilot-plugin .pt-2{padding-top:.5rem}#comfyui-copilot-plugin .pt-6{padding-top:1.5rem}#comfyui-copilot-plugin .text-left{text-align:left}#comfyui-copilot-plugin .text-center{text-align:center}#comfyui-copilot-plugin .\!text-\[11px\]{font-size:11px!important}#comfyui-copilot-plugin .text-\[10px\]{font-size:10px}#comfyui-copilot-plugin .text-\[11px\]{font-size:11px}#comfyui-copilot-plugin .text-\[12px\]{font-size:12px}#comfyui-copilot-plugin .text-\[14px\]{font-size:14px}#comfyui-copilot-plugin .text-\[16px\]{font-size:16px}#comfyui-copilot-plugin .text-base{font-size:1rem;line-height:1.5rem}#comfyui-copilot-plugin .text-lg{font-size:1.125rem;line-height:1.75rem}#comfyui-copilot-plugin .text-sm{font-size:.875rem;line-height:1.25rem}#comfyui-copilot-plugin .text-xl{font-size:1.25rem;line-height:1.75rem}#comfyui-copilot-plugin .text-xs{font-size:.75rem;line-height:1rem}#comfyui-copilot-plugin .font-bold{font-weight:700}#comfyui-copilot-plugin .font-medium{font-weight:500}#comfyui-copilot-plugin .font-semibold{font-weight:600}#comfyui-copilot-plugin .leading-relaxed{line-height:1.625}#comfyui-copilot-plugin .leading-snug{line-height:1.375}#comfyui-copilot-plugin .text-amber-500{--tw-text-opacity: 1;color:rgb(245 158 11 / var(--tw-text-opacity, 1))}#comfyui-copilot-plugin .text-amber-600{--tw-text-opacity: 1;color:rgb(217 119 6 / var(--tw-text-opacity, 1))}#comfyui-copilot-plugin .text-amber-700{--tw-text-opacity: 1;color:rgb(180 83 9 / var(--tw-text-opacity, 1))}#comfyui-copilot-plugin .text-amber-800{--tw-text-opacity: 1;color:rgb(146 64 14 / var(--tw-text-opacity, 1))}#comfyui-copilot-plugin .text-blue-600{--tw-text-opacity: 1;color:rgb(37 99 235 / var(--tw-text-opacity, 1))}#comfyui-copilot-plugin .text-blue-700{--tw-text-opacity: 1;color:rgb(29 78 216 / var(--tw-text-opacity, 1))}#comfyui-copilot-plugin .text-blue-800{--tw-text-opacity: 1;color:rgb(30 64 175 / var(--tw-text-opacity, 1))}#comfyui-copilot-plugin .text-blue-900{--tw-text-opacity: 1;color:rgb(30 58 138 / var(--tw-text-opacity, 1))}#comfyui-copilot-plugin .text-gray-300{color:color-mix(in srgb,var(--p-text-color) 30%,transparent)}#comfyui-copilot-plugin .text-gray-400{color:color-mix(in srgb,var(--p-text-color) 40%,transparent)}#comfyui-copilot-plugin .text-gray-500{color:color-mix(in srgb,var(--p-text-color) 50%,transparent)}#comfyui-copilot-plugin .text-gray-600{color:color-mix(in srgb,var(--p-text-color) 60%,transparent)}#comfyui-copilot-plugin .text-gray-700{color:color-mix(in srgb,var(--p-text-color) 70%,transparent)}#comfyui-copilot-plugin .text-gray-800{color:color-mix(in srgb,var(--p-text-color) 80%,transparent)}#comfyui-copilot-plugin .text-gray-900{color:color-mix(in srgb,var(--p-text-color) 90%,transparent)}#comfyui-copilot-plugin .text-green-500{--tw-text-opacity: 1;color:rgb(34 197 94 / var(--tw-text-opacity, 1))}#comfyui-copilot-plugin .text-green-700{--tw-text-opacity: 1;color:rgb(21 128 61 / var(--tw-text-opacity, 1))}#comfyui-copilot-plugin .text-green-800{--tw-text-opacity: 1;color:rgb(22 101 52 / var(--tw-text-opacity, 1))}#comfyui-copilot-plugin .text-green-900{--tw-text-opacity: 1;color:rgb(20 83 45 / var(--tw-text-opacity, 1))}#comfyui-copilot-plugin .text-indigo-600{--tw-text-opacity: 1;color:rgb(79 70 229 / var(--tw-text-opacity, 1))}#comfyui-copilot-plugin .text-pink-700{--tw-text-opacity: 1;color:rgb(190 24 93 / var(--tw-text-opacity, 1))}#comfyui-copilot-plugin .text-purple-700{--tw-text-opacity: 1;color:rgb(126 34 206 / var(--tw-text-opacity, 1))}#comfyui-copilot-plugin .text-red-500{--tw-text-opacity: 1;color:rgb(239 68 68 / var(--tw-text-opacity, 1))}#comfyui-copilot-plugin .text-red-600{--tw-text-opacity: 1;color:rgb(220 38 38 / var(--tw-text-opacity, 1))}#comfyui-copilot-plugin .text-red-700{--tw-text-opacity: 1;color:rgb(185 28 28 / var(--tw-text-opacity, 1))}#comfyui-copilot-plugin .text-white{color:var(--p-panel-background)}#comfyui-copilot-plugin .underline{text-decoration-line:underline}#comfyui-copilot-plugin .placeholder-gray-500::-moz-placeholder{color:color-mix(in srgb,var(--p-text-color) 50%,transparent)}#comfyui-copilot-plugin .placeholder-gray-500::placeholder{color:color-mix(in srgb,var(--p-text-color) 50%,transparent)}#comfyui-copilot-plugin .opacity-0{opacity:0}#comfyui-copilot-plugin .opacity-25{opacity:.25}#comfyui-copilot-plugin .opacity-40{opacity:.4}#comfyui-copilot-plugin .opacity-50{opacity:.5}#comfyui-copilot-plugin .opacity-75{opacity:.75}#comfyui-copilot-plugin .shadow{--tw-shadow: 0 1px 3px 0 rgb(0 0 0 / .1), 0 1px 2px -1px rgb(0 0 0 / .1);--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}#comfyui-copilot-plugin .shadow-2xl{--tw-shadow: 0 25px 50px -12px rgb(0 0 0 / .25);--tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}#comfyui-copilot-plugin .shadow-lg{--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}#comfyui-copilot-plugin .shadow-md{--tw-shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}#comfyui-copilot-plugin .shadow-sm{--tw-shadow: 0 1px 2px 0 rgb(0 0 0 / .05);--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}#comfyui-copilot-plugin .outline-none{outline:2px solid transparent;outline-offset:2px}#comfyui-copilot-plugin .ring-2{--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)}#comfyui-copilot-plugin .ring-pink-300{--tw-ring-opacity: 1;--tw-ring-color: rgb(249 168 212 / var(--tw-ring-opacity, 1))}#comfyui-copilot-plugin .filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}#comfyui-copilot-plugin .backdrop-blur-sm{--tw-backdrop-blur: blur(4px);-webkit-backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)}#comfyui-copilot-plugin .transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}#comfyui-copilot-plugin .transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}#comfyui-copilot-plugin .transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}#comfyui-copilot-plugin .transition-opacity{transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}#comfyui-copilot-plugin .duration-200{transition-duration:.2s}#comfyui-copilot-plugin{height:100%;display:flex;flex-direction:column}#comfyui-copilot-plugin h1,#comfyui-copilot-plugin h2,#comfyui-copilot-plugin h3,#comfyui-copilot-plugin h4,#comfyui-copilot-plugin h5,#comfyui-copilot-plugin h6,#comfyui-copilot-plugin p,#comfyui-copilot-plugin ul,#comfyui-copilot-plugin ol,#comfyui-copilot-plugin button,#comfyui-copilot-plugin input,#comfyui-copilot-plugin textarea,#comfyui-copilot-plugin select{margin:0;padding:0;font-size:100%;font-weight:400}#comfyui-copilot-plugin *{box-sizing:border-box;border-width:0;border-style:solid}#comfyui-copilot-plugin img,#comfyui-copilot-plugin svg,#comfyui-copilot-plugin video,#comfyui-copilot-plugin canvas,#comfyui-copilot-plugin audio,#comfyui-copilot-plugin iframe,#comfyui-copilot-plugin embed,#comfyui-copilot-plugin object{display:block;vertical-align:middle}#comfyui-copilot-plugin button{background-color:transparent;background-image:none}.hover\:border-b-2:hover{border-bottom-width:2px}.hover\:border-blue-300:hover{--tw-border-opacity: 1;border-color:rgb(147 197 253 / var(--tw-border-opacity, 1))}.hover\:border-blue-500:hover{--tw-border-opacity: 1;border-color:rgb(59 130 246 / var(--tw-border-opacity, 1))}.hover\:bg-amber-200\/50:hover{background-color:#fde68a80}.hover\:bg-blue-100:hover{--tw-bg-opacity: 1;background-color:rgb(219 234 254 / var(--tw-bg-opacity, 1))}.hover\:bg-blue-200:hover{--tw-bg-opacity: 1;background-color:rgb(191 219 254 / var(--tw-bg-opacity, 1))}.hover\:bg-blue-50:hover{--tw-bg-opacity: 1;background-color:rgb(239 246 255 / var(--tw-bg-opacity, 1))}.hover\:bg-blue-600:hover{--tw-bg-opacity: 1;background-color:rgb(37 99 235 / var(--tw-bg-opacity, 1))}.hover\:bg-blue-700:hover{--tw-bg-opacity: 1;background-color:rgb(29 78 216 / var(--tw-bg-opacity, 1))}.hover\:bg-gray-100:hover{background-color:color-mix(in srgb,var(--p-text-color) 10%,transparent)}.hover\:bg-gray-200:hover{background-color:color-mix(in srgb,var(--p-text-color) 20%,transparent)}.hover\:bg-gray-300:hover{background-color:color-mix(in srgb,var(--p-text-color) 30%,transparent)}.hover\:bg-gray-50:hover{background-color:color-mix(in srgb,var(--p-text-color) 5%,transparent)}.hover\:bg-green-200:hover{--tw-bg-opacity: 1;background-color:rgb(187 247 208 / var(--tw-bg-opacity, 1))}.hover\:bg-pink-300:hover{--tw-bg-opacity: 1;background-color:rgb(249 168 212 / var(--tw-bg-opacity, 1))}.hover\:bg-purple-200:hover{--tw-bg-opacity: 1;background-color:rgb(233 213 255 / var(--tw-bg-opacity, 1))}.hover\:text-amber-700:hover{--tw-text-opacity: 1;color:rgb(180 83 9 / var(--tw-text-opacity, 1))}.hover\:text-amber-800:hover{--tw-text-opacity: 1;color:rgb(146 64 14 / var(--tw-text-opacity, 1))}.hover\:text-blue-500:hover{--tw-text-opacity: 1;color:rgb(59 130 246 / var(--tw-text-opacity, 1))}.hover\:text-blue-600:hover{--tw-text-opacity: 1;color:rgb(37 99 235 / var(--tw-text-opacity, 1))}.hover\:text-blue-700:hover{--tw-text-opacity: 1;color:rgb(29 78 216 / var(--tw-text-opacity, 1))}.hover\:text-gray-600:hover{color:color-mix(in srgb,var(--p-text-color) 60%,transparent)}.hover\:text-gray-700:hover{color:color-mix(in srgb,var(--p-text-color) 70%,transparent)}.hover\:text-gray-900:hover{color:color-mix(in srgb,var(--p-text-color) 90%,transparent)}.hover\:text-red-700:hover{--tw-text-opacity: 1;color:rgb(185 28 28 / var(--tw-text-opacity, 1))}.hover\:opacity-100:hover{opacity:1}.hover\:shadow-sm:hover{--tw-shadow: 0 1px 2px 0 rgb(0 0 0 / .05);--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.focus\:border-blue-500:focus{--tw-border-opacity: 1;border-color:rgb(59 130 246 / var(--tw-border-opacity, 1))}.focus\:border-transparent:focus{border-color:transparent}.focus\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}.focus\:ring-2:focus{--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)}.focus\:ring-blue-500:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(59 130 246 / var(--tw-ring-opacity, 1))}.focus\:ring-blue-500\/20:focus{--tw-ring-color: rgb(59 130 246 / .2)}.active\:scale-95:active{--tw-scale-x: .95;--tw-scale-y: .95;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.disabled\:opacity-50:disabled{opacity:.5}.group:hover .group-hover\:block{display:block}.group:hover .group-hover\:translate-x-1{--tw-translate-x: .25rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.group:hover .group-hover\:opacity-100{opacity:1}.prose-headings\:font-semibold :is(:where(h1,h2,h3,h4,h5,h6,th):not(:where([class~=not-prose],[class~=not-prose] *))){font-weight:600}.prose-h1\:text-base :is(:where(h1):not(:where([class~=not-prose],[class~=not-prose] *))){font-size:1rem;line-height:1.5rem}.prose-h2\:text-sm :is(:where(h2):not(:where([class~=not-prose],[class~=not-prose] *))){font-size:.875rem;line-height:1.25rem}.prose-h3\:text-xs :is(:where(h3):not(:where([class~=not-prose],[class~=not-prose] *))){font-size:.75rem;line-height:1rem}.prose-h4\:text-xs :is(:where(h4):not(:where([class~=not-prose],[class~=not-prose] *))){font-size:.75rem;line-height:1rem}.prose-p\:text-xs :is(:where(p):not(:where([class~=not-prose],[class~=not-prose] *))){font-size:.75rem;line-height:1rem}.prose-a\:font-medium :is(:where(a):not(:where([class~=not-prose],[class~=not-prose] *))){font-weight:500}.prose-a\:text-amber-700 :is(:where(a):not(:where([class~=not-prose],[class~=not-prose] *))){--tw-text-opacity: 1;color:rgb(180 83 9 / var(--tw-text-opacity, 1))}.prose-a\:underline :is(:where(a):not(:where([class~=not-prose],[class~=not-prose] *))){text-decoration-line:underline}.hover\:prose-a\:text-amber-800 :is(:where(a):not(:where([class~=not-prose],[class~=not-prose] *))):hover{--tw-text-opacity: 1;color:rgb(146 64 14 / var(--tw-text-opacity, 1))}.prose-code\:text-xs :is(:where(code):not(:where([class~=not-prose],[class~=not-prose] *))){font-size:.75rem;line-height:1rem}.prose-pre\:text-xs :is(:where(pre):not(:where([class~=not-prose],[class~=not-prose] *))){font-size:.75rem;line-height:1rem}.prose-ol\:text-xs :is(:where(ol):not(:where([class~=not-prose],[class~=not-prose] *))){font-size:.75rem;line-height:1rem}.prose-ul\:text-xs :is(:where(ul):not(:where([class~=not-prose],[class~=not-prose] *))){font-size:.75rem;line-height:1rem}.prose-li\:text-xs :is(:where(li):not(:where([class~=not-prose],[class~=not-prose] *))){font-size:.75rem;line-height:1rem}@media (prefers-color-scheme: dark){.dark\:border-blue-500{--tw-border-opacity: 1;border-color:rgb(59 130 246 / var(--tw-border-opacity, 1))}.dark\:border-gray-600{border-color:color-mix(in srgb,var(--p-text-color) 60%,transparent)}.dark\:border-gray-700{border-color:color-mix(in srgb,var(--p-text-color) 70%,transparent)}.dark\:border-red-800\/20{border-color:#991b1b33}.dark\:bg-blue-500{--tw-bg-opacity: 1;background-color:rgb(59 130 246 / var(--tw-bg-opacity, 1))}.dark\:bg-gray-600{background-color:color-mix(in srgb,var(--p-text-color) 60%,transparent)}.dark\:bg-gray-700{background-color:color-mix(in srgb,var(--p-text-color) 70%,transparent)}.dark\:bg-gray-800{background-color:color-mix(in srgb,var(--p-text-color) 80%,transparent)}.dark\:bg-green-900\/20{background-color:#14532d33}.dark\:bg-red-900\/20{background-color:#7f1d1d33}.dark\:text-blue-400{--tw-text-opacity: 1;color:rgb(96 165 250 / var(--tw-text-opacity, 1))}.dark\:text-gray-200{color:color-mix(in srgb,var(--p-text-color) 20%,transparent)}.dark\:text-gray-300{color:color-mix(in srgb,var(--p-text-color) 30%,transparent)}.dark\:text-gray-400{color:color-mix(in srgb,var(--p-text-color) 40%,transparent)}.dark\:text-green-400{--tw-text-opacity: 1;color:rgb(74 222 128 / var(--tw-text-opacity, 1))}.dark\:text-red-400{--tw-text-opacity: 1;color:rgb(248 113 113 / var(--tw-text-opacity, 1))}.dark\:text-white{color:var(--p-panel-background)}.dark\:placeholder-gray-400::-moz-placeholder{color:color-mix(in srgb,var(--p-text-color) 40%,transparent)}.dark\:placeholder-gray-400::placeholder{color:color-mix(in srgb,var(--p-text-color) 40%,transparent)}.dark\:hover\:bg-blue-600:hover{--tw-bg-opacity: 1;background-color:rgb(37 99 235 / var(--tw-bg-opacity, 1))}.dark\:hover\:bg-gray-700:hover{background-color:color-mix(in srgb,var(--p-text-color) 70%,transparent)}.dark\:hover\:text-blue-300:hover{--tw-text-opacity: 1;color:rgb(147 197 253 / var(--tw-text-opacity, 1))}.dark\:hover\:text-gray-200:hover{color:color-mix(in srgb,var(--p-text-color) 20%,transparent)}.dark\:focus\:border-blue-400:focus{--tw-border-opacity: 1;border-color:rgb(96 165 250 / var(--tw-border-opacity, 1))}.dark\:focus\:ring-blue-400\/20:focus{--tw-ring-color: rgb(96 165 250 / .2)}}.\[\&\>\*\]\:\!my-1>*{margin-top:.25rem!important;margin-bottom:.25rem!important} diff --git a/dist/copilot_web/assets/input-T2ACqglr.css b/dist/copilot_web/assets/input-T2ACqglr.css new file mode 100644 index 0000000..d7e71d5 --- /dev/null +++ b/dist/copilot_web/assets/input-T2ACqglr.css @@ -0,0 +1 @@ +#comfyui-copilot-plugin *,#comfyui-copilot-plugin :before,#comfyui-copilot-plugin :after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }#comfyui-copilot-plugin ::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }#comfyui-copilot-plugin .container{width:100%}@media (min-width: 640px){#comfyui-copilot-plugin .container{max-width:640px}}@media (min-width: 768px){#comfyui-copilot-plugin .container{max-width:768px}}@media (min-width: 1024px){#comfyui-copilot-plugin .container{max-width:1024px}}@media (min-width: 1280px){#comfyui-copilot-plugin .container{max-width:1280px}}@media (min-width: 1536px){#comfyui-copilot-plugin .container{max-width:1536px}}#comfyui-copilot-plugin .prose,#comfyui-copilot-plugin .prose-neutral{--tw-prose-links: inherit;--tw-prose-headings: inherit}#comfyui-copilot-plugin .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}#comfyui-copilot-plugin .\!visible{visibility:visible!important}#comfyui-copilot-plugin .visible{visibility:visible}#comfyui-copilot-plugin .invisible{visibility:hidden}#comfyui-copilot-plugin .collapse{visibility:collapse}#comfyui-copilot-plugin .static{position:static}#comfyui-copilot-plugin .fixed{position:fixed}#comfyui-copilot-plugin .absolute{position:absolute}#comfyui-copilot-plugin .relative{position:relative}#comfyui-copilot-plugin .sticky{position:sticky}#comfyui-copilot-plugin .inset-0{inset:0}#comfyui-copilot-plugin .inset-y-0{top:0;bottom:0}#comfyui-copilot-plugin .-bottom-1{bottom:-.25rem}#comfyui-copilot-plugin .-right-1{right:-.25rem}#comfyui-copilot-plugin .-top-1{top:-.25rem}#comfyui-copilot-plugin .-top-10{top:-2.5rem}#comfyui-copilot-plugin .-top-6{top:-1.5rem}#comfyui-copilot-plugin .bottom-0{bottom:0}#comfyui-copilot-plugin .bottom-1{bottom:.25rem}#comfyui-copilot-plugin .bottom-2{bottom:.5rem}#comfyui-copilot-plugin .bottom-3{bottom:.75rem}#comfyui-copilot-plugin .bottom-full{bottom:100%}#comfyui-copilot-plugin .left-0{left:0}#comfyui-copilot-plugin .left-1\/2{left:50%}#comfyui-copilot-plugin .left-3{left:.75rem}#comfyui-copilot-plugin .right-0{right:0}#comfyui-copilot-plugin .right-1\.5{right:.375rem}#comfyui-copilot-plugin .right-12{right:3rem}#comfyui-copilot-plugin .right-2{right:.5rem}#comfyui-copilot-plugin .right-3{right:.75rem}#comfyui-copilot-plugin .right-4{right:1rem}#comfyui-copilot-plugin .top-0{top:0}#comfyui-copilot-plugin .top-1\/2{top:50%}#comfyui-copilot-plugin .top-2{top:.5rem}#comfyui-copilot-plugin .top-3{top:.75rem}#comfyui-copilot-plugin .top-4{top:1rem}#comfyui-copilot-plugin .z-10{z-index:10}#comfyui-copilot-plugin .z-50{z-index:50}#comfyui-copilot-plugin .z-\[9999\]{z-index:9999}#comfyui-copilot-plugin .m-4{margin:1rem}#comfyui-copilot-plugin .\!my-0\.5{margin-top:.125rem!important;margin-bottom:.125rem!important}#comfyui-copilot-plugin .\!my-1{margin-top:.25rem!important;margin-bottom:.25rem!important}#comfyui-copilot-plugin .mx-auto{margin-left:auto;margin-right:auto}#comfyui-copilot-plugin .-ml-1{margin-left:-.25rem}#comfyui-copilot-plugin .mb-1{margin-bottom:.25rem}#comfyui-copilot-plugin .mb-2{margin-bottom:.5rem}#comfyui-copilot-plugin .mb-3{margin-bottom:.75rem}#comfyui-copilot-plugin .mb-4{margin-bottom:1rem}#comfyui-copilot-plugin .mb-6{margin-bottom:1.5rem}#comfyui-copilot-plugin .ml-1{margin-left:.25rem}#comfyui-copilot-plugin .ml-2{margin-left:.5rem}#comfyui-copilot-plugin .ml-3{margin-left:.75rem}#comfyui-copilot-plugin .mr-1{margin-right:.25rem}#comfyui-copilot-plugin .mr-2{margin-right:.5rem}#comfyui-copilot-plugin .mr-3{margin-right:.75rem}#comfyui-copilot-plugin .mt-0\.5{margin-top:.125rem}#comfyui-copilot-plugin .mt-1{margin-top:.25rem}#comfyui-copilot-plugin .mt-12{margin-top:3rem}#comfyui-copilot-plugin .mt-2{margin-top:.5rem}#comfyui-copilot-plugin .mt-4{margin-top:1rem}#comfyui-copilot-plugin .mt-6{margin-top:1.5rem}#comfyui-copilot-plugin .line-clamp-2{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}#comfyui-copilot-plugin .block{display:block}#comfyui-copilot-plugin .inline{display:inline}#comfyui-copilot-plugin .flex{display:flex}#comfyui-copilot-plugin .inline-flex{display:inline-flex}#comfyui-copilot-plugin .table{display:table}#comfyui-copilot-plugin .grid{display:grid}#comfyui-copilot-plugin .contents{display:contents}#comfyui-copilot-plugin .hidden{display:none}#comfyui-copilot-plugin .aspect-square{aspect-ratio:1 / 1}#comfyui-copilot-plugin .h-0{height:0px}#comfyui-copilot-plugin .h-1{height:.25rem}#comfyui-copilot-plugin .h-10{height:2.5rem}#comfyui-copilot-plugin .h-14{height:3.5rem}#comfyui-copilot-plugin .h-2{height:.5rem}#comfyui-copilot-plugin .h-20{height:5rem}#comfyui-copilot-plugin .h-3{height:.75rem}#comfyui-copilot-plugin .h-3\.5{height:.875rem}#comfyui-copilot-plugin .h-4{height:1rem}#comfyui-copilot-plugin .h-5{height:1.25rem}#comfyui-copilot-plugin .h-6{height:1.5rem}#comfyui-copilot-plugin .h-7{height:1.75rem}#comfyui-copilot-plugin .h-8{height:2rem}#comfyui-copilot-plugin .h-\[4\.5rem\]{height:4.5rem}#comfyui-copilot-plugin .h-auto{height:auto}#comfyui-copilot-plugin .h-full{height:100%}#comfyui-copilot-plugin .max-h-60{max-height:15rem}#comfyui-copilot-plugin .max-h-\[400px\]{max-height:400px}#comfyui-copilot-plugin .max-h-\[40vh\]{max-height:40vh}#comfyui-copilot-plugin .max-h-\[80vh\]{max-height:80vh}#comfyui-copilot-plugin .max-h-\[90vh\]{max-height:90vh}#comfyui-copilot-plugin .max-h-\[calc\(90vh-2rem\)\]{max-height:calc(90vh - 2rem)}#comfyui-copilot-plugin .max-h-full{max-height:100%}#comfyui-copilot-plugin .min-h-\[80px\]{min-height:80px}#comfyui-copilot-plugin .w-1{width:.25rem}#comfyui-copilot-plugin .w-1\/2{width:50%}#comfyui-copilot-plugin .w-12{width:3rem}#comfyui-copilot-plugin .w-14{width:3.5rem}#comfyui-copilot-plugin .w-16{width:4rem}#comfyui-copilot-plugin .w-2{width:.5rem}#comfyui-copilot-plugin .w-3{width:.75rem}#comfyui-copilot-plugin .w-3\.5{width:.875rem}#comfyui-copilot-plugin .w-4{width:1rem}#comfyui-copilot-plugin .w-48{width:12rem}#comfyui-copilot-plugin .w-5{width:1.25rem}#comfyui-copilot-plugin .w-64{width:16rem}#comfyui-copilot-plugin .w-7{width:1.75rem}#comfyui-copilot-plugin .w-8{width:2rem}#comfyui-copilot-plugin .w-96{width:24rem}#comfyui-copilot-plugin .w-\[100\%\]{width:100%}#comfyui-copilot-plugin .w-\[35\%\]{width:35%}#comfyui-copilot-plugin .w-\[480px\]{width:480px}#comfyui-copilot-plugin .w-\[500px\]{width:500px}#comfyui-copilot-plugin .w-\[65\%\]{width:65%}#comfyui-copilot-plugin .w-\[90\%\]{width:90%}#comfyui-copilot-plugin .w-\[calc\(50\%-0\.25rem\)\]{width:calc(50% - .25rem)}#comfyui-copilot-plugin .w-full{width:100%}#comfyui-copilot-plugin .min-w-\[400px\]{min-width:400px}#comfyui-copilot-plugin .max-w-2xl{max-width:42rem}#comfyui-copilot-plugin .max-w-6xl{max-width:72rem}#comfyui-copilot-plugin .max-w-full{max-width:100%}#comfyui-copilot-plugin .max-w-lg{max-width:32rem}#comfyui-copilot-plugin .flex-1{flex:1 1 0%}#comfyui-copilot-plugin .flex-shrink-0{flex-shrink:0}#comfyui-copilot-plugin .-translate-x-1\/2{--tw-translate-x: -50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}#comfyui-copilot-plugin .-translate-y-1\/2{--tw-translate-y: -50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}#comfyui-copilot-plugin .-translate-y-full{--tw-translate-y: -100%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}#comfyui-copilot-plugin .transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}#comfyui-copilot-plugin{@keyframes bounce{0%,to{transform:translateY(-25%);animation-timing-function:cubic-bezier(.8,0,1,1)}50%{transform:none;animation-timing-function:cubic-bezier(0,0,.2,1)}}}#comfyui-copilot-plugin .animate-bounce{animation:bounce 1s infinite}#comfyui-copilot-plugin{@keyframes spin{to{transform:rotate(360deg)}}}#comfyui-copilot-plugin .animate-spin{animation:spin 1s linear infinite}#comfyui-copilot-plugin .cursor-ew-resize{cursor:ew-resize}#comfyui-copilot-plugin .cursor-help{cursor:help}#comfyui-copilot-plugin .cursor-not-allowed{cursor:not-allowed}#comfyui-copilot-plugin .cursor-pointer{cursor:pointer}#comfyui-copilot-plugin .resize-none{resize:none}#comfyui-copilot-plugin .resize-y{resize:vertical}#comfyui-copilot-plugin .resize{resize:both}#comfyui-copilot-plugin .appearance-none{-webkit-appearance:none;-moz-appearance:none;appearance:none}#comfyui-copilot-plugin .grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}#comfyui-copilot-plugin .grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}#comfyui-copilot-plugin .flex-row{flex-direction:row}#comfyui-copilot-plugin .flex-col{flex-direction:column}#comfyui-copilot-plugin .flex-wrap{flex-wrap:wrap}#comfyui-copilot-plugin .items-start{align-items:flex-start}#comfyui-copilot-plugin .items-center{align-items:center}#comfyui-copilot-plugin .justify-end{justify-content:flex-end}#comfyui-copilot-plugin .justify-center{justify-content:center}#comfyui-copilot-plugin .justify-between{justify-content:space-between}#comfyui-copilot-plugin .gap-1{gap:.25rem}#comfyui-copilot-plugin .gap-2{gap:.5rem}#comfyui-copilot-plugin .gap-3{gap:.75rem}#comfyui-copilot-plugin .gap-4{gap:1rem}#comfyui-copilot-plugin .space-x-1>:not([hidden])~:not([hidden]){--tw-space-x-reverse: 0;margin-right:calc(.25rem * var(--tw-space-x-reverse));margin-left:calc(.25rem * calc(1 - var(--tw-space-x-reverse)))}#comfyui-copilot-plugin .space-x-2>:not([hidden])~:not([hidden]){--tw-space-x-reverse: 0;margin-right:calc(.5rem * var(--tw-space-x-reverse));margin-left:calc(.5rem * calc(1 - var(--tw-space-x-reverse)))}#comfyui-copilot-plugin .space-x-3>:not([hidden])~:not([hidden]){--tw-space-x-reverse: 0;margin-right:calc(.75rem * var(--tw-space-x-reverse));margin-left:calc(.75rem * calc(1 - var(--tw-space-x-reverse)))}#comfyui-copilot-plugin .space-y-2>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.5rem * var(--tw-space-y-reverse))}#comfyui-copilot-plugin .space-y-3>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.75rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.75rem * var(--tw-space-y-reverse))}#comfyui-copilot-plugin .space-y-4>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(1rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem * var(--tw-space-y-reverse))}#comfyui-copilot-plugin .overflow-hidden{overflow:hidden}#comfyui-copilot-plugin .overflow-visible{overflow:visible}#comfyui-copilot-plugin .overflow-x-auto{overflow-x:auto}#comfyui-copilot-plugin .overflow-y-auto{overflow-y:auto}#comfyui-copilot-plugin .scroll-smooth{scroll-behavior:smooth}#comfyui-copilot-plugin .text-ellipsis{text-overflow:ellipsis}#comfyui-copilot-plugin .whitespace-normal{white-space:normal}#comfyui-copilot-plugin .whitespace-nowrap{white-space:nowrap}#comfyui-copilot-plugin .whitespace-pre-wrap{white-space:pre-wrap}#comfyui-copilot-plugin .break-words{overflow-wrap:break-word}#comfyui-copilot-plugin .break-all{word-break:break-all}#comfyui-copilot-plugin .rounded{border-radius:.25rem}#comfyui-copilot-plugin .rounded-full{border-radius:9999px}#comfyui-copilot-plugin .rounded-lg{border-radius:.5rem}#comfyui-copilot-plugin .rounded-md{border-radius:.375rem}#comfyui-copilot-plugin .rounded-sm{border-radius:.125rem}#comfyui-copilot-plugin .rounded-xl{border-radius:.75rem}#comfyui-copilot-plugin .border{border-width:1px}#comfyui-copilot-plugin .border-0{border-width:0px}#comfyui-copilot-plugin .border-2{border-width:2px}#comfyui-copilot-plugin .border-4{border-width:4px}#comfyui-copilot-plugin .border-b{border-bottom-width:1px}#comfyui-copilot-plugin .border-b-2{border-bottom-width:2px}#comfyui-copilot-plugin .border-l-4{border-left-width:4px}#comfyui-copilot-plugin .border-r{border-right-width:1px}#comfyui-copilot-plugin .border-t{border-top-width:1px}#comfyui-copilot-plugin .border-solid{border-style:solid}#comfyui-copilot-plugin .border-dashed{border-style:dashed}#comfyui-copilot-plugin .border-none{border-style:none}#comfyui-copilot-plugin .border-\[\#979797\]{--tw-border-opacity: 1;border-color:rgb(151 151 151 / var(--tw-border-opacity, 1))}#comfyui-copilot-plugin .border-amber-200{--tw-border-opacity: 1;border-color:rgb(253 230 138 / var(--tw-border-opacity, 1))}#comfyui-copilot-plugin .border-blue-100{--tw-border-opacity: 1;border-color:rgb(219 234 254 / var(--tw-border-opacity, 1))}#comfyui-copilot-plugin .border-blue-200{--tw-border-opacity: 1;border-color:rgb(191 219 254 / var(--tw-border-opacity, 1))}#comfyui-copilot-plugin .border-blue-300{--tw-border-opacity: 1;border-color:rgb(147 197 253 / var(--tw-border-opacity, 1))}#comfyui-copilot-plugin .border-blue-500{--tw-border-opacity: 1;border-color:rgb(59 130 246 / var(--tw-border-opacity, 1))}#comfyui-copilot-plugin .border-blue-600{--tw-border-opacity: 1;border-color:rgb(37 99 235 / var(--tw-border-opacity, 1))}#comfyui-copilot-plugin .border-gray-100{border-color:color-mix(in srgb,var(--p-text-color) 10%,transparent)}#comfyui-copilot-plugin .border-gray-200{border-color:color-mix(in srgb,var(--p-text-color) 20%,transparent)}#comfyui-copilot-plugin .border-gray-300{border-color:color-mix(in srgb,var(--p-text-color) 30%,transparent)}#comfyui-copilot-plugin .border-gray-700{border-color:color-mix(in srgb,var(--p-text-color) 70%,transparent)}#comfyui-copilot-plugin .border-gray-900{border-color:color-mix(in srgb,var(--p-text-color) 90%,transparent)}#comfyui-copilot-plugin .border-green-200{--tw-border-opacity: 1;border-color:rgb(187 247 208 / var(--tw-border-opacity, 1))}#comfyui-copilot-plugin .border-green-500{--tw-border-opacity: 1;border-color:rgb(34 197 94 / var(--tw-border-opacity, 1))}#comfyui-copilot-plugin .border-pink-500{--tw-border-opacity: 1;border-color:rgb(236 72 153 / var(--tw-border-opacity, 1))}#comfyui-copilot-plugin .border-red-200{--tw-border-opacity: 1;border-color:rgb(254 202 202 / var(--tw-border-opacity, 1))}#comfyui-copilot-plugin .border-red-500{--tw-border-opacity: 1;border-color:rgb(239 68 68 / var(--tw-border-opacity, 1))}#comfyui-copilot-plugin .border-transparent{border-color:transparent}#comfyui-copilot-plugin .border-yellow-200{--tw-border-opacity: 1;border-color:rgb(254 240 138 / var(--tw-border-opacity, 1))}#comfyui-copilot-plugin .border-t-blue-500{--tw-border-opacity: 1;border-top-color:rgb(59 130 246 / var(--tw-border-opacity, 1))}#comfyui-copilot-plugin .border-t-gray-800{border-top-color:color-mix(in srgb,var(--p-text-color) 80%,transparent)}#comfyui-copilot-plugin .border-t-transparent{border-top-color:transparent}#comfyui-copilot-plugin .bg-black{--tw-bg-opacity: 1;background-color:rgb(0 0 0 / var(--tw-bg-opacity, 1))}#comfyui-copilot-plugin .bg-black\/40{background-color:#0006}#comfyui-copilot-plugin .bg-blue-100{--tw-bg-opacity: 1;background-color:rgb(219 234 254 / var(--tw-bg-opacity, 1))}#comfyui-copilot-plugin .bg-blue-50{--tw-bg-opacity: 1;background-color:rgb(239 246 255 / var(--tw-bg-opacity, 1))}#comfyui-copilot-plugin .bg-blue-500{--tw-bg-opacity: 1;background-color:rgb(59 130 246 / var(--tw-bg-opacity, 1))}#comfyui-copilot-plugin .bg-blue-600{--tw-bg-opacity: 1;background-color:rgb(37 99 235 / var(--tw-bg-opacity, 1))}#comfyui-copilot-plugin .bg-gray-100{background-color:color-mix(in srgb,var(--p-text-color) 10%,transparent)}#comfyui-copilot-plugin .bg-gray-200{background-color:color-mix(in srgb,var(--p-text-color) 20%,transparent)}#comfyui-copilot-plugin .bg-gray-300{background-color:color-mix(in srgb,var(--p-text-color) 30%,transparent)}#comfyui-copilot-plugin .bg-gray-400{background-color:color-mix(in srgb,var(--p-text-color) 40%,transparent)}#comfyui-copilot-plugin .bg-gray-50{background-color:color-mix(in srgb,var(--p-text-color) 5%,transparent)}#comfyui-copilot-plugin .bg-gray-500{background-color:color-mix(in srgb,var(--p-text-color) 50%,transparent)}#comfyui-copilot-plugin .bg-gray-700{background-color:color-mix(in srgb,var(--p-text-color) 70%,transparent)}#comfyui-copilot-plugin .bg-gray-800{background-color:color-mix(in srgb,var(--p-text-color) 80%,transparent)}#comfyui-copilot-plugin .bg-gray-900{background-color:color-mix(in srgb,var(--p-text-color) 90%,transparent)}#comfyui-copilot-plugin .bg-green-100{--tw-bg-opacity: 1;background-color:rgb(220 252 231 / var(--tw-bg-opacity, 1))}#comfyui-copilot-plugin .bg-green-50{--tw-bg-opacity: 1;background-color:rgb(240 253 244 / var(--tw-bg-opacity, 1))}#comfyui-copilot-plugin .bg-indigo-100{--tw-bg-opacity: 1;background-color:rgb(224 231 255 / var(--tw-bg-opacity, 1))}#comfyui-copilot-plugin .bg-pink-200{--tw-bg-opacity: 1;background-color:rgb(251 207 232 / var(--tw-bg-opacity, 1))}#comfyui-copilot-plugin .bg-pink-500{--tw-bg-opacity: 1;background-color:rgb(236 72 153 / var(--tw-bg-opacity, 1))}#comfyui-copilot-plugin .bg-purple-100{--tw-bg-opacity: 1;background-color:rgb(243 232 255 / var(--tw-bg-opacity, 1))}#comfyui-copilot-plugin .bg-red-100{--tw-bg-opacity: 1;background-color:rgb(254 226 226 / var(--tw-bg-opacity, 1))}#comfyui-copilot-plugin .bg-red-50{--tw-bg-opacity: 1;background-color:rgb(254 242 242 / var(--tw-bg-opacity, 1))}#comfyui-copilot-plugin .bg-red-500{--tw-bg-opacity: 1;background-color:rgb(239 68 68 / var(--tw-bg-opacity, 1))}#comfyui-copilot-plugin .bg-transparent{background-color:transparent}#comfyui-copilot-plugin .bg-white{background-color:var(--p-panel-background)}#comfyui-copilot-plugin .bg-yellow-50{--tw-bg-opacity: 1;background-color:rgb(254 252 232 / var(--tw-bg-opacity, 1))}#comfyui-copilot-plugin .bg-opacity-30{--tw-bg-opacity: .3}#comfyui-copilot-plugin .bg-opacity-50{--tw-bg-opacity: .5}#comfyui-copilot-plugin .bg-opacity-75{--tw-bg-opacity: .75}#comfyui-copilot-plugin .bg-gradient-to-r{background-image:linear-gradient(to right,var(--tw-gradient-stops))}#comfyui-copilot-plugin .from-amber-50{--tw-gradient-from: #fffbeb var(--tw-gradient-from-position);--tw-gradient-to: rgb(255 251 235 / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)}#comfyui-copilot-plugin .to-amber-100{--tw-gradient-to: #fef3c7 var(--tw-gradient-to-position)}#comfyui-copilot-plugin .fill-current{fill:currentColor}#comfyui-copilot-plugin .object-contain{-o-object-fit:contain;object-fit:contain}#comfyui-copilot-plugin .object-cover{-o-object-fit:cover;object-fit:cover}#comfyui-copilot-plugin .p-0\.5{padding:.125rem}#comfyui-copilot-plugin .p-1{padding:.25rem}#comfyui-copilot-plugin .p-1\.5{padding:.375rem}#comfyui-copilot-plugin .p-2{padding:.5rem}#comfyui-copilot-plugin .p-3{padding:.75rem}#comfyui-copilot-plugin .p-4{padding:1rem}#comfyui-copilot-plugin .p-6{padding:1.5rem}#comfyui-copilot-plugin .p-8{padding:2rem}#comfyui-copilot-plugin .px-1{padding-left:.25rem;padding-right:.25rem}#comfyui-copilot-plugin .px-1\.5{padding-left:.375rem;padding-right:.375rem}#comfyui-copilot-plugin .px-2{padding-left:.5rem;padding-right:.5rem}#comfyui-copilot-plugin .px-3{padding-left:.75rem;padding-right:.75rem}#comfyui-copilot-plugin .px-4{padding-left:1rem;padding-right:1rem}#comfyui-copilot-plugin .px-5{padding-left:1.25rem;padding-right:1.25rem}#comfyui-copilot-plugin .py-0\.5{padding-top:.125rem;padding-bottom:.125rem}#comfyui-copilot-plugin .py-1{padding-top:.25rem;padding-bottom:.25rem}#comfyui-copilot-plugin .py-1\.5{padding-top:.375rem;padding-bottom:.375rem}#comfyui-copilot-plugin .py-2{padding-top:.5rem;padding-bottom:.5rem}#comfyui-copilot-plugin .py-2\.5{padding-top:.625rem;padding-bottom:.625rem}#comfyui-copilot-plugin .py-3{padding-top:.75rem;padding-bottom:.75rem}#comfyui-copilot-plugin .py-4{padding-top:1rem;padding-bottom:1rem}#comfyui-copilot-plugin .pb-10{padding-bottom:2.5rem}#comfyui-copilot-plugin .pb-2{padding-bottom:.5rem}#comfyui-copilot-plugin .pb-3{padding-bottom:.75rem}#comfyui-copilot-plugin .pl-4{padding-left:1rem}#comfyui-copilot-plugin .pr-12{padding-right:3rem}#comfyui-copilot-plugin .pr-4{padding-right:1rem}#comfyui-copilot-plugin .pr-6{padding-right:1.5rem}#comfyui-copilot-plugin .pt-1{padding-top:.25rem}#comfyui-copilot-plugin .pt-2{padding-top:.5rem}#comfyui-copilot-plugin .pt-6{padding-top:1.5rem}#comfyui-copilot-plugin .text-left{text-align:left}#comfyui-copilot-plugin .text-center{text-align:center}#comfyui-copilot-plugin .\!text-\[11px\]{font-size:11px!important}#comfyui-copilot-plugin .text-\[10px\]{font-size:10px}#comfyui-copilot-plugin .text-\[11px\]{font-size:11px}#comfyui-copilot-plugin .text-\[12px\]{font-size:12px}#comfyui-copilot-plugin .text-\[14px\]{font-size:14px}#comfyui-copilot-plugin .text-base{font-size:1rem;line-height:1.5rem}#comfyui-copilot-plugin .text-lg{font-size:1.125rem;line-height:1.75rem}#comfyui-copilot-plugin .text-sm{font-size:.875rem;line-height:1.25rem}#comfyui-copilot-plugin .text-xl{font-size:1.25rem;line-height:1.75rem}#comfyui-copilot-plugin .text-xs{font-size:.75rem;line-height:1rem}#comfyui-copilot-plugin .font-bold{font-weight:700}#comfyui-copilot-plugin .font-medium{font-weight:500}#comfyui-copilot-plugin .font-semibold{font-weight:600}#comfyui-copilot-plugin .italic{font-style:italic}#comfyui-copilot-plugin .leading-relaxed{line-height:1.625}#comfyui-copilot-plugin .leading-snug{line-height:1.375}#comfyui-copilot-plugin .text-amber-500{--tw-text-opacity: 1;color:rgb(245 158 11 / var(--tw-text-opacity, 1))}#comfyui-copilot-plugin .text-amber-600{--tw-text-opacity: 1;color:rgb(217 119 6 / var(--tw-text-opacity, 1))}#comfyui-copilot-plugin .text-amber-700{--tw-text-opacity: 1;color:rgb(180 83 9 / var(--tw-text-opacity, 1))}#comfyui-copilot-plugin .text-amber-800{--tw-text-opacity: 1;color:rgb(146 64 14 / var(--tw-text-opacity, 1))}#comfyui-copilot-plugin .text-blue-500{--tw-text-opacity: 1;color:rgb(59 130 246 / var(--tw-text-opacity, 1))}#comfyui-copilot-plugin .text-blue-600{--tw-text-opacity: 1;color:rgb(37 99 235 / var(--tw-text-opacity, 1))}#comfyui-copilot-plugin .text-blue-700{--tw-text-opacity: 1;color:rgb(29 78 216 / var(--tw-text-opacity, 1))}#comfyui-copilot-plugin .text-blue-800{--tw-text-opacity: 1;color:rgb(30 64 175 / var(--tw-text-opacity, 1))}#comfyui-copilot-plugin .text-blue-900{--tw-text-opacity: 1;color:rgb(30 58 138 / var(--tw-text-opacity, 1))}#comfyui-copilot-plugin .text-gray-300{color:color-mix(in srgb,var(--p-text-color) 30%,transparent)}#comfyui-copilot-plugin .text-gray-400{color:color-mix(in srgb,var(--p-text-color) 40%,transparent)}#comfyui-copilot-plugin .text-gray-500{color:color-mix(in srgb,var(--p-text-color) 50%,transparent)}#comfyui-copilot-plugin .text-gray-600{color:color-mix(in srgb,var(--p-text-color) 60%,transparent)}#comfyui-copilot-plugin .text-gray-700{color:color-mix(in srgb,var(--p-text-color) 70%,transparent)}#comfyui-copilot-plugin .text-gray-800{color:color-mix(in srgb,var(--p-text-color) 80%,transparent)}#comfyui-copilot-plugin .text-gray-900{color:color-mix(in srgb,var(--p-text-color) 90%,transparent)}#comfyui-copilot-plugin .text-green-500{--tw-text-opacity: 1;color:rgb(34 197 94 / var(--tw-text-opacity, 1))}#comfyui-copilot-plugin .text-green-700{--tw-text-opacity: 1;color:rgb(21 128 61 / var(--tw-text-opacity, 1))}#comfyui-copilot-plugin .text-green-800{--tw-text-opacity: 1;color:rgb(22 101 52 / var(--tw-text-opacity, 1))}#comfyui-copilot-plugin .text-green-900{--tw-text-opacity: 1;color:rgb(20 83 45 / var(--tw-text-opacity, 1))}#comfyui-copilot-plugin .text-indigo-600{--tw-text-opacity: 1;color:rgb(79 70 229 / var(--tw-text-opacity, 1))}#comfyui-copilot-plugin .text-pink-600{--tw-text-opacity: 1;color:rgb(219 39 119 / var(--tw-text-opacity, 1))}#comfyui-copilot-plugin .text-pink-700{--tw-text-opacity: 1;color:rgb(190 24 93 / var(--tw-text-opacity, 1))}#comfyui-copilot-plugin .text-purple-700{--tw-text-opacity: 1;color:rgb(126 34 206 / var(--tw-text-opacity, 1))}#comfyui-copilot-plugin .text-red-500{--tw-text-opacity: 1;color:rgb(239 68 68 / var(--tw-text-opacity, 1))}#comfyui-copilot-plugin .text-red-600{--tw-text-opacity: 1;color:rgb(220 38 38 / var(--tw-text-opacity, 1))}#comfyui-copilot-plugin .text-red-700{--tw-text-opacity: 1;color:rgb(185 28 28 / var(--tw-text-opacity, 1))}#comfyui-copilot-plugin .text-white{color:var(--p-panel-background)}#comfyui-copilot-plugin .underline{text-decoration-line:underline}#comfyui-copilot-plugin .placeholder-gray-500::-moz-placeholder{color:color-mix(in srgb,var(--p-text-color) 50%,transparent)}#comfyui-copilot-plugin .placeholder-gray-500::placeholder{color:color-mix(in srgb,var(--p-text-color) 50%,transparent)}#comfyui-copilot-plugin .opacity-0{opacity:0}#comfyui-copilot-plugin .opacity-25{opacity:.25}#comfyui-copilot-plugin .opacity-40{opacity:.4}#comfyui-copilot-plugin .opacity-50{opacity:.5}#comfyui-copilot-plugin .opacity-75{opacity:.75}#comfyui-copilot-plugin .shadow{--tw-shadow: 0 1px 3px 0 rgb(0 0 0 / .1), 0 1px 2px -1px rgb(0 0 0 / .1);--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}#comfyui-copilot-plugin .shadow-2xl{--tw-shadow: 0 25px 50px -12px rgb(0 0 0 / .25);--tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}#comfyui-copilot-plugin .shadow-lg{--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}#comfyui-copilot-plugin .shadow-md{--tw-shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}#comfyui-copilot-plugin .shadow-sm{--tw-shadow: 0 1px 2px 0 rgb(0 0 0 / .05);--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}#comfyui-copilot-plugin .outline-none{outline:2px solid transparent;outline-offset:2px}#comfyui-copilot-plugin .ring-2{--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)}#comfyui-copilot-plugin .ring-pink-300{--tw-ring-opacity: 1;--tw-ring-color: rgb(249 168 212 / var(--tw-ring-opacity, 1))}#comfyui-copilot-plugin .filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}#comfyui-copilot-plugin .backdrop-blur-sm{--tw-backdrop-blur: blur(4px);-webkit-backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)}#comfyui-copilot-plugin .transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}#comfyui-copilot-plugin .transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}#comfyui-copilot-plugin .transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}#comfyui-copilot-plugin .transition-opacity{transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}#comfyui-copilot-plugin .duration-200{transition-duration:.2s}#comfyui-copilot-plugin{height:100%;display:flex;flex-direction:column}#comfyui-copilot-plugin h1,#comfyui-copilot-plugin h2,#comfyui-copilot-plugin h3,#comfyui-copilot-plugin h4,#comfyui-copilot-plugin h5,#comfyui-copilot-plugin h6,#comfyui-copilot-plugin p,#comfyui-copilot-plugin ul,#comfyui-copilot-plugin ol,#comfyui-copilot-plugin button,#comfyui-copilot-plugin input,#comfyui-copilot-plugin textarea,#comfyui-copilot-plugin select{margin:0;padding:0;font-size:100%;font-weight:400}#comfyui-copilot-plugin *{box-sizing:border-box;border-width:0;border-style:solid}#comfyui-copilot-plugin img,#comfyui-copilot-plugin svg,#comfyui-copilot-plugin video,#comfyui-copilot-plugin canvas,#comfyui-copilot-plugin audio,#comfyui-copilot-plugin iframe,#comfyui-copilot-plugin embed,#comfyui-copilot-plugin object{display:block;vertical-align:middle}#comfyui-copilot-plugin button{background-color:transparent;background-image:none}.hover\:border-b-2:hover{border-bottom-width:2px}.hover\:border-blue-300:hover{--tw-border-opacity: 1;border-color:rgb(147 197 253 / var(--tw-border-opacity, 1))}.hover\:border-blue-500:hover{--tw-border-opacity: 1;border-color:rgb(59 130 246 / var(--tw-border-opacity, 1))}.hover\:bg-amber-200\/50:hover{background-color:#fde68a80}.hover\:bg-blue-100:hover{--tw-bg-opacity: 1;background-color:rgb(219 234 254 / var(--tw-bg-opacity, 1))}.hover\:bg-blue-200:hover{--tw-bg-opacity: 1;background-color:rgb(191 219 254 / var(--tw-bg-opacity, 1))}.hover\:bg-blue-50:hover{--tw-bg-opacity: 1;background-color:rgb(239 246 255 / var(--tw-bg-opacity, 1))}.hover\:bg-blue-600:hover{--tw-bg-opacity: 1;background-color:rgb(37 99 235 / var(--tw-bg-opacity, 1))}.hover\:bg-blue-700:hover{--tw-bg-opacity: 1;background-color:rgb(29 78 216 / var(--tw-bg-opacity, 1))}.hover\:bg-gray-100:hover{background-color:color-mix(in srgb,var(--p-text-color) 10%,transparent)}.hover\:bg-gray-200:hover{background-color:color-mix(in srgb,var(--p-text-color) 20%,transparent)}.hover\:bg-gray-300:hover{background-color:color-mix(in srgb,var(--p-text-color) 30%,transparent)}.hover\:bg-gray-50:hover{background-color:color-mix(in srgb,var(--p-text-color) 5%,transparent)}.hover\:bg-green-200:hover{--tw-bg-opacity: 1;background-color:rgb(187 247 208 / var(--tw-bg-opacity, 1))}.hover\:bg-pink-300:hover{--tw-bg-opacity: 1;background-color:rgb(249 168 212 / var(--tw-bg-opacity, 1))}.hover\:bg-purple-200:hover{--tw-bg-opacity: 1;background-color:rgb(233 213 255 / var(--tw-bg-opacity, 1))}.hover\:text-amber-700:hover{--tw-text-opacity: 1;color:rgb(180 83 9 / var(--tw-text-opacity, 1))}.hover\:text-amber-800:hover{--tw-text-opacity: 1;color:rgb(146 64 14 / var(--tw-text-opacity, 1))}.hover\:text-blue-500:hover{--tw-text-opacity: 1;color:rgb(59 130 246 / var(--tw-text-opacity, 1))}.hover\:text-blue-600:hover{--tw-text-opacity: 1;color:rgb(37 99 235 / var(--tw-text-opacity, 1))}.hover\:text-blue-700:hover{--tw-text-opacity: 1;color:rgb(29 78 216 / var(--tw-text-opacity, 1))}.hover\:text-gray-600:hover{color:color-mix(in srgb,var(--p-text-color) 60%,transparent)}.hover\:text-gray-700:hover{color:color-mix(in srgb,var(--p-text-color) 70%,transparent)}.hover\:text-gray-900:hover{color:color-mix(in srgb,var(--p-text-color) 90%,transparent)}.hover\:text-red-700:hover{--tw-text-opacity: 1;color:rgb(185 28 28 / var(--tw-text-opacity, 1))}.hover\:opacity-100:hover{opacity:1}.hover\:shadow-sm:hover{--tw-shadow: 0 1px 2px 0 rgb(0 0 0 / .05);--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.focus\:border-blue-500:focus{--tw-border-opacity: 1;border-color:rgb(59 130 246 / var(--tw-border-opacity, 1))}.focus\:border-transparent:focus{border-color:transparent}.focus\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}.focus\:ring-2:focus{--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)}.focus\:ring-blue-500:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(59 130 246 / var(--tw-ring-opacity, 1))}.focus\:ring-blue-500\/20:focus{--tw-ring-color: rgb(59 130 246 / .2)}.active\:scale-95:active{--tw-scale-x: .95;--tw-scale-y: .95;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.disabled\:opacity-50:disabled{opacity:.5}.group:hover .group-hover\:block{display:block}.group:hover .group-hover\:translate-x-1{--tw-translate-x: .25rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.group:hover .group-hover\:opacity-100{opacity:1}.prose-headings\:font-semibold :is(:where(h1,h2,h3,h4,h5,h6,th):not(:where([class~=not-prose],[class~=not-prose] *))){font-weight:600}.prose-h1\:text-base :is(:where(h1):not(:where([class~=not-prose],[class~=not-prose] *))){font-size:1rem;line-height:1.5rem}.prose-h2\:text-sm :is(:where(h2):not(:where([class~=not-prose],[class~=not-prose] *))){font-size:.875rem;line-height:1.25rem}.prose-h3\:text-xs :is(:where(h3):not(:where([class~=not-prose],[class~=not-prose] *))){font-size:.75rem;line-height:1rem}.prose-h4\:text-xs :is(:where(h4):not(:where([class~=not-prose],[class~=not-prose] *))){font-size:.75rem;line-height:1rem}.prose-p\:text-xs :is(:where(p):not(:where([class~=not-prose],[class~=not-prose] *))){font-size:.75rem;line-height:1rem}.prose-a\:font-medium :is(:where(a):not(:where([class~=not-prose],[class~=not-prose] *))){font-weight:500}.prose-a\:text-amber-700 :is(:where(a):not(:where([class~=not-prose],[class~=not-prose] *))){--tw-text-opacity: 1;color:rgb(180 83 9 / var(--tw-text-opacity, 1))}.prose-a\:underline :is(:where(a):not(:where([class~=not-prose],[class~=not-prose] *))){text-decoration-line:underline}.hover\:prose-a\:text-amber-800 :is(:where(a):not(:where([class~=not-prose],[class~=not-prose] *))):hover{--tw-text-opacity: 1;color:rgb(146 64 14 / var(--tw-text-opacity, 1))}.prose-code\:text-xs :is(:where(code):not(:where([class~=not-prose],[class~=not-prose] *))){font-size:.75rem;line-height:1rem}.prose-pre\:text-xs :is(:where(pre):not(:where([class~=not-prose],[class~=not-prose] *))){font-size:.75rem;line-height:1rem}.prose-ol\:text-xs :is(:where(ol):not(:where([class~=not-prose],[class~=not-prose] *))){font-size:.75rem;line-height:1rem}.prose-ul\:text-xs :is(:where(ul):not(:where([class~=not-prose],[class~=not-prose] *))){font-size:.75rem;line-height:1rem}.prose-li\:text-xs :is(:where(li):not(:where([class~=not-prose],[class~=not-prose] *))){font-size:.75rem;line-height:1rem}@media (prefers-color-scheme: dark){.dark\:border-blue-500{--tw-border-opacity: 1;border-color:rgb(59 130 246 / var(--tw-border-opacity, 1))}.dark\:border-gray-600{border-color:color-mix(in srgb,var(--p-text-color) 60%,transparent)}.dark\:border-gray-700{border-color:color-mix(in srgb,var(--p-text-color) 70%,transparent)}.dark\:border-red-800\/20{border-color:#991b1b33}.dark\:bg-blue-500{--tw-bg-opacity: 1;background-color:rgb(59 130 246 / var(--tw-bg-opacity, 1))}.dark\:bg-gray-600{background-color:color-mix(in srgb,var(--p-text-color) 60%,transparent)}.dark\:bg-gray-700{background-color:color-mix(in srgb,var(--p-text-color) 70%,transparent)}.dark\:bg-gray-800{background-color:color-mix(in srgb,var(--p-text-color) 80%,transparent)}.dark\:bg-green-900\/20{background-color:#14532d33}.dark\:bg-red-900\/20{background-color:#7f1d1d33}.dark\:text-blue-400{--tw-text-opacity: 1;color:rgb(96 165 250 / var(--tw-text-opacity, 1))}.dark\:text-gray-200{color:color-mix(in srgb,var(--p-text-color) 20%,transparent)}.dark\:text-gray-300{color:color-mix(in srgb,var(--p-text-color) 30%,transparent)}.dark\:text-gray-400{color:color-mix(in srgb,var(--p-text-color) 40%,transparent)}.dark\:text-green-400{--tw-text-opacity: 1;color:rgb(74 222 128 / var(--tw-text-opacity, 1))}.dark\:text-pink-400{--tw-text-opacity: 1;color:rgb(244 114 182 / var(--tw-text-opacity, 1))}.dark\:text-red-400{--tw-text-opacity: 1;color:rgb(248 113 113 / var(--tw-text-opacity, 1))}.dark\:text-white{color:var(--p-panel-background)}.dark\:placeholder-gray-400::-moz-placeholder{color:color-mix(in srgb,var(--p-text-color) 40%,transparent)}.dark\:placeholder-gray-400::placeholder{color:color-mix(in srgb,var(--p-text-color) 40%,transparent)}.dark\:hover\:bg-blue-600:hover{--tw-bg-opacity: 1;background-color:rgb(37 99 235 / var(--tw-bg-opacity, 1))}.dark\:hover\:bg-gray-700:hover{background-color:color-mix(in srgb,var(--p-text-color) 70%,transparent)}.dark\:hover\:text-blue-300:hover{--tw-text-opacity: 1;color:rgb(147 197 253 / var(--tw-text-opacity, 1))}.dark\:hover\:text-gray-200:hover{color:color-mix(in srgb,var(--p-text-color) 20%,transparent)}.dark\:focus\:border-blue-400:focus{--tw-border-opacity: 1;border-color:rgb(96 165 250 / var(--tw-border-opacity, 1))}.dark\:focus\:ring-blue-400\/20:focus{--tw-ring-color: rgb(96 165 250 / .2)}}.\[\&\>\*\]\:\!my-1>*{margin-top:.25rem!important;margin-bottom:.25rem!important} diff --git a/dist/copilot_web/input.js b/dist/copilot_web/input.js index 8acd2f2..a6be742 100644 --- a/dist/copilot_web/input.js +++ b/dist/copilot_web/input.js @@ -1,2 +1,2 @@ -const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["copilot_web/App-Dp5pJunx.js","copilot_web/vendor-markdown-Dek94WS0.js","copilot_web/vendor-react-V04_Axys.js","copilot_web/message-components-DHkIj9qD.js","copilot_web/fonts.css"])))=>i.map(i=>d[i]); -import{j as s}from"./vendor-markdown-Dek94WS0.js";import{a as w,R as p,r as x}from"./vendor-react-V04_Axys.js";import{w as v,a as g}from"./message-components-DHkIj9qD.js";/* empty css */const R="modulepreload",b=function(e){return"/"+e},m={},C=function(c,a,P){let d=Promise.resolve();if(a&&a.length>0){document.getElementsByTagName("link");const r=document.querySelector("meta[property=csp-nonce]"),t=r?.nonce||r?.getAttribute("nonce");d=Promise.allSettled(a.map(o=>{if(o=b(o),o in m)return;m[o]=!0;const i=o.endsWith(".css"),h=i?'[rel="stylesheet"]':"";if(document.querySelector(`link[href="${o}"]${h}`))return;const n=document.createElement("link");if(n.rel=i?"stylesheet":R,i||(n.as="script"),n.crossOrigin="",n.href=o,t&&n.setAttribute("nonce",t),document.head.appendChild(n),i)return new Promise((y,E)=>{n.addEventListener("load",y),n.addEventListener("error",()=>E(new Error(`Unable to preload CSS for ${o}`)))})}))}function u(r){const t=new Event("vite:preloadError",{cancelable:!0});if(t.payload=r,window.dispatchEvent(t),!t.defaultPrevented)throw r}return d.then(r=>{for(const t of r||[])t.status==="rejected"&&u(t.reason);return c().catch(u)})};var l={},f=w;l.createRoot=f.createRoot,l.hydrateRoot=f.hydrateRoot;const S=p.lazy(()=>C(async()=>{const{default:e}=await import("./App-Dp5pJunx.js");return{default:e}},__vite__mapDeps([0,1,2,3,4])).then(({default:e})=>({default:e})));function j(){return new Promise(e=>{if(document.body)return e(document.body);document.addEventListener("DOMContentLoaded",()=>{e(document.body)})})}j().then(()=>v()).then(()=>{g.extensionManager.registerSidebarTab({id:"comfyui-copilot",icon:"cc-icon-logo",title:"ComfyUI Copilot",tooltip:"ComfyUI Copilot",type:"custom",render:e=>{const c=document.createElement("div");c.id="comfyui-copilot-plugin",c.className="h-full w-full flex flex-col",e.style.height="100%",e.appendChild(c),l.createRoot(c).render(s.jsx(p.StrictMode,{children:s.jsx(x.Suspense,{fallback:s.jsx("div",{className:"h-full w-full flex items-center justify-center",children:"Loading..."}),children:s.jsx(S,{})})}))}})});export{C as _}; +const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["copilot_web/App-C_jxBl2D.js","copilot_web/vendor-markdown-Dek94WS0.js","copilot_web/vendor-react-V04_Axys.js","copilot_web/message-components-DHkIj9qD.js","copilot_web/fonts.css"])))=>i.map(i=>d[i]); +import{j as s}from"./vendor-markdown-Dek94WS0.js";import{a as w,R as p,r as x}from"./vendor-react-V04_Axys.js";import{w as v,a as g}from"./message-components-DHkIj9qD.js";/* empty css */const R="modulepreload",b=function(e){return"/"+e},m={},C=function(c,a,P){let d=Promise.resolve();if(a&&a.length>0){document.getElementsByTagName("link");const r=document.querySelector("meta[property=csp-nonce]"),t=r?.nonce||r?.getAttribute("nonce");d=Promise.allSettled(a.map(o=>{if(o=b(o),o in m)return;m[o]=!0;const i=o.endsWith(".css"),h=i?'[rel="stylesheet"]':"";if(document.querySelector(`link[href="${o}"]${h}`))return;const n=document.createElement("link");if(n.rel=i?"stylesheet":R,i||(n.as="script"),n.crossOrigin="",n.href=o,t&&n.setAttribute("nonce",t),document.head.appendChild(n),i)return new Promise((y,E)=>{n.addEventListener("load",y),n.addEventListener("error",()=>E(new Error(`Unable to preload CSS for ${o}`)))})}))}function u(r){const t=new Event("vite:preloadError",{cancelable:!0});if(t.payload=r,window.dispatchEvent(t),!t.defaultPrevented)throw r}return d.then(r=>{for(const t of r||[])t.status==="rejected"&&u(t.reason);return c().catch(u)})};var l={},f=w;l.createRoot=f.createRoot,l.hydrateRoot=f.hydrateRoot;const S=p.lazy(()=>C(async()=>{const{default:e}=await import("./App-C_jxBl2D.js");return{default:e}},__vite__mapDeps([0,1,2,3,4])).then(({default:e})=>({default:e})));function j(){return new Promise(e=>{if(document.body)return e(document.body);document.addEventListener("DOMContentLoaded",()=>{e(document.body)})})}j().then(()=>v()).then(()=>{g.extensionManager.registerSidebarTab({id:"comfyui-copilot",icon:"cc-icon-logo",title:"ComfyUI Copilot",tooltip:"ComfyUI Copilot",type:"custom",render:e=>{const c=document.createElement("div");c.id="comfyui-copilot-plugin",c.className="h-full w-full flex flex-col",e.style.height="100%",e.appendChild(c),l.createRoot(c).render(s.jsx(p.StrictMode,{children:s.jsx(x.Suspense,{fallback:s.jsx("div",{className:"h-full w-full flex items-center justify-center",children:"Loading..."}),children:s.jsx(S,{})})}))}})});export{C as _}; diff --git a/dist/copilot_web/workflowChat-CjDaET6O.js b/dist/copilot_web/workflowChat-DP_exkAV.js similarity index 92% rename from dist/copilot_web/workflowChat-CjDaET6O.js rename to dist/copilot_web/workflowChat-DP_exkAV.js index 7aff850..538be14 100644 --- a/dist/copilot_web/workflowChat-CjDaET6O.js +++ b/dist/copilot_web/workflowChat-DP_exkAV.js @@ -1,4 +1,4 @@ -const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["copilot_web/WorkflowOption-Bee-YmQA.js","copilot_web/vendor-markdown-Dek94WS0.js","copilot_web/vendor-react-V04_Axys.js","copilot_web/message-components-DHkIj9qD.js","copilot_web/ParameterDebugInterfaceNew-Bll5geLy.js","copilot_web/input.js","copilot_web/assets/input-0GzdDP_m.css","copilot_web/fonts.css"])))=>i.map(i=>d[i]); +const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["copilot_web/WorkflowOption-Bee-YmQA.js","copilot_web/vendor-markdown-Dek94WS0.js","copilot_web/vendor-react-V04_Axys.js","copilot_web/message-components-DHkIj9qD.js","copilot_web/ParameterDebugInterfaceV2-CiC0RieE.js","copilot_web/input.js","copilot_web/assets/input-T2ACqglr.css","copilot_web/fonts.css"])))=>i.map(i=>d[i]); import{_ as Ot}from"./input.js";import{j as h,r as yg,b as wg}from"./vendor-markdown-Dek94WS0.js";import{r as L,R as wn,c as Tt}from"./vendor-react-V04_Axys.js";import{f as bg,v as Sg,a as fn,B as Ag,U as Eg,A as Er,b as Ig,g as en,c as Mt,u as ru,M as Cg,W as Rt}from"./message-components-DHkIj9qD.js";/** * @license lucide-react v0.475.0 - ISC * @@ -71,9 +71,9 @@ import{_ as Ot}from"./input.js";import{j as h,r as yg,b as wg}from"./vendor-mark focus:ring-2 focus:ring-blue-500/20 dark:focus:ring-blue-400/20 focus:outline-none`})]}),h.jsx("div",{className:"flex items-center mb-2",children:h.jsx("button",{onClick:Pe,disabled:ge||!y.trim(),className:`px-4 py-2 rounded-lg font-medium text-xs transition-colors ${ge||!y.trim()?"bg-gray-300 dark:bg-gray-600 text-gray-500 dark:text-gray-400 cursor-not-allowed":"bg-blue-600 hover:bg-blue-700 dark:bg-blue-500 dark:hover:bg-blue-600 text-white"}`,children:ge?h.jsxs("span",{className:"flex items-center",children:[h.jsxs("svg",{className:"animate-spin -ml-1 mr-2 h-4 w-4 text-white",xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24",children:[h.jsx("circle",{className:"opacity-25",cx:"12",cy:"12",r:"10",stroke:"currentColor",strokeWidth:"4"}),h.jsx("path",{className:"opacity-75",fill:"currentColor",d:"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"})]}),"Verifying..."]}):"Verify"})}),k&&h.jsx("div",{className:`text-xs p-2 rounded-md ${k.success?"bg-green-50 dark:bg-green-900/20 text-green-700 dark:text-green-400":"bg-red-50 dark:bg-red-900/20 text-red-700 dark:text-red-400"}`,children:k.message})]}),h.jsxs("div",{className:"flex justify-end gap-3",children:[h.jsx("button",{onClick:b,className:`px-5 py-2.5 text-gray-700 bg-white dark:text-gray-200 hover:bg-gray-100 dark:hover:bg-gray-700 rounded-lg font-medium transition-colors`,children:"Cancel"}),h.jsx("button",{onClick:le,className:`px-5 py-2.5 bg-blue-600 hover:bg-blue-700 dark:bg-blue-500 dark:hover:bg-blue-600 - text-white rounded-lg font-medium transition-colors`,children:"Save"})]})]})}):null}const Kg="/copilot_web/assets/logo-BTZhX0BN.png";function zg({onClose:m,onClear:b,hasMessages:a,onHeightResize:F,title:M="ComfyUI-Copilot"}){const[E,B]=L.useState(!1),[te,y]=L.useState(!1),q=()=>{B(!0)},$=P=>{localStorage.setItem("chatApiKey",P)};return L.useEffect(()=>{const P=re=>{if(!te)return;const ge=re.movementY;F?.(ge)},ve=()=>{y(!1)};return te&&(document.addEventListener("mousemove",P),document.addEventListener("mouseup",ve)),()=>{document.removeEventListener("mousemove",P),document.removeEventListener("mouseup",ve)}},[te,F]),h.jsxs(h.Fragment,{children:[h.jsxs("div",{className:`flex items-center justify-between border-b px-4 py-3 - bg-white border-gray-200 sticky top-2 z-10`,children:[h.jsxs("div",{className:"flex items-center space-x-2",children:[h.jsx("img",{src:Kg,alt:"ComfyUI-Copilot Logo",className:"h-10 w-10 -ml-1"}),h.jsx("h3",{className:"text-[16px] font-medium text-gray-800",children:M}),h.jsx("button",{onClick:q,className:"p-1 bg-white border-none hover:bg-gray-100 rounded text-gray-500",children:h.jsx(Bg,{className:"h-5 w-5"})})]}),h.jsx("div",{className:"flex items-center gap-1",children:h.jsx("button",{className:`inline-flex bg-white border-none items-center justify-center rounded-md p-2 - ${a?"text-gray-500 hover:bg-gray-100":"text-gray-300 cursor-not-allowed"}`,disabled:!a,onClick:b,children:h.jsx(Fg,{className:"h-5 w-5"})})})]}),h.jsx(Gg,{isOpen:E,onClose:()=>B(!1),onSave:$,initialApiKey:localStorage.getItem("chatApiKey")||""})]})}const $g=5*1024*1024,Ma=["image/jpeg","image/png","image/gif","image/webp"],tu=[{name:"gpt-4o",image_enable:!0},{name:"gpt-4o-mini",image_enable:!0},{name:"qwen-plus",image_enable:!1},{name:"DeepSeek-V3",image_enable:!1}];function Hg({input:m,loading:b,onChange:a,onSend:F,onKeyPress:M,onUploadImages:E,uploadedImages:B,onRemoveImage:te,selectedModel:y,onModelChange:q}){const[$,P]=L.useState(!1),ve=wn.useRef(null),re=L.useRef(null);L.useEffect(()=>{re.current&&(re.current.style.height="auto",re.current.style.height=`${Math.min(re.current.scrollHeight,400)}px`)},[m]);const ge=T=>{if(T.target.files){const k=[],oe=[];if(Array.from(T.target.files).forEach(ce=>{Ma.includes(ce.type)?ce.size>$g?k.push(`${ce.name} (exceeds 5MB)`):oe.push(ce):k.push(`${ce.name} (unsupported format)`)}),k.length>0&&alert(`The following files couldn't be uploaded: + text-white rounded-lg font-medium transition-colors`,children:"Save"})]})]})}):null}const Kg="/copilot_web/assets/logo-BTZhX0BN.png";function zg({onClose:m,onClear:b,hasMessages:a,onHeightResize:F,title:M="ComfyUI-Copilot"}){const[E,B]=L.useState(!1),[te,y]=L.useState(!1),q=()=>{B(!0)},$=P=>{localStorage.setItem("chatApiKey",P)};return L.useEffect(()=>{const P=re=>{if(!te)return;const ge=re.movementY;F?.(ge)},ve=()=>{y(!1)};return te&&(document.addEventListener("mousemove",P),document.addEventListener("mouseup",ve)),()=>{document.removeEventListener("mousemove",P),document.removeEventListener("mouseup",ve)}},[te,F]),h.jsxs(h.Fragment,{children:[h.jsxs("div",{className:`flex items-center justify-between border-b px-3 py-2 + bg-white border-gray-200 sticky top-2 z-10`,children:[h.jsxs("div",{className:"flex items-center space-x-1",children:[h.jsx("img",{src:Kg,alt:"ComfyUI-Copilot Logo",className:"h-7 w-7 -ml-1"}),h.jsx("h3",{className:"text-[14px] font-medium text-gray-800",children:M}),h.jsx("button",{onClick:q,className:"p-1 bg-white border-none hover:bg-gray-100 rounded text-gray-500",children:h.jsx(Bg,{className:"h-4 w-4"})})]}),h.jsx("div",{className:"flex items-center gap-1",children:h.jsx("button",{className:`inline-flex bg-white border-none items-center justify-center rounded-md p-1.5 + ${a?"text-gray-500 hover:bg-gray-100":"text-gray-300 cursor-not-allowed"}`,disabled:!a,onClick:b,children:h.jsx(Fg,{className:"h-4 w-4"})})})]}),h.jsx(Gg,{isOpen:E,onClose:()=>B(!1),onSave:$,initialApiKey:localStorage.getItem("chatApiKey")||""})]})}const $g=5*1024*1024,Ma=["image/jpeg","image/png","image/gif","image/webp"],tu=[{name:"gpt-4o",image_enable:!0},{name:"gpt-4o-mini",image_enable:!0},{name:"qwen-plus",image_enable:!1},{name:"DeepSeek-V3",image_enable:!1}];function Hg({input:m,loading:b,onChange:a,onSend:F,onKeyPress:M,onUploadImages:E,uploadedImages:B,onRemoveImage:te,selectedModel:y,onModelChange:q}){const[$,P]=L.useState(!1),ve=wn.useRef(null),re=L.useRef(null);L.useEffect(()=>{re.current&&(re.current.style.height="auto",re.current.style.height=`${Math.min(re.current.scrollHeight,400)}px`)},[m]);const ge=T=>{if(T.target.files){const k=[],oe=[];if(Array.from(T.target.files).forEach(ce=>{Ma.includes(ce.type)?ce.size>$g?k.push(`${ce.name} (exceeds 5MB)`):oe.push(ce):k.push(`${ce.name} (unsupported format)`)}),k.length>0&&alert(`The following files couldn't be uploaded: ${k.join(` `)}`),oe.length>0){const ce=new DataTransfer;oe.forEach(se=>ce.items.add(se)),E(ce.files)}}};return h.jsxs("div",{className:`relative ${B.length>0?"mt-12":""}`,children:[B.length>0&&h.jsx("div",{className:"absolute -top-10 left-0 flex gap-2",children:B.map(T=>h.jsxs("div",{className:"relative group",children:[h.jsx("img",{src:T.preview,alt:"uploaded",className:"w-8 h-8 rounded object-cover"}),h.jsx("button",{onClick:()=>te(T.id),className:`absolute -top-1 -right-1 bg-white border-none text-gray-500 rounded-full p-0.5 opacity-0 group-hover:opacity-100 transition-opacity`,children:h.jsx(nu,{className:"w-3 h-3"})})]},T.id))}),h.jsx("textarea",{ref:re,onChange:a,onKeyDown:T=>{if(T.key==="Enter"&&!T.shiftKey){if(T.nativeEvent.isComposing)return;T.preventDefault(),m.trim()!==""&&F()}M(T)},value:m,placeholder:"Type your message...",className:`w-full min-h-[80px] max-h-[400px] resize-none rounded-md border @@ -126,4 +126,4 @@ __p += '`),z&&(v+=`' + function print() { __p += __j.call(arguments, '') } `:`; `)+v+`return __p -}`;var W=Ta(function(){return Y(s,S+"return "+v).apply(a,o)});if(W.source=v,zi(W))throw W;return W}function C0(e){return J(e).toLowerCase()}function N0(e){return J(e).toUpperCase()}function L0(e,n,t){if(e=J(e),e&&(t||n===a))return Uu(e);if(!e||!(n=Fe(n)))return e;var r=tn(e),i=tn(n),s=Fu(r,i),o=ju(r,i)+1;return On(r,s,o).join("")}function T0(e,n,t){if(e=J(e),e&&(t||n===a))return e.slice(0,Ku(e)+1);if(!e||!(n=Fe(n)))return e;var r=tn(e),i=ju(r,tn(n))+1;return On(r,0,i).join("")}function R0(e,n,t){if(e=J(e),e&&(t||n===a))return e.replace(zr,"");if(!e||!(n=Fe(n)))return e;var r=tn(e),i=Fu(r,tn(n));return On(r,i).join("")}function O0(e,n){var t=bn,r=Cr;if(ae(n)){var i="separator"in n?n.separator:i;t="length"in n?D(n.length):t,r="omission"in n?Fe(n.omission):r}e=J(e);var s=e.length;if(Qn(e)){var o=tn(e);s=o.length}if(t>=s)return e;var l=t-Vn(r);if(l<1)return r;var c=o?On(o,0,l).join(""):e.slice(0,l);if(i===a)return c+r;if(o&&(l+=c.length-l),$i(i)){if(e.slice(l).search(i)){var p,_=c;for(i.global||(i=ai(i.source,J(au.exec(i))+"g")),i.lastIndex=0;p=i.exec(_);)var v=p.index;c=c.slice(0,v===a?l:v)}}else if(e.indexOf(Fe(i),l)!=l){var x=c.lastIndexOf(i);x>-1&&(c=c.slice(0,x))}return c+r}function M0(e){return e=J(e),e&&Ga.test(e)?e.replace(iu,al):e}var D0=st(function(e,n,t){return e+(t?" ":"")+n.toUpperCase()}),Zi=Rs("toUpperCase");function La(e,n,t){return e=J(e),n=t?a:n,n===a?tl(e)?fl(e):qo(e):e.match(n)||[]}var Ta=U(function(e,n){try{return Be(e,a,n)}catch(t){return zi(t)?t:new R(t)}}),P0=_n(function(e,n){return qe(n,function(t){t=ln(t),gn(e,t,Gi(e[t],e))}),e});function k0(e){var n=e==null?0:e.length,t=I();return e=n?ue(e,function(r){if(typeof r[1]!="function")throw new Ze(B);return[t(r[0]),r[1]]}):[],U(function(r){for(var i=-1;++iSn)return[];var t=ze,r=Ee(e,ze);n=I(n),e-=ze;for(var i=ii(r,n);++t0||n<0)?new K(t):(e<0?t=t.takeRight(-e):e&&(t=t.drop(e)),n!==a&&(n=D(n),t=n<0?t.dropRight(-n):t.take(n-e)),t)},K.prototype.takeRightWhile=function(e){return this.reverse().takeWhile(e).reverse()},K.prototype.toArray=function(){return this.take(ze)},an(K.prototype,function(e,n){var t=/^(?:filter|find|map|reject)|While$/.test(n),r=/^(?:head|last)$/.test(n),i=u[r?"take"+(n=="last"?"Right":""):n],s=r||/^find/.test(n);i&&(u.prototype[n]=function(){var o=this.__wrapped__,l=r?[1]:arguments,c=o instanceof K,p=l[0],_=c||O(o),v=function(G){var z=i.apply(u,In([G],l));return r&&x?z[0]:z};_&&t&&typeof p=="function"&&p.length!=1&&(c=_=!1);var x=this.__chain__,S=!!this.__actions__.length,C=s&&!x,W=c&&!S;if(!s&&_){o=W?o:new K(this);var N=e.apply(o,l);return N.__actions__.push({func:vr,args:[v],thisArg:a}),new Ye(N,x)}return C&&W?e.apply(this,l):(N=this.thru(v),C?r?N.value()[0]:N.value():N)})}),qe(["pop","push","shift","sort","splice","unshift"],function(e){var n=Kt[e],t=/^(?:push|sort|unshift)$/.test(e)?"tap":"thru",r=/^(?:pop|shift)$/.test(e);u.prototype[e]=function(){var i=arguments;if(r&&!this.__chain__){var s=this.value();return n.apply(O(s)?s:[],i)}return this[t](function(o){return n.apply(O(o)?o:[],i)})}}),an(K.prototype,function(e,n){var t=u[n];if(t){var r=t.name+"";X.call(rt,r)||(rt[r]=[]),rt[r].push({name:n,func:t})}}),rt[fr(a,oe).name]=[{name:"wrapper",func:a}],K.prototype.clone=Ol,K.prototype.reverse=Ml,K.prototype.value=Dl,u.prototype.at=fh,u.prototype.chain=ch,u.prototype.commit=hh,u.prototype.next=dh,u.prototype.plant=ph,u.prototype.reverse=_h,u.prototype.toJSON=u.prototype.valueOf=u.prototype.value=vh,u.prototype.first=u.prototype.head,_t&&(u.prototype[_t]=gh),u},et=cl();kn?((kn.exports=et)._=et,Jr._=et):we._=et}).call(Tt)})(Ir,Ir.exports);var ka=Ir.exports;function ip(m=!0){L.useEffect(()=>{if(!m)return;const b=ka.debounce(a=>{document.documentElement.style.setProperty("--mouse-x",`${a.clientX}px`),document.documentElement.style.setProperty("--mouse-y",`${a.clientY}px`)},16);return document.addEventListener("mousemove",b),()=>{b.cancel(),document.removeEventListener("mousemove",b)}},[m])}function up(m=!0){const{state:b,dispatch:a}=ru(),{activeTab:F,screenState:M}=b;L.useEffect(()=>{if(!m)return;const E=B=>{const te=F==="parameter-debug",y=F==="chat",q=!M||M.currentScreen===0;if(y||q&&te){const $=fn.canvas.selected_nodes;Object.keys($??{}).length?a({type:"SET_SELECTED_NODE",payload:Object.values($)}):a({type:"SET_SELECTED_NODE",payload:null})}};return document.addEventListener("click",E),()=>{document.removeEventListener("click",E)}},[a,m,F,M])}const sp=({message:m,onClose:b})=>m?h.jsxs("div",{className:"bg-gradient-to-r from-amber-50 to-amber-100 border-b border-amber-200 px-5 py-2 mt-2 relative shadow-sm",children:[h.jsxs("div",{className:"flex items-center",children:[h.jsx("div",{className:"flex-shrink-0 mr-2",children:h.jsx("svg",{className:"w-3.5 h-3.5 text-amber-600",fill:"currentColor",viewBox:"0 0 20 20",xmlns:"http://www.w3.org/2000/svg",children:h.jsx("path",{fillRule:"evenodd",d:"M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a1 1 0 000 2v3a1 1 0 001 1h1a1 1 0 100-2v-3a1 1 0 00-1-1H9z",clipRule:"evenodd"})})}),h.jsx("div",{className:"text-amber-800 font-medium leading-relaxed pr-6 markdown-content",style:{fontSize:"11px"},children:h.jsx(Cg,{rehypePlugins:[[yg,{target:"_blank",rel:["noopener","noreferrer"]}]],remarkPlugins:[wg],className:"prose !text-[11px] prose-a:text-amber-700 prose-a:underline prose-a:font-medium hover:prose-a:text-amber-800",components:{a:({node:a,...F})=>h.jsx("a",{...F,className:"text-amber-700 underline hover:text-amber-800 transition-colors",style:{fontSize:"11px"}}),p:({children:a})=>h.jsx("span",{className:"inline",style:{fontSize:"11px"},children:a}),span:({children:a})=>h.jsx("span",{style:{fontSize:"11px"},children:a}),li:({children:a})=>h.jsx("li",{style:{fontSize:"11px"},children:a}),ul:({children:a})=>h.jsx("ul",{style:{fontSize:"11px"},children:a}),ol:({children:a})=>h.jsx("ol",{style:{fontSize:"11px"},children:a})},children:m})})]}),h.jsx("button",{onClick:b,className:"absolute right-2 top-1/2 -translate-y-1/2 text-amber-500 hover:text-amber-700 transition-colors p-1 rounded-full hover:bg-amber-200/50","aria-label":"Close announcement",children:h.jsx("svg",{className:"w-3 h-3",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:h.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M6 18L18 6M6 6l12 12"})})})]}):null,ap=()=>{const{state:m,dispatch:b}=ru(),{selectedNode:a,screenState:F}=m,M=a||[],E=wn.lazy(()=>Ot(()=>import("./ParameterDebugInterfaceNew-Bll5geLy.js"),__vite__mapDeps([4,1,2,3,5,6,7])).then(te=>({default:te.ParameterDebugInterface}))),B=()=>{b({type:"SET_SELECTED_NODE",payload:null}),b({type:"SET_SCREEN_STATE",payload:null}),localStorage.removeItem("screenState")};return h.jsx("div",{className:"flex-1 flex flex-col overflow-y-auto",children:h.jsx(wn.Suspense,{fallback:h.jsx("div",{children:"Loading..."}),children:h.jsx(E,{selectedNodes:M,visible:!0,onClose:B})})})},Da=({active:m,onClick:b,children:a})=>h.jsx("button",{onClick:b,className:`px-4 py-2 font-medium text-sm transition-colors duration-200 ${m?"text-blue-600 border-b-2 border-blue-600":"text-gray-600 hover:text-blue-500 hover:border-b-2 hover:border-blue-300"}`,children:a});function op({onClose:m,visible:b=!0,triggerUsage:a=!1,onUsageTriggered:F}){const{state:M,dispatch:E}=ru(),{messages:B,installedNodes:te,loading:y,sessionId:q,selectedNode:$,activeTab:P}=M,ve=L.useRef(null),[re,ge]=L.useState(""),[T,k]=L.useState(""),[oe,ce]=L.useState(window.innerWidth/3),[se,Pe]=L.useState(!1),[le,H]=L.useState([]),[Z,Se]=L.useState("gpt-4o-mini");L.useState(window.innerHeight),L.useState(0);const[pe,bn]=L.useState(""),[Cr,Dt]=L.useState(!1);ip(b&&P==="chat"),up(b),L.useEffect(()=>{ve.current&&(ve.current.scrollTop=ve.current.scrollHeight)},[B]),L.useEffect(()=>{if(P!=="chat")return;(async()=>{const j=await rp();console.log("[WorkflowChat] Received installed nodes:",j.length),E({type:"SET_INSTALLED_NODES",payload:j})})()},[P]);const Nr=async A=>{try{const j=await Rt.fetchMessages(A);E({type:"SET_MESSAGES",payload:j})}catch(j){console.error("Error fetching messages:",j)}};L.useEffect(()=>{if(P!=="chat")return;let A=localStorage.getItem("sessionId");A?(E({type:"SET_SESSION_ID",payload:A}),Nr(A)):(A=en(),E({type:"SET_SESSION_ID",payload:A}),localStorage.setItem("sessionId",A))},[P]),L.useEffect(()=>{const A=localStorage.getItem("activeTab");A&&E({type:"SET_ACTIVE_TAB",payload:A});const j=localStorage.getItem("screenState");j&&E({type:"SET_SCREEN_STATE",payload:JSON.parse(j)})},[]),L.useEffect(()=>{localStorage.setItem("activeTab",P)},[P]),L.useEffect(()=>{M.screenState&&localStorage.setItem("screenState",JSON.stringify(M.screenState))},[M.screenState]);const ct=wn.useCallback(A=>{if(!se)return;const j=window.innerWidth-A.clientX,_e=Math.min(Math.max(300,j),window.innerWidth*.8);ce(_e)},[se]),$n=wn.useMemo(()=>ka.debounce(ct,16),[ct]);L.useEffect(()=>(se&&(document.addEventListener("mousemove",$n),document.addEventListener("mouseup",cn)),()=>{document.removeEventListener("mousemove",$n),document.removeEventListener("mouseup",cn),$n.cancel()}),[se,$n]);const Lr=A=>{ge(A.target.value)},Dn=async()=>{if(E({type:"SET_LOADING",payload:!0}),re.trim()===""&&!$||!q)return;k(re);const A=en(),j={id:en(),role:"user",content:re,trace_id:A};E({type:"ADD_MESSAGE",payload:j}),ge("");try{const _e={type:"model_select",data:[Z]};let V=en(),$e=!0;for await(const ke of Rt.streamInvokeServer(q,re,le.map(ie=>ie.file),null,_e,A)){const ie={id:V,role:"ai",content:JSON.stringify(ke),format:ke.format,finished:ke.finished,name:"Assistant"};if($e)E({type:"ADD_MESSAGE",payload:ie}),$e=!1;else{E({type:"UPDATE_MESSAGE",payload:ie});const Ae=M.messages.map(We=>We.id===ie.id&&!We.finished?ie:We);qn(Ae)}ke.finished&&E({type:"SET_LOADING",payload:!1})}}catch(_e){console.error("Error sending message:",_e),E({type:"SET_LOADING",payload:!1})}finally{H([])}},Sn=async A=>{if(!q)return;E({type:"SET_LOADING",payload:!0}),k(A);const j=en(),_e={id:en(),role:"user",content:A,trace_id:j};E({type:"ADD_MESSAGE",payload:_e});try{const V={type:"model_select",data:[Z]};let $e=en(),ke=!0;for await(const ie of Rt.streamInvokeServer(q,A,le.map(Ae=>Ae.file),null,V,j)){const Ae={id:$e,role:"ai",content:JSON.stringify(ie),format:ie.format,finished:ie.finished,name:"Assistant"};if(ke)E({type:"ADD_MESSAGE",payload:Ae}),ke=!1;else{E({type:"UPDATE_MESSAGE",payload:Ae});const We=M.messages.map(nn=>nn.id===Ae.id&&!nn.finished?Ae:nn);qn(We)}ie.finished&&E({type:"SET_LOADING",payload:!1})}}catch(V){console.error("Error sending message:",V),E({type:"SET_LOADING",payload:!1})}finally{H([])}},Tr=A=>{A.metaKey&&A.key==="Enter"&&Dn()},Hn=()=>{E({type:"CLEAR_MESSAGES"});const A=M.sessionId;A&&localStorage.removeItem(`messages_${A}`),localStorage.removeItem("sessionId");const j=en();E({type:"SET_SESSION_ID",payload:j}),localStorage.setItem("sessionId",j)},ze=A=>{ge(A)},Pt=async(A,j)=>{if(!q||!$)return;E({type:"SET_LOADING",payload:!0});const _e=$[0].comfyClass||$[0].type,V=en(),$e={id:en(),role:"user",content:_e,trace_id:V};E({type:"ADD_MESSAGE",payload:$e});try{let ke=en(),ie=!0;for await(const Ae of Rt.streamInvokeServer(q,_e,[],A,j,V)){const We={id:ke,role:"ai",content:JSON.stringify(Ae),format:Ae.format,finished:Ae.finished,name:"Assistant"};if(A&&A!==""&&(We.metadata={intent:A}),ie)E({type:"ADD_MESSAGE",payload:We}),ie=!1;else{E({type:"UPDATE_MESSAGE",payload:We});const nn=M.messages.map(Ce=>Ce.id===We.id&&!Ce.finished?We:Ce);qn(nn)}Ae.finished&&E({type:"SET_LOADING",payload:!1})}}catch(ke){console.error("Error sending message:",ke),E({type:"SET_LOADING",payload:!1})}},qn=A=>{M.sessionId&&localStorage.setItem(`messages_${M.sessionId}`,JSON.stringify(A))},Rr=A=>{console.log("[WorkflowChat] Adding new message:",A);const j=[...M.messages,A];E({type:"ADD_MESSAGE",payload:A}),qn(j)},cn=()=>{Pe(!1)},Zn=A=>{const j=Array.from(A).map(_e=>({id:Math.random().toString(36).substr(2,9),file:_e,preview:URL.createObjectURL(_e)}));H(_e=>[..._e,...j])},Or=A=>{H(j=>j.filter(V=>V.id!==A))};wn.useEffect(()=>()=>{le.forEach(A=>URL.revokeObjectURL(A.preview))},[le]),L.useEffect(()=>{a&&F&&P==="chat"&&(Pt("node_explain"),F())},[a,P]),L.useEffect(()=>{if(!b||P!=="chat")return;(async()=>{try{const j=new Date().toDateString();if(localStorage.getItem("announcementLastShownDate")!==j){const V=await Rt.fetchAnnouncement();V&&V.trim()!==""&&(bn(V),Dt(!0),localStorage.setItem("announcementLastShownDate",j))}}catch(j){console.error("Error fetching announcement:",j)}})()},[b,P]);const Pn=()=>{Dt(!1)},An=A=>{E({type:"SET_ACTIVE_TAB",payload:A})},Mr=wn.useMemo(()=>h.jsx(ap,{}),[]);return b?h.jsxs("div",{className:"flex flex-col h-full w-full bg-white",style:{display:b?"flex":"none",height:"100%"},children:[h.jsx("div",{className:"absolute left-0 top-0 bottom-0 w-1 cursor-ew-resize hover:bg-gray-300"}),h.jsxs("div",{className:"flex h-full flex-col",children:[h.jsx(zg,{onClose:m,onClear:Hn,hasMessages:B.length>0,title:"ComfyUI-Copilot"}),h.jsxs("div",{className:"flex border-b border-gray-200 mt-2",children:[h.jsx(Da,{active:P==="chat",onClick:()=>An("chat"),children:"Chat"}),h.jsx(Da,{active:P==="parameter-debug",onClick:()=>An("parameter-debug"),children:"GenLab"})]}),Cr&&pe&&P==="chat"&&h.jsx(sp,{message:pe,onClose:Pn}),h.jsx("div",{className:"flex-1 overflow-y-auto p-4 scroll-smooth h-0",style:{display:P==="chat"?"block":"none"},ref:ve,children:h.jsx(np,{messages:B,latestInput:T,onOptionClick:ze,installedNodes:te,onAddMessage:Rr,loading:y})}),h.jsxs("div",{className:"border-t px-4 py-3 border-gray-200 bg-white sticky bottom-0",style:{display:P==="chat"?"block":"none"},children:[$&&h.jsx(Zg,{nodeInfo:$,onSendWithIntent:Pt,loading:y,onSendWithContent:Sn}),h.jsx(Hg,{input:re,loading:y,onChange:Lr,onSend:Dn,onKeyPress:Tr,onUploadImages:Zn,uploadedImages:le,onRemoveImage:Or,selectedModel:Z,onModelChange:Se})]}),h.jsx("div",{className:"flex-1 flex flex-col h-0",style:{display:P==="parameter-debug"?"flex":"none"},children:Mr})]})]}):null}const vp=Object.freeze(Object.defineProperty({__proto__:null,default:op},Symbol.toStringTag,{value:"Module"}));export{_p as g,pp as i,gp as m,dp as r,vp as w}; +}`;var W=Ta(function(){return Y(s,S+"return "+v).apply(a,o)});if(W.source=v,zi(W))throw W;return W}function C0(e){return J(e).toLowerCase()}function N0(e){return J(e).toUpperCase()}function L0(e,n,t){if(e=J(e),e&&(t||n===a))return Uu(e);if(!e||!(n=Fe(n)))return e;var r=tn(e),i=tn(n),s=Fu(r,i),o=ju(r,i)+1;return On(r,s,o).join("")}function T0(e,n,t){if(e=J(e),e&&(t||n===a))return e.slice(0,Ku(e)+1);if(!e||!(n=Fe(n)))return e;var r=tn(e),i=ju(r,tn(n))+1;return On(r,0,i).join("")}function R0(e,n,t){if(e=J(e),e&&(t||n===a))return e.replace(zr,"");if(!e||!(n=Fe(n)))return e;var r=tn(e),i=Fu(r,tn(n));return On(r,i).join("")}function O0(e,n){var t=bn,r=Cr;if(ae(n)){var i="separator"in n?n.separator:i;t="length"in n?D(n.length):t,r="omission"in n?Fe(n.omission):r}e=J(e);var s=e.length;if(Qn(e)){var o=tn(e);s=o.length}if(t>=s)return e;var l=t-Vn(r);if(l<1)return r;var c=o?On(o,0,l).join(""):e.slice(0,l);if(i===a)return c+r;if(o&&(l+=c.length-l),$i(i)){if(e.slice(l).search(i)){var p,_=c;for(i.global||(i=ai(i.source,J(au.exec(i))+"g")),i.lastIndex=0;p=i.exec(_);)var v=p.index;c=c.slice(0,v===a?l:v)}}else if(e.indexOf(Fe(i),l)!=l){var x=c.lastIndexOf(i);x>-1&&(c=c.slice(0,x))}return c+r}function M0(e){return e=J(e),e&&Ga.test(e)?e.replace(iu,al):e}var D0=st(function(e,n,t){return e+(t?" ":"")+n.toUpperCase()}),Zi=Rs("toUpperCase");function La(e,n,t){return e=J(e),n=t?a:n,n===a?tl(e)?fl(e):qo(e):e.match(n)||[]}var Ta=U(function(e,n){try{return Be(e,a,n)}catch(t){return zi(t)?t:new R(t)}}),P0=_n(function(e,n){return qe(n,function(t){t=ln(t),gn(e,t,Gi(e[t],e))}),e});function k0(e){var n=e==null?0:e.length,t=I();return e=n?ue(e,function(r){if(typeof r[1]!="function")throw new Ze(B);return[t(r[0]),r[1]]}):[],U(function(r){for(var i=-1;++iSn)return[];var t=ze,r=Ee(e,ze);n=I(n),e-=ze;for(var i=ii(r,n);++t0||n<0)?new K(t):(e<0?t=t.takeRight(-e):e&&(t=t.drop(e)),n!==a&&(n=D(n),t=n<0?t.dropRight(-n):t.take(n-e)),t)},K.prototype.takeRightWhile=function(e){return this.reverse().takeWhile(e).reverse()},K.prototype.toArray=function(){return this.take(ze)},an(K.prototype,function(e,n){var t=/^(?:filter|find|map|reject)|While$/.test(n),r=/^(?:head|last)$/.test(n),i=u[r?"take"+(n=="last"?"Right":""):n],s=r||/^find/.test(n);i&&(u.prototype[n]=function(){var o=this.__wrapped__,l=r?[1]:arguments,c=o instanceof K,p=l[0],_=c||O(o),v=function(G){var z=i.apply(u,In([G],l));return r&&x?z[0]:z};_&&t&&typeof p=="function"&&p.length!=1&&(c=_=!1);var x=this.__chain__,S=!!this.__actions__.length,C=s&&!x,W=c&&!S;if(!s&&_){o=W?o:new K(this);var N=e.apply(o,l);return N.__actions__.push({func:vr,args:[v],thisArg:a}),new Ye(N,x)}return C&&W?e.apply(this,l):(N=this.thru(v),C?r?N.value()[0]:N.value():N)})}),qe(["pop","push","shift","sort","splice","unshift"],function(e){var n=Kt[e],t=/^(?:push|sort|unshift)$/.test(e)?"tap":"thru",r=/^(?:pop|shift)$/.test(e);u.prototype[e]=function(){var i=arguments;if(r&&!this.__chain__){var s=this.value();return n.apply(O(s)?s:[],i)}return this[t](function(o){return n.apply(O(o)?o:[],i)})}}),an(K.prototype,function(e,n){var t=u[n];if(t){var r=t.name+"";X.call(rt,r)||(rt[r]=[]),rt[r].push({name:n,func:t})}}),rt[fr(a,oe).name]=[{name:"wrapper",func:a}],K.prototype.clone=Ol,K.prototype.reverse=Ml,K.prototype.value=Dl,u.prototype.at=fh,u.prototype.chain=ch,u.prototype.commit=hh,u.prototype.next=dh,u.prototype.plant=ph,u.prototype.reverse=_h,u.prototype.toJSON=u.prototype.valueOf=u.prototype.value=vh,u.prototype.first=u.prototype.head,_t&&(u.prototype[_t]=gh),u},et=cl();kn?((kn.exports=et)._=et,Jr._=et):we._=et}).call(Tt)})(Ir,Ir.exports);var ka=Ir.exports;function ip(m=!0){L.useEffect(()=>{if(!m)return;const b=ka.debounce(a=>{document.documentElement.style.setProperty("--mouse-x",`${a.clientX}px`),document.documentElement.style.setProperty("--mouse-y",`${a.clientY}px`)},16);return document.addEventListener("mousemove",b),()=>{b.cancel(),document.removeEventListener("mousemove",b)}},[m])}function up(m=!0){const{state:b,dispatch:a}=ru(),{activeTab:F,screenState:M}=b;L.useEffect(()=>{if(!m)return;const E=B=>{const te=F==="parameter-debug",y=F==="chat",q=!M||M.currentScreen===0;if(y||q&&te){const $=fn.canvas.selected_nodes;Object.keys($??{}).length?a({type:"SET_SELECTED_NODE",payload:Object.values($)}):a({type:"SET_SELECTED_NODE",payload:null})}};return document.addEventListener("click",E),()=>{document.removeEventListener("click",E)}},[a,m,F,M])}const sp=({message:m,onClose:b})=>m?h.jsxs("div",{className:"bg-gradient-to-r from-amber-50 to-amber-100 border-b border-amber-200 px-5 py-2 mt-2 relative shadow-sm",children:[h.jsxs("div",{className:"flex items-center",children:[h.jsx("div",{className:"flex-shrink-0 mr-2",children:h.jsx("svg",{className:"w-3.5 h-3.5 text-amber-600",fill:"currentColor",viewBox:"0 0 20 20",xmlns:"http://www.w3.org/2000/svg",children:h.jsx("path",{fillRule:"evenodd",d:"M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a1 1 0 000 2v3a1 1 0 001 1h1a1 1 0 100-2v-3a1 1 0 00-1-1H9z",clipRule:"evenodd"})})}),h.jsx("div",{className:"text-amber-800 font-medium leading-relaxed pr-6 markdown-content",style:{fontSize:"11px"},children:h.jsx(Cg,{rehypePlugins:[[yg,{target:"_blank",rel:["noopener","noreferrer"]}]],remarkPlugins:[wg],className:"prose !text-[11px] prose-a:text-amber-700 prose-a:underline prose-a:font-medium hover:prose-a:text-amber-800",components:{a:({node:a,...F})=>h.jsx("a",{...F,className:"text-amber-700 underline hover:text-amber-800 transition-colors",style:{fontSize:"11px"}}),p:({children:a})=>h.jsx("span",{className:"inline",style:{fontSize:"11px"},children:a}),span:({children:a})=>h.jsx("span",{style:{fontSize:"11px"},children:a}),li:({children:a})=>h.jsx("li",{style:{fontSize:"11px"},children:a}),ul:({children:a})=>h.jsx("ul",{style:{fontSize:"11px"},children:a}),ol:({children:a})=>h.jsx("ol",{style:{fontSize:"11px"},children:a})},children:m})})]}),h.jsx("button",{onClick:b,className:"absolute right-2 top-1/2 -translate-y-1/2 text-amber-500 hover:text-amber-700 transition-colors p-1 rounded-full hover:bg-amber-200/50","aria-label":"Close announcement",children:h.jsx("svg",{className:"w-3 h-3",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:h.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M6 18L18 6M6 6l12 12"})})})]}):null,ap=()=>{const{state:m,dispatch:b}=ru(),{selectedNode:a,screenState:F}=m,M=a||[],E=wn.lazy(()=>Ot(()=>import("./ParameterDebugInterfaceV2-CiC0RieE.js"),__vite__mapDeps([4,1,2,3,5,6,7])).then(te=>({default:te.ParameterDebugInterface}))),B=()=>{b({type:"SET_SELECTED_NODE",payload:null}),b({type:"SET_SCREEN_STATE",payload:null}),localStorage.removeItem("screenState")};return h.jsx("div",{className:"flex-1 flex flex-col overflow-y-auto",children:h.jsx(wn.Suspense,{fallback:h.jsx("div",{children:"Loading..."}),children:h.jsx(E,{selectedNodes:M,visible:!0,onClose:B})})})},Da=({active:m,onClick:b,children:a})=>h.jsx("button",{onClick:b,className:`px-4 py-2 font-medium text-xs transition-colors duration-200 ${m?"text-blue-600 border-b-2 border-blue-600":"text-gray-600 hover:text-blue-500 hover:border-b-2 hover:border-blue-300"}`,children:a});function op({onClose:m,visible:b=!0,triggerUsage:a=!1,onUsageTriggered:F}){const{state:M,dispatch:E}=ru(),{messages:B,installedNodes:te,loading:y,sessionId:q,selectedNode:$,activeTab:P}=M,ve=L.useRef(null),[re,ge]=L.useState(""),[T,k]=L.useState(""),[oe,ce]=L.useState(window.innerWidth/3),[se,Pe]=L.useState(!1),[le,H]=L.useState([]),[Z,Se]=L.useState("gpt-4o-mini");L.useState(window.innerHeight),L.useState(0);const[pe,bn]=L.useState(""),[Cr,Dt]=L.useState(!1);ip(b&&P==="chat"),up(b),L.useEffect(()=>{ve.current&&(ve.current.scrollTop=ve.current.scrollHeight)},[B]),L.useEffect(()=>{if(P!=="chat")return;(async()=>{const j=await rp();console.log("[WorkflowChat] Received installed nodes:",j.length),E({type:"SET_INSTALLED_NODES",payload:j})})()},[P]);const Nr=async A=>{try{const j=await Rt.fetchMessages(A);E({type:"SET_MESSAGES",payload:j})}catch(j){console.error("Error fetching messages:",j)}};L.useEffect(()=>{if(P!=="chat")return;let A=localStorage.getItem("sessionId");A?(E({type:"SET_SESSION_ID",payload:A}),Nr(A)):(A=en(),E({type:"SET_SESSION_ID",payload:A}),localStorage.setItem("sessionId",A))},[P]),L.useEffect(()=>{const A=localStorage.getItem("activeTab");A&&E({type:"SET_ACTIVE_TAB",payload:A});const j=localStorage.getItem("screenState");j&&E({type:"SET_SCREEN_STATE",payload:JSON.parse(j)})},[]),L.useEffect(()=>{localStorage.setItem("activeTab",P)},[P]),L.useEffect(()=>{M.screenState&&localStorage.setItem("screenState",JSON.stringify(M.screenState))},[M.screenState]);const ct=wn.useCallback(A=>{if(!se)return;const j=window.innerWidth-A.clientX,_e=Math.min(Math.max(300,j),window.innerWidth*.8);ce(_e)},[se]),$n=wn.useMemo(()=>ka.debounce(ct,16),[ct]);L.useEffect(()=>(se&&(document.addEventListener("mousemove",$n),document.addEventListener("mouseup",cn)),()=>{document.removeEventListener("mousemove",$n),document.removeEventListener("mouseup",cn),$n.cancel()}),[se,$n]);const Lr=A=>{ge(A.target.value)},Dn=async()=>{if(E({type:"SET_LOADING",payload:!0}),re.trim()===""&&!$||!q)return;k(re);const A=en(),j={id:en(),role:"user",content:re,trace_id:A};E({type:"ADD_MESSAGE",payload:j}),ge("");try{const _e={type:"model_select",data:[Z]};let V=en(),$e=!0;for await(const ke of Rt.streamInvokeServer(q,re,le.map(ie=>ie.file),null,_e,A)){const ie={id:V,role:"ai",content:JSON.stringify(ke),format:ke.format,finished:ke.finished,name:"Assistant"};if($e)E({type:"ADD_MESSAGE",payload:ie}),$e=!1;else{E({type:"UPDATE_MESSAGE",payload:ie});const Ae=M.messages.map(We=>We.id===ie.id&&!We.finished?ie:We);qn(Ae)}ke.finished&&E({type:"SET_LOADING",payload:!1})}}catch(_e){console.error("Error sending message:",_e),E({type:"SET_LOADING",payload:!1})}finally{H([])}},Sn=async A=>{if(!q)return;E({type:"SET_LOADING",payload:!0}),k(A);const j=en(),_e={id:en(),role:"user",content:A,trace_id:j};E({type:"ADD_MESSAGE",payload:_e});try{const V={type:"model_select",data:[Z]};let $e=en(),ke=!0;for await(const ie of Rt.streamInvokeServer(q,A,le.map(Ae=>Ae.file),null,V,j)){const Ae={id:$e,role:"ai",content:JSON.stringify(ie),format:ie.format,finished:ie.finished,name:"Assistant"};if(ke)E({type:"ADD_MESSAGE",payload:Ae}),ke=!1;else{E({type:"UPDATE_MESSAGE",payload:Ae});const We=M.messages.map(nn=>nn.id===Ae.id&&!nn.finished?Ae:nn);qn(We)}ie.finished&&E({type:"SET_LOADING",payload:!1})}}catch(V){console.error("Error sending message:",V),E({type:"SET_LOADING",payload:!1})}finally{H([])}},Tr=A=>{A.metaKey&&A.key==="Enter"&&Dn()},Hn=()=>{E({type:"CLEAR_MESSAGES"});const A=M.sessionId;A&&localStorage.removeItem(`messages_${A}`),localStorage.removeItem("sessionId");const j=en();E({type:"SET_SESSION_ID",payload:j}),localStorage.setItem("sessionId",j)},ze=A=>{ge(A)},Pt=async(A,j)=>{if(!q||!$)return;E({type:"SET_LOADING",payload:!0});const _e=$[0].comfyClass||$[0].type,V=en(),$e={id:en(),role:"user",content:_e,trace_id:V};E({type:"ADD_MESSAGE",payload:$e});try{let ke=en(),ie=!0;for await(const Ae of Rt.streamInvokeServer(q,_e,[],A,j,V)){const We={id:ke,role:"ai",content:JSON.stringify(Ae),format:Ae.format,finished:Ae.finished,name:"Assistant"};if(A&&A!==""&&(We.metadata={intent:A}),ie)E({type:"ADD_MESSAGE",payload:We}),ie=!1;else{E({type:"UPDATE_MESSAGE",payload:We});const nn=M.messages.map(Ce=>Ce.id===We.id&&!Ce.finished?We:Ce);qn(nn)}Ae.finished&&E({type:"SET_LOADING",payload:!1})}}catch(ke){console.error("Error sending message:",ke),E({type:"SET_LOADING",payload:!1})}},qn=A=>{M.sessionId&&localStorage.setItem(`messages_${M.sessionId}`,JSON.stringify(A))},Rr=A=>{console.log("[WorkflowChat] Adding new message:",A);const j=[...M.messages,A];E({type:"ADD_MESSAGE",payload:A}),qn(j)},cn=()=>{Pe(!1)},Zn=A=>{const j=Array.from(A).map(_e=>({id:Math.random().toString(36).substr(2,9),file:_e,preview:URL.createObjectURL(_e)}));H(_e=>[..._e,...j])},Or=A=>{H(j=>j.filter(V=>V.id!==A))};wn.useEffect(()=>()=>{le.forEach(A=>URL.revokeObjectURL(A.preview))},[le]),L.useEffect(()=>{a&&F&&P==="chat"&&(Pt("node_explain"),F())},[a,P]),L.useEffect(()=>{if(!b||P!=="chat")return;(async()=>{try{const j=new Date().toDateString();if(localStorage.getItem("announcementLastShownDate")!==j){const V=await Rt.fetchAnnouncement();V&&V.trim()!==""&&(bn(V),Dt(!0),localStorage.setItem("announcementLastShownDate",j))}}catch(j){console.error("Error fetching announcement:",j)}})()},[b,P]);const Pn=()=>{Dt(!1)},An=A=>{E({type:"SET_ACTIVE_TAB",payload:A})},Mr=wn.useMemo(()=>h.jsx(ap,{}),[]);return b?h.jsxs("div",{className:"flex flex-col h-full w-full bg-white",style:{display:b?"flex":"none",height:"100%"},children:[h.jsx("div",{className:"absolute left-0 top-0 bottom-0 w-1 cursor-ew-resize hover:bg-gray-300"}),h.jsxs("div",{className:"flex h-full flex-col",children:[h.jsx(zg,{onClose:m,onClear:Hn,hasMessages:B.length>0,title:"ComfyUI-Copilot"}),h.jsxs("div",{className:"flex border-b border-gray-200 mt-2",children:[h.jsx(Da,{active:P==="chat",onClick:()=>An("chat"),children:"Chat"}),h.jsx(Da,{active:P==="parameter-debug",onClick:()=>An("parameter-debug"),children:"GenLab"})]}),Cr&&pe&&P==="chat"&&h.jsx(sp,{message:pe,onClose:Pn}),h.jsx("div",{className:"flex-1 overflow-y-auto p-4 scroll-smooth h-0",style:{display:P==="chat"?"block":"none"},ref:ve,children:h.jsx(np,{messages:B,latestInput:T,onOptionClick:ze,installedNodes:te,onAddMessage:Rr,loading:y})}),h.jsxs("div",{className:"border-t px-4 py-3 border-gray-200 bg-white sticky bottom-0",style:{display:P==="chat"?"block":"none"},children:[$&&h.jsx(Zg,{nodeInfo:$,onSendWithIntent:Pt,loading:y,onSendWithContent:Sn}),h.jsx(Hg,{input:re,loading:y,onChange:Lr,onSend:Dn,onKeyPress:Tr,onUploadImages:Zn,uploadedImages:le,onRemoveImage:Or,selectedModel:Z,onModelChange:Se})]}),h.jsx("div",{className:"flex-1 flex flex-col h-0",style:{display:P==="parameter-debug"?"flex":"none"},children:Mr})]})]}):null}const vp=Object.freeze(Object.defineProperty({__proto__:null,default:op},Symbol.toStringTag,{value:"Module"}));export{_p as g,pp as i,gp as m,dp as r,vp as w}; diff --git a/ui/package-lock.json b/ui/package-lock.json index 822943a..c669361 100644 --- a/ui/package-lock.json +++ b/ui/package-lock.json @@ -1242,7 +1242,9 @@ } }, "node_modules/caniuse-lite": { - "version": "1.0.30001684", + "version": "1.0.30001718", + "resolved": "https://registry.npmmirror.com/caniuse-lite/-/caniuse-lite-1.0.30001718.tgz", + "integrity": "sha512-AflseV1ahcSunK53NfEs9gFWgOEmzr0f+kaMFA4xiLZlr9Hzt7HxcSpIFcnNCUkz6R6dWKa54rUz3HUmI3nVcw==", "dev": true, "funding": [ { @@ -1257,8 +1259,7 @@ "type": "github", "url": "https://github.com/sponsors/ai" } - ], - "license": "CC-BY-4.0" + ] }, "node_modules/ccount": { "version": "2.0.1", diff --git a/ui/src/components/chat/ChatHeader.tsx b/ui/src/components/chat/ChatHeader.tsx index 8a54cd8..b9ae484 100644 --- a/ui/src/components/chat/ChatHeader.tsx +++ b/ui/src/components/chat/ChatHeader.tsx @@ -69,36 +69,30 @@ export function ChatHeader({ return ( <> -
-
+
ComfyUI-Copilot Logo -

{title}

+

{title}

- {/* */}
diff --git a/ui/src/components/debug/ParameterDebugInterfaceNew.tsx b/ui/src/components/debug/ParameterDebugInterfaceNew.tsx index 730fb11..57036b2 100644 --- a/ui/src/components/debug/ParameterDebugInterfaceNew.tsx +++ b/ui/src/components/debug/ParameterDebugInterfaceNew.tsx @@ -2,11 +2,8 @@ // Licensed under the MIT License. import React, { useState, useEffect, useRef } from 'react'; -import { getOnlyOneImageNode, getOutputImageByPromptId, queuePrompt } from '../../utils/queuePrompt'; import { app } from '../../utils/comfyapp'; -import { interruptProcessing, manageQueue } from '../../apis/comfyApiCustom'; import { useChatContext } from '../../context/ChatContext'; -import { WorkflowChatAPI } from '../../apis/workflowChatApi'; import { InitialScreen } from './screens/InitialScreen'; import { ConfigureParameterScreen } from './screens/ConfigureParameterScreen'; import { ConfirmConfigurationScreen } from './screens/ConfirmConfigurationScreen'; @@ -15,53 +12,89 @@ import { ResultGalleryScreen } from './screens/ResultGalleryScreen'; import { AIWritingModal } from './modals/AIWritingModal'; import { ImageModal } from './modals/ImageModal'; import { generateDynamicParams, generateParameterCombinations } from './utils/parameterUtils'; -import { WidgetParamConf } from './utils/parameterUtils'; import { generateUUID } from '../../utils/uuid'; +// Import history components +import { HistoryScreen } from './screens/HistoryScreen'; +import { HistoryItemScreen } from './screens/HistoryItemScreen'; -// Add constant for localStorage key - used to persist interface state between sessions -const PARAM_DEBUG_STORAGE_KEY = 'parameter_debug_state'; +// Import types from the extracted types file +import { + GeneratedImage, + ParameterDebugInterfaceProps +} from './types/parameterDebugTypes'; -// Add CSS for the highlight pulse effect -const highlightPulseStyle = ` - @keyframes highlight-pulse { - 0% { - box-shadow: 0 0 0 0 rgba(59, 130, 246, 0.5); - } - 70% { - box-shadow: 0 0 0 15px rgba(59, 130, 246, 0); - } - 100% { - box-shadow: 0 0 0 0 rgba(59, 130, 246, 0); - } - } - - .highlight-pulse { - animation: highlight-pulse 1.5s infinite; - border: 2px solid #3b82f6; - } +// Import styles from the extracted styles file +import { highlightPulseStyle } from './styles/highlightPulseStyle'; - @keyframes fade-in-out { - 0% { opacity: 0; transform: translateY(-20px); } - 10% { opacity: 1; transform: translateY(0); } - 90% { opacity: 1; transform: translateY(0); } - 100% { opacity: 0; transform: translateY(-20px); } - } - - .animate-fade-in-out { - animation: fade-in-out 3s forwards; - } -`; +// Import localStorage utilities from the extracted utils file +import { + PARAM_DEBUG_STORAGE_KEY, + saveStateToLocalStorage +} from './utils/localStorageUtils'; -interface GeneratedImage { - url: string; - params: { [key: string]: any }; -} +// Import history utilities +import { + HistoryItem, + loadHistoryItems +} from './utils/historyUtils'; -interface ParameterDebugInterfaceProps { - selectedNodes: any[]; - visible: boolean; - onClose?: () => void; -} +// Import text input utilities from the extracted utils file +import { + handleTextInputChange as utilsHandleTextInputChange, + handleAddTextInput as utilsHandleAddTextInput, + handleRemoveTextInput as utilsHandleRemoveTextInput +} from './utils/textInputUtils'; + +// Import interface utilities from the extracted utils file +import { + toggleDropdown as utilsToggleDropdown, + updateParamTestValues as utilsUpdateParamTestValues, + handleTestValueSelect as utilsHandleTestValueSelect +} from './utils/interfaceUtils'; + +// Import search utilities from the extracted utils file +import { + handleSearch as utilsHandleSearch, + handleSelectAll as utilsHandleSelectAll, + handleParamSelect as utilsHandleParamSelect +} from './utils/searchUtils'; + +// Import modal utilities from the extracted utils file +import { + openImageModal as utilsOpenImageModal, + closeImageModal as utilsCloseImageModal +} from './utils/modalUtils'; + +// Import navigation utilities from the extracted utils file +import { + handleNext as utilsHandleNext, + handlePrevious as utilsHandlePrevious, + handlePageChange as utilsHandlePageChange +} from './utils/navigationUtils'; + +// Import image generation utilities +import { + handleStartGeneration as utilsHandleStartGeneration, + cleanupPolling as utilsCleanupPolling +} from './utils/imageGenerationUtils'; + +// Import AI text utilities +import { + handleAiWriting as utilsHandleAiWriting, + toggleTextSelection as utilsToggleTextSelection, + addSelectedTexts as utilsAddSelectedTexts, + openAiWritingModal as utilsOpenAiWritingModal +} from './utils/aiTextUtils'; + +// Import state management utilities +import { + resetAllStates as utilsResetAllStates, + handleSelectImage as utilsHandleSelectImage, + handleApplySelected as utilsHandleApplySelected, + handleClose as utilsHandleClose +} from './utils/stateManagementUtils'; + +// Note: Removed duplicate interface definitions to use imported types instead export const ParameterDebugInterface: React.FC = ({ selectedNodes, @@ -116,6 +149,7 @@ export const ParameterDebugInterface: React.FC = ( // Add new state for modal const [modalVisible, setModalVisible] = useState(false); const [modalImageUrl, setModalImageUrl] = useState(''); + const [modalImageParams, setModalImageParams] = useState<{ [key: string]: any } | null>(null); // Add state for text inputs and AI writing modal const [textInputs, setTextInputs] = useState<{[nodeId_paramName: string]: string[]}>({}); @@ -128,6 +162,11 @@ export const ParameterDebugInterface: React.FC = ( const [aiWritingError, setAiWritingError] = useState(null); const [aiSelectedTexts, setAiSelectedTexts] = useState<{[key: string]: boolean}>({}); + // Add state for history screen + const [isHistoryVisible, setIsHistoryVisible] = useState(false); + const [historyItems, setHistoryItems] = useState([]); + const [selectedHistoryItem, setSelectedHistoryItem] = useState(null); + // Get dispatch from context to update screen state const { dispatch } = useChatContext(); @@ -139,172 +178,115 @@ export const ParameterDebugInterface: React.FC = ( // Add loading state after other state declarations const [isLoading, setIsLoading] = useState(() => visible); // Initialize loading based on visibility - // Function to save state to localStorage - const saveStateToLocalStorage = (state: any) => { - try { - localStorage.setItem(PARAM_DEBUG_STORAGE_KEY, JSON.stringify(state)); - } catch (error) { - console.error('Error saving parameter debug state:', error); + // Load history items when component loads or when isHistoryVisible changes + useEffect(() => { + if (isHistoryVisible) { + const items = loadHistoryItems(); + setHistoryItems(items); } - }; + }, [isHistoryVisible]); // Add function to handle AI text generation const handleAiWriting = async () => { - if (!aiWritingModalText.trim()) { - setAiWritingError("Please enter some text to generate variations"); - return; - } - - setAiWritingLoading(true); - setAiWritingError(null); - setAiGeneratedTexts([]); - setAiSelectedTexts({}); - - try { - const generatedTexts = await WorkflowChatAPI.generateSDPrompts(aiWritingModalText); - setAiGeneratedTexts(generatedTexts); - // Send tracking event - WorkflowChatAPI.trackEvent({ - event_type: 'prompt_generate', - message_type: 'parameter_debug', - message_id: task_id, - data: { - input_text: aiWritingModalText, - generated_texts: generatedTexts - } - }); - - // Pre-select all generated texts - const newSelectedTexts: {[key: string]: boolean} = {}; - generatedTexts.forEach((text, index) => { - newSelectedTexts[`text${index+1}`] = false; - }); - setAiSelectedTexts(newSelectedTexts); - } catch (error) { - console.error("Error generating text:", error); - setAiWritingError("Failed to generate text variations. Please try again."); - } finally { - setAiWritingLoading(false); - } + utilsHandleAiWriting( + aiWritingModalText, + task_id, + setAiWritingLoading, + setAiWritingError, + setAiGeneratedTexts, + setAiSelectedTexts + ); }; - // Add function to handle text input changes + // Add function to handle text input changes - Use imported utility const handleTextInputChange = (nodeId: string, paramName: string, index: number, value: string) => { - const textKey = `${nodeId}_${paramName}`; - - setTextInputs(prev => { - const currentTexts = [...(prev[textKey] || [])]; - currentTexts[index] = value; - return { - ...prev, - [textKey]: currentTexts - }; - }); - - // Also update paramTestValues with the new value directly instead of using textInputs state - // (which hasn't been updated yet) - const currentTexts = [...(textInputs[textKey] || [])]; - currentTexts[index] = value; + const currentTexts = utilsHandleTextInputChange(nodeId, paramName, index, value, textInputs, setTextInputs); + // Also update paramTestValues with the new value directly updateParamTestValues(nodeId, paramName, currentTexts); }; - // Add function to add a new text input + // Add function to add a new text input - Use imported utility const handleAddTextInput = (nodeId: string, paramName: string) => { - const textKey = `${nodeId}_${paramName}`; - - setTextInputs(prev => { - const currentTexts = [...(prev[textKey] || [])]; - currentTexts.push(''); - return { - ...prev, - [textKey]: currentTexts - }; - }); - + const updatedTexts = utilsHandleAddTextInput(nodeId, paramName, textInputs, setTextInputs); // Also update paramTestValues - const updatedTexts = [...(textInputs[textKey] || []), '']; updateParamTestValues(nodeId, paramName, updatedTexts); }; - // Add function to remove a text input + // Add function to remove a text input - Use imported utility const handleRemoveTextInput = (nodeId: string, paramName: string, index: number) => { - const textKey = `${nodeId}_${paramName}`; - - setTextInputs(prev => { - const currentTexts = [...(prev[textKey] || [])]; - currentTexts.splice(index, 1); - return { - ...prev, - [textKey]: currentTexts - }; - }); - + const updatedTexts = utilsHandleRemoveTextInput(nodeId, paramName, index, textInputs, setTextInputs); // Also update paramTestValues - const updatedTexts = [...(textInputs[textKey] || [])]; - updatedTexts.splice(index, 1); updateParamTestValues(nodeId, paramName, updatedTexts); }; // Add function to toggle text selection in AI writing modal const toggleTextSelection = (textKey: string) => { - setAiSelectedTexts(prev => ({ - ...prev, - [textKey]: !prev[textKey] - })); + utilsToggleTextSelection(textKey, setAiSelectedTexts); }; // Add function to add selected texts from AI modal const addSelectedTexts = () => { - const textKey = `${aiWritingNodeId}_${aiWritingParamName}`; - const selectedTexts = Object.entries(aiSelectedTexts) - .filter(([_, isSelected]) => isSelected) - .map(([key]) => { - const index = parseInt(key.replace('text', '')) - 1; - return aiGeneratedTexts[index]; - }); - - if (selectedTexts.length === 0) { - return; - } - - setTextInputs(prev => { - const currentTexts = [...(prev[textKey] || [])]; - return { - ...prev, - [textKey]: [...currentTexts, ...selectedTexts] - }; - }); - - // Send tracking event - WorkflowChatAPI.trackEvent({ - event_type: 'prompt_apply', - message_type: 'parameter_debug', - message_id: task_id, - data: { - input_text: aiWritingModalText, - generated_texts: aiGeneratedTexts, - selected_texts: selectedTexts - } - }); - - // Also update paramTestValues - const updatedTexts = [...(textInputs[textKey] || []), ...selectedTexts]; - updateParamTestValues(aiWritingNodeId, aiWritingParamName, updatedTexts); - - // Close the modal - setAiWritingModalVisible(false); + utilsAddSelectedTexts( + aiWritingNodeId, + aiWritingParamName, + aiSelectedTexts, + aiGeneratedTexts, + aiWritingModalText, + task_id, + textInputs, + setTextInputs, + updateParamTestValues, + setAiWritingModalVisible + ); }; // Add function to open AI writing modal const openAiWritingModal = (nodeId: string, paramName: string) => { - setAiWritingModalVisible(true); - setAiWritingNodeId(nodeId); - setAiWritingParamName(paramName); - setAiWritingModalText(''); - setAiGeneratedTexts([]); - setAiSelectedTexts({}); - setAiWritingLoading(false); - setAiWritingError(null); + utilsOpenAiWritingModal( + nodeId, + paramName, + setAiWritingModalVisible, + setAiWritingNodeId, + setAiWritingParamName, + setAiWritingModalText, + setAiGeneratedTexts, + setAiSelectedTexts, + setAiWritingLoading, + setAiWritingError + ); + }; + + // Add function to toggle history screen visibility + const toggleHistoryScreen = (event?: React.MouseEvent) => { + if (event) { + event.preventDefault(); + event.stopPropagation(); + } + setIsHistoryVisible(prev => !prev); + }; + + // Add function to view a history item + const handleViewHistoryItem = (historyItem: HistoryItem) => { + setSelectedHistoryItem(historyItem); + setIsHistoryVisible(false); + + // Set generated images from history item + setGeneratedImages(historyItem.generatedImages || []); + + // Reset selected image index + setSelectedImageIndex(null); + + // Set current page to 1 + setCurrentPage(1); + }; + + // Add function to close history item view + const handleCloseHistoryItem = (event?: React.MouseEvent) => { + if (event) { + event.preventDefault(); + event.stopPropagation(); + } + setSelectedHistoryItem(null); }; // Add useEffect to initialize parameter test values when selectedNodes change @@ -391,7 +373,7 @@ export const ParameterDebugInterface: React.FC = ( }; }, [openDropdowns]); - // Modify useEffect for the task_id to use localStorage + // Modify useEffect that uses localStorage key to use imported constant useEffect(() => { if (visible) { // Only generate a new task_id if we don't have one in localStorage @@ -483,7 +465,47 @@ export const ParameterDebugInterface: React.FC = ( }; }, [visible]); - // Add useEffect to save state when relevant states change + // Helper function to reset all state variables - Use imported localStorage utility + const resetAllStates = (clearStorage = false) => { + utilsResetAllStates( + setCurrentScreen, + setSelectedParams, + setTask_id, + cleanupPolling, + setIsProcessing, + setIsCompleted, + setCompletedCount, + setTotalCount, + setSelectedImageIndex, + setGeneratedImages, + setParamTestValues, + setOpenDropdowns, + setSearchTerms, + setInputValues, + setCurrentPage, + setErrorMessage, + setNotificationVisible, + setModalVisible, + setModalImageUrl, + setModalImageParams, + setTextInputs, + setAiWritingModalVisible, + setAiWritingModalText, + setAiGeneratedTexts, + setAiWritingLoading, + setAiWritingNodeId, + setAiWritingParamName, + setAiWritingError, + setAiSelectedTexts, + clearStorage + ); + + // Reset history states + setIsHistoryVisible(false); + setSelectedHistoryItem(null); + }; + + // Add useEffect to save state when relevant states change - Use imported localStorage utility useEffect(() => { if (!visible) return; @@ -531,309 +553,81 @@ export const ParameterDebugInterface: React.FC = ( // Navigate to next screen const handleNext = (event?: React.MouseEvent) => { - if (event) { - event.preventDefault(); - event.stopPropagation(); - } - - // When moving from screen 0 to screen 1, clean up paramTestValues for unselected parameters - if (currentScreen === 0) { - // Make a copy of the current paramTestValues - const updatedParamTestValues = { ...paramTestValues }; - - // For each node - Object.keys(updatedParamTestValues).forEach(nodeId => { - const nodeParams = updatedParamTestValues[nodeId]; - - // For each parameter in this node - Object.keys(nodeParams).forEach(paramName => { - // If this parameter is no longer selected, remove it - if (!selectedParams[paramName]) { - delete nodeParams[paramName]; - } - }); - }); - - // Update the state with cleaned up values - setParamTestValues(updatedParamTestValues); - } - - // When moving to the confirmation screen, ensure all text values are properly synchronized - if (currentScreen === 1) { - // Ensure textInputs are synced to paramTestValues for all selected nodes - const updatedParamTestValues = { ...paramTestValues }; - selectedNodes.forEach(node => { - const nodeId = node.id.toString(); - const widgets = node.widgets || {}; - - Object.values(widgets).forEach((widget: any) => { - const paramName = widget.name; - - // Only process selected text parameters - if (selectedParams[paramName] && (widget.type === "customtext" || widget.type.toLowerCase().includes("text"))) { - const inputKey = `${nodeId}_${paramName}`; - const currentTexts = textInputs[inputKey] || ['']; - - // Update paramTestValues with the current text values - updatedParamTestValues[nodeId] = updatedParamTestValues[nodeId] || {}; - updatedParamTestValues[nodeId][paramName] = currentTexts; - } - }); - }); - - // Update the state with synchronized values - setParamTestValues(updatedParamTestValues); - - // Update totalCount with parameter combinations - const combinations = generateParameterCombinations(updatedParamTestValues); - setTotalCount(combinations.length); - } - - // Clear error message - setErrorMessage(null); - setCurrentScreen(prev => Math.min(prev + 1, 2)); + utilsHandleNext( + currentScreen, + setCurrentScreen, + selectedParams, + paramTestValues, + setParamTestValues, + textInputs, + selectedNodes, + setTotalCount, + setErrorMessage, + generateParameterCombinations, + event + ); }; // Navigate to previous screen const handlePrevious = (event?: React.MouseEvent) => { - if (event) { - event.preventDefault(); - event.stopPropagation(); - } - // Clear error message - setErrorMessage(null); - // Reset completed state when going back - if (isCompleted) { - setIsCompleted(false); - } - - // If going back from screen 1 to 0, clean up any paramTestValues for nodes that are no longer selected - if (currentScreen === 1) { - const selectedNodeIds = selectedNodes.map(node => node.id.toString()); - const currentNodeIds = Object.keys(paramTestValues); - - // Remove test values for any nodes that are no longer selected - const updatedParamTestValues = { ...paramTestValues }; - currentNodeIds.forEach(nodeId => { - if (!selectedNodeIds.includes(nodeId)) { - delete updatedParamTestValues[nodeId]; - } - }); - - setParamTestValues(updatedParamTestValues); - } - - // If returning from the result gallery or confirmation screen, ensure text values are maintained - if (currentScreen === 2 || isCompleted) { - // Ensure paramTestValues are correctly synchronized with textInputs - const updatedParamTestValues = { ...paramTestValues }; - - // For each text input value, ensure it's properly synced to paramTestValues - Object.entries(textInputs).forEach(([key, texts]) => { - if (!texts || texts.length === 0) return; - - const [nodeId, paramName] = key.split('_'); - - // Skip if node doesn't exist in selected nodes - if (!selectedNodes.some(node => node.id.toString() === nodeId)) return; - - // Ensure the node and parameter exist in paramTestValues - updatedParamTestValues[nodeId] = updatedParamTestValues[nodeId] || {}; - - // Only update if the values are different to avoid unnecessary state updates - if (JSON.stringify(updatedParamTestValues[nodeId][paramName]) !== JSON.stringify(texts)) { - updatedParamTestValues[nodeId][paramName] = texts; - } - }); - - setParamTestValues(updatedParamTestValues); - } - - setCurrentScreen(prev => Math.max(prev - 1, 0)); + utilsHandlePrevious( + currentScreen, + setCurrentScreen, + selectedNodes, + paramTestValues, + setParamTestValues, + textInputs, + isCompleted, + setIsCompleted, + setErrorMessage, + event + ); }; // Handle parameter selection const handleParamSelect = (param: string, event?: React.MouseEvent) => { - if (event) { - event.preventDefault(); - event.stopPropagation(); - } - - const isCurrentlySelected = selectedParams[param]; - - // Update the selected params state - setSelectedParams(prev => ({ - ...prev, - [param]: !isCurrentlySelected - })); - - // If we're deselecting a parameter, remove its values from paramTestValues - if (isCurrentlySelected) { - // Make a copy of the current paramTestValues - const updatedParamTestValues = { ...paramTestValues }; - - // For each node - Object.keys(updatedParamTestValues).forEach(nodeId => { - // If this parameter exists in this node, remove it - if (updatedParamTestValues[nodeId][param]) { - delete updatedParamTestValues[nodeId][param]; - } - }); - - // Update the state with cleaned up values - setParamTestValues(updatedParamTestValues); - } + utilsHandleParamSelect(param, selectedParams, setSelectedParams, paramTestValues, setParamTestValues, event); }; // Toggle dropdown open status - Use nodeId_paramName as key const toggleDropdown = (nodeId: string, paramName: string, event: React.MouseEvent) => { - event.preventDefault(); - event.stopPropagation(); - - const dropdownKey = `${nodeId}_${paramName}`; - - setOpenDropdowns(prev => { - const isCurrentlyOpen = prev[dropdownKey] && - typeof prev[dropdownKey] === 'object' ? - (prev[dropdownKey] as {isOpen: boolean}).isOpen : - Boolean(prev[dropdownKey]); - - if (isCurrentlyOpen) { - return { - ...prev, - [dropdownKey]: false - }; - } else { - // Determine dropdown position - let x = 0; - let y = 0; - - // Try to get position from event target - if (event.currentTarget) { - const rect = event.currentTarget.getBoundingClientRect(); - x = rect.left; - y = rect.bottom; - } else { - // If unable to get element position, use mouse click position - x = event.clientX; - y = event.clientY + 20; // Display 20px below mouse position - } - - // Ensure dropdown doesn't go out of window bounds - const windowWidth = window.innerWidth; - const dropdownWidth = 250; // Estimated dropdown width - - if (x + dropdownWidth > windowWidth) { - x = windowWidth - dropdownWidth - 10; // Ensure distance from right edge at least 10px - } - - if (x < 0) x = 10; // Ensure distance from left edge at least 10px - - return { - ...prev, - [dropdownKey]: { - isOpen: true, - x: x, - y: y - } - }; - } - }); + utilsToggleDropdown(nodeId, paramName, event, openDropdowns, setOpenDropdowns); }; // Update parameter test values - Modify to support new parameter structure const updateParamTestValues = (nodeId: string, paramName: string, values: any[]) => { - setParamTestValues(prev => { - const updatedValues = { ...prev }; - - // Ensure nodeID exists - if (!updatedValues[nodeId]) { - updatedValues[nodeId] = {}; - } - - // Update specific node and parameter values - updatedValues[nodeId][paramName] = values; - - return updatedValues; - }); + utilsUpdateParamTestValues(nodeId, paramName, values, paramTestValues, setParamTestValues); }; // Handle selecting specific test values - Modify to support new parameter structure const handleTestValueSelect = (nodeId: string, paramName: string, value: any, event?: React.MouseEvent) => { - if (event) { - event.preventDefault(); - event.stopPropagation(); - } - - setParamTestValues(prev => { - const updatedValues = { ...prev }; - - // Ensure nodeID exists - if (!updatedValues[nodeId]) { - updatedValues[nodeId] = {}; - } - - // Ensure parameter name exists - if (!updatedValues[nodeId][paramName]) { - updatedValues[nodeId][paramName] = []; - } - - const currentValues = updatedValues[nodeId][paramName]; - - if (currentValues.includes(value)) { - updatedValues[nodeId][paramName] = currentValues.filter(v => v !== value); - } else { - updatedValues[nodeId][paramName] = [...currentValues, value]; - } - - return updatedValues; - }); + utilsHandleTestValueSelect(nodeId, paramName, value, paramTestValues, setParamTestValues, event); }; // Add processing search - Use nodeId_paramName as key const handleSearch = (nodeId: string, paramName: string, term: string) => { - const searchKey = `${nodeId}_${paramName}`; - setSearchTerms(prev => ({ - ...prev, - [searchKey]: term - })); + utilsHandleSearch(nodeId, paramName, term, searchTerms, setSearchTerms); }; // Add select all - Modify to support new parameter structure const handleSelectAll = (nodeId: string, paramName: string, values: any[]) => { - // Ensure nodeID exists - if (!paramTestValues[nodeId]) { - updateParamTestValues(nodeId, paramName, values); - return; - } - - // Get current values - const currentValues = paramTestValues[nodeId][paramName] || []; - - // If all values are selected, cancel selecting all, otherwise select all - if (values.length === currentValues.length) { - updateParamTestValues(nodeId, paramName, []); - } else { - updateParamTestValues(nodeId, paramName, [...values]); - } + utilsHandleSelectAll(nodeId, paramName, values, paramTestValues, updateParamTestValues); }; // Handle page change const handlePageChange = (newPage: number, event?: React.MouseEvent) => { - if (event) { - event.preventDefault(); - event.stopPropagation(); - } - setCurrentPage(Math.max(1, Math.min(newPage, Math.ceil(generatedImages.length / imagesPerPage)))); + utilsHandlePageChange( + newPage, + imagesPerPage, + generatedImages, + setCurrentPage, + event + ); }; // Handle polling cleanup function const cleanupPolling = () => { - if (pollingTimeoutRef.current) { - clearTimeout(pollingTimeoutRef.current); - pollingTimeoutRef.current = null; - } - pollingSessionIdRef.current = null; + utilsCleanupPolling(pollingTimeoutRef, pollingSessionIdRef); }; // Add useEffect cleanup on unmount @@ -845,384 +639,128 @@ export const ParameterDebugInterface: React.FC = ( // Handle start generation - Modified to clean up before starting const handleStartGeneration = async (event?: React.MouseEvent, selectedNodeId?: number) => { - if (event) { - event.preventDefault(); - event.stopPropagation(); - } - - // Clean up any existing polling - cleanupPolling(); - - // Get parameter combinations - const paramCombinations = generateParameterCombinations(paramTestValues); - const totalCombinations = paramCombinations.length; - - // Check if total runs exceed 100 - if (totalCombinations > 100) { - setErrorMessage(`Cannot generate more than 100 images at once (currently: ${totalCombinations} images)`); - return; - } - - setErrorMessage(null); - setIsProcessing(true); - setCompletedCount(0); - - console.log("Generated parameter combinations:", paramCombinations); - - // Send tracking event - WorkflowChatAPI.trackEvent({ - event_type: 'start_generation', - message_type: 'parameter_debug', - message_id: task_id, - data: { - workflow: (await app.graphToPrompt()).output, - all_params: paramTestValues, - count: totalCombinations - } - }); - - // If we have no combinations, show error and return - if (paramCombinations.length === 0) { - setErrorMessage("No valid parameter combinations found. Please check your parameter selections."); - setIsProcessing(false); - return; - } - - // Get node ID to use for showing images - Use provided selectedNodeId if available - let showNodeId: number | null = selectedNodeId || null; - - // If no selectedNodeId provided, try to get one automatically - if (showNodeId === null) { - const nodeId = getOnlyOneImageNode(); - if (nodeId !== null) { - showNodeId = nodeId; - } - } - - // If showNodeId is null, we need user selection (handled in ConfirmConfigurationScreen) - if (showNodeId === null) { - setErrorMessage("Please select a SaveImage or PreviewImage node first."); - setIsProcessing(false); - return; - } - - const prompt_ids: string[] = []; - try { - // Generate a unique session ID - const sessionId = Date.now().toString(); - pollingSessionIdRef.current = sessionId; - - // Each combination represents all parameters for a single image generation - for (const combination of paramCombinations) { - const response = await queuePrompt(combination); - if(response.prompt_id) { - prompt_ids.push(response.prompt_id); - } else { - console.error("Failed to get prompt_id from response:", response); - prompt_ids.push(""); - } - } - - // Create an array to track images and their parameters - const newImages: GeneratedImage[] = Array(paramCombinations.length).fill(null).map((_, i) => ({ - url: `https://source.unsplash.com/random/300x300?sig=${Math.random()}`, // Default placeholder - params: generateDynamicParams(paramTestValues, i) - })); - - // Set initial images - setGeneratedImages(newImages); - - // Track timeout - const startTime = Date.now(); - const timeoutDuration = 5 * 60 * 1000; // 5 minutes - - // Function to poll for images - const pollForImages = async () => { - // Check if this polling session is still active - if (pollingSessionIdRef.current !== sessionId) { - console.log("Another polling session has started, stopping this one"); - return; - } - - // Check if timeout has been reached - if (Date.now() - startTime > timeoutDuration) { - console.log("Timeout reached while waiting for images"); - if (pollingSessionIdRef.current === sessionId) { - setIsProcessing(false); - setIsCompleted(true); - setCurrentPage(1); - } - return; - } - - let completedImagesCount = 0; - - // Check each prompt id to see if images are ready - for (let i = 0; i < prompt_ids.length; i++) { - const promptId = prompt_ids[i]; - if (!promptId) continue; - - try { - // We've already verified showNodeId is not null at this point - const imageUrl = await getOutputImageByPromptId(promptId, Number(showNodeId)); - - if (imageUrl) { - // If we have an image URL, update in our array - newImages[i] = { - ...newImages[i], - url: imageUrl - }; - completedImagesCount++; - } - } catch (error) { - console.error(`Error fetching image for prompt ID ${promptId}:`, error); - } - } - - // Only update state if this polling session is still active - if (pollingSessionIdRef.current === sessionId) { - // Update the images in state - setGeneratedImages([...newImages]); - - // Update the completed count - setCompletedCount(completedImagesCount); - - // If all images are ready or timeout occurred, we're done - if (completedImagesCount === prompt_ids.length) { - console.log("All images ready, completing session"); - setIsProcessing(false); - setIsCompleted(true); - setCurrentPage(1); - } else { - // Otherwise, poll again in 3 seconds - pollingTimeoutRef.current = setTimeout(pollForImages, 3000); - } - } - }; - - // Start polling - pollForImages(); - } catch (error) { - console.error("Error generating images:", error); - setIsProcessing(false); - } + utilsHandleStartGeneration( + paramTestValues, + task_id, + setIsProcessing, + setCompletedCount, + setErrorMessage, + setGeneratedImages, + setIsCompleted, + setCurrentPage, + pollingSessionIdRef, + pollingTimeoutRef, + generateParameterCombinations, + app, + event, + selectedNodeId + ); }; // Handle selecting an image const handleSelectImage = (index: number, event?: React.MouseEvent) => { - if (event) { - event.preventDefault(); - event.stopPropagation(); - } - setSelectedImageIndex(index); + utilsHandleSelectImage(index, setSelectedImageIndex, event); }; // Add new function to open image modal - const openImageModal = (imageUrl: string, event: React.MouseEvent) => { - event.preventDefault(); - event.stopPropagation(); - setModalImageUrl(imageUrl); - setModalVisible(true); + const openImageModal = (imageUrl: string, params: { [key: string]: any }, event: React.MouseEvent) => { + utilsOpenImageModal( + imageUrl, + params, + selectedNodes, + setModalImageUrl, + setModalImageParams, + setModalVisible, + event + ); }; // Add new function to close image modal const closeImageModal = (event?: React.MouseEvent) => { - if (event) { - event.preventDefault(); - event.stopPropagation(); - } - setModalVisible(false); + utilsCloseImageModal( + setModalVisible, + event + ); }; // Handle applying selected image const handleApplySelected = async (event?: React.MouseEvent) => { - if (event) { - event.preventDefault(); - event.stopPropagation(); - } - if (selectedImageIndex !== null) { - console.log(`Applied image ${selectedImageIndex + 1} with parameters:`, generatedImages[selectedImageIndex].params); - - // Send tracking event - let count_temp = 1; - // Calculate total parameter combinations - if (paramTestValues) { - for (const nodeId in paramTestValues) { - if (paramTestValues[nodeId]) { - for (const paramName in paramTestValues[nodeId]) { - const paramOptions = paramTestValues[nodeId][paramName]; - if (paramOptions) { - let optionsCount = 1; - if (Array.isArray(paramOptions)) { - optionsCount = paramOptions.length > 0 ? paramOptions.length : 1; - } else if (typeof paramOptions === 'object' && paramOptions !== null) { - // Handle both numeric and string keys in objects - optionsCount = Object.keys(paramOptions).length > 0 ? Object.keys(paramOptions).length : 1; - } - count_temp = count_temp * optionsCount; - } - } - } - } - } - - WorkflowChatAPI.trackEvent({ - event_type: 'parameter_debug_apply', - message_type: 'parameter_debug', - message_id: task_id, - data: { - workflow: (await app.graphToPrompt()).output, - selected_params: generatedImages[selectedImageIndex].params, - all_params: paramTestValues, - count: count_temp - } - }); - - // Apply selected image parameters to canvas - const selectedParams = generatedImages[selectedImageIndex].params; - - // Use structured parameter format - if (selectedParams.nodeParams) { - // Iterate over all node parameters - Object.entries(selectedParams.nodeParams).forEach(([nodeId, nodeParams]) => { - // Get node - const node = app.graph._nodes_by_id[nodeId]; - if (!node || !node.widgets) return; - - // Iterate over node parameters - Object.entries(nodeParams as Record).forEach(([paramName, value]) => { - // Find corresponding widget in node widgets - for (const widget of node.widgets) { - if (widget.name === paramName) { - // Set widget value - widget.value = value; - break; - } - } - }); - }); - - // Mark canvas as dirty, trigger re-render - app.graph.setDirtyCanvas(false, true); - - // Show notification message - setNotificationVisible(true); - - // Hide notification after 3 seconds - setTimeout(() => { - setNotificationVisible(false); - }, 3000); - } - } + utilsHandleApplySelected( + selectedImageIndex, + generatedImages, + app, + task_id, + paramTestValues, + setNotificationVisible, + event + ); }; // Modified handle close to implement different behaviors based on current screen const handleClose = (event?: React.MouseEvent, nodeIndex?: number) => { - if (event) { - event.preventDefault(); - event.stopPropagation(); - } - - // Screen 2: Close individual node card - if (currentScreen === 1 && nodeIndex !== undefined) { - // Remove the node at specified index - const newSelectedNodes = [...selectedNodes]; - const removedNode = newSelectedNodes[nodeIndex]; - newSelectedNodes.splice(nodeIndex, 1); - - // Also remove the parameter test values for the removed node - if (removedNode) { - const removedNodeId = removedNode.id.toString(); - setParamTestValues(prev => { - const updated = { ...prev }; - delete updated[removedNodeId]; - return updated; - }); - } - - // If no nodes left, return to original screen - if (newSelectedNodes.length === 0) { - if (onClose) { - // Clear screen state from context when closing - dispatch({ type: 'SET_SCREEN_STATE', payload: null }); - // Clear all state variables and localStorage - resetAllStates(true); // Pass true to clear localStorage - // Call provided onClose to reset the interface - onClose(); - } - } else { - // Update the context with the new selected nodes - dispatch({ type: 'SET_SELECTED_NODE', payload: newSelectedNodes }); - } - return; - } - - // Screen 3, 4, 5 or original: Close the entire interface - if (onClose) { - // Clear screen state from context when closing - dispatch({ type: 'SET_SCREEN_STATE', payload: null }); - // Clear all state variables and localStorage - resetAllStates(true); // Pass true to clear localStorage - // Use the provided onClose callback - onClose(); - } else { - // For users of this component without a callback - // Reset all states - // resetAllStates(); - } + utilsHandleClose( + currentScreen, + selectedNodes, + nodeIndex, + dispatch, + onClose, + resetAllStates, + event + ); }; - // Helper function to reset all state variables - const resetAllStates = (clearStorage = false) => { - setCurrentScreen(0); - setSelectedParams({ - Steps: true, - CFG: true, - sampler_name: true, - threshold: false, - prompt: false - }); - // Reset task_id - setTask_id(generateUUID()); - cleanupPolling(); // Add cleanup call - setIsProcessing(false); - setIsCompleted(false); - setCompletedCount(0); - setTotalCount(12); - setSelectedImageIndex(null); - setGeneratedImages(Array(12).fill(null).map((_, i) => ({ - url: `https://source.unsplash.com/random/300x300?sig=${Math.random()}`, - params: { - step: i % 3 === 0 ? 5 : i % 3 === 1 ? 10 : 15, - sampler_name: 'euler', - cfg: 1 - } - }))); - setParamTestValues({}); - setOpenDropdowns({}); - setSearchTerms({}); - setInputValues({}); - setCurrentPage(1); - setErrorMessage(null); - setNotificationVisible(false); - setModalVisible(false); - setModalImageUrl(''); - // Completely reset text inputs to ensure clean state on next run - setTextInputs({}); - setAiWritingModalVisible(false); - setAiWritingModalText(''); - setAiGeneratedTexts([]); - setAiWritingLoading(false); - setAiWritingNodeId(''); - setAiWritingParamName(''); - setAiWritingError(null); - setAiSelectedTexts({}); - - // Clear localStorage if requested (only when explicitly closing the interface) - if (clearStorage) { - localStorage.removeItem(PARAM_DEBUG_STORAGE_KEY); - } - }; + // Add a wrapper component for common modal display + const CommonModals = () => ( + <> + + + ); + + // If showing a history item + if (selectedHistoryItem) { + return ( +
e.stopPropagation()} + > + +
+ ); + } + + // If showing history screen + if (isHistoryVisible) { + return ( +
e.stopPropagation()} + > + +
+ ); + } // Conditionally render based on whether nodes are selected // First check if loading @@ -1236,6 +774,13 @@ export const ParameterDebugInterface: React.FC = (
Loading interface...
+ + ); } @@ -1248,6 +793,26 @@ export const ParameterDebugInterface: React.FC = ( onClick={(e) => e.stopPropagation()} >
+
+ {/* Show History Icon */} + + +

GenLab

@@ -1261,8 +826,8 @@ export const ParameterDebugInterface: React.FC = (
-

Batch Test Parameter Pairs

-

Select a node to batch test parameter pairs

+

Parameter Lab GenLab

+

Batch‑test parameters & find the optimal combo in one click

@@ -1274,15 +839,23 @@ export const ParameterDebugInterface: React.FC = (

How To Use

-

Click on any node in your workflow to start the parameter testing process

+

Click any node (hold Shift to select multiple nodes).

+

Set parameter ranges and start batch generation.

-

No node is currently selected

+

Let’s select a node to begin!

+ + ); } @@ -1307,6 +880,7 @@ export const ParameterDebugInterface: React.FC = ( notificationVisible={notificationVisible} modalVisible={modalVisible} modalImageUrl={modalImageUrl} + modalImageParams={modalImageParams} openImageModal={openImageModal} closeImageModal={closeImageModal} /> @@ -1333,6 +907,8 @@ export const ParameterDebugInterface: React.FC = ( setCurrentScreen={setCurrentScreen} cleanupPolling={cleanupPolling} /> + + ); } @@ -1351,6 +927,8 @@ export const ParameterDebugInterface: React.FC = ( handleNext={handleNext} handleClose={handleClose} /> + + ); } @@ -1399,6 +977,8 @@ export const ParameterDebugInterface: React.FC = ( addSelectedTexts={addSelectedTexts} onClose={() => setAiWritingModalVisible(false)} /> + + ); } @@ -1419,6 +999,8 @@ export const ParameterDebugInterface: React.FC = ( handleStartGeneration={handleStartGeneration} handleClose={handleClose} /> + + ); }; \ No newline at end of file diff --git a/ui/src/components/debug/ParameterDebugInterfaceV2.tsx b/ui/src/components/debug/ParameterDebugInterfaceV2.tsx new file mode 100644 index 0000000..3344114 --- /dev/null +++ b/ui/src/components/debug/ParameterDebugInterfaceV2.tsx @@ -0,0 +1,55 @@ +// Copyright (C) 2025 AIDC-AI +// Licensed under the MIT License. + +import React, { useState, useEffect } from 'react'; +import { ParameterDebugInterface as OriginalParameterDebugInterface } from './ParameterDebugInterfaceNew'; +import { ParameterDebugInterfaceProps } from './types/parameterDebugTypes'; +import { useChatContext } from '../../context/ChatContext'; +import { loadStateFromLocalStorage, clearStateFromLocalStorage } from './utils/localStorageUtils'; + +/** + * Enhanced version of ParameterDebugInterface with improved architecture + * + * This component: + * 1. Handles loading/persisting state to/from localStorage + * 2. Manages context interactions + * 3. Delegates rendering to the original component + */ +export const ParameterDebugInterface: React.FC = (props) => { + const { dispatch } = useChatContext(); + const [isInitialized, setIsInitialized] = useState(false); + + // Handle initialization - load saved state if available + useEffect(() => { + if (props.visible && !isInitialized) { + // Attempt to load saved state + const savedState = loadStateFromLocalStorage(); + if (savedState) { + // Update context with screen state if available + if (savedState.screenState) { + dispatch({ + type: 'SET_SCREEN_STATE', + payload: { + currentScreen: savedState.currentScreen, + isProcessing: savedState.isProcessing, + isCompleted: savedState.isCompleted + } + }); + } + } + setIsInitialized(true); + } + }, [props.visible, isInitialized, dispatch]); + + // Clean up when component unmounts + useEffect(() => { + return () => { + if (!props.visible) { + dispatch({ type: 'SET_SCREEN_STATE', payload: null }); + } + }; + }, [props.visible, dispatch]); + + // The original component handles most of the actual work + return ; +}; \ No newline at end of file diff --git a/ui/src/components/debug/README.md b/ui/src/components/debug/README.md new file mode 100644 index 0000000..67b0aed --- /dev/null +++ b/ui/src/components/debug/README.md @@ -0,0 +1,45 @@ +# Parameter Debug Interface + +This directory contains the Parameter Debug Interface components for ComfyUI Copilot. + +## Directory Structure + +- `ParameterDebugInterfaceNew.tsx` - Original large component (refactored to use extracted utilities) +- `ParameterDebugInterfaceV2.tsx` - Enhanced wrapper component with better architecture +- `index.ts` - Central export file for all components and utilities +- `types/` - Type definitions extracted from the original component + - `parameterDebugTypes.ts` - Common type definitions +- `utils/` - Utility functions extracted from the original component + - `localStorageUtils.ts` - LocalStorage related utilities + - `textInputUtils.ts` - Text input handling utilities + - `parameterUtils.ts` - Parameter processing utilities + - `interfaceUtils.ts` - UI interaction utilities + - `searchUtils.ts` - Search and filter utilities +- `styles/` - Style definitions + - `highlightPulseStyle.ts` - CSS animation styles +- `screens/` - Screen components used by the interface +- `modals/` - Modal components used by the interface + +## Refactoring Strategy + +The original `ParameterDebugInterfaceNew.tsx` file was very large and complex. Our strategy was to: + +1. Extract independent parts (types, utilities, styles) without changing the core logic +2. Create a wrapper (`ParameterDebugInterfaceV2.tsx`) that uses the original component but leverages the extracted parts +3. Refactor the original component to use the extracted utility functions +4. Update the export structure to expose a clean API + +## Benefits of the New Architecture + +1. **Modularity**: Core functions are organized by purpose in separate files +2. **Reusability**: Utilities can be easily reused across components +3. **Maintainability**: Smaller files are easier to understand and modify +4. **Performance**: Cleaner code structure may lead to better performance +5. **Testing**: Isolated utilities are easier to test + +## Future Improvements + +1. Continue splitting functionality into more specialized files +2. Convert screen components to use the extracted utilities +3. Add proper typing to all function parameters +4. Implement unit tests for utilities \ No newline at end of file diff --git a/ui/src/components/debug/index.ts b/ui/src/components/debug/index.ts new file mode 100644 index 0000000..e3a33ab --- /dev/null +++ b/ui/src/components/debug/index.ts @@ -0,0 +1,15 @@ +// Copyright (C) 2025 AIDC-AI +// Licensed under the MIT License. + +// Re-export components +export { ParameterDebugInterface } from './ParameterDebugInterfaceV2'; + +// Re-export types +export * from './types/parameterDebugTypes'; + +// Re-export utilities +export * from './utils/localStorageUtils'; +export * from './utils/textInputUtils'; +export * from './utils/parameterUtils'; +export * from './utils/interfaceUtils'; +export * from './utils/searchUtils'; \ No newline at end of file diff --git a/ui/src/components/debug/modals/ImageModal.tsx b/ui/src/components/debug/modals/ImageModal.tsx index 5ea19aa..b74a156 100644 --- a/ui/src/components/debug/modals/ImageModal.tsx +++ b/ui/src/components/debug/modals/ImageModal.tsx @@ -1,4 +1,3 @@ - // Copyright (C) 2025 AIDC-AI // Licensed under the MIT License. @@ -7,33 +6,110 @@ import React from 'react'; interface ImageModalProps { visible: boolean; imageUrl: string; + params?: { [key: string]: any }; onClose: (event?: React.MouseEvent) => void; } export const ImageModal: React.FC = ({ visible, imageUrl, + params, onClose }) => { if (!visible) return null; + // 处理参数信息格式化显示 + const formatParams = () => { + if (!params || !params.nodeParams) return null; + + const nodeElements = Object.entries(params.nodeParams).map(([nodeId, nodeParams]) => { + // 获取节点名称 (如果存在) + const nodeName = params.nodeNames?.[nodeId] || `Node ${nodeId}`; + + // 渲染每个参数 + const paramElements = Object.entries(nodeParams as Record) + .filter(([_, value]) => typeof value !== 'object' || value === null) // 过滤掉复杂对象类型，但允许null + .map(([paramName, value]) => ( +
+ - + {paramName}: + {String(value)} +
+ )); + + return ( +
+
+ {nodeName} +
+ {paramElements.length > 0 ? ( + paramElements + ) : ( +
nodeParams is null
+ )} +
+ ); + }); + + return ( +
+ {nodeElements.length > 0 ? nodeElements : ( +
nodeParams is null
+ )} +
+ ); + }; + return (
-
e.stopPropagation()}> +
e.stopPropagation()} + style={{ display: 'flex', flexDirection: 'row' }} // 强制使用横向flex布局 + > -
- Enlarged image + + {/* 左侧图片 */} +
+
+ Enlarged image +
+
+ + {/* 右侧参数信息 */} +
+
+

parameters

+ + {/* 显示常规参数 */} + {params && !params.nodeParams && Object.entries(params) + .filter(([paramName, value]) => + paramName !== 'nodeParams' && + typeof value !== 'object' + ) + .map(([paramName, value]) => ( +
+ {paramName}: {String(value)} +
+ )) + } + + {/* 显示节点参数 */} +
+ {formatParams()} +
+
diff --git a/ui/src/components/debug/screens/ConfigureParameterScreen.tsx b/ui/src/components/debug/screens/ConfigureParameterScreen.tsx index e9ac48e..98a7f5a 100644 --- a/ui/src/components/debug/screens/ConfigureParameterScreen.tsx +++ b/ui/src/components/debug/screens/ConfigureParameterScreen.tsx @@ -151,7 +151,7 @@ export const ConfigureParameterScreen: React.FC =
-

Parameter Options

+

Set test values

Configure the test values for each parameter

diff --git a/ui/src/components/debug/screens/HistoryItemScreen.tsx b/ui/src/components/debug/screens/HistoryItemScreen.tsx new file mode 100644 index 0000000..d2caa9c --- /dev/null +++ b/ui/src/components/debug/screens/HistoryItemScreen.tsx @@ -0,0 +1,153 @@ +// Copyright (C) 2025 AIDC-AI +// Licensed under the MIT License. + +import React from 'react'; +import { ImageModal } from '../modals/ImageModal'; +import { GeneratedImage } from '../types/parameterDebugTypes'; +import { HistoryItem, formatDate } from '../utils/historyUtils'; + +interface HistoryItemScreenProps { + historyItem: HistoryItem; + selectedImageIndex: number | null; + handleSelectImage: (index: number, event?: React.MouseEvent) => void; + handleClose: (event?: React.MouseEvent) => void; + currentPage: number; + handlePageChange: (newPage: number, event?: React.MouseEvent) => void; + imagesPerPage: number; + modalVisible: boolean; + modalImageUrl: string; + modalImageParams: { [key: string]: any } | null; + openImageModal: (imageUrl: string, params: { [key: string]: any }, event: React.MouseEvent) => void; + closeImageModal: (event?: React.MouseEvent) => void; +} + +export const HistoryItemScreen: React.FC = ({ + historyItem, + selectedImageIndex, + handleSelectImage, + handleClose, + currentPage, + handlePageChange, + imagesPerPage, + modalVisible, + modalImageUrl, + modalImageParams, + openImageModal, + closeImageModal +}) => { + const { timestamp, nodeName, generatedImages } = historyItem; + + // Calculate total pages + const actualTotalPages = Math.ceil(generatedImages.length / imagesPerPage); + + // Calculate current page's image index range + const startIndex = (currentPage - 1) * imagesPerPage; + const endIndex = Math.min(startIndex + imagesPerPage, generatedImages.length); + const currentImages = generatedImages.slice(startIndex, endIndex); + + return ( +
+
+
+

{nodeName}

+

{formatDate(timestamp)} • {generatedImages.length} images

+
+ +
+ + {/* Image Modal */} + + +
+ {currentImages.map((image, indexOnPage) => { + const actualIndex = startIndex + indexOnPage; + return ( +
handleSelectImage(actualIndex, e)} + > + {/* Zoom icon */} + +
+ {`Generated +
+
+ ); + })} +
+ + {/* Pagination controls */} + {actualTotalPages > 1 && ( +
+ + + +
+ Page {currentPage} of {actualTotalPages} +
+ + + +
+ )} +
+ ); +}; \ No newline at end of file diff --git a/ui/src/components/debug/screens/HistoryScreen.tsx b/ui/src/components/debug/screens/HistoryScreen.tsx new file mode 100644 index 0000000..d30ffab --- /dev/null +++ b/ui/src/components/debug/screens/HistoryScreen.tsx @@ -0,0 +1,76 @@ +/* + * @Author: ai-business-hql qingli.hql@alibaba-inc.com + * @Date: 2025-05-15 15:30:33 + * @LastEditors: ai-business-hql qingli.hql@alibaba-inc.com + * @LastEditTime: 2025-05-15 16:13:38 + * @FilePath: /comfyui_copilot/ui/src/components/debug/screens/HistoryScreen.tsx + * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE + */ +// Copyright (C) 2025 AIDC-AI +// Licensed under the MIT License. + +import React from 'react'; +import { HistoryItem, formatDate, formatNodeNameWithParams } from '../utils/historyUtils'; + +interface HistoryScreenProps { + historyItems: HistoryItem[]; + onViewHistoryItem: (historyItem: HistoryItem) => void; + onClose: () => void; +} + +export const HistoryScreen: React.FC = ({ + historyItems, + onViewHistoryItem, + onClose +}) => { + return ( +
+
+
+

Generation History

+

Last {historyItems.length} generation runs

+
+ +
+ + {historyItems.length === 0 ? ( +
+ No history items found +
+ ) : ( +
+ {historyItems.map((item) => ( +
+
+
+ {formatDate(item.timestamp)} +
+ +
+
+
+ {formatNodeNameWithParams(item.nodeName, item.params)} +
+
+
+ ))} +
+ )} +
+ ); +}; \ No newline at end of file diff --git a/ui/src/components/debug/screens/InitialScreen.tsx b/ui/src/components/debug/screens/InitialScreen.tsx index f4e0df9..917de31 100644 --- a/ui/src/components/debug/screens/InitialScreen.tsx +++ b/ui/src/components/debug/screens/InitialScreen.tsx @@ -1,8 +1,8 @@ /* * @Author: ai-business-hql ai.bussiness.hql@gmail.com * @Date: 2025-03-31 18:29:53 - * @LastEditors: ai-business-hql ai.bussiness.hql@gmail.com - * @LastEditTime: 2025-04-09 11:39:45 + * @LastEditors: ai-business-hql qingli.hql@alibaba-inc.com + * @LastEditTime: 2025-05-15 16:18:09 * @FilePath: /comfyui_copilot/ui/src/components/debug/screens/InitialScreen.tsx * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE */ @@ -38,8 +38,8 @@ export const InitialScreen: React.FC = ({
-

Select Parameters for Testing

-

Choose the parameters you want to include in your batch test

+

Select parameters

+

multiple selections supported

-
- Enlarged image -
-
-
- )} +
{currentImages.map((image, indexOnPage) => { @@ -116,7 +104,7 @@ export const ResultGalleryScreen: React.FC = ({ {/* Zoom icon */}
-
- {Object.entries(image.params) - // Filter out nodeParams and other complex objects from display - .filter(([paramName, value]) => - paramName !== 'nodeParams' && - typeof value !== 'object' - ) - .map(([paramName, value]) => ( -
{paramName}: {String(value)}
- )) - } -
); })} @@ -195,13 +171,7 @@ export const ResultGalleryScreen: React.FC = ({
)} -
- +