@field/cascade 0.10.0 → 0.12.0

package/dist/assets/image-DR4oeyJB.js

@@ -1,2062 +0,0 @@
-import{c as e,u as t}from"./nodeTypeUtils-BDJsc2Ks.js";import{A as n,B as r,D as i,E as a,V as o,k as s,o as c}from"./index-DyvDC6pS.js";var l=class extends c{constructor(e,t){super(e,`Color`,t)}setup(){this.addParm(`color`,{value:{r:1,g:1,b:1},type:`color`,displayName:`Color`}),this.addResolutionParm(),this.output=this.out(`image`),this.watchProp(`color`,()=>this.requestCook()),this.onReady=()=>this.requestCook()}render(){let[e,t]=this.getResolution(),n=o(this.props.color.value),r=i.solid(e,t,n);this.setOutput(this.output,r)}},u=class extends c{constructor(e,t){super(e,`File`,t)}setup(){this.imageInput=this.in(`image`,null),this.addParm(`file`,{value:``,type:`image`,params:{accept:`image/*`},displayName:`File`,onChange:()=>{this.props.file.value&&!this.imageInput.value&&this.requestCook()}}),this.addParm(`resolutionMode`,{value:`original`,params:{options:[{value:`original`,label:`Original`},{value:`max`,label:`Max Resolution`},{value:`fixed`,label:`Fixed Resolution`}]},displayName:`Resolution Mode`,onChange:()=>{(this.props.file.value||this.imageInput.value)&&this.requestCook()}}),this.addParm(`maxResolution`,{value:[2048,2048],params:{min:[1,1],max:[4096,4096]},displayName:`Max Resolution`,hidden:()=>this.props.resolutionMode.value!==`max`,onChange:()=>{(this.props.file.value||this.imageInput.value)&&this.props.resolutionMode.value===`max`&&this.requestCook()}}),this.addParm(`fixedResolution`,{value:[512,512],params:{min:[1,1],max:[4096,4096]},displayName:`Fixed Resolution`,hidden:()=>this.props.resolutionMode.value!==`fixed`,onChange:()=>{(this.props.file.value||this.imageInput.value)&&this.props.resolutionMode.value===`fixed`&&this.requestCook()}}),this.output=this.out(`image`),this.imageInput.onChange=()=>this.requestCook(),this.onReady=()=>{(this.props.file.value||this.imageInput.value)&&this.requestCook()}}async render(){let e=null;if(this.imageInput.value?e=this.imageInput.value instanceof i?this.imageInput.value:typeof this.imageInput.value==`string`?i.fromCanvas(await n(this.imageInput.value)):i.fromCanvas(this.imageInput.value):this.props.file.value&&(e=i.fromCanvas(await n(this.props.file.value))),e)try{let t=this.props.resolutionMode.value,n;if(t===`original`)n=e;else if(t===`max`){let[t,r]=this.props.maxResolution.value,i=e.width/e.height,a=e.width,o=e.height;a>t&&(a=t,o=t/i),o>r&&(o=r,a=r*i),a=Math.round(a),o=Math.round(o),n=a!==e.width||o!==e.height?this.resizeBuffer(e,a,o):e}else{let[t,r]=this.props.fixedResolution.value;n=this.resizeBuffer(e,t,r)}this.setOutput(this.output,n)}catch(e){this.error=e,console.error(`Failed to process image:`,e)}}resizeBuffer(e,t,n){let r=i.rgba(t,n),a=e.width/t,o=e.height/n;for(let i=0;i<Math.min(e.channelCount,4);i++){let s=r.channels[i];for(let r=0;r<n;r++)for(let n=0;n<t;n++){let c=n*a,l=r*o;s[r*t+n]=e.sample(c,l,i)}}return e.channelCount<4&&r.fill(3,1),r}},d=class extends c{constructor(e,t){super(e,`Composite`,t)}setup(){this.image1=this.in(`image1`,null),this.image2=this.in(`image2`,null),this.addParm(`blendMode`,{value:`multiply`,params:{options:[{value:`normal`,label:`Normal`},{value:`multiply`,label:`Multiply`},{value:`screen`,label:`Screen`},{value:`overlay`,label:`Overlay`},{value:`darken`,label:`Darken`},{value:`lighten`,label:`Lighten`},{value:`color-dodge`,label:`Color Dodge`},{value:`color-burn`,label:`Color Burn`},{value:`hard-light`,label:`Hard Light`},{value:`soft-light`,label:`Soft Light`},{value:`difference`,label:`Difference`},{value:`exclusion`,label:`Exclusion`},{value:`add`,label:`Add`},{value:`subtract`,label:`Subtract`},{value:`divide`,label:`Divide`},{value:`pin-light`,label:`Pin Light`},{value:`vivid-light`,label:`Vivid Light`},{value:`linear-dodge`,label:`Linear Dodge`},{value:`linear-burn`,label:`Linear Burn`}]},displayName:`Blend Mode`,onChange:()=>this.requestCook()}),this.addParm(`opacity`,{value:1,params:{min:0,max:1,step:.01},displayName:`Opacity`,onChange:()=>this.requestCook()}),this.addParm(`outputResolution`,{value:`input1`,params:{options:[{value:`input1`,label:`Use Input 1`},{value:`input2`,label:`Use Input 2`},{value:`largest`,label:`Largest Input`},{value:`smallest`,label:`Smallest Input`},{value:`custom`,label:`Custom`}]},displayName:`Output Resolution`,onChange:()=>this.requestCook()}),this.addParm(`customResolution`,{value:[512,512],params:{min:[1,1],max:[4096,4096],integer:!0},displayName:`Resolution`,hidden:()=>this.props.outputResolution.value!==`custom`,onChange:()=>this.requestCook()}),this.addParm(`fitMode`,{value:`fill`,params:{options:[{value:`fill`,label:`Fill (Crop)`},{value:`fit`,label:`Fit (Letterbox)`},{value:`stretch`,label:`Stretch`},{value:`native`,label:`Native (No Scale)`}]},displayName:`Fit Mode`,onChange:()=>this.requestCook()}),this.output=this.out(`image`),this.image1.onChange=()=>this.requestCook(),this.image2.onChange=()=>this.requestCook(),this.onReady=()=>this.requestCook()}blendBuffers(e,t,n,r){let a=e.width,o=e.height,s=i.rgba(a,o),c=e.channelCount>=4?e:e.toRGBA(),l=t.channelCount>=4?t:t.toRGBA(),u=c.channels[0],d=c.channels[1],f=c.channels[2],p=c.channels[3],m=l.channels[0],h=l.channels[1],g=l.channels[2],_=l.channels[3],v=s.channels[0],y=s.channels[1],b=s.channels[2],x=s.channels[3];for(let e=0;e<a*o;e++){let t=u[e],i=d[e],a=f[e],o=p[e],s=m[e],c=h[e],l=g[e],S=_[e],C,w,T;switch(n){case`normal`:C=s,w=c,T=l;break;case`multiply`:C=t*s,w=i*c,T=a*l;break;case`screen`:C=1-(1-t)*(1-s),w=1-(1-i)*(1-c),T=1-(1-a)*(1-l);break;case`overlay`:C=t<.5?2*t*s:1-2*(1-t)*(1-s),w=i<.5?2*i*c:1-2*(1-i)*(1-c),T=a<.5?2*a*l:1-2*(1-a)*(1-l);break;case`darken`:C=Math.min(t,s),w=Math.min(i,c),T=Math.min(a,l);break;case`lighten`:C=Math.max(t,s),w=Math.max(i,c),T=Math.max(a,l);break;case`color-dodge`:C=s===1?1:Math.min(1,t/(1-s)),w=c===1?1:Math.min(1,i/(1-c)),T=l===1?1:Math.min(1,a/(1-l));break;case`color-burn`:C=s===0?0:Math.max(0,1-(1-t)/s),w=c===0?0:Math.max(0,1-(1-i)/c),T=l===0?0:Math.max(0,1-(1-a)/l);break;case`hard-light`:C=s<.5?2*t*s:1-2*(1-t)*(1-s),w=c<.5?2*i*c:1-2*(1-i)*(1-c),T=l<.5?2*a*l:1-2*(1-a)*(1-l);break;case`soft-light`:C=s<.5?t-(1-2*s)*t*(1-t):t+(2*s-1)*(Math.sqrt(t)-t),w=c<.5?i-(1-2*c)*i*(1-i):i+(2*c-1)*(Math.sqrt(i)-i),T=l<.5?a-(1-2*l)*a*(1-a):a+(2*l-1)*(Math.sqrt(a)-a);break;case`difference`:C=Math.abs(t-s),w=Math.abs(i-c),T=Math.abs(a-l);break;case`exclusion`:C=t+s-2*t*s,w=i+c-2*i*c,T=a+l-2*a*l;break;case`add`:C=Math.min(1,t+s),w=Math.min(1,i+c),T=Math.min(1,a+l);break;case`subtract`:C=Math.max(0,t-s),w=Math.max(0,i-c),T=Math.max(0,a-l);break;case`divide`:C=s===0?1:Math.min(1,t/s),w=c===0?1:Math.min(1,i/c),T=l===0?1:Math.min(1,a/l);break;case`pin-light`:C=s<.5?Math.min(t,2*s):Math.max(t,2*(s-.5)),w=c<.5?Math.min(i,2*c):Math.max(i,2*(c-.5)),T=l<.5?Math.min(a,2*l):Math.max(a,2*(l-.5));break;case`vivid-light`:C=s<.5?s===0?0:1-(1-t)/(2*s):s===1?1:t/(2*(1-s)),w=c<.5?c===0?0:1-(1-i)/(2*c):c===1?1:i/(2*(1-c)),T=l<.5?l===0?0:1-(1-a)/(2*l):l===1?1:a/(2*(1-l));break;case`linear-dodge`:C=Math.min(1,t+s),w=Math.min(1,i+c),T=Math.min(1,a+l);break;case`linear-burn`:C=Math.max(0,t+s-1),w=Math.max(0,i+c-1),T=Math.max(0,a+l-1);break;default:C=s,w=c,T=l}v[e]=t+(C-t)*r*S,y[e]=i+(w-i)*r*S,b[e]=a+(T-a)*r*S,x[e]=o+(S-o)*r}return s}render(){let e=this.props.outputResolution.value,t=this.props.fitMode.value,n=this.props.customResolution.value,{buffers:r}=this.prepareInputs([this.image1.value,this.image2.value],e,t,n),[i,a]=r;if(!i||!a)return;let o=this.props.blendMode.value,s=this.props.opacity.value;try{let e=this.blendBuffers(i,a,o,s);this.setOutput(this.output,e)}catch(e){console.error(`Composite render error:`,e),this.error=e}}},f=class extends c{constructor(e,t){super(e,`Checkers`,t)}setup(){this.addParm(`color1`,{value:{r:1,g:1,b:1},type:`color`,displayName:`Color 1`,onChange:()=>this.requestCook()}),this.addParm(`color2`,{value:{r:0,g:0,b:0},type:`color`,displayName:`Color 2`,onChange:()=>this.requestCook()}),this.addParm(`mode`,{value:`size`,params:{options:[{value:`size`,label:`Size`},{value:`divisions`,label:`Divisions`}]},displayName:`Mode`,onChange:()=>this.requestCook()}),this.addParm(`size`,{value:32,params:{min:1,max:512,step:.1},displayName:`Size`,hidden:()=>this.props.mode.value!==`size`,onChange:()=>this.requestCook()}),this.addParm(`divisions`,{value:16,params:{min:1,max:512,step:1,integer:!0},displayName:`Divisions`,hidden:()=>this.props.mode.value!==`divisions`,onChange:()=>this.requestCook()}),this.addParm(`centered`,{value:!1,type:`boolean`,displayName:`Centered`,onChange:()=>this.requestCook()}),this.addResolutionParm(),this.output=this.out(`image`),this.onReady=()=>this.requestCook()}render(){let[e,t]=this.getResolution(),n=this.props.mode.value,r=o(this.props.color1.value),a=o(this.props.color2.value),s=this.props.centered.value,c;c=n===`size`?this.props.size.value:e/this.props.divisions.value;let l=0,u=0;s&&(l=e/2%c-c/2,u=t/2%c-c/2);let d=i.rgba(e,t),f=d.r(),p=d.g(),m=d.b(),h=d.a();for(let n=0;n<t;n++)for(let t=0;t<e;t++){let i=n*e+t,o=(Math.floor((t-l)/c)+Math.floor((n-u)/c))%2==0?r:a;f[i]=o.r,p[i]=o.g,m[i]=o.b,h[i]=o.a}d.markDirty(),this.setOutput(this.output,d)}},p=class extends c{constructor(e,t){super(e,`Resize`,t)}setup(){this.image=this.in(`image`,null),this.addParm(`mode`,{value:`scale`,params:{options:[{value:`scale`,label:`Scale`},{value:`fixed`,label:`Fixed`}]},displayName:`Mode`,onChange:()=>this.requestCook()}),this.addParm(`scale`,{value:1,params:{min:.1,max:10,step:.1},displayName:`Scale`,hidden:()=>this.props.mode.value!==`scale`,onChange:()=>this.requestCook()}),this.addParm(`width`,{value:512,params:{min:1,max:4096,step:1},displayName:`Width`,hidden:()=>this.props.mode.value!==`fixed`,onChange:()=>this.requestCook()}),this.addParm(`height`,{value:512,params:{min:1,max:4096,step:1},displayName:`Height`,hidden:()=>this.props.mode.value!==`fixed`,onChange:()=>this.requestCook()}),this.output=this.out(`image`),this.image.onChange=()=>this.requestCook(),this.onReady=()=>this.requestCook()}resizeBuffer(e,t,n){let r=i.rgba(t,n),a=e.width/t,o=e.height/n;for(let i=0;i<Math.min(e.channelCount,4);i++){let s=r.channels[i];for(let r=0;r<n;r++)for(let n=0;n<t;n++){let c=n*a,l=r*o;s[r*t+n]=e.sample(c,l,i)}}return e.channelCount<4&&r.fill(3,1),r}render(){let e=this.toImageBuffer(this.image.value);if(!e)return;let t,n;if(this.props.mode.value===`scale`){let r=this.props.scale.value;t=Math.round(e.width*r),n=Math.round(e.height*r)}else t=this.props.width.value,n=this.props.height.value;let r=this.resizeBuffer(e,t,n);this.setOutput(this.output,r)}},m=class extends c{constructor(e,t){super(e,`NormalMap`,t)}setup(){this.image=this.in(`image`,null),this.addParm(`scale`,{value:1,params:{min:0,max:10,step:.1},displayName:`Scale`,onChange:()=>this.requestCook()}),this.addParm(`flipX`,{value:!1,type:`boolean`,displayName:`Flip X`,onChange:()=>this.requestCook()}),this.addParm(`flipY`,{value:!1,type:`boolean`,displayName:`Flip Y`,onChange:()=>this.requestCook()}),this.output=this.out(`image`),this.image.onChange=()=>this.requestCook(),this.onReady=()=>this.requestCook()}computeNormalMap(e,t,n,r){let{width:a,height:o}=e,s=i.rgba(a,o),c=e.channels[0],l=s.channels[0],u=s.channels[1],d=s.channels[2],f=s.channels[3];for(let e=0;e<o;e++)for(let i=0;i<a;i++){let s=e*a+i,p=c[s],m=c[Math.min(i+1,a-1)+e*a],h=c[i+Math.min(e+1,o-1)*a],g=(m-p)*t,_=(h-p)*t,v=n?-g:g,y=r?-_:_,b=-v,x=-y,S=Math.sqrt(b*b+x*x+1),C=b/S,w=x/S,T=1/S;l[s]=C*.5+.5,u[s]=w*.5+.5,d[s]=T*.5+.5,f[s]=1}return s}render(){let e=this.toImageBuffer(this.image.value);if(!e)return;let t=this.props.scale.value,n=this.props.flipX.value,r=this.props.flipY.value,i=this.computeNormalMap(e,t,n,r);this.setOutput(this.output,i)}},h=class extends c{constructor(e,t){super(e,`Ramp`,t)}setup(){this.addParm(`type`,{value:`horizontal`,params:{options:[{value:`horizontal`,label:`Horizontal`},{value:`vertical`,label:`Vertical`},{value:`radial`,label:`Radial`},{value:`concentric`,label:`Concentric`}]},displayName:`Type`,onChange:()=>this.requestCook()}),this.addParm(`points`,{value:[{position:0,color:{r:0,g:0,b:0},interpolation:`linear`},{position:1,color:{r:1,g:1,b:1},interpolation:`linear`}],type:`colorramp`,displayName:`Ramp`,onChange:()=>this.requestCook()}),this.addResolutionParm(),this.output=this.out(`image`),this.onReady=()=>this.requestCook()}normalizeRampColor(e){if(typeof e==`object`&&e&&`r`in e&&`g`in e&&`b`in e){let t=e.r<=1&&e.g<=1&&e.b<=1;return{r:t?e.r:e.r/255,g:t?e.g:e.g/255,b:t?e.b:e.b/255,a:e.a===void 0?1:t?e.a:e.a/255}}if(Array.isArray(e)){let t=e.every(e=>e<=1);return{r:t?e[0]:e[0]/255,g:t?e[1]:e[1]/255,b:t?e[2]:e[2]/255,a:e[3]===void 0?1:t?e[3]:e[3]/255}}if(typeof e==`string`){let t=e.match(/rgb\s*\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)\s*\)/);if(t)return{r:parseInt(t[1],10)/255,g:parseInt(t[2],10)/255,b:parseInt(t[3],10)/255,a:1};let n=e.replace(`#`,``);if(n.length===3||n.length===6){let e=n.length===3?n.split(``).map(e=>e+e).join(``):n,t=/^([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(e);if(t)return{r:parseInt(t[1],16)/255,g:parseInt(t[2],16)/255,b:parseInt(t[3],16)/255,a:1}}}return{r:0,g:0,b:0,a:1}}interpolateColor(e,t,n,r){return r===`constant`?n<.5?e:t:(r===`smooth`&&(n=n*n*(3-2*n)),{r:e.r+(t.r-e.r)*n,g:e.g+(t.g-e.g)*n,b:e.b+(t.b-e.b)*n,a:(e.a??1)+((t.a??1)-(e.a??1))*n})}getColorAtPosition(e,t){let n=[...e].sort((e,t)=>e.position-t.position);t=Math.max(0,Math.min(1,t));let r=null,i=null;for(let e=0;e<n.length;e++)if(n[e].position<=t&&(r=n[e]),n[e].position>=t&&!i){i=n[e];break}if(!r&&i)return this.normalizeRampColor(i.color);if(r&&!i)return this.normalizeRampColor(r.color);if(!r&&!i)return{r:0,g:0,b:0,a:1};if(r.position===t)return this.normalizeRampColor(r.color);if(i.position===t)return this.normalizeRampColor(i.color);let a=(t-r.position)/(i.position-r.position),o=this.normalizeRampColor(r.color),s=this.normalizeRampColor(i.color),c=i.interpolation||`linear`;return this.interpolateColor(o,s,a,c)}render(){let[e,t]=this.getResolution(),n=this.props.type.value,r=this.props.points.value||[];if(r.length===0)return;let a=i.rgba(e,t),o=a.r(),s=a.g(),c=a.b(),l=a.a(),u=e/2,d=t/2,f=Math.sqrt(u*u+d*d);for(let i=0;i<t;i++)for(let a=0;a<e;a++){let p=0;if(n===`horizontal`)p=a/e;else if(n===`vertical`)p=i/t;else if(n===`radial`){let e=a-u,t=i-d;p=(Math.atan2(t,e)+Math.PI)/(2*Math.PI)}else if(n===`concentric`){let e=a-u,t=i-d;p=Math.sqrt(e*e+t*t)/f}let m=this.getColorAtPosition(r,p),h=i*e+a;o[h]=m.r,s[h]=m.g,c[h]=m.b,l[h]=m.a??1}a.markDirty(),this.setOutput(this.output,a)}},g=class extends c{constructor(e,t){super(e,`Noise`,t),this.noise2D=null,this.currentSeed=null}setup(){this.addParm(`seed`,{value:0,params:{min:0,max:1e4,step:1,integer:!0},displayName:`Seed`,onChange:()=>{this.initNoise().then(()=>{this.noise2D&&this.requestCook()})}}),this.addParm(`scale`,{value:.01,params:{min:.001,max:1,step:.001},displayName:`Scale`,onChange:()=>this.requestCook()}),this.addParm(`iterations`,{value:4,params:{min:1,max:8,step:1,integer:!0},displayName:`Iterations`,onChange:()=>this.requestCook()}),this.addResolutionParm(),this.output=this.out(`image`),this.onReady=async()=>{await this.initNoise(),this.noise2D&&this.requestCook()}}async initNoise(){try{let{createNoise2D:e}=await this.require(`simplex-noise`),t=this.props.seed.value,n=t;function r(){return n=(n*9301+49297)%233280,n/233280}this.noise2D=e(r),this.currentSeed=t}catch(e){console.error(`Failed to load simplex-noise:`,e),this.error=e}}render(){if(!this.noise2D){this.initNoise().then(()=>{this.noise2D&&this.requestCook()});return}let[e,t]=this.getResolution(),n=this.props.scale.value,r=this.props.iterations.value;if(this.props.seed.value!==this.currentSeed){this.initNoise().then(()=>{this.noise2D&&this.requestCook()});return}let a=i.grayscale(e,t),o=a.r();for(let i=0;i<t;i++)for(let t=0;t<e;t++){let a=0,s=1,c=n,l=0;for(let e=0;e<r;e++){let e=t*c,n=i*c,r=this.noise2D(e,n);a+=r*s,l+=s,s*=.5,c*=2}a=(a/l+1)*.5,o[i*e+t]=a}a.markDirty(),this.setOutput(this.output,a)}},_=class extends c{constructor(e,t){super(e,`Blur`,t)}setup(){this.image=this.in(`image`,null),this.addParm(`method`,{value:`box`,params:{options:[{value:`box`,label:`Box (Fast)`},{value:`gaussian`,label:`Gaussian (Accurate)`}]},displayName:`Method`,onChange:()=>this.requestCook()}),this.addParm(`radius`,{value:5,params:{min:0,max:100,step:.1},displayName:`Radius`,onChange:()=>this.requestCook()}),this.addParm(`wrapEdges`,{value:!1,type:`boolean`,displayName:`Wrap Edges`,onChange:()=>this.requestCook()}),this.output=this.out(`image`),this.image.onChange=()=>this.requestCook(),this.onReady=()=>this.requestCook()}boxBlur(e,t,n){if(t<=0)return e.clone();let{width:r,height:i}=e,a=t,o=this.boxesForGauss(a,3),s=e.emptyClone();for(let t=0;t<e.channelCount;t++){let a=new Float32Array(e.channels[t]);for(let e of o)this.boxBlurPass(a,r,i,e,n);s.channels[t].set(a)}return s}boxesForGauss(e,t){let n=Math.sqrt(12*e*e/t+1),r=Math.floor(n);r%2==0&&r--;let i=r+2,a=(12*e*e-t*r*r-4*t*r-3*t)/(-4*r-4),o=Math.round(a),s=[];for(let e=0;e<t;e++)s.push(e<o?r:i);return s.map(e=>(e-1)/2)}boxBlurPass(e,t,n,r,i){if(r<1)return;let a=new Float32Array(t*n),o=Math.floor(r),s=1/(o*2+1);for(let r=0;r<n;r++){let n=r*t,c=0;for(let r=-o;r<=o;r++){let a=i?(r%t+t)%t:Math.max(0,Math.min(t-1,r));c+=e[n+a]}a[n]=c*s;for(let r=1;r<t;r++){let l=i?((r-o-1)%t+t)%t:Math.max(0,r-o-1),u=i?((r+o)%t+t)%t:Math.min(t-1,r+o);c-=e[n+l],c+=e[n+u],a[n+r]=c*s}}for(let r=0;r<t;r++){let c=0;for(let e=-o;e<=o;e++){let o=i?(e%n+n)%n:Math.max(0,Math.min(n-1,e));c+=a[o*t+r]}e[r]=c*s;for(let l=1;l<n;l++){let u=i?((l-o-1)%n+n)%n:Math.max(0,l-o-1),d=i?((l+o)%n+n)%n:Math.min(n-1,l+o);c-=a[u*t+r],c+=a[d*t+r],e[l*t+r]=c*s}}}trueGaussianBlur(e,t,n){if(t<=0)return e.clone();let{width:r,height:i}=e,a=e.emptyClone(),o=Math.ceil(t*3)*2+1,s=new Float32Array(o),c=t/3,l=2*c*c,u=0,d=o-1>>1;for(let e=0;e<o;e++){let t=e-d,n=Math.exp(-(t*t)/l);s[e]=n,u+=n}let f=1/u;for(let e=0;e<o;e++)s[e]*=f;let p=n?e=>(e%r+r)%r:e=>e<0?0:e>=r?r-1:e,m=n?e=>(e%i+i)%i:e=>e<0?0:e>=i?i-1:e;for(let t=0;t<e.channelCount;t++){let n=e.channels[t],c=a.channels[t],l=new Float32Array(r*i);for(let e=0;e<i;e++){let t=e*r;for(let e=0;e<r;e++){let r=0;for(let i=0;i<o;i++){let a=p(e+i-d);r+=n[t+a]*s[i]}l[t+e]=r}}for(let e=0;e<r;e++)for(let t=0;t<i;t++){let n=0;for(let i=0;i<o;i++){let a=m(t+i-d);n+=l[a*r+e]*s[i]}c[t*r+e]=n}}return a}render(){let e=this.toImageBuffer(this.image.value);if(!e)return;let t=this.props.method.value,n=this.props.radius.value,r=this.props.wrapEdges.value,i=t===`gaussian`?this.trueGaussianBlur(e,n,r):this.boxBlur(e,n,r);this.setOutput(this.output,i)}},v=class extends c{constructor(e,t){super(e,`Text`,t)}setup(){this.addParm(`text`,{value:`Hello, World!`,type:`textarea`,displayName:`Text`}),this.addParm(`font`,{value:`Inter, system-ui, sans-serif`,type:`text`,displayName:`Font`}),this.addParm(`fontSize`,{value:48,type:`slider`,params:{min:1,max:500,step:1},displayName:`Font Size`}),this.addParm(`fontWeight`,{value:`normal`,type:`select`,params:{options:[{value:`normal`,label:`Normal`},{value:`bold`,label:`Bold`},{value:`100`,label:`Thin (100)`},{value:`200`,label:`Extra Light (200)`},{value:`300`,label:`Light (300)`},{value:`500`,label:`Medium (500)`},{value:`600`,label:`Semi Bold (600)`},{value:`700`,label:`Bold (700)`},{value:`800`,label:`Extra Bold (800)`},{value:`900`,label:`Black (900)`}]},displayName:`Font Weight`}),this.addParm(`fontStyle`,{value:`normal`,type:`select`,params:{options:[{value:`normal`,label:`Normal`},{value:`italic`,label:`Italic`},{value:`oblique`,label:`Oblique`}]},displayName:`Font Style`}),this.addParm(`alignH`,{value:`center`,type:`select`,params:{options:[{value:`left`,label:`Left`},{value:`center`,label:`Center`},{value:`right`,label:`Right`}]},displayName:`Horizontal Align`}),this.addParm(`alignV`,{value:`middle`,type:`select`,params:{options:[{value:`top`,label:`Top`},{value:`middle`,label:`Middle`},{value:`bottom`,label:`Bottom`}]},displayName:`Vertical Align`}),this.addParm(`color`,{value:{r:1,g:1,b:1},type:`color`,displayName:`Color`}),this.addParm(`backgroundColor`,{value:{r:0,g:0,b:0,a:0},type:`color`,displayName:`Background`}),this.addResolutionParm(),this.addParm(`offset`,{value:[0,0],params:{min:[-2048,-2048],max:[2048,2048],step:1},displayName:`Offset`}),this.addParm(`rotation`,{value:0,type:`slider`,params:{min:-180,max:180,step:.1},displayName:`Rotation`}),this.addParm(`letterSpacing`,{value:0,type:`slider`,params:{min:-50,max:100,step:.5},displayName:`Letter Spacing`}),this.addParm(`lineHeight`,{value:1.2,type:`slider`,params:{min:.5,max:3,step:.05},displayName:`Line Height`}),this.addParm(`opacity`,{value:1,type:`slider`,params:{min:0,max:1,step:.01},displayName:`Opacity`}),this.output=this.out(`image`),[`text`,`font`,`fontSize`,`fontWeight`,`fontStyle`,`alignH`,`alignV`,`color`,`backgroundColor`,`offset`,`rotation`,`letterSpacing`,`lineHeight`,`opacity`].forEach(e=>this.watchProp(e,()=>this.requestCook())),this.onReady=()=>this.requestCook()}render(){let[e,t]=this.getResolution(),n=this.props.text.value,a=this.props.font.value,c=this.props.fontSize.value,l=this.props.fontWeight.value,u=this.props.fontStyle.value,d=this.props.alignH.value,f=this.props.alignV.value,p=o(this.props.color.value),m=o(this.props.backgroundColor.value),[h,g]=this.props.offset.value,_=this.props.rotation.value,v=this.props.letterSpacing.value,y=this.props.lineHeight.value,b=this.props.opacity.value,x=s(e,t),S=x.getContext(`2d`);if(!S){this.setOutput(this.output,i.rgba(e,t));return}m.a>0?(S.fillStyle=r(m),S.fillRect(0,0,e,t)):S.clearRect(0,0,e,t),S.save(),S.globalAlpha=b,S.font=`${u} ${l} ${c}px ${a}`,S.fillStyle=r(p);let C=n.split(`
-`),w=c*y,T=C.length*w,E,D;switch(d){case`left`:S.textAlign=`left`,E=0;break;case`right`:S.textAlign=`right`,E=e;break;default:S.textAlign=`center`,E=e/2}switch(f){case`top`:D=c;break;case`bottom`:D=t-T+c;break;default:D=(t-T)/2+c}if(E+=h,D+=g,_!==0){let e=_*Math.PI/180;S.translate(E,D-c/2+T/2),S.rotate(e),S.translate(-E,-(D-c/2+T/2))}if(v!==0){S.textAlign=`left`;for(let e=0;e<C.length;e++){let t=C[e],n=D+e*w,r=0;for(let e of t)r+=S.measureText(e).width+v;r-=v;let i;switch(d){case`left`:i=E;break;case`right`:i=E-r;break;default:i=E-r/2}for(let e of t)S.fillText(e,i,n),i+=S.measureText(e).width+v}}else for(let e=0;e<C.length;e++){let t=D+e*w;S.fillText(C[e],E,t)}S.restore();let O=i.fromCanvas(x);this.setOutput(this.output,O)}},y=class extends c{constructor(e,t){super(e,`Transform`,t)}setup(){this.imageInput=this.in(`image`,null),this.addParm(`translate`,{value:[0,0],params:{min:[-2048,-2048],max:[2048,2048],step:1},displayName:`Translate`,onChange:()=>this.requestCook()}),this.addParm(`rotation`,{value:0,params:{min:-180,max:180,step:.1},displayName:`Rotation`,onChange:()=>this.requestCook()}),this.addParm(`scale`,{value:[1,1],params:{min:[.01,.01],max:[10,10],step:.01},displayName:`Scale`,onChange:()=>this.requestCook()}),this.addParm(`uniformScale`,{value:!0,type:`boolean`,displayName:`Uniform Scale`,onChange:()=>this.requestCook()}),this.addParm(`pivot`,{value:`center`,params:{options:[{value:`center`,label:`Center`},{value:`top-left`,label:`Top Left`},{value:`top-right`,label:`Top Right`},{value:`bottom-left`,label:`Bottom Left`},{value:`bottom-right`,label:`Bottom Right`},{value:`custom`,label:`Custom`}]},displayName:`Pivot`,onChange:()=>this.requestCook()}),this.addParm(`customPivot`,{value:[.5,.5],params:{min:[0,0],max:[1,1],step:.01},displayName:`Custom Pivot`,hidden:()=>this.props.pivot.value!==`custom`,onChange:()=>this.requestCook()}),this.addParm(`filter`,{value:`bilinear`,params:{options:[{value:`nearest`,label:`Nearest`},{value:`bilinear`,label:`Bilinear`}]},displayName:`Filter`,onChange:()=>this.requestCook()}),this.addParm(`wrap`,{value:`clamp`,params:{options:[{value:`clamp`,label:`Clamp`},{value:`repeat`,label:`Repeat`},{value:`mirror`,label:`Mirror`},{value:`transparent`,label:`Transparent`}]},displayName:`Wrap Mode`,onChange:()=>this.requestCook()}),this.output=this.out(`image`),this.imageInput.onChange=()=>this.requestCook(),this.onReady=()=>this.requestCook()}getPivotPoint(e,t){switch(this.props.pivot.value){case`center`:return[e/2,t/2];case`top-left`:return[0,0];case`top-right`:return[e,0];case`bottom-left`:return[0,t];case`bottom-right`:return[e,t];case`custom`:let[n,r]=this.props.customPivot.value;return[n*e,r*t];default:return[e/2,t/2]}}wrapCoord(e,t,n){if(n===`clamp`)return Math.max(0,Math.min(t-1,e));if(n===`repeat`)return e%=t,e<0&&(e+=t),e;if(n===`mirror`){let n=t*2;return e=Math.abs(e%n),e>=t&&(e=n-e-1),Math.max(0,Math.min(t-1,e))}return e}render(){let e=this.toImageBuffer(this.imageInput.value);if(!e)return;let t=e.width,n=e.height,[r,a]=this.props.translate.value,o=this.props.rotation.value*Math.PI/180,[s,c]=this.props.scale.value,l=this.props.uniformScale.value,u=this.props.filter.value,d=this.props.wrap.value;l&&(c=s);let[f,p]=this.getPivotPoint(t,n),m=Math.cos(-o),h=Math.sin(-o),g=1/s,_=1/c,v=i.rgba(t,n),y=Math.min(e.channelCount,4);for(let i=0;i<n;i++)for(let o=0;o<t;o++){let s=o-f-r,c=i-p-a,l=s*m-c*h,b=s*h+c*m,x=l*g+f,S=b*_+p;if(d===`transparent`&&(x<0||x>=t||S<0||S>=n)){let e=i*t+o;for(let t=0;t<4;t++)v.channels[t][e]=0;continue}let C=i*t+o;if(u===`nearest`){let r=Math.round(x),i=Math.round(S),a=this.wrapCoord(r,t,d),o=this.wrapCoord(i,n,d)*t+a;for(let t=0;t<y;t++)v.channels[t][C]=e.channels[t][o];y<4&&(v.channels[3][C]=1)}else{let r=Math.floor(x),i=Math.floor(S),a=r+1,o=i+1,s=x-r,c=S-i,l=this.wrapCoord(r,t,d),u=this.wrapCoord(a,t,d),f=this.wrapCoord(i,n,d),p=this.wrapCoord(o,n,d),m=f*t+l,h=f*t+u,g=p*t+l,_=p*t+u;for(let t=0;t<y;t++){let n=e.channels[t][m],r=e.channels[t][h],i=e.channels[t][g],a=e.channels[t][_],o=n+(r-n)*s,l=i+(a-i)*s;v.channels[t][C]=o+(l-o)*c}y<4&&(v.channels[3][C]=1)}}v.markDirty(),this.setOutput(this.output,v)}},b={Color:l,Image:u,Composite:d,Checkers:f,Resize:p,NormalMap:m,Ramp:h,Noise:g,Blur:_,Text:v,Transform:y},x=`/**
- * ColorNode - creates a solid color ImageBuffer
- */
-
-import { ImageNodeBase, ImageBuffer } from '../ImageNodeBase';
-import type { Graph } from '@/nodes/Graph';
-import type { OutputPort } from '@/types/node.types';
-import { normalizeColor } from '@/utils/colorUtils';
-
-export class ColorNode extends ImageNodeBase {
-  private output!: OutputPort<ImageBuffer>;
-
-  constructor(id: string, graph: Graph) {
-    super(id, 'Color', graph);
-  }
-
-  protected setup(): void {
-    this.addParm('color', {
-      value: { r: 1.0, g: 1.0, b: 1.0 },
-      type: 'color',
-      displayName: 'Color'
-    });
-
-    this.addResolutionParm();
-
-    this.output = this.out('image');
-
-    this.watchProp('color', () => this.requestCook());
-
-    this.onReady = () => this.requestCook();
-  }
-
-  protected render(): void {
-    const [width, height] = this.getResolution();
-    const color = normalizeColor(this.props.color.value);
-
-    const buffer = ImageBuffer.solid(width, height, color);
-    this.setOutput(this.output, buffer);
-  }
-}
-`,S=`/**
- * ImageNode - loads an image file or accepts image input
- * Converts to ImageBuffer for the processing pipeline
- */
-
-import { ImageNodeBase, ImageBuffer } from '../ImageNodeBase';
-import type { Graph } from '@/nodes/Graph';
-import type { InputPort, OutputPort } from '@/types/node.types';
-import { decodeImage } from '../surface.js';
-import type { ImageSourceLike } from '../ImageBuffer';
-
-type ImageInputValue = ImageSourceLike | ImageBuffer | string | null;
-
-export class ImageNode extends ImageNodeBase {
-  private imageInput!: InputPort<ImageInputValue>;
-  private output!: OutputPort<ImageBuffer>;
-
-  constructor(id: string, graph: Graph) {
-    super(id, 'File', graph);
-  }
-
-  protected setup(): void {
-    this.imageInput = this.in<ImageInputValue>('image', null);
-
-    this.addParm('file', {
-      value: '',
-      type: 'image',
-      params: {
-        accept: 'image/*'
-      },
-      displayName: 'File',
-      onChange: () => {
-        if (this.props.file.value && !this.imageInput.value) {
-          this.requestCook();
-        }
-      }
-    });
-
-    this.addParm('resolutionMode', {
-      value: 'original',
-      params: {
-        options: [
-          { value: 'original', label: 'Original' },
-          { value: 'max', label: 'Max Resolution' },
-          { value: 'fixed', label: 'Fixed Resolution' }
-        ]
-      },
-      displayName: 'Resolution Mode',
-      onChange: () => {
-        if (this.props.file.value || this.imageInput.value) {
-          this.requestCook();
-        }
-      }
-    });
-
-    this.addParm('maxResolution', {
-      value: [2048, 2048],
-      params: {
-        min: [1, 1],
-        max: [4096, 4096]
-      },
-      displayName: 'Max Resolution',
-      hidden: () => this.props.resolutionMode.value !== 'max',
-      onChange: () => {
-        if ((this.props.file.value || this.imageInput.value) && this.props.resolutionMode.value === 'max') {
-          this.requestCook();
-        }
-      }
-    });
-
-    this.addParm('fixedResolution', {
-      value: [512, 512],
-      params: {
-        min: [1, 1],
-        max: [4096, 4096]
-      },
-      displayName: 'Fixed Resolution',
-      hidden: () => this.props.resolutionMode.value !== 'fixed',
-      onChange: () => {
-        if ((this.props.file.value || this.imageInput.value) && this.props.resolutionMode.value === 'fixed') {
-          this.requestCook();
-        }
-      }
-    });
-
-    this.output = this.out('image');
-
-    this.imageInput.onChange = () => this.requestCook();
-
-    this.onReady = () => {
-      if (this.props.file.value || this.imageInput.value) {
-        this.requestCook();
-      }
-    };
-  }
-
-  protected async render(): Promise<void> {
-    let sourceBuffer: ImageBuffer | null = null;
-
-    // The shared decoder awaits both browser and headless image loads.
-    if (this.imageInput.value) {
-      if (this.imageInput.value instanceof ImageBuffer) {
-        sourceBuffer = this.imageInput.value;
-      } else if (typeof this.imageInput.value === 'string') {
-        sourceBuffer = ImageBuffer.fromCanvas(await decodeImage(this.imageInput.value));
-      } else {
-        sourceBuffer = ImageBuffer.fromCanvas(this.imageInput.value);
-      }
-    } else if (this.props.file.value) {
-      sourceBuffer = ImageBuffer.fromCanvas(await decodeImage(this.props.file.value as string));
-    }
-
-    if (!sourceBuffer) {
-      return;
-    }
-
-    try {
-      const mode = this.props.resolutionMode.value;
-      let outputBuffer: ImageBuffer;
-
-      if (mode === 'original') {
-        outputBuffer = sourceBuffer;
-      } else if (mode === 'max') {
-        const [maxWidth, maxHeight] = this.props.maxResolution.value;
-        const aspectRatio = sourceBuffer.width / sourceBuffer.height;
-        let newWidth = sourceBuffer.width;
-        let newHeight = sourceBuffer.height;
-
-        if (newWidth > maxWidth) {
-          newWidth = maxWidth;
-          newHeight = maxWidth / aspectRatio;
-        }
-        if (newHeight > maxHeight) {
-          newHeight = maxHeight;
-          newWidth = maxHeight * aspectRatio;
-        }
-
-        newWidth = Math.round(newWidth);
-        newHeight = Math.round(newHeight);
-
-        if (newWidth !== sourceBuffer.width || newHeight !== sourceBuffer.height) {
-          outputBuffer = this.resizeBuffer(sourceBuffer, newWidth, newHeight);
-        } else {
-          outputBuffer = sourceBuffer;
-        }
-      } else {
-        const [width, height] = this.props.fixedResolution.value;
-        outputBuffer = this.resizeBuffer(sourceBuffer, width, height);
-      }
-
-      this.setOutput(this.output, outputBuffer);
-    } catch (error) {
-      this.error = error as Error;
-      console.error('Failed to process image:', error);
-    }
-  }
-
-  private resizeBuffer(source: ImageBuffer, newWidth: number, newHeight: number): ImageBuffer {
-    const result = ImageBuffer.rgba(newWidth, newHeight);
-    const scaleX = source.width / newWidth;
-    const scaleY = source.height / newHeight;
-
-    for (let c = 0; c < Math.min(source.channelCount, 4); c++) {
-      const dstChannel = result.channels[c];
-
-      for (let y = 0; y < newHeight; y++) {
-        for (let x = 0; x < newWidth; x++) {
-          const srcX = x * scaleX;
-          const srcY = y * scaleY;
-          dstChannel[y * newWidth + x] = source.sample(srcX, srcY, c);
-        }
-      }
-    }
-
-    if (source.channelCount < 4) {
-      result.fill(3, 1);
-    }
-
-    return result;
-  }
-}
-`,C=`/**
- * CompositeNode - blends two ImageBuffers together
- * Supports resolution control similar to TouchDesigner TOPs
- */
-
-import { ImageNodeBase, ImageBuffer, type ImageInput, type ResolutionMode, type FitMode } from '../ImageNodeBase';
-import type { Graph } from '@/nodes/Graph';
-import type { InputPort, OutputPort } from '@/types/node.types';
-
-export class CompositeNode extends ImageNodeBase {
-  private image1!: InputPort<ImageInput>;
-  private image2!: InputPort<ImageInput>;
-  private output!: OutputPort<ImageBuffer>;
-
-  constructor(id: string, graph: Graph) {
-    super(id, 'Composite', graph);
-  }
-
-  protected setup(): void {
-    this.image1 = this.in<ImageInput>('image1', null);
-    this.image2 = this.in<ImageInput>('image2', null);
-
-    this.addParm('blendMode', {
-      value: 'multiply',
-      params: {
-        options: [
-          { value: 'normal', label: 'Normal' },
-          { value: 'multiply', label: 'Multiply' },
-          { value: 'screen', label: 'Screen' },
-          { value: 'overlay', label: 'Overlay' },
-          { value: 'darken', label: 'Darken' },
-          { value: 'lighten', label: 'Lighten' },
-          { value: 'color-dodge', label: 'Color Dodge' },
-          { value: 'color-burn', label: 'Color Burn' },
-          { value: 'hard-light', label: 'Hard Light' },
-          { value: 'soft-light', label: 'Soft Light' },
-          { value: 'difference', label: 'Difference' },
-          { value: 'exclusion', label: 'Exclusion' },
-          { value: 'add', label: 'Add' },
-          { value: 'subtract', label: 'Subtract' },
-          { value: 'divide', label: 'Divide' },
-          { value: 'pin-light', label: 'Pin Light' },
-          { value: 'vivid-light', label: 'Vivid Light' },
-          { value: 'linear-dodge', label: 'Linear Dodge' },
-          { value: 'linear-burn', label: 'Linear Burn' }
-        ]
-      },
-      displayName: 'Blend Mode',
-      onChange: () => this.requestCook()
-    });
-
-    this.addParm('opacity', {
-      value: 1.0,
-      params: {
-        min: 0.0,
-        max: 1.0,
-        step: 0.01
-      },
-      displayName: 'Opacity',
-      onChange: () => this.requestCook()
-    });
-
-    // Resolution control - which input determines output size
-    this.addParm('outputResolution', {
-      value: 'input1',
-      params: {
-        options: [
-          { value: 'input1', label: 'Use Input 1' },
-          { value: 'input2', label: 'Use Input 2' },
-          { value: 'largest', label: 'Largest Input' },
-          { value: 'smallest', label: 'Smallest Input' },
-          { value: 'custom', label: 'Custom' }
-        ]
-      },
-      displayName: 'Output Resolution',
-      onChange: () => this.requestCook()
-    });
-
-    this.addParm('customResolution', {
-      value: [512, 512],
-      params: {
-        min: [1, 1],
-        max: [4096, 4096],
-        integer: true
-      },
-      displayName: 'Resolution',
-      hidden: () => this.props.outputResolution.value !== 'custom',
-      onChange: () => this.requestCook()
-    });
-
-    // How to fit inputs that don't match output resolution
-    this.addParm('fitMode', {
-      value: 'fill',
-      params: {
-        options: [
-          { value: 'fill', label: 'Fill (Crop)' },
-          { value: 'fit', label: 'Fit (Letterbox)' },
-          { value: 'stretch', label: 'Stretch' },
-          { value: 'native', label: 'Native (No Scale)' }
-        ]
-      },
-      displayName: 'Fit Mode',
-      onChange: () => this.requestCook()
-    });
-
-    this.output = this.out('image');
-
-    this.image1.onChange = () => this.requestCook();
-    this.image2.onChange = () => this.requestCook();
-
-    this.onReady = () => this.requestCook();
-  }
-
-  private blendBuffers(base: ImageBuffer, blend: ImageBuffer, mode: string, opacity: number): ImageBuffer {
-    const width = base.width;
-    const height = base.height;
-    const result = ImageBuffer.rgba(width, height);
-
-    // Ensure both have RGBA
-    const baseRGBA = base.channelCount >= 4 ? base : base.toRGBA();
-    const blendRGBA = blend.channelCount >= 4 ? blend : blend.toRGBA();
-
-    const r1 = baseRGBA.channels[0];
-    const g1 = baseRGBA.channels[1];
-    const b1 = baseRGBA.channels[2];
-    const a1 = baseRGBA.channels[3];
-
-    const r2 = blendRGBA.channels[0];
-    const g2 = blendRGBA.channels[1];
-    const b2 = blendRGBA.channels[2];
-    const a2 = blendRGBA.channels[3];
-
-    const rOut = result.channels[0];
-    const gOut = result.channels[1];
-    const bOut = result.channels[2];
-    const aOut = result.channels[3];
-
-    for (let i = 0; i < width * height; i++) {
-      const baseR = r1[i], baseG = g1[i], baseB = b1[i], baseA = a1[i];
-      const blendR = r2[i], blendG = g2[i], blendB = b2[i], blendA = a2[i];
-
-      let r: number, g: number, b: number;
-
-      switch (mode) {
-        case 'normal':
-          r = blendR; g = blendG; b = blendB;
-          break;
-        case 'multiply':
-          r = baseR * blendR; g = baseG * blendG; b = baseB * blendB;
-          break;
-        case 'screen':
-          r = 1 - (1 - baseR) * (1 - blendR);
-          g = 1 - (1 - baseG) * (1 - blendG);
-          b = 1 - (1 - baseB) * (1 - blendB);
-          break;
-        case 'overlay':
-          r = baseR < 0.5 ? 2 * baseR * blendR : 1 - 2 * (1 - baseR) * (1 - blendR);
-          g = baseG < 0.5 ? 2 * baseG * blendG : 1 - 2 * (1 - baseG) * (1 - blendG);
-          b = baseB < 0.5 ? 2 * baseB * blendB : 1 - 2 * (1 - baseB) * (1 - blendB);
-          break;
-        case 'darken':
-          r = Math.min(baseR, blendR); g = Math.min(baseG, blendG); b = Math.min(baseB, blendB);
-          break;
-        case 'lighten':
-          r = Math.max(baseR, blendR); g = Math.max(baseG, blendG); b = Math.max(baseB, blendB);
-          break;
-        case 'color-dodge':
-          r = blendR === 1 ? 1 : Math.min(1, baseR / (1 - blendR));
-          g = blendG === 1 ? 1 : Math.min(1, baseG / (1 - blendG));
-          b = blendB === 1 ? 1 : Math.min(1, baseB / (1 - blendB));
-          break;
-        case 'color-burn':
-          r = blendR === 0 ? 0 : Math.max(0, 1 - (1 - baseR) / blendR);
-          g = blendG === 0 ? 0 : Math.max(0, 1 - (1 - baseG) / blendG);
-          b = blendB === 0 ? 0 : Math.max(0, 1 - (1 - baseB) / blendB);
-          break;
-        case 'hard-light':
-          r = blendR < 0.5 ? 2 * baseR * blendR : 1 - 2 * (1 - baseR) * (1 - blendR);
-          g = blendG < 0.5 ? 2 * baseG * blendG : 1 - 2 * (1 - baseG) * (1 - blendG);
-          b = blendB < 0.5 ? 2 * baseB * blendB : 1 - 2 * (1 - baseB) * (1 - blendB);
-          break;
-        case 'soft-light':
-          r = blendR < 0.5 ? baseR - (1 - 2 * blendR) * baseR * (1 - baseR) : baseR + (2 * blendR - 1) * (Math.sqrt(baseR) - baseR);
-          g = blendG < 0.5 ? baseG - (1 - 2 * blendG) * baseG * (1 - baseG) : baseG + (2 * blendG - 1) * (Math.sqrt(baseG) - baseG);
-          b = blendB < 0.5 ? baseB - (1 - 2 * blendB) * baseB * (1 - baseB) : baseB + (2 * blendB - 1) * (Math.sqrt(baseB) - baseB);
-          break;
-        case 'difference':
-          r = Math.abs(baseR - blendR); g = Math.abs(baseG - blendG); b = Math.abs(baseB - blendB);
-          break;
-        case 'exclusion':
-          r = baseR + blendR - 2 * baseR * blendR;
-          g = baseG + blendG - 2 * baseG * blendG;
-          b = baseB + blendB - 2 * baseB * blendB;
-          break;
-        case 'add':
-          r = Math.min(1, baseR + blendR); g = Math.min(1, baseG + blendG); b = Math.min(1, baseB + blendB);
-          break;
-        case 'subtract':
-          r = Math.max(0, baseR - blendR); g = Math.max(0, baseG - blendG); b = Math.max(0, baseB - blendB);
-          break;
-        case 'divide':
-          r = blendR === 0 ? 1 : Math.min(1, baseR / blendR);
-          g = blendG === 0 ? 1 : Math.min(1, baseG / blendG);
-          b = blendB === 0 ? 1 : Math.min(1, baseB / blendB);
-          break;
-        case 'pin-light':
-          r = blendR < 0.5 ? Math.min(baseR, 2 * blendR) : Math.max(baseR, 2 * (blendR - 0.5));
-          g = blendG < 0.5 ? Math.min(baseG, 2 * blendG) : Math.max(baseG, 2 * (blendG - 0.5));
-          b = blendB < 0.5 ? Math.min(baseB, 2 * blendB) : Math.max(baseB, 2 * (blendB - 0.5));
-          break;
-        case 'vivid-light':
-          r = blendR < 0.5 ? (blendR === 0 ? 0 : 1 - (1 - baseR) / (2 * blendR)) : (blendR === 1 ? 1 : baseR / (2 * (1 - blendR)));
-          g = blendG < 0.5 ? (blendG === 0 ? 0 : 1 - (1 - baseG) / (2 * blendG)) : (blendG === 1 ? 1 : baseG / (2 * (1 - blendG)));
-          b = blendB < 0.5 ? (blendB === 0 ? 0 : 1 - (1 - baseB) / (2 * blendB)) : (blendB === 1 ? 1 : baseB / (2 * (1 - blendB)));
-          break;
-        case 'linear-dodge':
-          r = Math.min(1, baseR + blendR); g = Math.min(1, baseG + blendG); b = Math.min(1, baseB + blendB);
-          break;
-        case 'linear-burn':
-          r = Math.max(0, baseR + blendR - 1); g = Math.max(0, baseG + blendG - 1); b = Math.max(0, baseB + blendB - 1);
-          break;
-        default:
-          r = blendR; g = blendG; b = blendB;
-      }
-
-      // Apply opacity
-      rOut[i] = baseR + (r - baseR) * opacity * blendA;
-      gOut[i] = baseG + (g - baseG) * opacity * blendA;
-      bOut[i] = baseB + (b - baseB) * opacity * blendA;
-      aOut[i] = baseA + (blendA - baseA) * opacity;
-    }
-
-    return result;
-  }
-
-  protected render(): void {
-    // Get resolution settings
-    const resolutionMode = this.props.outputResolution.value as ResolutionMode;
-    const fitMode = this.props.fitMode.value as FitMode;
-    const customSize = this.props.customResolution.value as [number, number];
-
-    // Prepare inputs - handles resolution matching
-    const { buffers } = this.prepareInputs(
-      [this.image1.value, this.image2.value],
-      resolutionMode,
-      fitMode,
-      customSize
-    );
-
-    const [buf1, buf2] = buffers;
-
-    if (!buf1 || !buf2) {
-      return;
-    }
-
-    const blendMode = this.props.blendMode.value;
-    const opacity = this.props.opacity.value;
-
-    try {
-      const result = this.blendBuffers(buf1, buf2, blendMode, opacity);
-      this.setOutput(this.output, result);
-    } catch (error) {
-      console.error('Composite render error:', error);
-      this.error = error as Error;
-    }
-  }
-}
-`,w=`/**
- * CheckersNode - generates a checkerboard pattern as ImageBuffer
- */
-
-import { ImageNodeBase, ImageBuffer } from '../ImageNodeBase';
-import type { Graph } from '@/nodes/Graph';
-import type { OutputPort } from '@/types/node.types';
-import { normalizeColor } from '@/utils/colorUtils';
-
-export class CheckersNode extends ImageNodeBase {
-  private output!: OutputPort<ImageBuffer>;
-
-  constructor(id: string, graph: Graph) {
-    super(id, 'Checkers', graph);
-  }
-
-  protected setup(): void {
-    this.addParm('color1', {
-      value: { r: 1.0, g: 1.0, b: 1.0 },
-      type: 'color',
-      displayName: 'Color 1',
-      onChange: () => this.requestCook()
-    });
-
-    this.addParm('color2', {
-      value: { r: 0.0, g: 0.0, b: 0.0 },
-      type: 'color',
-      displayName: 'Color 2',
-      onChange: () => this.requestCook()
-    });
-
-    this.addParm('mode', {
-      value: 'size',
-      params: {
-        options: [
-          { value: 'size', label: 'Size' },
-          { value: 'divisions', label: 'Divisions' }
-        ]
-      },
-      displayName: 'Mode',
-      onChange: () => this.requestCook()
-    });
-
-    this.addParm('size', {
-      value: 32,
-      params: {
-        min: 1,
-        max: 512,
-        step: 0.1
-      },
-      displayName: 'Size',
-      hidden: () => this.props.mode.value !== 'size',
-      onChange: () => this.requestCook()
-    });
-
-    this.addParm('divisions', {
-      value: 16,
-      params: {
-        min: 1,
-        max: 512,
-        step: 1,
-        integer: true
-      },
-      displayName: 'Divisions',
-      hidden: () => this.props.mode.value !== 'divisions',
-      onChange: () => this.requestCook()
-    });
-
-    this.addParm('centered', {
-      value: false,
-      type: 'boolean',
-      displayName: 'Centered',
-      onChange: () => this.requestCook()
-    });
-
-    this.addResolutionParm();
-
-    this.output = this.out('image');
-
-    this.onReady = () => this.requestCook();
-  }
-
-  protected render(): void {
-    const [width, height] = this.getResolution();
-    const mode = this.props.mode.value;
-    const color1 = normalizeColor(this.props.color1.value);
-    const color2 = normalizeColor(this.props.color2.value);
-    const centered = this.props.centered.value;
-
-    let checkerSize: number;
-    if (mode === 'size') {
-      checkerSize = this.props.size.value;
-    } else {
-      checkerSize = width / this.props.divisions.value;
-    }
-
-    // Calculate offset to center the pattern
-    let offsetX = 0;
-    let offsetY = 0;
-    if (centered) {
-      // Offset so that the center of the image is at the center of a checker cell
-      offsetX = (width / 2) % checkerSize - checkerSize / 2;
-      offsetY = (height / 2) % checkerSize - checkerSize / 2;
-    }
-
-    const buffer = ImageBuffer.rgba(width, height);
-    const r = buffer.r();
-    const g = buffer.g();
-    const b = buffer.b();
-    const a = buffer.a();
-
-    for (let y = 0; y < height; y++) {
-      for (let x = 0; x < width; x++) {
-        const idx = y * width + x;
-        const isEven = (Math.floor((x - offsetX) / checkerSize) + Math.floor((y - offsetY) / checkerSize)) % 2 === 0;
-        const color = isEven ? color1 : color2;
-
-        r[idx] = color.r;
-        g[idx] = color.g;
-        b[idx] = color.b;
-        a[idx] = color.a;
-      }
-    }
-
-    buffer.markDirty();
-    this.setOutput(this.output, buffer);
-  }
-}
-`,T=`/**
- * ResizeNode - scales or resizes an ImageBuffer with bilinear interpolation
- */
-
-import { ImageNodeBase, ImageBuffer, type ImageInput } from '../ImageNodeBase';
-import type { Graph } from '@/nodes/Graph';
-import type { InputPort, OutputPort } from '@/types/node.types';
-
-export class ResizeNode extends ImageNodeBase {
-  private image!: InputPort<ImageInput>;
-  private output!: OutputPort<ImageBuffer>;
-
-  constructor(id: string, graph: Graph) {
-    super(id, 'Resize', graph);
-  }
-
-  protected setup(): void {
-    this.image = this.in<ImageInput>('image', null);
-
-    this.addParm('mode', {
-      value: 'scale',
-      params: {
-        options: [
-          { value: 'scale', label: 'Scale' },
-          { value: 'fixed', label: 'Fixed' }
-        ]
-      },
-      displayName: 'Mode',
-      onChange: () => this.requestCook()
-    });
-
-    this.addParm('scale', {
-      value: 1.0,
-      params: {
-        min: 0.1,
-        max: 10.0,
-        step: 0.1
-      },
-      displayName: 'Scale',
-      hidden: () => this.props.mode.value !== 'scale',
-      onChange: () => this.requestCook()
-    });
-
-    this.addParm('width', {
-      value: 512,
-      params: {
-        min: 1,
-        max: 4096,
-        step: 1
-      },
-      displayName: 'Width',
-      hidden: () => this.props.mode.value !== 'fixed',
-      onChange: () => this.requestCook()
-    });
-
-    this.addParm('height', {
-      value: 512,
-      params: {
-        min: 1,
-        max: 4096,
-        step: 1
-      },
-      displayName: 'Height',
-      hidden: () => this.props.mode.value !== 'fixed',
-      onChange: () => this.requestCook()
-    });
-
-    this.output = this.out('image');
-
-    this.image.onChange = () => this.requestCook();
-
-    this.onReady = () => this.requestCook();
-  }
-
-  private resizeBuffer(source: ImageBuffer, newWidth: number, newHeight: number): ImageBuffer {
-    const result = ImageBuffer.rgba(newWidth, newHeight);
-    const scaleX = source.width / newWidth;
-    const scaleY = source.height / newHeight;
-
-    // Process each channel using bilinear interpolation
-    for (let c = 0; c < Math.min(source.channelCount, 4); c++) {
-      const dstChannel = result.channels[c];
-
-      for (let y = 0; y < newHeight; y++) {
-        for (let x = 0; x < newWidth; x++) {
-          const srcX = x * scaleX;
-          const srcY = y * scaleY;
-          dstChannel[y * newWidth + x] = source.sample(srcX, srcY, c);
-        }
-      }
-    }
-
-    // Fill alpha if source doesn't have it
-    if (source.channelCount < 4) {
-      result.fill(3, 1);
-    }
-
-    return result;
-  }
-
-  protected render(): void {
-    const buffer = this.toImageBuffer(this.image.value);
-    if (!buffer) {
-      return;
-    }
-
-    let newWidth: number, newHeight: number;
-
-    if (this.props.mode.value === 'scale') {
-      const scale = this.props.scale.value;
-      newWidth = Math.round(buffer.width * scale);
-      newHeight = Math.round(buffer.height * scale);
-    } else {
-      newWidth = this.props.width.value;
-      newHeight = this.props.height.value;
-    }
-
-    const resized = this.resizeBuffer(buffer, newWidth, newHeight);
-    this.setOutput(this.output, resized);
-  }
-}
-`,E=`/**
- * NormalMapNode - computes normal map from height map (red/grayscale channel)
- */
-
-import { ImageNodeBase, ImageBuffer, type ImageInput } from '../ImageNodeBase';
-import type { Graph } from '@/nodes/Graph';
-import type { InputPort, OutputPort } from '@/types/node.types';
-
-export class NormalMapNode extends ImageNodeBase {
-  private image!: InputPort<ImageInput>;
-  private output!: OutputPort<ImageBuffer>;
-
-  constructor(id: string, graph: Graph) {
-    super(id, 'NormalMap', graph);
-  }
-
-  protected setup(): void {
-    this.image = this.in<ImageInput>('image', null);
-
-    this.addParm('scale', {
-      value: 1.0,
-      params: {
-        min: 0.0,
-        max: 10.0,
-        step: 0.1
-      },
-      displayName: 'Scale',
-      onChange: () => this.requestCook()
-    });
-
-    this.addParm('flipX', {
-      value: false,
-      type: 'boolean',
-      displayName: 'Flip X',
-      onChange: () => this.requestCook()
-    });
-
-    this.addParm('flipY', {
-      value: false,
-      type: 'boolean',
-      displayName: 'Flip Y',
-      onChange: () => this.requestCook()
-    });
-
-    this.output = this.out('image');
-
-    this.image.onChange = () => this.requestCook();
-
-    this.onReady = () => this.requestCook();
-  }
-
-  private computeNormalMap(source: ImageBuffer, scale: number, flipX: boolean, flipY: boolean): ImageBuffer {
-    const { width, height } = source;
-    const result = ImageBuffer.rgba(width, height);
-
-    // Use first channel as height (works for grayscale or red channel)
-    const heightMap = source.channels[0];
-
-    const rOut = result.channels[0];
-    const gOut = result.channels[1];
-    const bOut = result.channels[2];
-    const aOut = result.channels[3];
-
-    for (let y = 0; y < height; y++) {
-      for (let x = 0; x < width; x++) {
-        const idx = y * width + x;
-
-        // Get neighboring heights with clamping
-        const h00 = heightMap[idx];
-        const h10 = heightMap[Math.min(x + 1, width - 1) + y * width];
-        const h01 = heightMap[x + Math.min(y + 1, height - 1) * width];
-
-        // Compute gradients
-        const dx = (h10 - h00) * scale;
-        const dy = (h01 - h00) * scale;
-
-        // Apply flips
-        const finalDx = flipX ? -dx : dx;
-        const finalDy = flipY ? -dy : dy;
-
-        // Compute normal vector: Normal = normalize(-dx, -dy, 1)
-        const nx = -finalDx;
-        const ny = -finalDy;
-        const nz = 1.0;
-
-        const length = Math.sqrt(nx * nx + ny * ny + nz * nz);
-        const normalizedX = nx / length;
-        const normalizedY = ny / length;
-        const normalizedZ = nz / length;
-
-        // Map from [-1, 1] to [0, 1] for normal map format
-        rOut[idx] = normalizedX * 0.5 + 0.5;
-        gOut[idx] = normalizedY * 0.5 + 0.5;
-        bOut[idx] = normalizedZ * 0.5 + 0.5;
-        aOut[idx] = 1.0;
-      }
-    }
-
-    return result;
-  }
-
-  protected render(): void {
-    const buffer = this.toImageBuffer(this.image.value);
-    if (!buffer) {
-      return;
-    }
-
-    const scale = this.props.scale.value;
-    const flipX = this.props.flipX.value;
-    const flipY = this.props.flipY.value;
-
-    const normalMap = this.computeNormalMap(buffer, scale, flipX, flipY);
-    this.setOutput(this.output, normalMap);
-  }
-}
-`,D=`/**
- * RampNode - generates color ramps as ImageBuffer
- */
-
-import { ImageNodeBase, ImageBuffer } from '../ImageNodeBase';
-import type { Graph } from '@/nodes/Graph';
-import type { OutputPort } from '@/types/node.types';
-
-interface ColorValue {
-  r: number;
-  g: number;
-  b: number;
-  a?: number;
-}
-
-interface RampPoint {
-  position: number;
-  color: ColorValue | number[] | string;
-  interpolation?: 'linear' | 'smooth' | 'constant';
-}
-
-export class RampNode extends ImageNodeBase {
-  private output!: OutputPort<ImageBuffer>;
-
-  constructor(id: string, graph: Graph) {
-    super(id, 'Ramp', graph);
-  }
-
-  protected setup(): void {
-    this.addParm('type', {
-      value: 'horizontal',
-      params: {
-        options: [
-          { value: 'horizontal', label: 'Horizontal' },
-          { value: 'vertical', label: 'Vertical' },
-          { value: 'radial', label: 'Radial' },
-          { value: 'concentric', label: 'Concentric' }
-        ]
-      },
-      displayName: 'Type',
-      onChange: () => this.requestCook()
-    });
-
-    this.addParm('points', {
-      value: [
-        { position: 0.0, color: { r: 0.0, g: 0.0, b: 0.0 }, interpolation: 'linear' },
-        { position: 1.0, color: { r: 1.0, g: 1.0, b: 1.0 }, interpolation: 'linear' }
-      ],
-      type: 'colorramp',
-      displayName: 'Ramp',
-      onChange: () => this.requestCook()
-    });
-
-    this.addResolutionParm();
-
-    this.output = this.out('image');
-
-    this.onReady = () => this.requestCook();
-  }
-
-  private normalizeRampColor(color: ColorValue | number[] | string): ColorValue {
-    if (typeof color === 'object' && color !== null && 'r' in color && 'g' in color && 'b' in color) {
-      const isNormalized = color.r <= 1.0 && color.g <= 1.0 && color.b <= 1.0;
-      return {
-        r: isNormalized ? color.r : color.r / 255,
-        g: isNormalized ? color.g : color.g / 255,
-        b: isNormalized ? color.b : color.b / 255,
-        a: color.a !== undefined ? (isNormalized ? color.a : color.a / 255) : 1.0
-      };
-    }
-
-    if (Array.isArray(color)) {
-      const isNormalized = color.every(v => v <= 1.0);
-      return {
-        r: isNormalized ? color[0] : color[0] / 255,
-        g: isNormalized ? color[1] : color[1] / 255,
-        b: isNormalized ? color[2] : color[2] / 255,
-        a: color[3] !== undefined ? (isNormalized ? color[3] : color[3] / 255) : 1.0
-      };
-    }
-
-    if (typeof color === 'string') {
-      const rgbMatch = color.match(/rgb\\s*\\(\\s*(\\d+)\\s*,\\s*(\\d+)\\s*,\\s*(\\d+)\\s*\\)/);
-      if (rgbMatch) {
-        return {
-          r: parseInt(rgbMatch[1], 10) / 255,
-          g: parseInt(rgbMatch[2], 10) / 255,
-          b: parseInt(rgbMatch[3], 10) / 255,
-          a: 1.0
-        };
-      }
-
-      const hex = color.replace('#', '');
-      if (hex.length === 3 || hex.length === 6) {
-        const expanded = hex.length === 3
-          ? hex.split('').map(c => c + c).join('')
-          : hex;
-        const result = /^([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(expanded);
-        if (result) {
-          return {
-            r: parseInt(result[1], 16) / 255,
-            g: parseInt(result[2], 16) / 255,
-            b: parseInt(result[3], 16) / 255,
-            a: 1.0
-          };
-        }
-      }
-    }
-
-    return { r: 0, g: 0, b: 0, a: 1.0 };
-  }
-
-  private interpolateColor(color1: ColorValue, color2: ColorValue, t: number, interpolation: string): ColorValue {
-    if (interpolation === 'constant') {
-      return t < 0.5 ? color1 : color2;
-    } else if (interpolation === 'smooth') {
-      t = t * t * (3 - 2 * t);
-    }
-
-    return {
-      r: color1.r + (color2.r - color1.r) * t,
-      g: color1.g + (color2.g - color1.g) * t,
-      b: color1.b + (color2.b - color1.b) * t,
-      a: (color1.a ?? 1) + ((color2.a ?? 1) - (color1.a ?? 1)) * t
-    };
-  }
-
-  private getColorAtPosition(points: RampPoint[], position: number): ColorValue {
-    const sortedPoints = [...points].sort((a, b) => a.position - b.position);
-    position = Math.max(0, Math.min(1, position));
-
-    let before: RampPoint | null = null;
-    let after: RampPoint | null = null;
-
-    for (let i = 0; i < sortedPoints.length; i++) {
-      if (sortedPoints[i].position <= position) {
-        before = sortedPoints[i];
-      }
-      if (sortedPoints[i].position >= position && !after) {
-        after = sortedPoints[i];
-        break;
-      }
-    }
-
-    if (!before && after) return this.normalizeRampColor(after.color);
-    if (before && !after) return this.normalizeRampColor(before.color);
-    if (!before && !after) return { r: 0, g: 0, b: 0, a: 1 };
-
-    if (before!.position === position) return this.normalizeRampColor(before!.color);
-    if (after!.position === position) return this.normalizeRampColor(after!.color);
-
-    const t = (position - before!.position) / (after!.position - before!.position);
-    const color1 = this.normalizeRampColor(before!.color);
-    const color2 = this.normalizeRampColor(after!.color);
-    const interpolation = after!.interpolation || 'linear';
-
-    return this.interpolateColor(color1, color2, t, interpolation);
-  }
-
-  protected render(): void {
-    const [width, height] = this.getResolution();
-    const rampType = this.props.type.value;
-    const points: RampPoint[] = this.props.points.value || [];
-
-    if (points.length === 0) {
-      return;
-    }
-
-    const buffer = ImageBuffer.rgba(width, height);
-    const r = buffer.r();
-    const g = buffer.g();
-    const b = buffer.b();
-    const a = buffer.a();
-
-    const centerX = width / 2;
-    const centerY = height / 2;
-    const maxDist = Math.sqrt(centerX * centerX + centerY * centerY);
-
-    for (let y = 0; y < height; y++) {
-      for (let x = 0; x < width; x++) {
-        let position = 0;
-
-        if (rampType === 'horizontal') {
-          position = x / width;
-        } else if (rampType === 'vertical') {
-          position = y / height;
-        } else if (rampType === 'radial') {
-          const dx = x - centerX;
-          const dy = y - centerY;
-          const angle = Math.atan2(dy, dx);
-          position = (angle + Math.PI) / (2 * Math.PI);
-        } else if (rampType === 'concentric') {
-          const dx = x - centerX;
-          const dy = y - centerY;
-          const dist = Math.sqrt(dx * dx + dy * dy);
-          position = dist / maxDist;
-        }
-
-        const color = this.getColorAtPosition(points, position);
-        const idx = y * width + x;
-        r[idx] = color.r;
-        g[idx] = color.g;
-        b[idx] = color.b;
-        a[idx] = color.a ?? 1;
-      }
-    }
-
-    buffer.markDirty();
-    this.setOutput(this.output, buffer);
-  }
-}
-`,O=`/**
- * NoiseNode - generates procedural noise patterns as ImageBuffer
- */
-
-import { ImageNodeBase, ImageBuffer } from '../ImageNodeBase';
-import type { Graph } from '@/nodes/Graph';
-import type { OutputPort } from '@/types/node.types';
-
-type Noise2DFunction = (x: number, y: number) => number;
-
-export class NoiseNode extends ImageNodeBase {
-  private output!: OutputPort<ImageBuffer>;
-  private noise2D: Noise2DFunction | null = null;
-  private currentSeed: number | null = null;
-
-  constructor(id: string, graph: Graph) {
-    super(id, 'Noise', graph);
-  }
-
-  protected setup(): void {
-    this.addParm('seed', {
-      value: 0,
-      params: {
-        min: 0,
-        max: 10000,
-        step: 1,
-        integer: true
-      },
-      displayName: 'Seed',
-      onChange: () => {
-        void this.initNoise().then(() => {
-          if (this.noise2D) this.requestCook();
-        });
-      }
-    });
-
-    this.addParm('scale', {
-      value: 0.01,
-      params: {
-        min: 0.001,
-        max: 1.0,
-        step: 0.001
-      },
-      displayName: 'Scale',
-      onChange: () => this.requestCook()
-    });
-
-    this.addParm('iterations', {
-      value: 4,
-      params: {
-        min: 1,
-        max: 8,
-        step: 1,
-        integer: true
-      },
-      displayName: 'Iterations',
-      onChange: () => this.requestCook()
-    });
-
-    this.addResolutionParm();
-
-    this.output = this.out('image');
-
-    this.onReady = async () => {
-      await this.initNoise();
-      if (this.noise2D) {
-        this.requestCook();
-      }
-    };
-  }
-
-  private async initNoise(): Promise<void> {
-    try {
-      const simplexNoise = await this.require('simplex-noise');
-      const { createNoise2D } = simplexNoise;
-      const seed = this.props.seed.value;
-
-      let rng = seed;
-      function seededRandom() {
-        rng = (rng * 9301 + 49297) % 233280;
-        return rng / 233280;
-      }
-
-      this.noise2D = createNoise2D(seededRandom);
-      this.currentSeed = seed;
-    } catch (error) {
-      console.error('Failed to load simplex-noise:', error);
-      this.error = error as Error;
-    }
-  }
-
-  protected render(): void {
-    if (!this.noise2D) {
-      this.initNoise().then(() => {
-        if (this.noise2D) {
-          this.requestCook();
-        }
-      });
-      return;
-    }
-
-    const [width, height] = this.getResolution();
-    const scale = this.props.scale.value;
-    const iterations = this.props.iterations.value;
-    const seed = this.props.seed.value;
-
-    if (seed !== this.currentSeed) {
-      this.initNoise().then(() => {
-        if (this.noise2D) {
-          this.requestCook();
-        }
-      });
-      return;
-    }
-
-    // Create grayscale buffer (single channel for efficiency)
-    const buffer = ImageBuffer.grayscale(width, height);
-    const gray = buffer.r();
-
-    // Generate fractal noise
-    for (let y = 0; y < height; y++) {
-      for (let x = 0; x < width; x++) {
-        let value = 0;
-        let amplitude = 1;
-        let frequency = scale;
-        let maxValue = 0;
-
-        for (let i = 0; i < iterations; i++) {
-          const nx = x * frequency;
-          const ny = y * frequency;
-          const noiseValue = this.noise2D!(nx, ny);
-          value += noiseValue * amplitude;
-          maxValue += amplitude;
-          amplitude *= 0.5;
-          frequency *= 2;
-        }
-
-        // Normalize to [0, 1]
-        value = (value / maxValue + 1) * 0.5;
-        gray[y * width + x] = value;
-      }
-    }
-
-    buffer.markDirty();
-    this.setOutput(this.output, buffer);
-  }
-}
-`,k=`/**
- * BlurNode - applies Gaussian blur to an ImageBuffer
- * Uses separable convolution for efficiency
- */
-
-import { ImageNodeBase, ImageBuffer, type ImageInput } from '../ImageNodeBase';
-import type { Graph } from '@/nodes/Graph';
-import type { InputPort, OutputPort } from '@/types/node.types';
-
-export class BlurNode extends ImageNodeBase {
-  private image!: InputPort<ImageInput>;
-  private output!: OutputPort<ImageBuffer>;
-
-  constructor(id: string, graph: Graph) {
-    super(id, 'Blur', graph);
-  }
-
-  protected setup(): void {
-    this.image = this.in<ImageInput>('image', null);
-
-    this.addParm('method', {
-      value: 'box',
-      params: {
-        options: [
-          { value: 'box', label: 'Box (Fast)' },
-          { value: 'gaussian', label: 'Gaussian (Accurate)' }
-        ]
-      },
-      displayName: 'Method',
-      onChange: () => this.requestCook()
-    });
-
-    this.addParm('radius', {
-      value: 5.0,
-      params: {
-        min: 0.0,
-        max: 100.0,
-        step: 0.1
-      },
-      displayName: 'Radius',
-      onChange: () => this.requestCook()
-    });
-
-    this.addParm('wrapEdges', {
-      value: false,
-      type: 'boolean',
-      displayName: 'Wrap Edges',
-      onChange: () => this.requestCook()
-    });
-
-    this.output = this.out('image');
-
-    this.image.onChange = () => this.requestCook();
-
-    this.onReady = () => this.requestCook();
-  }
-
-  /**
-   * Fast blur using stacked box blur approximation.
-   * 3 passes of box blur closely approximates Gaussian and is O(1) per pixel.
-   */
-  private boxBlur(source: ImageBuffer, radius: number, wrapEdges: boolean): ImageBuffer {
-    if (radius <= 0) {
-      return source.clone();
-    }
-
-    const { width, height } = source;
-
-    // Calculate box sizes for Gaussian approximation
-    // Using 3 passes gives a good approximation
-    const sigma = radius;
-    const boxes = this.boxesForGauss(sigma, 3);
-
-    // Process each channel
-    const result = source.emptyClone();
-
-    for (let c = 0; c < source.channelCount; c++) {
-      // Copy source to result for in-place processing
-      const channelData = new Float32Array(source.channels[c]);
-
-      // Apply 3 box blur passes
-      for (const boxSize of boxes) {
-        this.boxBlurPass(channelData, width, height, boxSize, wrapEdges);
-      }
-
-      result.channels[c].set(channelData);
-    }
-
-    return result;
-  }
-
-  /**
-   * Calculate box sizes for Gaussian approximation.
-   * Returns array of box radii for n passes.
-   */
-  private boxesForGauss(sigma: number, n: number): number[] {
-    // Ideal box width for Gaussian approximation
-    const wIdeal = Math.sqrt((12 * sigma * sigma / n) + 1);
-    let wl = Math.floor(wIdeal);
-    if (wl % 2 === 0) wl--;
-    const wu = wl + 2;
-
-    const mIdeal = (12 * sigma * sigma - n * wl * wl - 4 * n * wl - 3 * n) / (-4 * wl - 4);
-    const m = Math.round(mIdeal);
-
-    const sizes: number[] = [];
-    for (let i = 0; i < n; i++) {
-      sizes.push(i < m ? wl : wu);
-    }
-    return sizes.map(s => (s - 1) / 2); // Convert to radius
-  }
-
-  /**
-   * Single box blur pass (horizontal then vertical) - O(1) per pixel
-   */
-  private boxBlurPass(data: Float32Array, w: number, h: number, r: number, wrap: boolean): void {
-    if (r < 1) return;
-
-    const temp = new Float32Array(w * h);
-    const ri = Math.floor(r);
-    const diameter = ri * 2 + 1;
-    const invDiameter = 1 / diameter;
-
-    // Horizontal pass - O(1) per pixel using sliding window
-    for (let y = 0; y < h; y++) {
-      const rowOffset = y * w;
-      let sum = 0;
-
-      // Initialize sum for first pixel
-      for (let i = -ri; i <= ri; i++) {
-        const px = wrap ? ((i % w) + w) % w : Math.max(0, Math.min(w - 1, i));
-        sum += data[rowOffset + px];
-      }
-      temp[rowOffset] = sum * invDiameter;
-
-      // Slide window across row
-      for (let x = 1; x < w; x++) {
-        // Remove left pixel, add right pixel
-        const removeX = wrap ? (((x - ri - 1) % w) + w) % w : Math.max(0, x - ri - 1);
-        const addX = wrap ? (((x + ri) % w) + w) % w : Math.min(w - 1, x + ri);
-        sum -= data[rowOffset + removeX];
-        sum += data[rowOffset + addX];
-        temp[rowOffset + x] = sum * invDiameter;
-      }
-    }
-
-    // Vertical pass - O(1) per pixel using sliding window
-    for (let x = 0; x < w; x++) {
-      let sum = 0;
-
-      // Initialize sum for first pixel
-      for (let i = -ri; i <= ri; i++) {
-        const py = wrap ? ((i % h) + h) % h : Math.max(0, Math.min(h - 1, i));
-        sum += temp[py * w + x];
-      }
-      data[x] = sum * invDiameter;
-
-      // Slide window down column
-      for (let y = 1; y < h; y++) {
-        const removeY = wrap ? (((y - ri - 1) % h) + h) % h : Math.max(0, y - ri - 1);
-        const addY = wrap ? (((y + ri) % h) + h) % h : Math.min(h - 1, y + ri);
-        sum -= temp[removeY * w + x];
-        sum += temp[addY * w + x];
-        data[y * w + x] = sum * invDiameter;
-      }
-    }
-  }
-
-  /**
-   * True Gaussian blur using separable convolution.
-   * More accurate but O(radius) per pixel - slower for large radii.
-   */
-  private trueGaussianBlur(source: ImageBuffer, radius: number, wrapEdges: boolean): ImageBuffer {
-    if (radius <= 0) {
-      return source.clone();
-    }
-
-    const { width, height } = source;
-    const result = source.emptyClone();
-
-    // Create Gaussian kernel
-    const kernelSize = Math.ceil(radius * 3) * 2 + 1;
-    const kernel = new Float32Array(kernelSize);
-    const sigma = radius / 3;
-    const twoSigmaSq = 2 * sigma * sigma;
-    let sum = 0;
-
-    const halfKernel = (kernelSize - 1) >> 1;
-
-    for (let i = 0; i < kernelSize; i++) {
-      const x = i - halfKernel;
-      const value = Math.exp(-(x * x) / twoSigmaSq);
-      kernel[i] = value;
-      sum += value;
-    }
-
-    // Normalize kernel
-    const invSum = 1 / sum;
-    for (let i = 0; i < kernelSize; i++) {
-      kernel[i] *= invSum;
-    }
-
-    // Inline wrapCoord functions
-    const wrapX = wrapEdges
-      ? (coord: number) => ((coord % width) + width) % width
-      : (coord: number) => coord < 0 ? 0 : coord >= width ? width - 1 : coord;
-    const wrapY = wrapEdges
-      ? (coord: number) => ((coord % height) + height) % height
-      : (coord: number) => coord < 0 ? 0 : coord >= height ? height - 1 : coord;
-
-    // Process each channel
-    for (let c = 0; c < source.channelCount; c++) {
-      const srcChannel = source.channels[c];
-      const dstChannel = result.channels[c];
-      const temp = new Float32Array(width * height);
-
-      // Horizontal pass
-      for (let y = 0; y < height; y++) {
-        const rowOffset = y * width;
-        for (let x = 0; x < width; x++) {
-          let acc = 0;
-          for (let k = 0; k < kernelSize; k++) {
-            const px = wrapX(x + k - halfKernel);
-            acc += srcChannel[rowOffset + px] * kernel[k];
-          }
-          temp[rowOffset + x] = acc;
-        }
-      }
-
-      // Vertical pass
-      for (let x = 0; x < width; x++) {
-        for (let y = 0; y < height; y++) {
-          let acc = 0;
-          for (let k = 0; k < kernelSize; k++) {
-            const py = wrapY(y + k - halfKernel);
-            acc += temp[py * width + x] * kernel[k];
-          }
-          dstChannel[y * width + x] = acc;
-        }
-      }
-    }
-
-    return result;
-  }
-
-  protected render(): void {
-    const buffer = this.toImageBuffer(this.image.value);
-    if (!buffer) {
-      return;
-    }
-
-    const method = this.props.method.value;
-    const radius = this.props.radius.value;
-    const wrapEdges = this.props.wrapEdges.value;
-
-    const blurred = method === 'gaussian'
-      ? this.trueGaussianBlur(buffer, radius, wrapEdges)
-      : this.boxBlur(buffer, radius, wrapEdges);
-
-    this.setOutput(this.output, blurred);
-  }
-}
-`,A=`/**
- * TextNode - Renders text onto an ImageBuffer
- *
- * Similar to Houdini's Font node, provides extensive control over
- * text rendering including font, size, alignment, color, and transforms.
- */
-
-import { ImageNodeBase, ImageBuffer } from '../ImageNodeBase';
-import type { Graph } from '@/nodes/Graph';
-import type { OutputPort } from '@/types/node.types';
-import { colorToCss, normalizeColor } from '@/utils/colorUtils';
-import { createSurface } from '../surface.js';
-
-export class TextNode extends ImageNodeBase {
-  private output!: OutputPort<ImageBuffer>;
-
-  constructor(id: string, graph: Graph) {
-    super(id, 'Text', graph);
-  }
-
-  protected setup(): void {
-    // Text content (multiline)
-    this.addParm('text', {
-      value: 'Hello, World!',
-      type: 'textarea',
-      displayName: 'Text'
-    });
-
-    // Font family
-    this.addParm('font', {
-      value: 'Inter, system-ui, sans-serif',
-      type: 'text',
-      displayName: 'Font'
-    });
-
-    // Font size in pixels
-    this.addParm('fontSize', {
-      value: 48,
-      type: 'slider',
-      params: { min: 1, max: 500, step: 1 },
-      displayName: 'Font Size'
-    });
-
-    // Font weight
-    this.addParm('fontWeight', {
-      value: 'normal',
-      type: 'select',
-      params: {
-        options: [
-          { value: 'normal', label: 'Normal' },
-          { value: 'bold', label: 'Bold' },
-          { value: '100', label: 'Thin (100)' },
-          { value: '200', label: 'Extra Light (200)' },
-          { value: '300', label: 'Light (300)' },
-          { value: '500', label: 'Medium (500)' },
-          { value: '600', label: 'Semi Bold (600)' },
-          { value: '700', label: 'Bold (700)' },
-          { value: '800', label: 'Extra Bold (800)' },
-          { value: '900', label: 'Black (900)' }
-        ]
-      },
-      displayName: 'Font Weight'
-    });
-
-    // Font style
-    this.addParm('fontStyle', {
-      value: 'normal',
-      type: 'select',
-      params: {
-        options: [
-          { value: 'normal', label: 'Normal' },
-          { value: 'italic', label: 'Italic' },
-          { value: 'oblique', label: 'Oblique' }
-        ]
-      },
-      displayName: 'Font Style'
-    });
-
-    // Horizontal alignment
-    this.addParm('alignH', {
-      value: 'center',
-      type: 'select',
-      params: {
-        options: [
-          { value: 'left', label: 'Left' },
-          { value: 'center', label: 'Center' },
-          { value: 'right', label: 'Right' }
-        ]
-      },
-      displayName: 'Horizontal Align'
-    });
-
-    // Vertical alignment
-    this.addParm('alignV', {
-      value: 'middle',
-      type: 'select',
-      params: {
-        options: [
-          { value: 'top', label: 'Top' },
-          { value: 'middle', label: 'Middle' },
-          { value: 'bottom', label: 'Bottom' }
-        ]
-      },
-      displayName: 'Vertical Align'
-    });
-
-    // Text color
-    this.addParm('color', {
-      value: { r: 1.0, g: 1.0, b: 1.0 },
-      type: 'color',
-      displayName: 'Color'
-    });
-
-    // Background color (with alpha for transparency)
-    this.addParm('backgroundColor', {
-      value: { r: 0.0, g: 0.0, b: 0.0, a: 0.0 },
-      type: 'color',
-      displayName: 'Background'
-    });
-
-    this.addResolutionParm();
-
-    // Position offset (relative to alignment anchor)
-    this.addParm('offset', {
-      value: [0, 0],
-      params: {
-        min: [-2048, -2048],
-        max: [2048, 2048],
-        step: 1
-      },
-      displayName: 'Offset'
-    });
-
-    // Rotation in degrees
-    this.addParm('rotation', {
-      value: 0,
-      type: 'slider',
-      params: { min: -180, max: 180, step: 0.1 },
-      displayName: 'Rotation'
-    });
-
-    // Letter spacing (tracking)
-    this.addParm('letterSpacing', {
-      value: 0,
-      type: 'slider',
-      params: { min: -50, max: 100, step: 0.5 },
-      displayName: 'Letter Spacing'
-    });
-
-    // Line height multiplier
-    this.addParm('lineHeight', {
-      value: 1.2,
-      type: 'slider',
-      params: { min: 0.5, max: 3.0, step: 0.05 },
-      displayName: 'Line Height'
-    });
-
-    // Opacity
-    this.addParm('opacity', {
-      value: 1.0,
-      type: 'slider',
-      params: { min: 0, max: 1, step: 0.01 },
-      displayName: 'Opacity'
-    });
-
-    this.output = this.out('image');
-
-    // Watch all properties for changes (resolution is handled by addResolutionParm)
-    const propNames = [
-      'text', 'font', 'fontSize', 'fontWeight', 'fontStyle',
-      'alignH', 'alignV', 'color', 'backgroundColor',
-      'offset', 'rotation', 'letterSpacing', 'lineHeight', 'opacity'
-    ];
-    propNames.forEach(prop => this.watchProp(prop, () => this.requestCook()));
-
-    this.onReady = () => this.requestCook();
-  }
-
-  protected render(): void {
-    const [width, height] = this.getResolution();
-    const text = this.props.text.value as string;
-    const font = this.props.font.value as string;
-    const fontSize = this.props.fontSize.value as number;
-    const fontWeight = this.props.fontWeight.value as string;
-    const fontStyle = this.props.fontStyle.value as string;
-    const alignH = this.props.alignH.value as string;
-    const alignV = this.props.alignV.value as string;
-    const color = normalizeColor(this.props.color.value);
-    const bgColor = normalizeColor(this.props.backgroundColor.value);
-    const [offsetX, offsetY] = this.props.offset.value;
-    const rotation = this.props.rotation.value as number;
-    const letterSpacing = this.props.letterSpacing.value as number;
-    const lineHeight = this.props.lineHeight.value as number;
-    const opacity = this.props.opacity.value as number;
-
-    // Use the current host's Canvas 2D surface.
-    const canvas = createSurface(width, height);
-    const ctx = canvas.getContext('2d') as CanvasRenderingContext2D | null;
-    if (!ctx) {
-      this.setOutput(this.output, ImageBuffer.rgba(width, height));
-      return;
-    }
-
-    // Fill background
-    if (bgColor.a > 0) {
-      ctx.fillStyle = colorToCss(bgColor);
-      ctx.fillRect(0, 0, width, height);
-    } else {
-      // Transparent background
-      ctx.clearRect(0, 0, width, height);
-    }
-
-    // Set up text rendering
-    ctx.save();
-
-    // Apply global alpha for opacity
-    ctx.globalAlpha = opacity;
-
-    // Build font string
-    const fontString = \`\${fontStyle} \${fontWeight} \${fontSize}px \${font}\`;
-    ctx.font = fontString;
-    ctx.fillStyle = colorToCss(color);
-
-    // Calculate text metrics for multiline
-    const lines = text.split('\\n');
-    const lineHeightPx = fontSize * lineHeight;
-    const totalTextHeight = lines.length * lineHeightPx;
-
-    // Calculate anchor point based on alignment
-    let anchorX: number;
-    let anchorY: number;
-
-    switch (alignH) {
-      case 'left':
-        ctx.textAlign = 'left';
-        anchorX = 0;
-        break;
-      case 'right':
-        ctx.textAlign = 'right';
-        anchorX = width;
-        break;
-      case 'center':
-      default:
-        ctx.textAlign = 'center';
-        anchorX = width / 2;
-        break;
-    }
-
-    switch (alignV) {
-      case 'top':
-        anchorY = fontSize; // Baseline offset
-        break;
-      case 'bottom':
-        anchorY = height - totalTextHeight + fontSize;
-        break;
-      case 'middle':
-      default:
-        anchorY = (height - totalTextHeight) / 2 + fontSize;
-        break;
-    }
-
-    // Apply offset
-    anchorX += offsetX;
-    anchorY += offsetY;
-
-    // Apply rotation around anchor point
-    if (rotation !== 0) {
-      const rotationRad = (rotation * Math.PI) / 180;
-      ctx.translate(anchorX, anchorY - fontSize / 2 + totalTextHeight / 2);
-      ctx.rotate(rotationRad);
-      ctx.translate(-anchorX, -(anchorY - fontSize / 2 + totalTextHeight / 2));
-    }
-
-    // Render each line
-    if (letterSpacing !== 0) {
-      // Manual letter spacing - render character by character
-      ctx.textAlign = 'left';
-      for (let i = 0; i < lines.length; i++) {
-        const line = lines[i];
-        const y = anchorY + i * lineHeightPx;
-
-        // Calculate line width for alignment
-        let lineWidth = 0;
-        for (const char of line) {
-          lineWidth += ctx.measureText(char).width + letterSpacing;
-        }
-        lineWidth -= letterSpacing; // Remove trailing spacing
-
-        // Calculate starting X based on alignment
-        let x: number;
-        switch (alignH) {
-          case 'left':
-            x = anchorX;
-            break;
-          case 'right':
-            x = anchorX - lineWidth;
-            break;
-          case 'center':
-          default:
-            x = anchorX - lineWidth / 2;
-            break;
-        }
-
-        // Render each character
-        for (const char of line) {
-          ctx.fillText(char, x, y);
-          x += ctx.measureText(char).width + letterSpacing;
-        }
-      }
-    } else {
-      // Standard text rendering (faster)
-      for (let i = 0; i < lines.length; i++) {
-        const y = anchorY + i * lineHeightPx;
-        ctx.fillText(lines[i], anchorX, y);
-      }
-    }
-
-    ctx.restore();
-
-    // Convert canvas to ImageBuffer
-    const buffer = ImageBuffer.fromCanvas(canvas);
-    this.setOutput(this.output, buffer);
-  }
-}
-`,j=`/**
- * TransformNode - 2D transformation (rotation, translation, scaling) for images
- */
-
-import { ImageNodeBase, ImageBuffer } from '../ImageNodeBase';
-import type { Graph } from '@/nodes/Graph';
-import type { InputPort, OutputPort } from '@/types/node.types';
-
-export class TransformNode extends ImageNodeBase {
-  private imageInput!: InputPort<ImageBuffer | null>;
-  private output!: OutputPort<ImageBuffer>;
-
-  constructor(id: string, graph: Graph) {
-    super(id, 'Transform', graph);
-  }
-
-  protected setup(): void {
-    this.imageInput = this.in<ImageBuffer | null>('image', null);
-
-    this.addParm('translate', {
-      value: [0, 0],
-      params: {
-        min: [-2048, -2048],
-        max: [2048, 2048],
-        step: 1
-      },
-      displayName: 'Translate',
-      onChange: () => this.requestCook()
-    });
-
-    this.addParm('rotation', {
-      value: 0,
-      params: {
-        min: -180,
-        max: 180,
-        step: 0.1
-      },
-      displayName: 'Rotation',
-      onChange: () => this.requestCook()
-    });
-
-    this.addParm('scale', {
-      value: [1, 1],
-      params: {
-        min: [0.01, 0.01],
-        max: [10, 10],
-        step: 0.01
-      },
-      displayName: 'Scale',
-      onChange: () => this.requestCook()
-    });
-
-    this.addParm('uniformScale', {
-      value: true,
-      type: 'boolean',
-      displayName: 'Uniform Scale',
-      onChange: () => this.requestCook()
-    });
-
-    this.addParm('pivot', {
-      value: 'center',
-      params: {
-        options: [
-          { value: 'center', label: 'Center' },
-          { value: 'top-left', label: 'Top Left' },
-          { value: 'top-right', label: 'Top Right' },
-          { value: 'bottom-left', label: 'Bottom Left' },
-          { value: 'bottom-right', label: 'Bottom Right' },
-          { value: 'custom', label: 'Custom' }
-        ]
-      },
-      displayName: 'Pivot',
-      onChange: () => this.requestCook()
-    });
-
-    this.addParm('customPivot', {
-      value: [0.5, 0.5],
-      params: {
-        min: [0, 0],
-        max: [1, 1],
-        step: 0.01
-      },
-      displayName: 'Custom Pivot',
-      hidden: () => this.props.pivot.value !== 'custom',
-      onChange: () => this.requestCook()
-    });
-
-    this.addParm('filter', {
-      value: 'bilinear',
-      params: {
-        options: [
-          { value: 'nearest', label: 'Nearest' },
-          { value: 'bilinear', label: 'Bilinear' }
-        ]
-      },
-      displayName: 'Filter',
-      onChange: () => this.requestCook()
-    });
-
-    this.addParm('wrap', {
-      value: 'clamp',
-      params: {
-        options: [
-          { value: 'clamp', label: 'Clamp' },
-          { value: 'repeat', label: 'Repeat' },
-          { value: 'mirror', label: 'Mirror' },
-          { value: 'transparent', label: 'Transparent' }
-        ]
-      },
-      displayName: 'Wrap Mode',
-      onChange: () => this.requestCook()
-    });
-
-    this.output = this.out('image');
-
-    this.imageInput.onChange = () => this.requestCook();
-
-    this.onReady = () => this.requestCook();
-  }
-
-  private getPivotPoint(width: number, height: number): [number, number] {
-    const pivot = this.props.pivot.value;
-    switch (pivot) {
-      case 'center': return [width / 2, height / 2];
-      case 'top-left': return [0, 0];
-      case 'top-right': return [width, 0];
-      case 'bottom-left': return [0, height];
-      case 'bottom-right': return [width, height];
-      case 'custom':
-        const [px, py] = this.props.customPivot.value;
-        return [px * width, py * height];
-      default: return [width / 2, height / 2];
-    }
-  }
-
-  private wrapCoord(coord: number, size: number, mode: string): number {
-    if (mode === 'clamp') {
-      return Math.max(0, Math.min(size - 1, coord));
-    } else if (mode === 'repeat') {
-      coord = coord % size;
-      if (coord < 0) coord += size;
-      return coord;
-    } else if (mode === 'mirror') {
-      const period = size * 2;
-      coord = Math.abs(coord % period);
-      if (coord >= size) coord = period - coord - 1;
-      return Math.max(0, Math.min(size - 1, coord));
-    }
-    return coord; // transparent - will be checked separately
-  }
-
-  protected render(): void {
-    const input = this.toImageBuffer(this.imageInput.value);
-    if (!input) {
-      return;
-    }
-
-    const width = input.width;
-    const height = input.height;
-    const [tx, ty] = this.props.translate.value;
-    const rotation = this.props.rotation.value * Math.PI / 180;
-    let [sx, sy] = this.props.scale.value;
-    const uniformScale = this.props.uniformScale.value;
-    const filterMode = this.props.filter.value;
-    const wrapMode = this.props.wrap.value;
-
-    if (uniformScale) {
-      sy = sx;
-    }
-
-    const [pivotX, pivotY] = this.getPivotPoint(width, height);
-
-    // Pre-compute inverse transform matrix
-    const cosR = Math.cos(-rotation);
-    const sinR = Math.sin(-rotation);
-    const invSx = 1 / sx;
-    const invSy = 1 / sy;
-
-    const buffer = ImageBuffer.rgba(width, height);
-    const channelCount = Math.min(input.channelCount, 4);
-
-    for (let y = 0; y < height; y++) {
-      for (let x = 0; x < width; x++) {
-        // Transform from destination to source coordinates
-        // 1. Translate to pivot
-        let dx = x - pivotX - tx;
-        let dy = y - pivotY - ty;
-
-        // 2. Rotate (inverse)
-        const rx = dx * cosR - dy * sinR;
-        const ry = dx * sinR + dy * cosR;
-
-        // 3. Scale (inverse)
-        const srcX = rx * invSx + pivotX;
-        const srcY = ry * invSy + pivotY;
-
-        // Check bounds for transparent mode
-        if (wrapMode === 'transparent') {
-          if (srcX < 0 || srcX >= width || srcY < 0 || srcY >= height) {
-            const idx = y * width + x;
-            for (let c = 0; c < 4; c++) {
-              buffer.channels[c][idx] = c === 3 ? 0 : 0; // transparent black
-            }
-            continue;
-          }
-        }
-
-        const idx = y * width + x;
-
-        if (filterMode === 'nearest') {
-          const sx0 = Math.round(srcX);
-          const sy0 = Math.round(srcY);
-          const wx = this.wrapCoord(sx0, width, wrapMode);
-          const wy = this.wrapCoord(sy0, height, wrapMode);
-          const srcIdx = wy * width + wx;
-
-          for (let c = 0; c < channelCount; c++) {
-            buffer.channels[c][idx] = input.channels[c][srcIdx];
-          }
-          // Fill alpha if input doesn't have it
-          if (channelCount < 4) {
-            buffer.channels[3][idx] = 1;
-          }
-        } else {
-          // Bilinear interpolation
-          const x0 = Math.floor(srcX);
-          const y0 = Math.floor(srcY);
-          const x1 = x0 + 1;
-          const y1 = y0 + 1;
-          const fx = srcX - x0;
-          const fy = srcY - y0;
-
-          const wx0 = this.wrapCoord(x0, width, wrapMode);
-          const wx1 = this.wrapCoord(x1, width, wrapMode);
-          const wy0 = this.wrapCoord(y0, height, wrapMode);
-          const wy1 = this.wrapCoord(y1, height, wrapMode);
-
-          const idx00 = wy0 * width + wx0;
-          const idx10 = wy0 * width + wx1;
-          const idx01 = wy1 * width + wx0;
-          const idx11 = wy1 * width + wx1;
-
-          for (let c = 0; c < channelCount; c++) {
-            const v00 = input.channels[c][idx00];
-            const v10 = input.channels[c][idx10];
-            const v01 = input.channels[c][idx01];
-            const v11 = input.channels[c][idx11];
-
-            const v0 = v00 + (v10 - v00) * fx;
-            const v1 = v01 + (v11 - v01) * fx;
-            buffer.channels[c][idx] = v0 + (v1 - v0) * fy;
-          }
-          // Fill alpha if input doesn't have it
-          if (channelCount < 4) {
-            buffer.channels[3][idx] = 1;
-          }
-        }
-      }
-    }
-
-    buffer.markDirty();
-    this.setOutput(this.output, buffer);
-  }
-}
-`;function M(e,t){let n=document.createElement(`canvas`);return n.width=e,n.height=t,n}function N(e){return e instanceof HTMLCanvasElement?{width:e.width,height:e.height}:e instanceof HTMLImageElement?{width:e.naturalWidth||e.width,height:e.naturalHeight||e.height}:{width:0,height:0}}function P(e){if(e instanceof HTMLCanvasElement)return e;let t=M(e.naturalWidth||e.width,e.naturalHeight||e.height),n=t.getContext(`2d`);return n&&n.drawImage(e,0,0),t}function F(e){return new Promise((t,n)=>{let r=new Image;r.crossOrigin=`anonymous`,r.onload=()=>t(r),r.onerror=()=>n(Error(`Failed to load image: ${e}`)),r.src=e})}function I(e,t,n){let{width:r,height:i}=N(e),a=r/i,o=r,s=i;r>t&&(o=t,s=t/a),s>n&&(s=n,o=n*a);let c=M(Math.round(o),Math.round(s)),l=c.getContext(`2d`);return l&&l.drawImage(e,0,0,c.width,c.height),c}function L(e,t,n){let r=M(t,n),i=r.getContext(`2d`);return i&&i.drawImage(e,0,0,t,n),r}function R(e,t){let{width:n,height:r}=N(e);return L(e,Math.round(n*t),Math.round(r*t))}function z(e){return{normal:`source-over`,multiply:`multiply`,screen:`screen`,overlay:`overlay`,darken:`darken`,lighten:`lighten`,"color-dodge":`color-dodge`,"color-burn":`color-burn`,"hard-light":`hard-light`,"soft-light":`soft-light`,difference:`difference`,exclusion:`exclusion`,add:`lighter`,subtract:`difference`}[e]||`source-over`}e(`image`,b),t(`Color`,x),t(`Image`,S),t(`Composite`,C),t(`Checkers`,w),t(`Resize`,T),t(`NormalMap`,E),t(`Ramp`,D),t(`Noise`,O),t(`Blur`,k),t(`Text`,A),t(`Transform`,j);export{_ as BlurNode,f as CheckersNode,l as ColorNode,d as CompositeNode,u as ImageNode,c as ImageNodeBase,g as NoiseNode,m as NormalMapNode,h as RampNode,p as ResizeNode,v as TextNode,y as TransformNode,M as createCanvas,z as getBlendMode,N as getImageResolution,a as imageLibrary,b as imageNodeClasses,P as imageToCanvas,F as loadImage,L as resizeImageToFixed,I as resizeImageWithAspectRatio,R as scaleImage};