@field/cascade 0.2.22 → 0.3.0

package/dist/assets/{image-BUcQC7PG.js → image-DMCXBY-_.js}

@@ -1,5 +1,5 @@
-import{c as e,o as t}from"./nodeTypeUtils-CweA3NHd.js";import{E as n,T as r,_ as i,g as a,o}from"./index-BXYXSdgh.js";var s=class extends o{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(),r=n(this.props.color.value),a=i.solid(e,t,r);this.setOutput(this.output,a)}},c=class extends o{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){if(this.imageInput.value instanceof i)e=this.imageInput.value;else if(this.imageInput.value instanceof HTMLImageElement||this.imageInput.value instanceof HTMLCanvasElement)e=i.fromCanvas(this.imageInput.value);else if(typeof this.imageInput.value==`string`){let t=new Image;t.crossOrigin=`anonymous`,await new Promise((e,n)=>{t.onload=()=>e(),t.onerror=n,t.src=this.imageInput.value}),e=i.fromCanvas(t)}}else if(this.props.file.value){let t=new Image;t.crossOrigin=`anonymous`,await new Promise((e,n)=>{t.onload=()=>e(),t.onerror=n,t.src=this.props.file.value}),e=i.fromCanvas(t)}if(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}},l=class extends o{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}}},u=class extends o{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(),r=this.props.mode.value,a=n(this.props.color1.value),o=n(this.props.color2.value),s=this.props.centered.value,c;c=r===`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 r=n*e+t,i=(Math.floor((t-l)/c)+Math.floor((n-u)/c))%2==0?a:o;f[r]=i.r,p[r]=i.g,m[r]=i.b,h[r]=i.a}d.markDirty(),this.setOutput(this.output,d)}},d=class extends o{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)}},f=class extends o{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)}},p=class extends o{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)}},m=class extends o{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)}},h=class extends o{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)}},g=class extends o{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(),a=this.props.text.value,o=this.props.font.value,s=this.props.fontSize.value,c=this.props.fontWeight.value,l=this.props.fontStyle.value,u=this.props.alignH.value,d=this.props.alignV.value,f=n(this.props.color.value),p=n(this.props.backgroundColor.value),[m,h]=this.props.offset.value,g=this.props.rotation.value,_=this.props.letterSpacing.value,v=this.props.lineHeight.value,y=this.props.opacity.value,b=document.createElement(`canvas`);b.width=e,b.height=t;let x=b.getContext(`2d`);if(!x){this.setOutput(this.output,i.rgba(e,t));return}p.a>0?(x.fillStyle=r(p),x.fillRect(0,0,e,t)):x.clearRect(0,0,e,t),x.save(),x.globalAlpha=y,x.font=`${l} ${c} ${s}px ${o}`,x.fillStyle=r(f);let S=a.split(`
-`),C=s*v,w=S.length*C,T,E;switch(u){case`left`:x.textAlign=`left`,T=0;break;case`right`:x.textAlign=`right`,T=e;break;default:x.textAlign=`center`,T=e/2}switch(d){case`top`:E=s;break;case`bottom`:E=t-w+s;break;default:E=(t-w)/2+s}if(T+=m,E+=h,g!==0){let e=g*Math.PI/180;x.translate(T,E-s/2+w/2),x.rotate(e),x.translate(-T,-(E-s/2+w/2))}if(_!==0){x.textAlign=`left`;for(let e=0;e<S.length;e++){let t=S[e],n=E+e*C,r=0;for(let e of t)r+=x.measureText(e).width+_;r-=_;let i;switch(u){case`left`:i=T;break;case`right`:i=T-r;break;default:i=T-r/2}for(let e of t)x.fillText(e,i,n),i+=x.measureText(e).width+_}}else for(let e=0;e<S.length;e++){let t=E+e*C;x.fillText(S[e],T,t)}x.restore();let D=i.fromCanvas(b);this.setOutput(this.output,D)}},_=class extends o{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)}},v=`/**
+import{c as e,u as t}from"./nodeTypeUtils-BBA1JqHx.js";import{O as n,_ as r,h as i,k as a,m as o,o as s,v as c}from"./index-HTCN44kj.js";var l=class extends s{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=a(this.props.color.value),r=i.solid(e,t,n);this.setOutput(this.output,r)}},u=class extends s{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 c(this.imageInput.value)):i.fromCanvas(this.imageInput.value):this.props.file.value&&(e=i.fromCanvas(await c(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 s{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 s{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=a(this.props.color1.value),o=a(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,a=(Math.floor((t-l)/c)+Math.floor((n-u)/c))%2==0?r:o;f[i]=a.r,p[i]=a.g,m[i]=a.b,h[i]=a.a}d.markDirty(),this.setOutput(this.output,d)}},p=class extends s{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 s{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 s{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 s{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 s{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 s{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(),o=this.props.text.value,s=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=a(this.props.color.value),m=a(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=r(e,t),S=x.getContext(`2d`);if(!S){this.setOutput(this.output,i.rgba(e,t));return}m.a>0?(S.fillStyle=n(m),S.fillRect(0,0,e,t)):S.clearRect(0,0,e,t),S.save(),S.globalAlpha=b,S.font=`${u} ${l} ${c}px ${s}`,S.fillStyle=n(p);let C=o.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 s{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
  */
 
@@ -39,16 +39,18 @@ export class ColorNode extends ImageNodeBase {
     this.setOutput(this.output, buffer);
   }
 }
