From daf2aec27baa7bf9f080be5cff5fb4afb247679d Mon Sep 17 00:00:00 2001 From: Immac Date: Tue, 3 Mar 2026 11:04:07 -0600 Subject: [PATCH] fix: align weight range -10/10/0.01 across BarInput defaults, MixCard and StyleMixerPanel --- ...leMixerPanel-RQq4Q0CQ.js => StyleMixerPanel-BzTZ1bZm.js} | 4 ++-- dist/immac_style_mixer/main.js | 4 ++-- ui/src/components/BarInput.tsx | 6 +++--- ui/src/components/MixCard.tsx | 6 +++--- ui/src/components/StyleMixerPanel.tsx | 6 +++--- 5 files changed, 13 insertions(+), 13 deletions(-) rename dist/immac_style_mixer/{StyleMixerPanel-RQq4Q0CQ.js => StyleMixerPanel-BzTZ1bZm.js} (60%) diff --git a/dist/immac_style_mixer/StyleMixerPanel-RQq4Q0CQ.js b/dist/immac_style_mixer/StyleMixerPanel-BzTZ1bZm.js similarity index 60% rename from dist/immac_style_mixer/StyleMixerPanel-RQq4Q0CQ.js rename to dist/immac_style_mixer/StyleMixerPanel-BzTZ1bZm.js index bba528d..68a0432 100644 --- a/dist/immac_style_mixer/StyleMixerPanel-RQq4Q0CQ.js +++ b/dist/immac_style_mixer/StyleMixerPanel-BzTZ1bZm.js @@ -1,4 +1,4 @@ -import{j as e}from"./main.js";import{r as o,b as me}from"./vendor-DPfS0z4g.js";const oe={styles:[],mixes:[],current_mix_id:null},ae="/immac_style_mixer/api/data";function xe(){const[t,s]=o.useState(oe),[p,l]=o.useState(!0),[h,b]=o.useState(null),[f,C]=o.useState(!1),z=o.useRef(oe),D=o.useRef(null),N=o.useRef(!1);o.useEffect(()=>{fetch(ae).then(m=>{if(!m.ok)throw new Error(`HTTP ${m.status}`);return m.json()}).then(m=>{z.current=m,s(m)}).catch(m=>b(String(m))).finally(()=>l(!1))},[]);const _=o.useCallback((m,g)=>{var R,P,H,x,S,F,T,O;const w=z.current,j=typeof m=="function"?m(w):m;z.current=j,s(j);const u=j.mixes.length-w.mixes.length,k=j.styles.length-w.styles.length;if(u<0||k<0){try{(P=(R=window.app)==null?void 0:R.refreshComboInNodes)==null||P.call(R),(x=(H=window.app)==null?void 0:H.toast)==null||x.add({severity:"warn",summary:"Style Mixer",detail:"A mix or style was deleted — node combo lists have been refreshed.",life:4e3})}catch(n){console.warn("[ImmacStyleMixer] refreshComboInNodes/toast failed",n)}C(!1)}else if(u>0||k>0){const n=k>0&&w.styles.length===0,a=u>0&&w.mixes.length===0;if(n||a){try{(F=(S=window.app)==null?void 0:S.refreshComboInNodes)==null||F.call(S),(O=(T=window.app)==null?void 0:T.toast)==null||O.add({severity:"info",summary:"Style Mixer",detail:"First item added — node combo lists refreshed.",life:4e3})}catch(r){console.warn("[ImmacStyleMixer] refreshComboInNodes/toast failed",r)}C(!1)}else g!=null&&g.silent||C(!0)}D.current&&clearTimeout(D.current),N.current=(g==null?void 0:g.silent)??!1,D.current=setTimeout(()=>{fetch(ae,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(j)}).then(()=>{var n,a,r,I,A;if(!N.current)try{(a=(n=window.app)==null?void 0:n.refreshComboInNodes)==null||a.call(n)}catch{}try{(A=(I=(r=window.app)==null?void 0:r.graph)==null?void 0:I.nodes)==null||A.forEach(B=>{typeof B._immacUpdatePreview=="function"&&B._immacUpdatePreview()})}catch{}}).catch(n=>console.error("[ImmacStyleMixer] Save failed",n))},400)},[]),v=o.useCallback(()=>{var m,g,w,j,u;try{(g=(m=window.app)==null?void 0:m.refreshComboInNodes)==null||g.call(m),(u=(j=(w=window.app)==null?void 0:w.graph)==null?void 0:j.nodes)==null||u.forEach(k=>{typeof k._immacUpdatePreview=="function"&&k._immacUpdatePreview()})}catch(k){console.warn("[ImmacStyleMixer] refreshComboInNodes failed",k)}C(!1)},[]);return{data:t,loading:p,error:h,update:_,pendingRefresh:f,refreshNodes:v}}async function ge(t){const s=new FormData;s.append("image",t),s.append("subfolder","immac_style_mixer/styles"),s.append("type","input");const p=await fetch("/upload/image",{method:"POST",body:s});if(!p.ok)throw new Error(`Upload failed: HTTP ${p.status}`);return(await p.json()).name}function Q(t,s){const p=s?`&t=${s}`:"";return`/view?filename=${encodeURIComponent(t)}&subfolder=immac_style_mixer%2Fstyles&type=input${p}`}async function he(t){const s=new FormData;s.append("image",t),s.append("subfolder","immac_style_mixer/mixes"),s.append("type","input");const p=await fetch("/upload/image",{method:"POST",body:s});if(!p.ok)throw new Error(`Upload failed: HTTP ${p.status}`);return(await p.json()).name}function re(t,s){const p=s?`&t=${s}`:"";return`/view?filename=${encodeURIComponent(t)}&subfolder=immac_style_mixer%2Fmixes&type=input${p}`}function ne({src:t,alt:s,onClose:p}){return o.useEffect(()=>{function l(h){h.key==="Escape"&&p()}return window.addEventListener("keydown",l),()=>window.removeEventListener("keydown",l)},[p]),me.createPortal(e.jsxs("div",{onClick:p,style:{position:"fixed",inset:0,zIndex:99999,background:"rgba(0,0,0,0.85)",display:"flex",alignItems:"center",justifyContent:"center",cursor:"zoom-out"},children:[e.jsx("img",{src:t,alt:s??"",onClick:l=>l.stopPropagation(),style:{maxWidth:"90vw",maxHeight:"90vh",objectFit:"contain",borderRadius:8,boxShadow:"0 8px 40px rgba(0,0,0,0.7)",cursor:"default"}}),e.jsx("button",{onClick:p,title:"Close",style:{position:"fixed",top:16,right:20,background:"none",border:"none",color:"#fff",fontSize:28,cursor:"pointer",lineHeight:1,opacity:.8},children:"✕"})]}),document.body)}function pe({value:t,onChange:s,min:p=0,max:l=1,step:h=.05,pixelsPerStep:b=2,width:f=72,decimals:C=2}){const[z,D]=o.useState(!1),[N,_]=o.useState(""),v=o.useRef(null),m=o.useCallback(()=>{const x=parseFloat(N);isNaN(x)||s(x),D(!1)},[N,s]);o.useEffect(()=>{var x,S;z&&((x=v.current)==null||x.focus(),(S=v.current)==null||S.select())},[z]);const g=o.useRef(!1),w=o.useRef(0),j=o.useRef(0),u=o.useRef(!1),k=o.useCallback(x=>{z||(x.currentTarget.setPointerCapture(x.pointerId),g.current=!0,u.current=!1,w.current=x.clientX,j.current=Math.max(p,Math.min(l,t)))},[z,t,p,l]),R=o.useCallback(x=>{if(!g.current)return;const S=x.clientX-w.current;Math.abs(S)>2&&(u.current=!0);const F=S/b,T=j.current+F*h,O=Math.round(T/h)*h,n=parseFloat(Math.max(p,Math.min(l,O)).toFixed(C));s(n)},[h,b,C,p,l,s]),P=o.useCallback(()=>{g.current&&!u.current&&(_(t.toFixed(C)),D(!0)),g.current=!1},[t,C]),H=Math.max(0,Math.min(1,(t-p)/(l-p)))*100;return z?e.jsx("input",{ref:v,type:"text",inputMode:"decimal",value:N,onChange:x=>_(x.target.value),onBlur:m,onKeyDown:x=>{x.key==="Enter"&&m(),x.key==="Escape"&&D(!1)},style:{width:f,background:"var(--p-surface-ground, #141414)",border:"1px solid var(--p-primary-color, #6c6)",borderRadius:4,color:"inherit",padding:"2px 4px",fontSize:12,boxSizing:"border-box",textAlign:"center",outline:"none"}}):e.jsxs("div",{draggable:!1,onMouseDown:x=>x.stopPropagation(),onDragStart:x=>x.stopPropagation(),style:{position:"relative",width:f,height:20,borderRadius:4,overflow:"hidden",cursor:"ew-resize",userSelect:"none",flexShrink:0,border:"1px solid var(--p-surface-border, #555)",background:"var(--p-surface-ground, #141414)",boxSizing:"border-box"},onPointerDown:k,onPointerMove:R,onPointerUp:P,children:[e.jsx("div",{style:{position:"absolute",inset:0,width:`${H}%`,background:"var(--p-primary-color, #4a7a4a)",opacity:.55,pointerEvents:"none"}}),e.jsx("span",{style:{position:"absolute",inset:0,display:"flex",alignItems:"center",justifyContent:"center",fontSize:11,color:"var(--p-text-color, #ddd)",pointerEvents:"none",fontVariantNumeric:"tabular-nums"},children:t.toFixed(C)})]})}function ye({mix:t,styles:s,isActive:p,isDirty:l,onActivate:h,onUpdate:b,onDelete:f,onDuplicate:C,onRefreshCache:z}){function D(i){i.target.closest("button, input, select, textarea, a")||h()}const[N,_]=o.useState(!1),[v,m]=o.useState(t.name),[g,w]=o.useState(!1),[j,u]=o.useState(!1),[k,R]=o.useState(!1),[P,H]=o.useState(!1),[x,S]=o.useState(!1),[F,T]=o.useState(!1),O=o.useRef(null);function n(){const i=t.styles.filter(d=>d.enabled).map(d=>{var y;return((y=s.find(M=>M.id===d.style_id))==null?void 0:y.value)??""}).filter(Boolean);i.length!==0&&navigator.clipboard.writeText(i.join(", ")).then(()=>{S(!0),setTimeout(()=>S(!1),1500)})}async function a(i){if(i.type.startsWith("image/")){w(!0);try{const d=await he(i);b({...t,image_filename:d,image_updated_at:Date.now()})}catch(d){console.error("[ImmacStyleMixer] Mix image upload failed",d)}finally{w(!1)}}}function r(){_(!1),v.trim()!==t.name&&b({...t,name:v.trim()||t.name})}function I(i,d){const y=t.styles.map((M,$)=>$===i?{...M,...d}:M);b({...t,styles:y},{silent:!0})}function A(i){b({...t,styles:t.styles.filter((d,y)=>y!==i)},{silent:!0})}function B(i){t.styles.some(d=>d.style_id===i)||b({...t,styles:[...t.styles,{style_id:i,weight:1,enabled:!0}]},{silent:!0})}const c=s.filter(i=>!t.styles.some(d=>d.style_id===i.id));function E(){return{draggable:!0,onDragStart:i=>{i.dataTransfer.effectAllowed="copy",i.dataTransfer.setData("application/x-immac-mix-name",t.name)},onDragEnd:i=>{var K,X,Y,G,J,q,ie;const d=(K=window.app)==null?void 0:K.canvas;if(!d)return;const y=d.canvas;if(!y||document.elementFromPoint(i.clientX,i.clientY)!==y)return;const M=d.convertEventToCanvasOffset(i),$=window.LiteGraph,L=$==null?void 0:$.createNode("StyleMixImmacStyleMixer");if(!L)return;L.pos=M,(Y=(X=window.app)==null?void 0:X.graph)==null||Y.add(L);const W=(G=L.widgets)==null?void 0:G.find(fe=>fe.name==="mix");W&&(W.value=t.name,(J=W.callback)==null||J.call(W,t.name,null,null,null,L)),(ie=(q=window.app)==null?void 0:q.graph)==null||ie.setDirtyCanvas(!0,!0)}}}return e.jsxs("div",{style:{border:`2px solid ${F?"#88aaff":p?"var(--p-primary-color, #6c6)":"var(--p-surface-border, #444)"}`,borderRadius:8,padding:10,background:F?"rgba(100,130,255,0.07)":"var(--p-surface-section, #1e1e1e)",display:"flex",flexDirection:"column",gap:8,width:"100%",position:"relative",overflow:"hidden",transition:"border-color 0.15s, background 0.15s"},onClick:D,onDragOver:i=>{i.dataTransfer.types.includes("application/x-immac-style-id")&&(i.preventDefault(),i.dataTransfer.dropEffect="copy",T(!0))},onDragLeave:i=>{i.currentTarget.contains(i.relatedTarget)||T(!1)},onDrop:i=>{T(!1);const d=i.dataTransfer.getData("application/x-immac-style-id");d&&(i.preventDefault(),i.stopPropagation(),B(d))},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:6},children:[e.jsx("span",{...E(),title:"Drag to canvas",style:{cursor:"grab",color:"#666",fontSize:14,flexShrink:0,lineHeight:1,userSelect:"none"},children:"⠿"}),N?e.jsx("input",{autoFocus:!0,value:v,onChange:i=>m(i.target.value),onBlur:r,onKeyDown:i=>{i.key==="Enter"&&r(),i.key==="Escape"&&_(!1)},style:le}):e.jsx("span",{title:"Double-click to rename",onDoubleClick:()=>{m(t.name),_(!0)},style:{fontWeight:600,flex:1,cursor:"text",fontSize:13},children:t.name}),l&&e.jsx("button",{title:"Pending node-cache changes — click to reload",onClick:i=>{i.stopPropagation(),z()},style:{...U,color:"#f5a623",fontSize:14,animation:"immac-pulse 1.8s ease-in-out infinite"},children:e.jsx("i",{className:"pi pi-exclamation-circle"})}),e.jsx("button",{title:t.favorite?"Remove bookmark":"Bookmark",onClick:()=>b({...t,favorite:!t.favorite}),style:U,children:e.jsx("i",{className:t.favorite?"pi pi-bookmark-fill":"pi pi-bookmark"})}),e.jsx("button",{title:"Duplicate mix",onClick:C,style:{...U,color:"var(--p-text-muted-color, #888)"},children:e.jsx("i",{className:"pi pi-copy"})}),(()=>{const i=t.styles.some(d=>{var y;return d.enabled&&((y=s.find(M=>M.id===d.style_id))==null?void 0:y.value)});return e.jsx("button",{title:i?"Copy combined prompt":"No enabled styles with prompt text",onClick:d=>{d.stopPropagation(),n()},disabled:!i,style:{...U,color:x?"#6c6":"var(--p-text-muted-color, #888)",opacity:i?1:.35},children:e.jsx("i",{className:x?"pi pi-check":"pi pi-clipboard"})})})(),e.jsx("button",{title:"Delete mix",onClick:()=>R(!0),style:{...U,color:"var(--p-text-muted-color, #888)"},children:e.jsx("i",{className:"pi pi-trash"})})]}),k&&e.jsxs("div",{style:{position:"absolute",inset:0,background:"rgba(20,20,20,0.92)",display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",gap:12,zIndex:10},children:[e.jsx("i",{className:"pi pi-trash",style:{fontSize:22,color:"#e55"}}),e.jsxs("span",{style:{fontSize:13,color:"#ddd",fontWeight:600},children:['Delete "',t.name,'"?']}),e.jsxs("div",{style:{display:"flex",gap:8},children:[e.jsx("button",{onClick:()=>R(!1),style:{...se},children:"Cancel"}),e.jsx("button",{onClick:f,style:{...se,background:"#c33",color:"#fff",borderColor:"#c33"},children:"Delete"})]})]}),e.jsxs("div",{style:{position:"relative",width:"100%",paddingBottom:"100%"},onMouseEnter:()=>H(!0),onMouseLeave:()=>H(!1),children:[e.jsx("div",{title:"Click or drop an image to set mix cover",onClick:()=>{var i;return(i=O.current)==null?void 0:i.click()},onDragOver:i=>i.preventDefault(),onDrop:i=>{i.preventDefault();const d=i.dataTransfer.files[0];d&&a(d)},style:{position:"absolute",inset:0,borderRadius:6,border:"1px dashed var(--p-surface-border, #555)",overflow:"hidden",cursor:"pointer",display:"flex",alignItems:"center",justifyContent:"center",background:"var(--p-surface-ground, #141414)",fontSize:11,color:"#888",flexShrink:0},children:g?"Uploading…":t.image_filename?e.jsx("img",{src:re(t.image_filename,t.image_updated_at),alt:t.name,style:{width:"100%",height:"100%",objectFit:"cover",transition:"transform 0.3s ease",transform:P?"scale(1.05)":"scale(1)"}}):"+ cover image"}),!g&&t.image_filename&&P&&e.jsx("button",{title:"View full size",onClick:i=>{i.stopPropagation(),u(!0)},style:be,children:e.jsx("i",{className:"pi pi-search-plus"})})]}),j&&t.image_filename&&e.jsx(ne,{src:re(t.image_filename,t.image_updated_at),alt:t.name,onClose:()=>u(!1)}),e.jsx("input",{ref:O,type:"file",accept:"image/*",style:{display:"none"},onChange:i=>{var y;const d=(y=i.target.files)==null?void 0:y[0];d&&a(d),i.target.value=""}}),e.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:6,maxHeight:240,overflowY:"auto"},children:[t.styles.length===0&&e.jsx("div",{style:{fontSize:11,color:"#666"},children:"No styles added yet."}),t.styles.map((i,d)=>{const y=s.find(M=>M.id===i.style_id);return e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:6},children:[e.jsx("button",{title:i.enabled?"Disable":"Enable",onClick:()=>I(d,{enabled:!i.enabled}),style:{...U,fontSize:11,padding:"2px 5px",border:"1px solid var(--p-surface-border, #555)",borderRadius:4,background:i.enabled?"var(--p-primary-color, #557755)":"transparent",color:i.enabled?"#fff":"#888",minWidth:32},children:i.enabled?"ON":"OFF"}),e.jsx("span",{style:{fontSize:12,flex:1,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},children:(y==null?void 0:y.name)??i.style_id}),e.jsx(pe,{value:i.weight,onChange:M=>I(d,{weight:M}),min:0,max:1,step:.05,width:64}),e.jsx("button",{title:"Remove from mix",onClick:()=>A(d),style:{...U,color:"#e55",fontSize:13},children:"✕"})]},i.style_id)})]}),e.jsxs("select",{value:"",disabled:c.length===0,onChange:i=>{i.target.value&&B(i.target.value)},style:{...le,cursor:c.length===0?"not-allowed":"pointer",opacity:c.length===0?.45:1},title:c.length===0?"All library styles are already in this mix":"Add a style to this mix",children:[e.jsx("option",{value:"",children:c.length===0?"— all styles already added —":"+ add style…"}),c.map(i=>e.jsx("option",{value:i.id,children:i.name},i.id))]})]})}const se={background:"transparent",border:"1px solid #666",borderRadius:5,color:"#ccc",cursor:"pointer",fontSize:12,padding:"4px 12px"},U={background:"none",border:"none",cursor:"pointer",fontSize:16,padding:"0 2px",color:"inherit",lineHeight:1,flexShrink:0},be={position:"absolute",top:6,left:6,background:"rgba(255,255,255,0.92)",border:"none",borderRadius:6,cursor:"pointer",fontSize:13,padding:"3px 6px",lineHeight:1,color:"#222",boxShadow:"0 1px 4px rgba(0,0,0,0.25)"},le={background:"var(--p-surface-ground, #141414)",border:"1px solid var(--p-surface-border, #444)",borderRadius:4,color:"inherit",padding:"2px 4px",fontSize:12,boxSizing:"border-box"};(()=>{if(document.getElementById("immac-pulse-style"))return;const t=document.createElement("style");t.id="immac-pulse-style",t.textContent=`@keyframes immac-pulse { +import{j as e}from"./main.js";import{r as o,b as me}from"./vendor-DPfS0z4g.js";const oe={styles:[],mixes:[],current_mix_id:null},ae="/immac_style_mixer/api/data";function xe(){const[t,s]=o.useState(oe),[p,l]=o.useState(!0),[h,b]=o.useState(null),[f,C]=o.useState(!1),z=o.useRef(oe),D=o.useRef(null),N=o.useRef(!1);o.useEffect(()=>{fetch(ae).then(m=>{if(!m.ok)throw new Error(`HTTP ${m.status}`);return m.json()}).then(m=>{z.current=m,s(m)}).catch(m=>b(String(m))).finally(()=>l(!1))},[]);const _=o.useCallback((m,g)=>{var R,P,H,x,S,F,T,O;const w=z.current,j=typeof m=="function"?m(w):m;z.current=j,s(j);const u=j.mixes.length-w.mixes.length,k=j.styles.length-w.styles.length;if(u<0||k<0){try{(P=(R=window.app)==null?void 0:R.refreshComboInNodes)==null||P.call(R),(x=(H=window.app)==null?void 0:H.toast)==null||x.add({severity:"warn",summary:"Style Mixer",detail:"A mix or style was deleted — node combo lists have been refreshed.",life:4e3})}catch(n){console.warn("[ImmacStyleMixer] refreshComboInNodes/toast failed",n)}C(!1)}else if(u>0||k>0){const n=k>0&&w.styles.length===0,a=u>0&&w.mixes.length===0;if(n||a){try{(F=(S=window.app)==null?void 0:S.refreshComboInNodes)==null||F.call(S),(O=(T=window.app)==null?void 0:T.toast)==null||O.add({severity:"info",summary:"Style Mixer",detail:"First item added — node combo lists refreshed.",life:4e3})}catch(r){console.warn("[ImmacStyleMixer] refreshComboInNodes/toast failed",r)}C(!1)}else g!=null&&g.silent||C(!0)}D.current&&clearTimeout(D.current),N.current=(g==null?void 0:g.silent)??!1,D.current=setTimeout(()=>{fetch(ae,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(j)}).then(()=>{var n,a,r,I,A;if(!N.current)try{(a=(n=window.app)==null?void 0:n.refreshComboInNodes)==null||a.call(n)}catch{}try{(A=(I=(r=window.app)==null?void 0:r.graph)==null?void 0:I.nodes)==null||A.forEach(B=>{typeof B._immacUpdatePreview=="function"&&B._immacUpdatePreview()})}catch{}}).catch(n=>console.error("[ImmacStyleMixer] Save failed",n))},400)},[]),v=o.useCallback(()=>{var m,g,w,j,u;try{(g=(m=window.app)==null?void 0:m.refreshComboInNodes)==null||g.call(m),(u=(j=(w=window.app)==null?void 0:w.graph)==null?void 0:j.nodes)==null||u.forEach(k=>{typeof k._immacUpdatePreview=="function"&&k._immacUpdatePreview()})}catch(k){console.warn("[ImmacStyleMixer] refreshComboInNodes failed",k)}C(!1)},[]);return{data:t,loading:p,error:h,update:_,pendingRefresh:f,refreshNodes:v}}async function ge(t){const s=new FormData;s.append("image",t),s.append("subfolder","immac_style_mixer/styles"),s.append("type","input");const p=await fetch("/upload/image",{method:"POST",body:s});if(!p.ok)throw new Error(`Upload failed: HTTP ${p.status}`);return(await p.json()).name}function Q(t,s){const p=s?`&t=${s}`:"";return`/view?filename=${encodeURIComponent(t)}&subfolder=immac_style_mixer%2Fstyles&type=input${p}`}async function he(t){const s=new FormData;s.append("image",t),s.append("subfolder","immac_style_mixer/mixes"),s.append("type","input");const p=await fetch("/upload/image",{method:"POST",body:s});if(!p.ok)throw new Error(`Upload failed: HTTP ${p.status}`);return(await p.json()).name}function re(t,s){const p=s?`&t=${s}`:"";return`/view?filename=${encodeURIComponent(t)}&subfolder=immac_style_mixer%2Fmixes&type=input${p}`}function ne({src:t,alt:s,onClose:p}){return o.useEffect(()=>{function l(h){h.key==="Escape"&&p()}return window.addEventListener("keydown",l),()=>window.removeEventListener("keydown",l)},[p]),me.createPortal(e.jsxs("div",{onClick:p,style:{position:"fixed",inset:0,zIndex:99999,background:"rgba(0,0,0,0.85)",display:"flex",alignItems:"center",justifyContent:"center",cursor:"zoom-out"},children:[e.jsx("img",{src:t,alt:s??"",onClick:l=>l.stopPropagation(),style:{maxWidth:"90vw",maxHeight:"90vh",objectFit:"contain",borderRadius:8,boxShadow:"0 8px 40px rgba(0,0,0,0.7)",cursor:"default"}}),e.jsx("button",{onClick:p,title:"Close",style:{position:"fixed",top:16,right:20,background:"none",border:"none",color:"#fff",fontSize:28,cursor:"pointer",lineHeight:1,opacity:.8},children:"✕"})]}),document.body)}function pe({value:t,onChange:s,min:p=-10,max:l=10,step:h=.01,pixelsPerStep:b=2,width:f=72,decimals:C=2}){const[z,D]=o.useState(!1),[N,_]=o.useState(""),v=o.useRef(null),m=o.useCallback(()=>{const x=parseFloat(N);isNaN(x)||s(x),D(!1)},[N,s]);o.useEffect(()=>{var x,S;z&&((x=v.current)==null||x.focus(),(S=v.current)==null||S.select())},[z]);const g=o.useRef(!1),w=o.useRef(0),j=o.useRef(0),u=o.useRef(!1),k=o.useCallback(x=>{z||(x.currentTarget.setPointerCapture(x.pointerId),g.current=!0,u.current=!1,w.current=x.clientX,j.current=Math.max(p,Math.min(l,t)))},[z,t,p,l]),R=o.useCallback(x=>{if(!g.current)return;const S=x.clientX-w.current;Math.abs(S)>2&&(u.current=!0);const F=S/b,T=j.current+F*h,O=Math.round(T/h)*h,n=parseFloat(Math.max(p,Math.min(l,O)).toFixed(C));s(n)},[h,b,C,p,l,s]),P=o.useCallback(()=>{g.current&&!u.current&&(_(t.toFixed(C)),D(!0)),g.current=!1},[t,C]),H=Math.max(0,Math.min(1,(t-p)/(l-p)))*100;return z?e.jsx("input",{ref:v,type:"text",inputMode:"decimal",value:N,onChange:x=>_(x.target.value),onBlur:m,onKeyDown:x=>{x.key==="Enter"&&m(),x.key==="Escape"&&D(!1)},style:{width:f,background:"var(--p-surface-ground, #141414)",border:"1px solid var(--p-primary-color, #6c6)",borderRadius:4,color:"inherit",padding:"2px 4px",fontSize:12,boxSizing:"border-box",textAlign:"center",outline:"none"}}):e.jsxs("div",{draggable:!1,onMouseDown:x=>x.stopPropagation(),onDragStart:x=>x.stopPropagation(),style:{position:"relative",width:f,height:20,borderRadius:4,overflow:"hidden",cursor:"ew-resize",userSelect:"none",flexShrink:0,border:"1px solid var(--p-surface-border, #555)",background:"var(--p-surface-ground, #141414)",boxSizing:"border-box"},onPointerDown:k,onPointerMove:R,onPointerUp:P,children:[e.jsx("div",{style:{position:"absolute",inset:0,width:`${H}%`,background:"var(--p-primary-color, #4a7a4a)",opacity:.55,pointerEvents:"none"}}),e.jsx("span",{style:{position:"absolute",inset:0,display:"flex",alignItems:"center",justifyContent:"center",fontSize:11,color:"var(--p-text-color, #ddd)",pointerEvents:"none",fontVariantNumeric:"tabular-nums"},children:t.toFixed(C)})]})}function ye({mix:t,styles:s,isActive:p,isDirty:l,onActivate:h,onUpdate:b,onDelete:f,onDuplicate:C,onRefreshCache:z}){function D(i){i.target.closest("button, input, select, textarea, a")||h()}const[N,_]=o.useState(!1),[v,m]=o.useState(t.name),[g,w]=o.useState(!1),[j,u]=o.useState(!1),[k,R]=o.useState(!1),[P,H]=o.useState(!1),[x,S]=o.useState(!1),[F,T]=o.useState(!1),O=o.useRef(null);function n(){const i=t.styles.filter(d=>d.enabled).map(d=>{var y;return((y=s.find(M=>M.id===d.style_id))==null?void 0:y.value)??""}).filter(Boolean);i.length!==0&&navigator.clipboard.writeText(i.join(", ")).then(()=>{S(!0),setTimeout(()=>S(!1),1500)})}async function a(i){if(i.type.startsWith("image/")){w(!0);try{const d=await he(i);b({...t,image_filename:d,image_updated_at:Date.now()})}catch(d){console.error("[ImmacStyleMixer] Mix image upload failed",d)}finally{w(!1)}}}function r(){_(!1),v.trim()!==t.name&&b({...t,name:v.trim()||t.name})}function I(i,d){const y=t.styles.map((M,$)=>$===i?{...M,...d}:M);b({...t,styles:y},{silent:!0})}function A(i){b({...t,styles:t.styles.filter((d,y)=>y!==i)},{silent:!0})}function B(i){t.styles.some(d=>d.style_id===i)||b({...t,styles:[...t.styles,{style_id:i,weight:1,enabled:!0}]},{silent:!0})}const c=s.filter(i=>!t.styles.some(d=>d.style_id===i.id));function E(){return{draggable:!0,onDragStart:i=>{i.dataTransfer.effectAllowed="copy",i.dataTransfer.setData("application/x-immac-mix-name",t.name)},onDragEnd:i=>{var K,X,Y,G,J,q,ie;const d=(K=window.app)==null?void 0:K.canvas;if(!d)return;const y=d.canvas;if(!y||document.elementFromPoint(i.clientX,i.clientY)!==y)return;const M=d.convertEventToCanvasOffset(i),$=window.LiteGraph,L=$==null?void 0:$.createNode("StyleMixImmacStyleMixer");if(!L)return;L.pos=M,(Y=(X=window.app)==null?void 0:X.graph)==null||Y.add(L);const W=(G=L.widgets)==null?void 0:G.find(fe=>fe.name==="mix");W&&(W.value=t.name,(J=W.callback)==null||J.call(W,t.name,null,null,null,L)),(ie=(q=window.app)==null?void 0:q.graph)==null||ie.setDirtyCanvas(!0,!0)}}}return e.jsxs("div",{style:{border:`2px solid ${F?"#88aaff":p?"var(--p-primary-color, #6c6)":"var(--p-surface-border, #444)"}`,borderRadius:8,padding:10,background:F?"rgba(100,130,255,0.07)":"var(--p-surface-section, #1e1e1e)",display:"flex",flexDirection:"column",gap:8,width:"100%",position:"relative",overflow:"hidden",transition:"border-color 0.15s, background 0.15s"},onClick:D,onDragOver:i=>{i.dataTransfer.types.includes("application/x-immac-style-id")&&(i.preventDefault(),i.dataTransfer.dropEffect="copy",T(!0))},onDragLeave:i=>{i.currentTarget.contains(i.relatedTarget)||T(!1)},onDrop:i=>{T(!1);const d=i.dataTransfer.getData("application/x-immac-style-id");d&&(i.preventDefault(),i.stopPropagation(),B(d))},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:6},children:[e.jsx("span",{...E(),title:"Drag to canvas",style:{cursor:"grab",color:"#666",fontSize:14,flexShrink:0,lineHeight:1,userSelect:"none"},children:"⠿"}),N?e.jsx("input",{autoFocus:!0,value:v,onChange:i=>m(i.target.value),onBlur:r,onKeyDown:i=>{i.key==="Enter"&&r(),i.key==="Escape"&&_(!1)},style:le}):e.jsx("span",{title:"Double-click to rename",onDoubleClick:()=>{m(t.name),_(!0)},style:{fontWeight:600,flex:1,cursor:"text",fontSize:13},children:t.name}),l&&e.jsx("button",{title:"Pending node-cache changes — click to reload",onClick:i=>{i.stopPropagation(),z()},style:{...U,color:"#f5a623",fontSize:14,animation:"immac-pulse 1.8s ease-in-out infinite"},children:e.jsx("i",{className:"pi pi-exclamation-circle"})}),e.jsx("button",{title:t.favorite?"Remove bookmark":"Bookmark",onClick:()=>b({...t,favorite:!t.favorite}),style:U,children:e.jsx("i",{className:t.favorite?"pi pi-bookmark-fill":"pi pi-bookmark"})}),e.jsx("button",{title:"Duplicate mix",onClick:C,style:{...U,color:"var(--p-text-muted-color, #888)"},children:e.jsx("i",{className:"pi pi-copy"})}),(()=>{const i=t.styles.some(d=>{var y;return d.enabled&&((y=s.find(M=>M.id===d.style_id))==null?void 0:y.value)});return e.jsx("button",{title:i?"Copy combined prompt":"No enabled styles with prompt text",onClick:d=>{d.stopPropagation(),n()},disabled:!i,style:{...U,color:x?"#6c6":"var(--p-text-muted-color, #888)",opacity:i?1:.35},children:e.jsx("i",{className:x?"pi pi-check":"pi pi-clipboard"})})})(),e.jsx("button",{title:"Delete mix",onClick:()=>R(!0),style:{...U,color:"var(--p-text-muted-color, #888)"},children:e.jsx("i",{className:"pi pi-trash"})})]}),k&&e.jsxs("div",{style:{position:"absolute",inset:0,background:"rgba(20,20,20,0.92)",display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",gap:12,zIndex:10},children:[e.jsx("i",{className:"pi pi-trash",style:{fontSize:22,color:"#e55"}}),e.jsxs("span",{style:{fontSize:13,color:"#ddd",fontWeight:600},children:['Delete "',t.name,'"?']}),e.jsxs("div",{style:{display:"flex",gap:8},children:[e.jsx("button",{onClick:()=>R(!1),style:{...se},children:"Cancel"}),e.jsx("button",{onClick:f,style:{...se,background:"#c33",color:"#fff",borderColor:"#c33"},children:"Delete"})]})]}),e.jsxs("div",{style:{position:"relative",width:"100%",paddingBottom:"100%"},onMouseEnter:()=>H(!0),onMouseLeave:()=>H(!1),children:[e.jsx("div",{title:"Click or drop an image to set mix cover",onClick:()=>{var i;return(i=O.current)==null?void 0:i.click()},onDragOver:i=>i.preventDefault(),onDrop:i=>{i.preventDefault();const d=i.dataTransfer.files[0];d&&a(d)},style:{position:"absolute",inset:0,borderRadius:6,border:"1px dashed var(--p-surface-border, #555)",overflow:"hidden",cursor:"pointer",display:"flex",alignItems:"center",justifyContent:"center",background:"var(--p-surface-ground, #141414)",fontSize:11,color:"#888",flexShrink:0},children:g?"Uploading…":t.image_filename?e.jsx("img",{src:re(t.image_filename,t.image_updated_at),alt:t.name,style:{width:"100%",height:"100%",objectFit:"cover",transition:"transform 0.3s ease",transform:P?"scale(1.05)":"scale(1)"}}):"+ cover image"}),!g&&t.image_filename&&P&&e.jsx("button",{title:"View full size",onClick:i=>{i.stopPropagation(),u(!0)},style:be,children:e.jsx("i",{className:"pi pi-search-plus"})})]}),j&&t.image_filename&&e.jsx(ne,{src:re(t.image_filename,t.image_updated_at),alt:t.name,onClose:()=>u(!1)}),e.jsx("input",{ref:O,type:"file",accept:"image/*",style:{display:"none"},onChange:i=>{var y;const d=(y=i.target.files)==null?void 0:y[0];d&&a(d),i.target.value=""}}),e.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:6,maxHeight:240,overflowY:"auto"},children:[t.styles.length===0&&e.jsx("div",{style:{fontSize:11,color:"#666"},children:"No styles added yet."}),t.styles.map((i,d)=>{const y=s.find(M=>M.id===i.style_id);return e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:6},children:[e.jsx("button",{title:i.enabled?"Disable":"Enable",onClick:()=>I(d,{enabled:!i.enabled}),style:{...U,fontSize:11,padding:"2px 5px",border:"1px solid var(--p-surface-border, #555)",borderRadius:4,background:i.enabled?"var(--p-primary-color, #557755)":"transparent",color:i.enabled?"#fff":"#888",minWidth:32},children:i.enabled?"ON":"OFF"}),e.jsx("span",{style:{fontSize:12,flex:1,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},children:(y==null?void 0:y.name)??i.style_id}),e.jsx(pe,{value:i.weight,onChange:M=>I(d,{weight:M}),min:-10,max:10,step:.01,width:64}),e.jsx("button",{title:"Remove from mix",onClick:()=>A(d),style:{...U,color:"#e55",fontSize:13},children:"✕"})]},i.style_id)})]}),e.jsxs("select",{value:"",disabled:c.length===0,onChange:i=>{i.target.value&&B(i.target.value)},style:{...le,cursor:c.length===0?"not-allowed":"pointer",opacity:c.length===0?.45:1},title:c.length===0?"All library styles are already in this mix":"Add a style to this mix",children:[e.jsx("option",{value:"",children:c.length===0?"— all styles already added —":"+ add style…"}),c.map(i=>e.jsx("option",{value:i.id,children:i.name},i.id))]})]})}const se={background:"transparent",border:"1px solid #666",borderRadius:5,color:"#ccc",cursor:"pointer",fontSize:12,padding:"4px 12px"},U={background:"none",border:"none",cursor:"pointer",fontSize:16,padding:"0 2px",color:"inherit",lineHeight:1,flexShrink:0},be={position:"absolute",top:6,left:6,background:"rgba(255,255,255,0.92)",border:"none",borderRadius:6,cursor:"pointer",fontSize:13,padding:"3px 6px",lineHeight:1,color:"#222",boxShadow:"0 1px 4px rgba(0,0,0,0.25)"},le={background:"var(--p-surface-ground, #141414)",border:"1px solid var(--p-surface-border, #444)",borderRadius:4,color:"inherit",padding:"2px 4px",fontSize:12,boxSizing:"border-box"};(()=>{if(document.getElementById("immac-pulse-style"))return;const t=document.createElement("style");t.id="immac-pulse-style",t.textContent=`@keyframes immac-pulse { 0%,100% { opacity:1; transform:scale(1); } 50% { opacity:0.55; transform:scale(1.15); } -}`,document.head.appendChild(t)})();function ve({style:t,onUpdate:s,onDelete:p,inCurrentMix:l,onAddToMix:h,onRemoveFromMix:b,isDirty:f,onRefreshCache:C}){const[z,D]=o.useState(!1),[N,_]=o.useState(!1),[v,m]=o.useState(t.name),[g,w]=o.useState(t.value),[j,u]=o.useState(!1),[k,R]=o.useState(!1),[P,H]=o.useState(!1),[x,S]=o.useState(!1),[F,T]=o.useState(!1),O=o.useRef(null),n=!!(h||b);function a(){t.value&&navigator.clipboard.writeText(t.value).then(()=>{T(!0),setTimeout(()=>T(!1),1500)})}function r(){D(!1),v.trim()!==t.name&&s({...t,name:v.trim()||t.name})}function I(){_(!1),g!==t.value&&s({...t,value:g})}async function A(c){if(c.type.startsWith("image/")){u(!0);try{const E=await ge(c);s({...t,image_filename:E,image_updated_at:Date.now()})}catch(E){console.error("[ImmacStyleMixer] Image upload failed",E)}finally{u(!1)}}}const B={draggable:!0,onDragStart:c=>{c.dataTransfer.setData("application/x-immac-style-id",t.id),c.dataTransfer.setData("application/x-immac-style-name",t.name),c.dataTransfer.effectAllowed="copy"},onDragEnd:c=>{var L,W,K,X,Y,G,J;const E=(L=window.app)==null?void 0:L.canvas;if(!E)return;const i=E.canvas;if(!i||document.elementFromPoint(c.clientX,c.clientY)!==i)return;const d=E.convertEventToCanvasOffset(c),y=window.LiteGraph,M=y==null?void 0:y.createNode("StylePickImmacStyleMixer");if(!M)return;M.pos=d,(K=(W=window.app)==null?void 0:W.graph)==null||K.add(M);const $=(X=M.widgets)==null?void 0:X.find(q=>q.name==="style");$&&($.value=t.name,(Y=$.callback)==null||Y.call($,t.name,null,null,null,M)),(J=(G=window.app)==null?void 0:G.graph)==null||J.setDirtyCanvas(!0,!0)}};return e.jsxs("div",{style:{border:"1px solid var(--p-surface-border, #444)",borderRadius:8,padding:8,width:"100%",background:"var(--p-surface-section, #1e1e1e)",display:"flex",flexDirection:"column",gap:6,position:"relative",overflow:"hidden"},children:[e.jsxs("div",{style:{display:"flex",justifyContent:"space-between",alignItems:"center"},children:[e.jsx("span",{...B,title:"Drag to canvas",style:{cursor:"grab",color:"#666",fontSize:14,lineHeight:1,userSelect:"none",flexShrink:0},children:"⠿"}),e.jsx("button",{title:t.favorite?"Remove bookmark":"Bookmark",onClick:()=>s({...t,favorite:!t.favorite}),style:V,children:e.jsx("i",{className:t.favorite?"pi pi-bookmark-fill":"pi pi-bookmark"})}),e.jsxs("div",{style:{display:"flex",gap:2},children:[l?e.jsx("button",{title:"Remove from current mix",onClick:b,style:{...V,color:"#e66"},children:e.jsx("i",{className:"pi pi-minus"})}):e.jsx("button",{title:n?"Add to current mix":"No active mix",onClick:h,disabled:!n,style:{...V,color:"var(--p-text-muted-color, #888)",opacity:n?1:.35},children:e.jsx("i",{className:"pi pi-plus"})}),e.jsx("button",{title:t.value?"Copy prompt text":"No prompt text to copy",onClick:a,disabled:!t.value,style:{...V,color:F?"#6c6":"var(--p-text-muted-color, #888)",opacity:t.value?1:.35},children:e.jsx("i",{className:F?"pi pi-check":"pi pi-clipboard"})}),f&&e.jsx("button",{title:"Node combo lists may be stale — click to refresh",onClick:C,style:{...V,color:"#f5a623",fontSize:14,animation:"immac-pulse 1.8s ease-in-out infinite"},children:e.jsx("i",{className:"pi pi-exclamation-circle"})}),e.jsx("button",{title:"Delete style",onClick:()=>H(!0),style:{...V,color:"var(--p-text-muted-color, #888)"},children:e.jsx("i",{className:"pi pi-trash"})})]})]}),P&&e.jsxs("div",{style:{position:"absolute",inset:0,background:"rgba(20,20,20,0.92)",display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",gap:12,zIndex:10},children:[e.jsx("i",{className:"pi pi-trash",style:{fontSize:22,color:"#e55"}}),e.jsxs("span",{style:{fontSize:13,color:"#ddd",fontWeight:600},children:['Delete "',t.name,'"?']}),e.jsxs("div",{style:{display:"flex",gap:8},children:[e.jsx("button",{onClick:()=>H(!1),style:{...ce},children:"Cancel"}),e.jsx("button",{onClick:p,style:{...ce,background:"#c33",color:"#fff",borderColor:"#c33"},children:"Delete"})]})]}),e.jsxs("div",{style:{position:"relative",width:"100%",paddingBottom:"100%"},onMouseEnter:()=>S(!0),onMouseLeave:()=>S(!1),children:[e.jsx("div",{title:"Click or drop to upload image",onClick:()=>{var c;return(c=O.current)==null?void 0:c.click()},onDragOver:c=>c.preventDefault(),onDrop:c=>{c.preventDefault();const E=c.dataTransfer.files[0];E&&A(E)},style:{position:"absolute",inset:0,borderRadius:6,border:"1px dashed var(--p-surface-border, #555)",overflow:"hidden",cursor:"pointer",display:"flex",alignItems:"center",justifyContent:"center",background:"var(--p-surface-ground, #141414)",fontSize:11,color:"#888"},children:j?"Uploading…":t.image_filename?e.jsx("img",{src:Q(t.image_filename,t.image_updated_at),alt:t.name,style:{width:"100%",height:"100%",objectFit:"cover",transition:"transform 0.3s ease",transform:x?"scale(1.05)":"scale(1)"}}):"+ image"}),!j&&t.image_filename&&x&&e.jsx("button",{title:"View full size",onClick:c=>{c.stopPropagation(),R(!0)},style:ke,children:e.jsx("i",{className:"pi pi-search-plus"})})]}),k&&t.image_filename&&e.jsx(ne,{src:Q(t.image_filename,t.image_updated_at),alt:t.name,onClose:()=>R(!1)}),e.jsx("input",{ref:O,type:"file",accept:"image/*",style:{display:"none"},onChange:c=>{var i;const E=(i=c.target.files)==null?void 0:i[0];E&&A(E),c.target.value=""}}),z?e.jsx("input",{autoFocus:!0,value:v,onChange:c=>m(c.target.value),onBlur:r,onKeyDown:c=>{c.key==="Enter"&&r(),c.key==="Escape"&&D(!1)},style:de}):e.jsx("div",{title:"Click to rename",onDoubleClick:()=>{m(t.name),D(!0)},style:{fontWeight:600,fontSize:13,cursor:"text",wordBreak:"break-word"},children:t.name}),N?e.jsx("textarea",{autoFocus:!0,value:g,onChange:c=>w(c.target.value),onBlur:I,onKeyDown:c=>{c.key==="Escape"&&_(!1)},rows:3,style:{...de,resize:"vertical"}}):e.jsx("div",{title:"Click to edit prompt text",onDoubleClick:()=>{w(t.value),_(!0)},style:{fontSize:11,color:"#aaa",cursor:"text",wordBreak:"break-word",minHeight:32},children:t.value||e.jsx("span",{style:{color:"#555"},children:"double-click to add prompt…"})})]})}const ce={background:"transparent",border:"1px solid #666",borderRadius:5,color:"#ccc",cursor:"pointer",fontSize:12,padding:"4px 12px"},V={background:"none",border:"none",cursor:"pointer",fontSize:16,padding:"0 2px",color:"inherit",lineHeight:1},ke={position:"absolute",top:6,left:6,background:"rgba(255,255,255,0.92)",border:"none",borderRadius:6,cursor:"pointer",fontSize:13,padding:"3px 6px",lineHeight:1,color:"#222",boxShadow:"0 1px 4px rgba(0,0,0,0.25)"},de={width:"100%",boxSizing:"border-box",background:"var(--p-surface-ground, #141414)",border:"1px solid var(--p-primary-color, #6c6)",borderRadius:4,color:"inherit",padding:"2px 4px",fontSize:12};function we({styles:t,onUpdate:s,onDelete:p,onAdd:l,currentMixStyleIds:h,onAddToMix:b,onRemoveFromMix:f,isDirty:C,onRefreshCache:z}){const[D,N]=o.useState(""),[_,v]=o.useState(!1);function m(){const u=D.trim();u&&(l(u),N(""),v(!1))}const g=t.filter(u=>u.favorite),w=t.filter(u=>!u.favorite),j=[...g,...w];return e.jsx("div",{style:{display:"flex",flexDirection:"column",gap:10},children:e.jsxs("div",{style:{display:"grid",gridTemplateColumns:"repeat(auto-fill, minmax(180px, 1fr))",gap:10},children:[j.map(u=>e.jsx(ve,{style:u,onUpdate:s,onDelete:()=>p(u.id),inCurrentMix:h==null?void 0:h.has(u.id),onAddToMix:b?()=>b(u.id):void 0,onRemoveFromMix:f?()=>f(u.id):void 0,isDirty:C,onRefreshCache:z},u.id)),_?e.jsxs("div",{style:{border:"1px dashed var(--p-primary-color, #6c6)",borderRadius:8,padding:10,display:"flex",flexDirection:"column",gap:8,background:"var(--p-surface-section, #1e1e1e)",flexShrink:0},children:[e.jsx("input",{autoFocus:!0,placeholder:"Style name…",value:D,onChange:u=>N(u.target.value),onKeyDown:u=>{u.key==="Enter"&&m(),u.key==="Escape"&&v(!1)},style:je}),e.jsxs("div",{style:{display:"flex",gap:6},children:[e.jsx("button",{onClick:m,style:ue,children:"Add"}),e.jsx("button",{onClick:()=>{v(!1),N("")},style:{...ue,background:"transparent",color:"#aaa"},children:"Cancel"})]})]}):e.jsx("button",{title:"Add a new style",onClick:()=>v(!0),style:{width:"100%",minHeight:80,border:"1px dashed var(--p-surface-border, #555)",borderRadius:8,background:"transparent",color:"#666",cursor:"pointer",fontSize:24},children:"+"})]})})}const je={width:"100%",boxSizing:"border-box",background:"var(--p-surface-ground, #141414)",border:"1px solid var(--p-primary-color, #6c6)",borderRadius:4,color:"inherit",padding:"4px 6px",fontSize:13},ue={flex:1,background:"var(--p-primary-color, #557755)",border:"none",borderRadius:4,color:"#fff",cursor:"pointer",padding:"4px 8px",fontSize:12};function Z(){return crypto.randomUUID()}function ee({title:t,children:s,defaultOpen:p=!0,grow:l=!0}){const[h,b]=o.useState(p);return e.jsxs("div",{style:{display:"flex",flexDirection:"column",flex:h&&l?"1 1 0":"0 0 auto",minHeight:0,borderBottom:"1px solid var(--p-surface-border, #333)"},children:[e.jsxs("button",{onClick:()=>b(f=>!f),style:{display:"flex",alignItems:"center",gap:6,background:"none",border:"none",cursor:"pointer",padding:"8px 0",width:"100%",textAlign:"left",color:"#888",flexShrink:0},children:[e.jsx("i",{className:`pi ${h?"pi-chevron-down":"pi-chevron-right"}`,style:{fontSize:10,flexShrink:0}}),e.jsx("span",{style:{fontWeight:700,fontSize:12,textTransform:"uppercase",letterSpacing:"0.08em"},children:t})]}),h&&e.jsx("div",{style:{flex:1,minHeight:0,overflowY:"auto",paddingBottom:8},children:s})]})}function De(){const{data:t,loading:s,error:p,update:l,pendingRefresh:h,refreshNodes:b}=xe(),f=t.mixes.find(n=>n.id===t.current_mix_id)??null,[C,z]=o.useState(null),[D,N]=o.useState(null),[_,v]=o.useState(!1),m=o.useCallback(n=>{const a={id:Z(),name:n,value:"",favorite:!1,image_filename:null};l(r=>({...r,styles:[...r.styles,a]}))},[l]),g=o.useCallback(n=>{l(a=>({...a,styles:a.styles.map(r=>r.id===n.id?n:r)}))},[l]),w=o.useCallback(n=>{l(a=>({...a,styles:a.styles.filter(r=>r.id!==n),mixes:a.mixes.map(r=>({...r,styles:r.styles.filter(I=>I.style_id!==n)}))}))},[l]),j=o.useCallback(n=>{const a={...n,id:Z(),name:`${n.name} (copy)`,favorite:!1};l(r=>{const I=r.mixes.findIndex(B=>B.id===n.id),A=[...r.mixes];return A.splice(I+1,0,a),{...r,mixes:A}})},[l]),u=o.useCallback(()=>{const n={id:Z(),name:`Mix ${t.mixes.length+1}`,favorite:!1,image_filename:null,styles:[]};l(a=>({...a,mixes:[...a.mixes,n]}))},[t.mixes.length,l]),k=o.useCallback((n,a)=>{l(r=>({...r,mixes:r.mixes.map(I=>I.id===n.id?n:I)}),a)},[l]),R=o.useCallback(n=>{f&&(f.styles.some(a=>a.style_id===n)||k({...f,styles:[...f.styles,{style_id:n,weight:1,enabled:!0}]},{silent:!0}))},[f,k]),P=o.useCallback(n=>{f&&k({...f,styles:f.styles.filter(a=>a.style_id!==n)},{silent:!0})},[f,k]),H=o.useCallback(n=>{l(a=>({...a,mixes:a.mixes.filter(r=>r.id!==n),current_mix_id:a.current_mix_id===n?null:a.current_mix_id}))},[l]),x=o.useCallback(n=>{l(a=>({...a,current_mix_id:n}))},[l]),S=o.useCallback((n,a,r)=>{f&&k({...f,styles:f.styles.map(I=>I.style_id===n?{...I,...a}:I)},r)},[f,k]);if(s)return e.jsx("div",{style:te,children:"Loading…"});if(p)return e.jsxs("div",{style:{...te,color:"#e55"},children:["Error: ",p]});const F=t.mixes.filter(n=>n.favorite),T=t.mixes.filter(n=>!n.favorite),O=[...F,...T];return e.jsxs("div",{style:te,children:[e.jsx(ee,{title:"Current Mix",grow:!1,children:f?e.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:6},children:[e.jsx("div",{style:{fontWeight:600,fontSize:14},children:f.name}),e.jsxs("div",{style:{display:"flex",gap:8,flexWrap:"nowrap",overflowX:"auto",borderRadius:6,border:`1px dashed ${_?"#88aaff":"transparent"}`,background:_?"rgba(100,130,255,0.07)":"transparent",padding:_?4:0,transition:"border-color 0.15s, background 0.15s, padding 0.1s",minHeight:40,paddingBottom:6},onDragOver:n=>{n.dataTransfer.types.includes("application/x-immac-style-id")&&(n.preventDefault(),n.dataTransfer.dropEffect="copy",v(!0))},onDragLeave:n=>{n.currentTarget.contains(n.relatedTarget)||v(!1)},onDrop:n=>{v(!1);const a=n.dataTransfer.getData("application/x-immac-style-id");a&&(n.preventDefault(),R(a))},children:[f.styles.length===0&&!_&&e.jsx("div",{style:{fontSize:12,color:"#666"},children:"No styles in this mix yet."}),f.styles.map(n=>{const a=t.styles.find(r=>r.id===n.style_id);return e.jsxs("div",{onMouseEnter:()=>N(n.style_id),onMouseLeave:()=>N(null),onDoubleClick:()=>S(n.style_id,{enabled:!n.enabled},{silent:!0}),style:{border:`1px solid ${n.enabled?"var(--p-primary-color, #6c6)":"var(--p-surface-border, #444)"}`,borderRadius:6,overflow:"hidden",background:"var(--p-surface-section, #1e1e1e)",opacity:n.enabled?1:.45,fontSize:12,display:"flex",flexDirection:"column",alignItems:"center",width:180,flexShrink:0},children:[e.jsxs("div",{style:{position:"relative",width:"100%",paddingBottom:"100%"},children:[e.jsx("div",{style:{position:"absolute",inset:0,background:"var(--p-surface-ground, #141414)",display:"flex",alignItems:"center",justifyContent:"center"},children:a!=null&&a.image_filename?e.jsx("img",{src:Q(a.image_filename,a.image_updated_at),alt:a.name,style:{width:"100%",height:"100%",objectFit:"cover",display:"block",transition:"transform 0.3s ease",transform:D===n.style_id?"scale(1.05)":"scale(1)"}}):e.jsx("i",{className:"pi pi-image",style:{fontSize:20,color:"#555"}})}),(a==null?void 0:a.image_filename)&&D===n.style_id&&e.jsx("button",{title:"View full size",onClick:()=>z(Q(a.image_filename,a.image_updated_at)),style:{position:"absolute",top:6,left:6,background:"rgba(255,255,255,0.92)",border:"none",borderRadius:6,cursor:"pointer",fontSize:13,padding:"3px 6px",lineHeight:1,color:"#222",boxShadow:"0 1px 4px rgba(0,0,0,0.25)"},children:e.jsx("i",{className:"pi pi-search-plus"})})]}),e.jsxs("div",{style:{padding:"4px 6px",width:"100%",boxSizing:"border-box",display:"flex",flexDirection:"column",gap:4},children:[e.jsx("div",{style:{fontWeight:600,whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis",textAlign:"center",fontSize:12},children:(a==null?void 0:a.name)??"?"}),e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:4},children:[e.jsx("button",{title:n.enabled?"Disable style":"Enable style",onClick:r=>{r.stopPropagation(),S(n.style_id,{enabled:!n.enabled},{silent:!0})},style:{background:n.enabled?"var(--p-primary-color, #557755)":"transparent",border:"1px solid var(--p-surface-border, #555)",borderRadius:4,color:n.enabled?"#fff":"#888",cursor:"pointer",fontSize:10,padding:"1px 4px",lineHeight:1,flexShrink:0},children:n.enabled?"ON":"OFF"}),e.jsx("div",{style:{flex:1,minWidth:0},onClick:r=>r.stopPropagation(),children:e.jsx(pe,{value:n.weight,onChange:r=>S(n.style_id,{weight:r},{silent:!0}),min:0,max:1,step:.05,width:"100%"})}),e.jsx("button",{title:"Remove from mix",onClick:r=>{r.stopPropagation(),P(n.style_id)},style:{background:"none",border:"none",cursor:"pointer",color:"#e66",fontSize:13,padding:"0 2px",lineHeight:1,flexShrink:0},children:"✕"})]})]})]},n.style_id)})]})]}):e.jsx("div",{style:{fontSize:12,color:"#666"},children:"No mix active — select one from Mixes below."})}),e.jsx(ee,{title:"Mixes",children:e.jsxs("div",{style:{display:"flex",flexDirection:"row",flexWrap:"wrap",gap:10,paddingBottom:4},children:[O.map(n=>e.jsx("div",{style:{flex:"0 0 280px"},children:e.jsx(ye,{mix:n,styles:t.styles,isActive:n.id===t.current_mix_id,isDirty:h,onActivate:()=>x(n.id),onUpdate:k,onDelete:()=>H(n.id),onDuplicate:()=>j(n),onRefreshCache:b})},n.id)),e.jsx("button",{title:"Add a new mix",onClick:u,style:{flex:"0 0 120px",minHeight:80,border:"1px dashed var(--p-surface-border, #555)",borderRadius:8,background:"transparent",color:"#666",cursor:"pointer",fontSize:22},children:"+"})]})}),e.jsx(ee,{title:"Styles",children:e.jsx(we,{styles:t.styles,onUpdate:g,onDelete:w,onAdd:m,currentMixStyleIds:f?new Set(f.styles.map(n=>n.style_id)):void 0,onAddToMix:f?R:void 0,onRemoveFromMix:f?P:void 0,isDirty:h,onRefreshCache:b})}),C&&e.jsx(ne,{src:C,onClose:()=>z(null)})]})}const te={position:"absolute",inset:0,padding:"0 12px",display:"flex",flexDirection:"column",overflow:"hidden",color:"var(--p-text-color, #eee)",fontSize:13,boxSizing:"border-box"};export{De as default}; +}`,document.head.appendChild(t)})();function ve({style:t,onUpdate:s,onDelete:p,inCurrentMix:l,onAddToMix:h,onRemoveFromMix:b,isDirty:f,onRefreshCache:C}){const[z,D]=o.useState(!1),[N,_]=o.useState(!1),[v,m]=o.useState(t.name),[g,w]=o.useState(t.value),[j,u]=o.useState(!1),[k,R]=o.useState(!1),[P,H]=o.useState(!1),[x,S]=o.useState(!1),[F,T]=o.useState(!1),O=o.useRef(null),n=!!(h||b);function a(){t.value&&navigator.clipboard.writeText(t.value).then(()=>{T(!0),setTimeout(()=>T(!1),1500)})}function r(){D(!1),v.trim()!==t.name&&s({...t,name:v.trim()||t.name})}function I(){_(!1),g!==t.value&&s({...t,value:g})}async function A(c){if(c.type.startsWith("image/")){u(!0);try{const E=await ge(c);s({...t,image_filename:E,image_updated_at:Date.now()})}catch(E){console.error("[ImmacStyleMixer] Image upload failed",E)}finally{u(!1)}}}const B={draggable:!0,onDragStart:c=>{c.dataTransfer.setData("application/x-immac-style-id",t.id),c.dataTransfer.setData("application/x-immac-style-name",t.name),c.dataTransfer.effectAllowed="copy"},onDragEnd:c=>{var L,W,K,X,Y,G,J;const E=(L=window.app)==null?void 0:L.canvas;if(!E)return;const i=E.canvas;if(!i||document.elementFromPoint(c.clientX,c.clientY)!==i)return;const d=E.convertEventToCanvasOffset(c),y=window.LiteGraph,M=y==null?void 0:y.createNode("StylePickImmacStyleMixer");if(!M)return;M.pos=d,(K=(W=window.app)==null?void 0:W.graph)==null||K.add(M);const $=(X=M.widgets)==null?void 0:X.find(q=>q.name==="style");$&&($.value=t.name,(Y=$.callback)==null||Y.call($,t.name,null,null,null,M)),(J=(G=window.app)==null?void 0:G.graph)==null||J.setDirtyCanvas(!0,!0)}};return e.jsxs("div",{style:{border:"1px solid var(--p-surface-border, #444)",borderRadius:8,padding:8,width:"100%",background:"var(--p-surface-section, #1e1e1e)",display:"flex",flexDirection:"column",gap:6,position:"relative",overflow:"hidden"},children:[e.jsxs("div",{style:{display:"flex",justifyContent:"space-between",alignItems:"center"},children:[e.jsx("span",{...B,title:"Drag to canvas",style:{cursor:"grab",color:"#666",fontSize:14,lineHeight:1,userSelect:"none",flexShrink:0},children:"⠿"}),e.jsx("button",{title:t.favorite?"Remove bookmark":"Bookmark",onClick:()=>s({...t,favorite:!t.favorite}),style:V,children:e.jsx("i",{className:t.favorite?"pi pi-bookmark-fill":"pi pi-bookmark"})}),e.jsxs("div",{style:{display:"flex",gap:2},children:[l?e.jsx("button",{title:"Remove from current mix",onClick:b,style:{...V,color:"#e66"},children:e.jsx("i",{className:"pi pi-minus"})}):e.jsx("button",{title:n?"Add to current mix":"No active mix",onClick:h,disabled:!n,style:{...V,color:"var(--p-text-muted-color, #888)",opacity:n?1:.35},children:e.jsx("i",{className:"pi pi-plus"})}),e.jsx("button",{title:t.value?"Copy prompt text":"No prompt text to copy",onClick:a,disabled:!t.value,style:{...V,color:F?"#6c6":"var(--p-text-muted-color, #888)",opacity:t.value?1:.35},children:e.jsx("i",{className:F?"pi pi-check":"pi pi-clipboard"})}),f&&e.jsx("button",{title:"Node combo lists may be stale — click to refresh",onClick:C,style:{...V,color:"#f5a623",fontSize:14,animation:"immac-pulse 1.8s ease-in-out infinite"},children:e.jsx("i",{className:"pi pi-exclamation-circle"})}),e.jsx("button",{title:"Delete style",onClick:()=>H(!0),style:{...V,color:"var(--p-text-muted-color, #888)"},children:e.jsx("i",{className:"pi pi-trash"})})]})]}),P&&e.jsxs("div",{style:{position:"absolute",inset:0,background:"rgba(20,20,20,0.92)",display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",gap:12,zIndex:10},children:[e.jsx("i",{className:"pi pi-trash",style:{fontSize:22,color:"#e55"}}),e.jsxs("span",{style:{fontSize:13,color:"#ddd",fontWeight:600},children:['Delete "',t.name,'"?']}),e.jsxs("div",{style:{display:"flex",gap:8},children:[e.jsx("button",{onClick:()=>H(!1),style:{...ce},children:"Cancel"}),e.jsx("button",{onClick:p,style:{...ce,background:"#c33",color:"#fff",borderColor:"#c33"},children:"Delete"})]})]}),e.jsxs("div",{style:{position:"relative",width:"100%",paddingBottom:"100%"},onMouseEnter:()=>S(!0),onMouseLeave:()=>S(!1),children:[e.jsx("div",{title:"Click or drop to upload image",onClick:()=>{var c;return(c=O.current)==null?void 0:c.click()},onDragOver:c=>c.preventDefault(),onDrop:c=>{c.preventDefault();const E=c.dataTransfer.files[0];E&&A(E)},style:{position:"absolute",inset:0,borderRadius:6,border:"1px dashed var(--p-surface-border, #555)",overflow:"hidden",cursor:"pointer",display:"flex",alignItems:"center",justifyContent:"center",background:"var(--p-surface-ground, #141414)",fontSize:11,color:"#888"},children:j?"Uploading…":t.image_filename?e.jsx("img",{src:Q(t.image_filename,t.image_updated_at),alt:t.name,style:{width:"100%",height:"100%",objectFit:"cover",transition:"transform 0.3s ease",transform:x?"scale(1.05)":"scale(1)"}}):"+ image"}),!j&&t.image_filename&&x&&e.jsx("button",{title:"View full size",onClick:c=>{c.stopPropagation(),R(!0)},style:ke,children:e.jsx("i",{className:"pi pi-search-plus"})})]}),k&&t.image_filename&&e.jsx(ne,{src:Q(t.image_filename,t.image_updated_at),alt:t.name,onClose:()=>R(!1)}),e.jsx("input",{ref:O,type:"file",accept:"image/*",style:{display:"none"},onChange:c=>{var i;const E=(i=c.target.files)==null?void 0:i[0];E&&A(E),c.target.value=""}}),z?e.jsx("input",{autoFocus:!0,value:v,onChange:c=>m(c.target.value),onBlur:r,onKeyDown:c=>{c.key==="Enter"&&r(),c.key==="Escape"&&D(!1)},style:de}):e.jsx("div",{title:"Click to rename",onDoubleClick:()=>{m(t.name),D(!0)},style:{fontWeight:600,fontSize:13,cursor:"text",wordBreak:"break-word"},children:t.name}),N?e.jsx("textarea",{autoFocus:!0,value:g,onChange:c=>w(c.target.value),onBlur:I,onKeyDown:c=>{c.key==="Escape"&&_(!1)},rows:3,style:{...de,resize:"vertical"}}):e.jsx("div",{title:"Click to edit prompt text",onDoubleClick:()=>{w(t.value),_(!0)},style:{fontSize:11,color:"#aaa",cursor:"text",wordBreak:"break-word",minHeight:32},children:t.value||e.jsx("span",{style:{color:"#555"},children:"double-click to add prompt…"})})]})}const ce={background:"transparent",border:"1px solid #666",borderRadius:5,color:"#ccc",cursor:"pointer",fontSize:12,padding:"4px 12px"},V={background:"none",border:"none",cursor:"pointer",fontSize:16,padding:"0 2px",color:"inherit",lineHeight:1},ke={position:"absolute",top:6,left:6,background:"rgba(255,255,255,0.92)",border:"none",borderRadius:6,cursor:"pointer",fontSize:13,padding:"3px 6px",lineHeight:1,color:"#222",boxShadow:"0 1px 4px rgba(0,0,0,0.25)"},de={width:"100%",boxSizing:"border-box",background:"var(--p-surface-ground, #141414)",border:"1px solid var(--p-primary-color, #6c6)",borderRadius:4,color:"inherit",padding:"2px 4px",fontSize:12};function we({styles:t,onUpdate:s,onDelete:p,onAdd:l,currentMixStyleIds:h,onAddToMix:b,onRemoveFromMix:f,isDirty:C,onRefreshCache:z}){const[D,N]=o.useState(""),[_,v]=o.useState(!1);function m(){const u=D.trim();u&&(l(u),N(""),v(!1))}const g=t.filter(u=>u.favorite),w=t.filter(u=>!u.favorite),j=[...g,...w];return e.jsx("div",{style:{display:"flex",flexDirection:"column",gap:10},children:e.jsxs("div",{style:{display:"grid",gridTemplateColumns:"repeat(auto-fill, minmax(180px, 1fr))",gap:10},children:[j.map(u=>e.jsx(ve,{style:u,onUpdate:s,onDelete:()=>p(u.id),inCurrentMix:h==null?void 0:h.has(u.id),onAddToMix:b?()=>b(u.id):void 0,onRemoveFromMix:f?()=>f(u.id):void 0,isDirty:C,onRefreshCache:z},u.id)),_?e.jsxs("div",{style:{border:"1px dashed var(--p-primary-color, #6c6)",borderRadius:8,padding:10,display:"flex",flexDirection:"column",gap:8,background:"var(--p-surface-section, #1e1e1e)",flexShrink:0},children:[e.jsx("input",{autoFocus:!0,placeholder:"Style name…",value:D,onChange:u=>N(u.target.value),onKeyDown:u=>{u.key==="Enter"&&m(),u.key==="Escape"&&v(!1)},style:je}),e.jsxs("div",{style:{display:"flex",gap:6},children:[e.jsx("button",{onClick:m,style:ue,children:"Add"}),e.jsx("button",{onClick:()=>{v(!1),N("")},style:{...ue,background:"transparent",color:"#aaa"},children:"Cancel"})]})]}):e.jsx("button",{title:"Add a new style",onClick:()=>v(!0),style:{width:"100%",minHeight:80,border:"1px dashed var(--p-surface-border, #555)",borderRadius:8,background:"transparent",color:"#666",cursor:"pointer",fontSize:24},children:"+"})]})})}const je={width:"100%",boxSizing:"border-box",background:"var(--p-surface-ground, #141414)",border:"1px solid var(--p-primary-color, #6c6)",borderRadius:4,color:"inherit",padding:"4px 6px",fontSize:13},ue={flex:1,background:"var(--p-primary-color, #557755)",border:"none",borderRadius:4,color:"#fff",cursor:"pointer",padding:"4px 8px",fontSize:12};function Z(){return crypto.randomUUID()}function ee({title:t,children:s,defaultOpen:p=!0,grow:l=!0}){const[h,b]=o.useState(p);return e.jsxs("div",{style:{display:"flex",flexDirection:"column",flex:h&&l?"1 1 0":"0 0 auto",minHeight:0,borderBottom:"1px solid var(--p-surface-border, #333)"},children:[e.jsxs("button",{onClick:()=>b(f=>!f),style:{display:"flex",alignItems:"center",gap:6,background:"none",border:"none",cursor:"pointer",padding:"8px 0",width:"100%",textAlign:"left",color:"#888",flexShrink:0},children:[e.jsx("i",{className:`pi ${h?"pi-chevron-down":"pi-chevron-right"}`,style:{fontSize:10,flexShrink:0}}),e.jsx("span",{style:{fontWeight:700,fontSize:12,textTransform:"uppercase",letterSpacing:"0.08em"},children:t})]}),h&&e.jsx("div",{style:{flex:1,minHeight:0,overflowY:"auto",paddingBottom:8},children:s})]})}function De(){const{data:t,loading:s,error:p,update:l,pendingRefresh:h,refreshNodes:b}=xe(),f=t.mixes.find(n=>n.id===t.current_mix_id)??null,[C,z]=o.useState(null),[D,N]=o.useState(null),[_,v]=o.useState(!1),m=o.useCallback(n=>{const a={id:Z(),name:n,value:"",favorite:!1,image_filename:null};l(r=>({...r,styles:[...r.styles,a]}))},[l]),g=o.useCallback(n=>{l(a=>({...a,styles:a.styles.map(r=>r.id===n.id?n:r)}))},[l]),w=o.useCallback(n=>{l(a=>({...a,styles:a.styles.filter(r=>r.id!==n),mixes:a.mixes.map(r=>({...r,styles:r.styles.filter(I=>I.style_id!==n)}))}))},[l]),j=o.useCallback(n=>{const a={...n,id:Z(),name:`${n.name} (copy)`,favorite:!1};l(r=>{const I=r.mixes.findIndex(B=>B.id===n.id),A=[...r.mixes];return A.splice(I+1,0,a),{...r,mixes:A}})},[l]),u=o.useCallback(()=>{const n={id:Z(),name:`Mix ${t.mixes.length+1}`,favorite:!1,image_filename:null,styles:[]};l(a=>({...a,mixes:[...a.mixes,n]}))},[t.mixes.length,l]),k=o.useCallback((n,a)=>{l(r=>({...r,mixes:r.mixes.map(I=>I.id===n.id?n:I)}),a)},[l]),R=o.useCallback(n=>{f&&(f.styles.some(a=>a.style_id===n)||k({...f,styles:[...f.styles,{style_id:n,weight:1,enabled:!0}]},{silent:!0}))},[f,k]),P=o.useCallback(n=>{f&&k({...f,styles:f.styles.filter(a=>a.style_id!==n)},{silent:!0})},[f,k]),H=o.useCallback(n=>{l(a=>({...a,mixes:a.mixes.filter(r=>r.id!==n),current_mix_id:a.current_mix_id===n?null:a.current_mix_id}))},[l]),x=o.useCallback(n=>{l(a=>({...a,current_mix_id:n}))},[l]),S=o.useCallback((n,a,r)=>{f&&k({...f,styles:f.styles.map(I=>I.style_id===n?{...I,...a}:I)},r)},[f,k]);if(s)return e.jsx("div",{style:te,children:"Loading…"});if(p)return e.jsxs("div",{style:{...te,color:"#e55"},children:["Error: ",p]});const F=t.mixes.filter(n=>n.favorite),T=t.mixes.filter(n=>!n.favorite),O=[...F,...T];return e.jsxs("div",{style:te,children:[e.jsx(ee,{title:"Current Mix",grow:!1,children:f?e.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:6},children:[e.jsx("div",{style:{fontWeight:600,fontSize:14},children:f.name}),e.jsxs("div",{style:{display:"flex",gap:8,flexWrap:"nowrap",overflowX:"auto",borderRadius:6,border:`1px dashed ${_?"#88aaff":"transparent"}`,background:_?"rgba(100,130,255,0.07)":"transparent",padding:_?4:0,transition:"border-color 0.15s, background 0.15s, padding 0.1s",minHeight:40,paddingBottom:6},onDragOver:n=>{n.dataTransfer.types.includes("application/x-immac-style-id")&&(n.preventDefault(),n.dataTransfer.dropEffect="copy",v(!0))},onDragLeave:n=>{n.currentTarget.contains(n.relatedTarget)||v(!1)},onDrop:n=>{v(!1);const a=n.dataTransfer.getData("application/x-immac-style-id");a&&(n.preventDefault(),R(a))},children:[f.styles.length===0&&!_&&e.jsx("div",{style:{fontSize:12,color:"#666"},children:"No styles in this mix yet."}),f.styles.map(n=>{const a=t.styles.find(r=>r.id===n.style_id);return e.jsxs("div",{onMouseEnter:()=>N(n.style_id),onMouseLeave:()=>N(null),onDoubleClick:()=>S(n.style_id,{enabled:!n.enabled},{silent:!0}),style:{border:`1px solid ${n.enabled?"var(--p-primary-color, #6c6)":"var(--p-surface-border, #444)"}`,borderRadius:6,overflow:"hidden",background:"var(--p-surface-section, #1e1e1e)",opacity:n.enabled?1:.45,fontSize:12,display:"flex",flexDirection:"column",alignItems:"center",width:180,flexShrink:0},children:[e.jsxs("div",{style:{position:"relative",width:"100%",paddingBottom:"100%"},children:[e.jsx("div",{style:{position:"absolute",inset:0,background:"var(--p-surface-ground, #141414)",display:"flex",alignItems:"center",justifyContent:"center"},children:a!=null&&a.image_filename?e.jsx("img",{src:Q(a.image_filename,a.image_updated_at),alt:a.name,style:{width:"100%",height:"100%",objectFit:"cover",display:"block",transition:"transform 0.3s ease",transform:D===n.style_id?"scale(1.05)":"scale(1)"}}):e.jsx("i",{className:"pi pi-image",style:{fontSize:20,color:"#555"}})}),(a==null?void 0:a.image_filename)&&D===n.style_id&&e.jsx("button",{title:"View full size",onClick:()=>z(Q(a.image_filename,a.image_updated_at)),style:{position:"absolute",top:6,left:6,background:"rgba(255,255,255,0.92)",border:"none",borderRadius:6,cursor:"pointer",fontSize:13,padding:"3px 6px",lineHeight:1,color:"#222",boxShadow:"0 1px 4px rgba(0,0,0,0.25)"},children:e.jsx("i",{className:"pi pi-search-plus"})})]}),e.jsxs("div",{style:{padding:"4px 6px",width:"100%",boxSizing:"border-box",display:"flex",flexDirection:"column",gap:4},children:[e.jsx("div",{style:{fontWeight:600,whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis",textAlign:"center",fontSize:12},children:(a==null?void 0:a.name)??"?"}),e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:4},children:[e.jsx("button",{title:n.enabled?"Disable style":"Enable style",onClick:r=>{r.stopPropagation(),S(n.style_id,{enabled:!n.enabled},{silent:!0})},style:{background:n.enabled?"var(--p-primary-color, #557755)":"transparent",border:"1px solid var(--p-surface-border, #555)",borderRadius:4,color:n.enabled?"#fff":"#888",cursor:"pointer",fontSize:10,padding:"1px 4px",lineHeight:1,flexShrink:0},children:n.enabled?"ON":"OFF"}),e.jsx("div",{style:{flex:1,minWidth:0},onClick:r=>r.stopPropagation(),children:e.jsx(pe,{value:n.weight,onChange:r=>S(n.style_id,{weight:r},{silent:!0}),min:-10,max:10,step:.01,width:"100%"})}),e.jsx("button",{title:"Remove from mix",onClick:r=>{r.stopPropagation(),P(n.style_id)},style:{background:"none",border:"none",cursor:"pointer",color:"#e66",fontSize:13,padding:"0 2px",lineHeight:1,flexShrink:0},children:"✕"})]})]})]},n.style_id)})]})]}):e.jsx("div",{style:{fontSize:12,color:"#666"},children:"No mix active — select one from Mixes below."})}),e.jsx(ee,{title:"Mixes",children:e.jsxs("div",{style:{display:"flex",flexDirection:"row",flexWrap:"wrap",gap:10,paddingBottom:4},children:[O.map(n=>e.jsx("div",{style:{flex:"0 0 280px"},children:e.jsx(ye,{mix:n,styles:t.styles,isActive:n.id===t.current_mix_id,isDirty:h,onActivate:()=>x(n.id),onUpdate:k,onDelete:()=>H(n.id),onDuplicate:()=>j(n),onRefreshCache:b})},n.id)),e.jsx("button",{title:"Add a new mix",onClick:u,style:{flex:"0 0 120px",minHeight:80,border:"1px dashed var(--p-surface-border, #555)",borderRadius:8,background:"transparent",color:"#666",cursor:"pointer",fontSize:22},children:"+"})]})}),e.jsx(ee,{title:"Styles",children:e.jsx(we,{styles:t.styles,onUpdate:g,onDelete:w,onAdd:m,currentMixStyleIds:f?new Set(f.styles.map(n=>n.style_id)):void 0,onAddToMix:f?R:void 0,onRemoveFromMix:f?P:void 0,isDirty:h,onRefreshCache:b})}),C&&e.jsx(ne,{src:C,onClose:()=>z(null)})]})}const te={position:"absolute",inset:0,padding:"0 12px",display:"flex",flexDirection:"column",overflow:"hidden",color:"var(--p-text-color, #eee)",fontSize:13,boxSizing:"border-box"};export{De as default}; diff --git a/dist/immac_style_mixer/main.js b/dist/immac_style_mixer/main.js index 3239851..84402e1 100644 --- a/dist/immac_style_mixer/main.js +++ b/dist/immac_style_mixer/main.js @@ -1,4 +1,4 @@ -const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["immac_style_mixer/StyleMixerPanel-RQq4Q0CQ.js","immac_style_mixer/vendor-DPfS0z4g.js"])))=>i.map(i=>d[i]); +const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["immac_style_mixer/StyleMixerPanel-BzTZ1bZm.js","immac_style_mixer/vendor-DPfS0z4g.js"])))=>i.map(i=>d[i]); import{r as T,a as z,R as j}from"./vendor-DPfS0z4g.js";const L="modulepreload",B=function(p){return"/"+p},C={},N=function(m,h,f){let e=Promise.resolve();if(h&&h.length>0){document.getElementsByTagName("link");const s=document.querySelector("meta[property=csp-nonce]"),i=(s==null?void 0:s.nonce)||(s==null?void 0:s.getAttribute("nonce"));e=Promise.allSettled(h.map(t=>{if(t=B(t),t in C)return;C[t]=!0;const r=t.endsWith(".css"),o=r?'[rel="stylesheet"]':"";if(document.querySelector(`link[href="${t}"]${o}`))return;const n=document.createElement("link");if(n.rel=r?"stylesheet":L,r||(n.as="script"),n.crossOrigin="",n.href=t,i&&n.setAttribute("nonce",i),document.head.appendChild(n),r)return new Promise((u,l)=>{n.addEventListener("load",u),n.addEventListener("error",()=>l(new Error(`Unable to preload CSS for ${t}`)))})}))}function a(s){const i=new Event("vite:preloadError",{cancelable:!0});if(i.payload=s,window.dispatchEvent(i),!i.defaultPrevented)throw s}return e.then(s=>{for(const i of s||[])i.status==="rejected"&&a(i.reason);return m().catch(a)})};var M={exports:{}},P={};/** * @license React * react-jsx-runtime.production.min.js @@ -7,4 +7,4 @@ import{r as T,a as z,R as j}from"./vendor-DPfS0z4g.js";const L="modulepreload",B * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. - */var A=T,D=Symbol.for("react.element"),F=Symbol.for("react.fragment"),Z=Object.prototype.hasOwnProperty,J=A.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,W={key:!0,ref:!0,__self:!0,__source:!0};function U(p,m,h){var f,e={},a=null,s=null;h!==void 0&&(a=""+h),m.key!==void 0&&(a=""+m.key),m.ref!==void 0&&(s=m.ref);for(f in m)Z.call(m,f)&&!W.hasOwnProperty(f)&&(e[f]=m[f]);if(p&&p.defaultProps)for(f in m=p.defaultProps,m)e[f]===void 0&&(e[f]=m[f]);return{$$typeof:D,type:p,key:a,ref:s,props:e,_owner:J.current}}P.Fragment=F;P.jsx=U;P.jsxs=U;M.exports=P;var k=M.exports,I={},O=z;I.createRoot=O.createRoot,I.hydrateRoot=O.hydrateRoot;const H=j.lazy(()=>N(()=>import("./StyleMixerPanel-RQq4Q0CQ.js"),__vite__mapDeps([0,1])));function q(){return new Promise(p=>{function m(){if(window.app){p();return}const h=setInterval(()=>{window.app&&(clearInterval(h),p())},50);setTimeout(()=>{clearInterval(h),console.error("[ImmacStyleMixer] Timeout waiting for ComfyUI app"),p()},5e3)}document.readyState==="loading"?document.addEventListener("DOMContentLoaded",m):m()})}async function V(){if(await q(),!window.app){console.error("[ImmacStyleMixer] ComfyUI app not available");return}window.app.extensionManager.registerSidebarTab({id:"immac-style-mixer",icon:"pi pi-palette",title:"Style Mixer",tooltip:"Immac Style Mixer",type:"custom",render:e=>{const a=document.createElement("div");a.id="immac-style-mixer-root",a.style.position="absolute",a.style.inset="0",a.style.overflow="hidden",e.style.position="relative",e.style.height="100%",e.appendChild(a),I.createRoot(a).render(k.jsx(j.StrictMode,{children:k.jsx(T.Suspense,{fallback:k.jsx("div",{style:{padding:"1rem"},children:"Loading…"}),children:k.jsx(H,{})})}))}});const p="/immac_style_mixer/api/data";async function m(){const e=await fetch(p);if(!e.ok){alert(`Backup failed: HTTP ${e.status}`);return}const a=await e.json(),s=new Blob([JSON.stringify(a,null,2)],{type:"application/json"}),i=URL.createObjectURL(s),t=document.createElement("a");t.href=i,t.download=`style_mixer_backup_${new Date().toISOString().slice(0,10)}.json`,t.click(),URL.revokeObjectURL(i)}function h(){const e=document.createElement("a");e.href="/immac_style_mixer/api/backup.zip",e.download=`style_mixer_backup_${new Date().toISOString().slice(0,10)}.zip`,e.click()}function f(){const e=document.createElement("input");e.type="file",e.accept=".json,.zip,application/json,application/zip",e.onchange=()=>{var i;const a=(i=e.files)==null?void 0:i[0];if(!a)return;if(a.name.endsWith(".zip")||a.type==="application/zip")a.arrayBuffer().then(async t=>{var r,o;try{const n=await fetch("/immac_style_mixer/api/restore.zip",{method:"POST",headers:{"Content-Type":"application/zip"},body:t});if(!n.ok){const l=await n.text();throw new Error(`HTTP ${n.status}: ${l.slice(0,300)}`)}const u=await n.json();try{(o=(r=window.app)==null?void 0:r.toast)==null||o.add({severity:"success",summary:"Style Mixer",detail:`ZIP restored: ${u.styles} styles, ${u.mixes} mixes, ${u.images} images. Reload the Style Mixer panel to see changes.`,life:6e3})}catch{}}catch(n){alert(`Failed to restore ZIP backup: ${n.message}`)}}).catch(t=>alert(`Could not read file: ${t.message}`));else{const t=new FileReader;t.onload=async r=>{var o,n,u;try{const l=JSON.parse((o=r.target)==null?void 0:o.result);if(!Array.isArray(l.styles)||!Array.isArray(l.mixes))throw new Error("Invalid backup: missing styles or mixes arrays.");const S=await fetch(p,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(l)});if(!S.ok)throw new Error(`Save failed: HTTP ${S.status}`);try{(u=(n=window.app)==null?void 0:n.toast)==null||u.add({severity:"success",summary:"Style Mixer",detail:`Backup restored: ${l.styles.length} styles, ${l.mixes.length} mixes. Reload the Style Mixer panel to see changes.`,life:6e3})}catch{}}catch(l){alert(`Failed to restore backup: ${l.message}`)}},t.readAsText(a)}},e.click()}window.app.registerExtension({name:"ImmacStyleMixer",settings:[{id:"ImmacStyleMixer.BackupRestore",name:"Style Mixer — Backup & Restore",type:(e,a,s)=>{const i=document.createElement("div");i.style.cssText="display:flex;gap:8px;align-items:center";const t=document.createElement("button");t.textContent="⬇ Download backup (JSON)",t.title="Save all styles and mixes to a JSON file",t.style.cssText="cursor:pointer;padding:4px 10px;border-radius:4px",t.onclick=()=>m().catch(console.error);const r=document.createElement("button");r.textContent="⬇ Download ZIP (with images)",r.title="Save styles, mixes and all images to a ZIP file",r.style.cssText="cursor:pointer;padding:4px 10px;border-radius:4px",r.onclick=()=>h();const o=document.createElement("button");return o.textContent="⬆ Restore (JSON or ZIP)",o.title="Restore from a JSON or ZIP backup — auto-detected",o.style.cssText="cursor:pointer;padding:4px 10px;border-radius:4px",o.onclick=()=>f(),i.appendChild(t),i.appendChild(r),i.appendChild(o),i},defaultValue:null}],nodeCreated(e){var E;if(e.comfyClass!=="StyleMixImmacStyleMixer"&&e.comfyClass!=="StylePickImmacStyleMixer")return;const a=e.comfyClass==="StylePickImmacStyleMixer",s=a?"style":"mix",i=(E=e.widgets)==null?void 0:E.find(y=>y.name===s);if(!i)return;const t=document.createElement("img");t.style.cssText="width:100%;height:100%;display:none;object-fit:contain;border-radius:4px";const r=document.createElement("div");r.style.cssText="padding:4px;box-sizing:border-box",r.appendChild(t),r.style.setProperty("--comfy-widget-min-height","0"),r.style.setProperty("--comfy-widget-height","0"),e.addDOMWidget("immac_preview","div",r,{serialize:!1});function o(y,w){var _,d,R,$;const v=((_=e.size)==null?void 0:_[0])??300,b=w/y,c=Math.round((v-8)*b),g=Math.max(80,Math.min(c,600));r.style.setProperty("--comfy-widget-min-height",String(g)),r.style.setProperty("--comfy-widget-height",String(g));const x=(d=e.computeSize)==null?void 0:d.call(e);x&&e.setSize([Math.max(e.size[0],x[0]),Math.max(e.size[1],x[1])]),($=(R=window.app)==null?void 0:R.graph)==null||$.setDirtyCanvas(!0)}function n(){var y,w;r.style.setProperty("--comfy-widget-min-height","0"),r.style.setProperty("--comfy-widget-height","0"),t.style.display="none",(w=(y=window.app)==null?void 0:y.graph)==null||w.setDirtyCanvas(!0)}function u(y){t.onload=()=>{t.style.display="block",o(t.naturalWidth,t.naturalHeight)},t.onerror=()=>{n()},t.src=y}async function l(y){var w;try{const v=await fetch("/immac_style_mixer/api/data");if(!v.ok)return;const b=await v.json();if(a){const c=(b.styles??[]).find(x=>x.name===y);if(!(c!=null&&c.image_filename)){n();return}const g=c.image_updated_at?`&t=${c.image_updated_at}`:"";u(`/view?filename=${encodeURIComponent(c.image_filename)}&subfolder=immac_style_mixer%2Fstyles&type=input${g}`)}else{const c=(b.mixes??[]).find(x=>x.name===y);let g="";if(c!=null&&c.image_filename){const x=c.image_updated_at?`&t=${c.image_updated_at}`:"";g=`/view?filename=${encodeURIComponent(c.image_filename)}&subfolder=immac_style_mixer%2Fmixes&type=input${x}`}else if((w=c==null?void 0:c.styles)!=null&&w.length){const x=Object.fromEntries((b.styles??[]).map(d=>[d.id,d])),_=c.styles.filter(d=>d.enabled!==!1).map(d=>x[d.style_id]).find(d=>d==null?void 0:d.image_filename);if(_){const d=_.image_updated_at?`&t=${_.image_updated_at}`:"";g=`/view?filename=${encodeURIComponent(_.image_filename)}&subfolder=immac_style_mixer%2Fstyles&type=input${d}`}}if(!g){n();return}u(g)}}catch(v){console.error("[ImmacStyleMixer] Preview update failed",v)}}const S=i.callback;i.callback=function(...y){S==null||S.apply(this,y),l(String(i.value??""))},e._immacUpdatePreview=()=>l(String(i.value??"")),i.value&&l(String(i.value))},loadedGraphNode(e){var r;if(typeof e._immacUpdatePreview!="function")return;const a=e.comfyClass==="StylePickImmacStyleMixer",s=a?"style":"mix",i=(r=e.widgets)==null?void 0:r.find(o=>o.name===s),t=String((i==null?void 0:i.value)??"");t==="(no styles saved)"||t==="(no mixes saved)"?fetch("/immac_style_mixer/api/data").then(o=>o.json()).then(o=>{var u;const n=a?o.styles??[]:o.mixes??[];n.length>0&&i&&(i.value=n[0].name,Array.isArray((u=i.options)==null?void 0:u.values)&&(i.options.values=n.map(l=>l.name))),e._immacUpdatePreview()}).catch(()=>e._immacUpdatePreview()):e._immacUpdatePreview()}})}V().catch(console.error);export{k as j}; + */var A=T,D=Symbol.for("react.element"),F=Symbol.for("react.fragment"),Z=Object.prototype.hasOwnProperty,J=A.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,W={key:!0,ref:!0,__self:!0,__source:!0};function U(p,m,h){var f,e={},a=null,s=null;h!==void 0&&(a=""+h),m.key!==void 0&&(a=""+m.key),m.ref!==void 0&&(s=m.ref);for(f in m)Z.call(m,f)&&!W.hasOwnProperty(f)&&(e[f]=m[f]);if(p&&p.defaultProps)for(f in m=p.defaultProps,m)e[f]===void 0&&(e[f]=m[f]);return{$$typeof:D,type:p,key:a,ref:s,props:e,_owner:J.current}}P.Fragment=F;P.jsx=U;P.jsxs=U;M.exports=P;var k=M.exports,I={},O=z;I.createRoot=O.createRoot,I.hydrateRoot=O.hydrateRoot;const H=j.lazy(()=>N(()=>import("./StyleMixerPanel-BzTZ1bZm.js"),__vite__mapDeps([0,1])));function q(){return new Promise(p=>{function m(){if(window.app){p();return}const h=setInterval(()=>{window.app&&(clearInterval(h),p())},50);setTimeout(()=>{clearInterval(h),console.error("[ImmacStyleMixer] Timeout waiting for ComfyUI app"),p()},5e3)}document.readyState==="loading"?document.addEventListener("DOMContentLoaded",m):m()})}async function V(){if(await q(),!window.app){console.error("[ImmacStyleMixer] ComfyUI app not available");return}window.app.extensionManager.registerSidebarTab({id:"immac-style-mixer",icon:"pi pi-palette",title:"Style Mixer",tooltip:"Immac Style Mixer",type:"custom",render:e=>{const a=document.createElement("div");a.id="immac-style-mixer-root",a.style.position="absolute",a.style.inset="0",a.style.overflow="hidden",e.style.position="relative",e.style.height="100%",e.appendChild(a),I.createRoot(a).render(k.jsx(j.StrictMode,{children:k.jsx(T.Suspense,{fallback:k.jsx("div",{style:{padding:"1rem"},children:"Loading…"}),children:k.jsx(H,{})})}))}});const p="/immac_style_mixer/api/data";async function m(){const e=await fetch(p);if(!e.ok){alert(`Backup failed: HTTP ${e.status}`);return}const a=await e.json(),s=new Blob([JSON.stringify(a,null,2)],{type:"application/json"}),i=URL.createObjectURL(s),t=document.createElement("a");t.href=i,t.download=`style_mixer_backup_${new Date().toISOString().slice(0,10)}.json`,t.click(),URL.revokeObjectURL(i)}function h(){const e=document.createElement("a");e.href="/immac_style_mixer/api/backup.zip",e.download=`style_mixer_backup_${new Date().toISOString().slice(0,10)}.zip`,e.click()}function f(){const e=document.createElement("input");e.type="file",e.accept=".json,.zip,application/json,application/zip",e.onchange=()=>{var i;const a=(i=e.files)==null?void 0:i[0];if(!a)return;if(a.name.endsWith(".zip")||a.type==="application/zip")a.arrayBuffer().then(async t=>{var r,o;try{const n=await fetch("/immac_style_mixer/api/restore.zip",{method:"POST",headers:{"Content-Type":"application/zip"},body:t});if(!n.ok){const l=await n.text();throw new Error(`HTTP ${n.status}: ${l.slice(0,300)}`)}const u=await n.json();try{(o=(r=window.app)==null?void 0:r.toast)==null||o.add({severity:"success",summary:"Style Mixer",detail:`ZIP restored: ${u.styles} styles, ${u.mixes} mixes, ${u.images} images. Reload the Style Mixer panel to see changes.`,life:6e3})}catch{}}catch(n){alert(`Failed to restore ZIP backup: ${n.message}`)}}).catch(t=>alert(`Could not read file: ${t.message}`));else{const t=new FileReader;t.onload=async r=>{var o,n,u;try{const l=JSON.parse((o=r.target)==null?void 0:o.result);if(!Array.isArray(l.styles)||!Array.isArray(l.mixes))throw new Error("Invalid backup: missing styles or mixes arrays.");const S=await fetch(p,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(l)});if(!S.ok)throw new Error(`Save failed: HTTP ${S.status}`);try{(u=(n=window.app)==null?void 0:n.toast)==null||u.add({severity:"success",summary:"Style Mixer",detail:`Backup restored: ${l.styles.length} styles, ${l.mixes.length} mixes. Reload the Style Mixer panel to see changes.`,life:6e3})}catch{}}catch(l){alert(`Failed to restore backup: ${l.message}`)}},t.readAsText(a)}},e.click()}window.app.registerExtension({name:"ImmacStyleMixer",settings:[{id:"ImmacStyleMixer.BackupRestore",name:"Style Mixer — Backup & Restore",type:(e,a,s)=>{const i=document.createElement("div");i.style.cssText="display:flex;gap:8px;align-items:center";const t=document.createElement("button");t.textContent="⬇ Download backup (JSON)",t.title="Save all styles and mixes to a JSON file",t.style.cssText="cursor:pointer;padding:4px 10px;border-radius:4px",t.onclick=()=>m().catch(console.error);const r=document.createElement("button");r.textContent="⬇ Download ZIP (with images)",r.title="Save styles, mixes and all images to a ZIP file",r.style.cssText="cursor:pointer;padding:4px 10px;border-radius:4px",r.onclick=()=>h();const o=document.createElement("button");return o.textContent="⬆ Restore (JSON or ZIP)",o.title="Restore from a JSON or ZIP backup — auto-detected",o.style.cssText="cursor:pointer;padding:4px 10px;border-radius:4px",o.onclick=()=>f(),i.appendChild(t),i.appendChild(r),i.appendChild(o),i},defaultValue:null}],nodeCreated(e){var E;if(e.comfyClass!=="StyleMixImmacStyleMixer"&&e.comfyClass!=="StylePickImmacStyleMixer")return;const a=e.comfyClass==="StylePickImmacStyleMixer",s=a?"style":"mix",i=(E=e.widgets)==null?void 0:E.find(y=>y.name===s);if(!i)return;const t=document.createElement("img");t.style.cssText="width:100%;height:100%;display:none;object-fit:contain;border-radius:4px";const r=document.createElement("div");r.style.cssText="padding:4px;box-sizing:border-box",r.appendChild(t),r.style.setProperty("--comfy-widget-min-height","0"),r.style.setProperty("--comfy-widget-height","0"),e.addDOMWidget("immac_preview","div",r,{serialize:!1});function o(y,w){var _,d,R,$;const v=((_=e.size)==null?void 0:_[0])??300,b=w/y,c=Math.round((v-8)*b),g=Math.max(80,Math.min(c,600));r.style.setProperty("--comfy-widget-min-height",String(g)),r.style.setProperty("--comfy-widget-height",String(g));const x=(d=e.computeSize)==null?void 0:d.call(e);x&&e.setSize([Math.max(e.size[0],x[0]),Math.max(e.size[1],x[1])]),($=(R=window.app)==null?void 0:R.graph)==null||$.setDirtyCanvas(!0)}function n(){var y,w;r.style.setProperty("--comfy-widget-min-height","0"),r.style.setProperty("--comfy-widget-height","0"),t.style.display="none",(w=(y=window.app)==null?void 0:y.graph)==null||w.setDirtyCanvas(!0)}function u(y){t.onload=()=>{t.style.display="block",o(t.naturalWidth,t.naturalHeight)},t.onerror=()=>{n()},t.src=y}async function l(y){var w;try{const v=await fetch("/immac_style_mixer/api/data");if(!v.ok)return;const b=await v.json();if(a){const c=(b.styles??[]).find(x=>x.name===y);if(!(c!=null&&c.image_filename)){n();return}const g=c.image_updated_at?`&t=${c.image_updated_at}`:"";u(`/view?filename=${encodeURIComponent(c.image_filename)}&subfolder=immac_style_mixer%2Fstyles&type=input${g}`)}else{const c=(b.mixes??[]).find(x=>x.name===y);let g="";if(c!=null&&c.image_filename){const x=c.image_updated_at?`&t=${c.image_updated_at}`:"";g=`/view?filename=${encodeURIComponent(c.image_filename)}&subfolder=immac_style_mixer%2Fmixes&type=input${x}`}else if((w=c==null?void 0:c.styles)!=null&&w.length){const x=Object.fromEntries((b.styles??[]).map(d=>[d.id,d])),_=c.styles.filter(d=>d.enabled!==!1).map(d=>x[d.style_id]).find(d=>d==null?void 0:d.image_filename);if(_){const d=_.image_updated_at?`&t=${_.image_updated_at}`:"";g=`/view?filename=${encodeURIComponent(_.image_filename)}&subfolder=immac_style_mixer%2Fstyles&type=input${d}`}}if(!g){n();return}u(g)}}catch(v){console.error("[ImmacStyleMixer] Preview update failed",v)}}const S=i.callback;i.callback=function(...y){S==null||S.apply(this,y),l(String(i.value??""))},e._immacUpdatePreview=()=>l(String(i.value??"")),i.value&&l(String(i.value))},loadedGraphNode(e){var r;if(typeof e._immacUpdatePreview!="function")return;const a=e.comfyClass==="StylePickImmacStyleMixer",s=a?"style":"mix",i=(r=e.widgets)==null?void 0:r.find(o=>o.name===s),t=String((i==null?void 0:i.value)??"");t==="(no styles saved)"||t==="(no mixes saved)"?fetch("/immac_style_mixer/api/data").then(o=>o.json()).then(o=>{var u;const n=a?o.styles??[]:o.mixes??[];n.length>0&&i&&(i.value=n[0].name,Array.isArray((u=i.options)==null?void 0:u.values)&&(i.options.values=n.map(l=>l.name))),e._immacUpdatePreview()}).catch(()=>e._immacUpdatePreview()):e._immacUpdatePreview()}})}V().catch(console.error);export{k as j}; diff --git a/ui/src/components/BarInput.tsx b/ui/src/components/BarInput.tsx index 3a35f8e..82c8abd 100644 --- a/ui/src/components/BarInput.tsx +++ b/ui/src/components/BarInput.tsx @@ -27,9 +27,9 @@ interface Props { export default function BarInput({ value, onChange, - min = 0, - max = 1, - step = 0.05, + min = -10, + max = 10, + step = 0.01, pixelsPerStep = 2, width = 72, decimals = 2, diff --git a/ui/src/components/MixCard.tsx b/ui/src/components/MixCard.tsx index 778b68c..5ccf78a 100644 --- a/ui/src/components/MixCard.tsx +++ b/ui/src/components/MixCard.tsx @@ -359,9 +359,9 @@ export default function MixCard({ mix, styles, isActive, isDirty, onActivate, on updateEntry(i, { weight: v })} - min={0} - max={1} - step={0.05} + min={-10} + max={10} + step={0.01} width={64} /> diff --git a/ui/src/components/StyleMixerPanel.tsx b/ui/src/components/StyleMixerPanel.tsx index 93f6fb7..e47d64d 100644 --- a/ui/src/components/StyleMixerPanel.tsx +++ b/ui/src/components/StyleMixerPanel.tsx @@ -291,9 +291,9 @@ export default function StyleMixerPanel() { updateCurrentMixEntry(entry.style_id, { weight: v }, { silent: true })} - min={0} - max={1} - step={0.05} + min={-10} + max={10} + step={0.01} width="100%" />