-`,y=`/**
+`,S=`/**
  * ImageNode - loads an image file or accepts image input
  * Converts to ImageBuffer for the processing pipeline
  */
 
-import { ImageNodeBase, ImageBuffer, type ImageInput } from '../ImageNodeBase';
+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 = HTMLCanvasElement | HTMLImageElement | ImageBuffer | string | null;
+type ImageInputValue = ImageSourceLike | ImageBuffer | string | null;
 
 export class ImageNode extends ImageNodeBase {
   private imageInput!: InputPort<ImageInputValue>;
@@ -136,32 +138,17 @@ export class ImageNode extends ImageNodeBase {
   protected async render(): Promise<void> {
     let sourceBuffer: ImageBuffer | null = null;
 
-    // First check input port
+    // 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 (this.imageInput.value instanceof HTMLImageElement ||
-                 this.imageInput.value instanceof HTMLCanvasElement) {
-        sourceBuffer = ImageBuffer.fromCanvas(this.imageInput.value);
       } else if (typeof this.imageInput.value === 'string') {
-        const img = new Image();
-        img.crossOrigin = 'anonymous';
-        await new Promise<void>((resolve, reject) => {
-          img.onload = () => resolve();
-          img.onerror = reject;
-          img.src = this.imageInput.value as string;
-        });
-        sourceBuffer = ImageBuffer.fromCanvas(img);
+        sourceBuffer = ImageBuffer.fromCanvas(await decodeImage(this.imageInput.value));
+      } else {
+        sourceBuffer = ImageBuffer.fromCanvas(this.imageInput.value);
       }
     } else if (this.props.file.value) {
-      const img = new Image();
-      img.crossOrigin = 'anonymous';
-      await new Promise<void>((resolve, reject) => {
-        img.onload = () => resolve();
-        img.onerror = reject;
-        img.src = this.props.file.value;
-      });
-      sourceBuffer = ImageBuffer.fromCanvas(img);
+      sourceBuffer = ImageBuffer.fromCanvas(await decodeImage(this.props.file.value as string));
     }
 
     if (!sourceBuffer) {
@@ -233,7 +220,7 @@ export class ImageNode extends ImageNodeBase {
     return result;
   }
 }
-`,b=`/**
+`,C=`/**
  * CompositeNode - blends two ImageBuffers together
  * Supports resolution control similar to TouchDesigner TOPs
  */
@@ -500,7 +487,7 @@ export class CompositeNode extends ImageNodeBase {
     }
   }
 }
-`,x=`/**
+`,w=`/**
  * CheckersNode - generates a checkerboard pattern as ImageBuffer
  */
 
@@ -628,7 +615,7 @@ export class CheckersNode extends ImageNodeBase {
     this.setOutput(this.output, buffer);
   }
 }
-`,S=`/**
+`,T=`/**
  * ResizeNode - scales or resizes an ImageBuffer with bilinear interpolation
  */
 
@@ -749,7 +736,7 @@ export class ResizeNode extends ImageNodeBase {
     this.setOutput(this.output, resized);
   }
 }
-`,C=`/**
+`,E=`/**
  * NormalMapNode - computes normal map from height map (red/grayscale channel)
  */
 
@@ -864,7 +851,7 @@ export class NormalMapNode extends ImageNodeBase {
     this.setOutput(this.output, normalMap);
   }
 }
-`,w=`/**
+`,D=`/**
  * RampNode - generates color ramps as ImageBuffer
  */
 
@@ -1075,7 +1062,7 @@ export class RampNode extends ImageNodeBase {
     this.setOutput(this.output, buffer);
   }
 }
-`,T=`/**
+`,O=`/**
  * NoiseNode - generates procedural noise patterns as ImageBuffer
  */
 
@@ -1222,7 +1209,7 @@ export class NoiseNode extends ImageNodeBase {
     this.setOutput(this.output, buffer);
   }
 }
-`,E=`/**
+`,k=`/**
  * BlurNode - applies Gaussian blur to an ImageBuffer
  * Uses separable convolution for efficiency
  */
@@ -1484,7 +1471,7 @@ export class BlurNode extends ImageNodeBase {
     this.setOutput(this.output, blurred);
   }
 }
-`,D=`/**
+`,A=`/**
  * TextNode - Renders text onto an ImageBuffer
  *
  * Similar to Houdini's Font node, provides extensive control over
@@ -1495,6 +1482,7 @@ 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>;
@@ -1678,11 +1666,9 @@ export class TextNode extends ImageNodeBase {
     const lineHeight = this.props.lineHeight.value as number;
     const opacity = this.props.opacity.value as number;
 
-    // Create canvas for rendering
-    const canvas = document.createElement('canvas');
-    canvas.width = width;
-    canvas.height = height;
-    const ctx = canvas.getContext('2d');
+    // 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;
@@ -1809,7 +1795,7 @@ export class TextNode extends ImageNodeBase {
     this.setOutput(this.output, buffer);
   }
 }
-`,O=`/**
+`,j=`/**
  * TransformNode - 2D transformation (rotation, translation, scaling) for images
  */
 
@@ -2073,4 +2059,4 @@ export class TransformNode extends ImageNodeBase {
     this.setOutput(this.output, buffer);
   }
 }
-`;function k(e,t){let n=document.createElement(`canvas`);return n.width=e,n.height=t,n}function A(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 j(e){if(e instanceof HTMLCanvasElement)return e;let t=k(e.naturalWidth||e.width,e.naturalHeight||e.height),n=t.getContext(`2d`);return n&&n.drawImage(e,0,0),t}function M(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 N(e,t,n){let{width:r,height:i}=A(e),a=r/i,o=r,s=i;r>t&&(o=t,s=t/a),s>n&&(s=n,o=n*a);let c=k(Math.round(o),Math.round(s)),l=c.getContext(`2d`);return l&&l.drawImage(e,0,0,c.width,c.height),c}function P(e,t,n){let r=k(t,n),i=r.getContext(`2d`);return i&&i.drawImage(e,0,0,t,n),r}function F(e,t){let{width:n,height:r}=A(e);return P(e,Math.round(n*t),Math.round(r*t))}function I(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`}var L={Color:s,Image:c,Composite:l,Checkers:u,Resize:d,NormalMap:f,Ramp:p,Noise:m,Blur:h,Text:g,Transform:_};t(`image`,L),e(`Color`,v),e(`Image`,y),e(`Composite`,b),e(`Checkers`,x),e(`Resize`,S),e(`NormalMap`,C),e(`Ramp`,w),e(`Noise`,T),e(`Blur`,E),e(`Text`,D),e(`Transform`,O);export{h as BlurNode,u as CheckersNode,s as ColorNode,l as CompositeNode,c as ImageNode,o as ImageNodeBase,m as NoiseNode,f as NormalMapNode,p as RampNode,d as ResizeNode,g as TextNode,_ as TransformNode,k as createCanvas,I as getBlendMode,A as getImageResolution,a as imageLibrary,L as imageNodeClasses,j as imageToCanvas,M as loadImage,P as resizeImageToFixed,N as resizeImageWithAspectRatio,F as scaleImage};
+`;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,s 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,o as imageLibrary,b as imageNodeClasses,P as imageToCanvas,F as loadImage,L as resizeImageToFixed,I as resizeImageWithAspectRatio,R as scaleImage};