@rippleflow/water-distortion 0.1.5 → 0.1.6

package/README.md

@@ -25,6 +25,9 @@ export function Hero() {
   return (
     <WaterDistortion
       mode="texture"
+      interactionMode="both"
+      runInBackground={false}
+      pauseKey="Space"
       wakeStrength={0.54}
       interactionRadius={25}
       troughStrength={0.92}
@@ -43,7 +46,9 @@ export function Hero() {
       crestIntensity={0.2}
       causticIntensity={0}
       simulationResolution={192}
+      idleTimeout={900}
       texture="/work-collage.jpg"
+      textureFit="cover"
       underlay={
         <img
           src="/work-collage.jpg"
@@ -51,6 +56,8 @@ export function Hero() {
           style={{ width: "100%", height: "100%", objectFit: "cover" }}
         />
       }
+      className="hero"
+      reducedMotion="respect"
       style={{ minHeight: 620 }}
     >
       <section>
@@ -88,7 +95,7 @@ For true shader refraction, provide a texture source:
 | `mode` | `"dom" \| "texture" \| "canvas"` | `"texture"` | Chooses live-DOM overlay mode or true WebGL background sampling. |
 | `texture` | `TexImageSource \| string` | `undefined` | Image/canvas/video source sampled by WebGL in `texture` or `canvas` mode. URL strings are loaded with `crossOrigin="anonymous"`. |
 | `textureFit` | `"fill" \| "cover" \| "contain" \| "none"` | `"fill"` | Sizes and centers the sampled texture like CSS `object-fit`. `contain` and undersized `none` leave uncovered areas transparent. |
-| `interactionMode` | `"move" \| "click" \| "drag" \| "event"` | `"move"` | Chooses pointer-movement wakes, one ripple per pointer down, press ripples plus held-drag wakes, or programmatic ripples only. |
+| `interactionMode` | `"move" \| "click" \| "both" \| "drag" \| "event"` | `"move"` | Chooses pointer-movement wakes, one ripple per pointer down, both free movement and pointer-down ripples, press ripples plus held-drag wakes, or programmatic ripples only. |
 | `runInBackground` | `boolean` | `false` | Continues stepping while hidden or unfocused and catches up elapsed time when the browser throttles background callbacks. |
 | `pauseKey` | `string` | `undefined` | Toggles simulation pausing when this [`KeyboardEvent.code`](https://developer.mozilla.org/docs/Web/API/KeyboardEvent/code) is pressed, such as `Space` or `KeyP`. Keyboard input in interactive controls is ignored. |
 | `wakeStrength` | `number` | `0.54` | Overall pointer wake strength. Slow drags stay subtle; fast movement is clamped before it reaches the shader. |

package/dist/WaterDistortion.d.ts

@@ -1,7 +1,7 @@
 import type { CSSProperties, ReactNode } from "react";
 import { type WaterRenderMode, type WaterTextureFit, type WaterTextureSource } from "./core/waterRenderer";
 export type ReducedMotionBehavior = "respect" | "disable" | "ignore";
-export type WaterInteractionMode = "move" | "click" | "drag" | "event";
+export type WaterInteractionMode = "move" | "click" | "both" | "drag" | "event";
 export interface WaterRipplePosition {
     /** Horizontal position normalized from 0 (left) to 1 (right). */
     x: number;

package/dist/WaterDistortion.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"WaterDistortion.d.ts","sourceRoot":"","sources":["../src/WaterDistortion.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAStD,OAAO,EAEL,KAAK,eAAe,EAEpB,KAAK,eAAe,EACpB,KAAK,kBAAkB,EACxB,MAAM,sBAAsB,CAAC;AAS9B,MAAM,MAAM,qBAAqB,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,CAAC;AACrE,MAAM,MAAM,oBAAoB,GAAG,MAAM,GAAG,OAAO,GAAG,MAAM,GAAG,OAAO,CAAC;AAEvE,MAAM,WAAW,mBAAmB;IAClC,iEAAiE;IACjE,CAAC,EAAE,MAAM,CAAC;IACV,+DAA+D;IAC/D,CAAC,EAAE,MAAM,CAAC;CACX;AAED,MAAM,WAAW,qBAAqB;IACpC,aAAa,CAAC,QAAQ,EAAE,mBAAmB,GAAG,IAAI,CAAC;CACpD;AAED,MAAM,WAAW,oBAAoB;IACnC,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,IAAI,CAAC,EAAE,eAAe,CAAC;IACvB,OAAO,CAAC,EAAE,kBAAkB,CAAC;IAC7B,UAAU,CAAC,EAAE,eAAe,CAAC;IAC7B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,aAAa,CAAC,EAAE,qBAAqB,CAAC;IACtC,eAAe,CAAC,EAAE,oBAAoB,CAAC;IACvC,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAoOD,eAAO,MAAM,eAAe,wHA2qB1B,CAAC;AAEH,eAAO,MAAM,UAAU,wHAAkB,CAAC;AAC1C,YAAY,EAAE,eAAe,EAAE,eAAe,EAAE,kBAAkB,EAAE,CAAC"}
+{"version":3,"file":"WaterDistortion.d.ts","sourceRoot":"","sources":["../src/WaterDistortion.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAStD,OAAO,EAEL,KAAK,eAAe,EAEpB,KAAK,eAAe,EACpB,KAAK,kBAAkB,EACxB,MAAM,sBAAsB,CAAC;AAS9B,MAAM,MAAM,qBAAqB,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,CAAC;AACrE,MAAM,MAAM,oBAAoB,GAC5B,MAAM,GACN,OAAO,GACP,MAAM,GACN,MAAM,GACN,OAAO,CAAC;AAEZ,MAAM,WAAW,mBAAmB;IAClC,iEAAiE;IACjE,CAAC,EAAE,MAAM,CAAC;IACV,+DAA+D;IAC/D,CAAC,EAAE,MAAM,CAAC;CACX;AAED,MAAM,WAAW,qBAAqB;IACpC,aAAa,CAAC,QAAQ,EAAE,mBAAmB,GAAG,IAAI,CAAC;CACpD;AAED,MAAM,WAAW,oBAAoB;IACnC,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,IAAI,CAAC,EAAE,eAAe,CAAC;IACvB,OAAO,CAAC,EAAE,kBAAkB,CAAC;IAC7B,UAAU,CAAC,EAAE,eAAe,CAAC;IAC7B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,aAAa,CAAC,EAAE,qBAAqB,CAAC;IACtC,eAAe,CAAC,EAAE,oBAAoB,CAAC;IACvC,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAoOD,eAAO,MAAM,eAAe,wHAgrB1B,CAAC;AAEH,eAAO,MAAM,UAAU,wHAAkB,CAAC;AAC1C,YAAY,EAAE,eAAe,EAAE,eAAe,EAAE,kBAAkB,EAAE,CAAC"}

package/dist/water-distortion.cjs

@@ -240,5 +240,5 @@ void main() {
   vec3 color = base + highlight - vec3(0.015, 0.055, 0.070) * visibleTrough * 0.45;
   gl_FragColor = vec4(color, textureAlpha);
 }
-`;class Je{constructor(e,n=()=>{}){f(this,"gl");f(this,"isWebGL2");f(this,"canLinearFloat");f(this,"quadBuffer");f(this,"simulationProgram");f(this,"materialProgram");f(this,"backgroundTexture");f(this,"causticTexture");f(this,"stateTextures");f(this,"framebuffers");f(this,"readIndex",0);f(this,"simWidth",1);f(this,"simHeight",1);f(this,"cssWidth",1);f(this,"cssHeight",1);f(this,"textureSource");f(this,"textureImage");f(this,"textureReady",!1);f(this,"textureNeedsUpload",!1);f(this,"textureWidth",0);f(this,"textureHeight",0);f(this,"activityPixels");f(this,"wakeAUniforms",new Float32Array(J*4));f(this,"wakeBUniforms",new Float32Array(J*4));f(this,"wakeShapeUniforms",new Float32Array(J*4));this.canvas=e,this.requestRender=n;const{gl:t,isWebGL2:i,canLinearFloat:a}=nt(e);this.gl=t,this.isWebGL2=i,this.canLinearFloat=a,this.quadBuffer=V(t.createBuffer(),"WebGL buffer"),this.simulationProgram=ke(t,Ie,Qe),this.materialProgram=ke(t,Ie,Ze),this.backgroundTexture=V(t.createTexture(),"WebGL texture"),this.causticTexture=V(t.createTexture(),"WebGL texture"),t.bindBuffer(t.ARRAY_BUFFER,this.quadBuffer),t.bufferData(t.ARRAY_BUFFER,new Float32Array([-1,-1,1,-1,-1,1,1,1]),t.STATIC_DRAW),t.disable(t.DEPTH_TEST),t.disable(t.STENCIL_TEST),t.disable(t.BLEND),this.initializeBackgroundTexture(),this.initializeCausticTexture(),this.resize(1,1,1,192)}resize(e,n,t,i){this.cssWidth=Math.max(1,e),this.cssHeight=Math.max(1,n);const a=Math.min(2,Math.max(1,t||1)),s=Math.max(1,Math.round(this.cssWidth*a)),u=Math.max(1,Math.round(this.cssHeight*a));(this.canvas.width!==s||this.canvas.height!==u)&&(this.canvas.width=s,this.canvas.height=u);const c=Math.max(q,Math.round(i)),h=this.cssWidth/this.cssHeight;let x=c,E=c;h>=1?(E=Math.round(c/h),E<q&&(E=q,x=Math.round(q*h))):(x=Math.round(c*h),x<q&&(x=q,E=Math.round(q/h))),!(x===this.simWidth&&E===this.simHeight)&&(this.simWidth=x,this.simHeight=E,this.recreateState())}setTextureSource(e){if(e===this.textureSource||(this.textureSource=e,this.textureImage=void 0,this.textureReady=!1,this.textureNeedsUpload=!1,this.textureWidth=0,this.textureHeight=0,!e))return;if(typeof e!="string"){this.textureImage=e,this.textureNeedsUpload=!0;return}const n=new Image;n.crossOrigin="anonymous",n.onload=()=>{this.textureSource===e&&(this.textureImage=n,this.textureNeedsUpload=!0,this.requestRender())},n.onerror=()=>{this.textureSource===e&&(this.textureImage=void 0,this.textureReady=!1,this.textureNeedsUpload=!1)},n.src=e}step(e,n,t){if(!this.stateTextures||!this.framebuffers)return;const i=this.gl,a=1-this.readIndex;i.useProgram(this.simulationProgram.program),i.bindFramebuffer(i.FRAMEBUFFER,this.framebuffers[a]),i.viewport(0,0,this.simWidth,this.simHeight),i.activeTexture(i.TEXTURE0),i.bindTexture(i.TEXTURE_2D,this.stateTextures[this.readIndex]),this.prepareQuad(this.simulationProgram),this.setSimulationUniforms(e,n,t),i.drawArrays(i.TRIANGLE_STRIP,0,4),i.bindFramebuffer(i.FRAMEBUFFER,null),this.readIndex=a}render(e,n=0){const t=this.gl;this.stateTextures&&(e.texture?this.setTextureSource(e.texture):this.setTextureSource(void 0),this.uploadTextureIfNeeded(e),t.useProgram(this.materialProgram.program),t.bindFramebuffer(t.FRAMEBUFFER,null),t.viewport(0,0,this.canvas.width,this.canvas.height),t.clearColor(0,0,0,0),t.clear(t.COLOR_BUFFER_BIT),!(e.mode!=="dom"&&!this.textureReady)&&(t.activeTexture(t.TEXTURE0),t.bindTexture(t.TEXTURE_2D,this.stateTextures[this.readIndex]),t.activeTexture(t.TEXTURE1),t.bindTexture(t.TEXTURE_2D,this.backgroundTexture),t.activeTexture(t.TEXTURE2),t.bindTexture(t.TEXTURE_2D,this.causticTexture),this.prepareQuad(this.materialProgram),this.setMaterialUniforms(e,n),t.drawArrays(t.TRIANGLE_STRIP,0,4)))}hasVisibleActivity(){if(!this.framebuffers)return!1;const e=this.gl,n=this.framebuffers[this.readIndex],t=this.simWidth*this.simHeight*4;(!this.activityPixels||this.activityPixels.length!==t)&&(this.activityPixels=new Float32Array(t)),e.bindFramebuffer(e.FRAMEBUFFER,n);try{e.readPixels(0,0,this.simWidth,this.simHeight,e.RGBA,e.FLOAT,this.activityPixels)}finally{e.bindFramebuffer(e.FRAMEBUFFER,null)}return at(this.activityPixels,this.simWidth,this.simHeight)}clear(){const e=this.gl;if(this.framebuffers){e.viewport(0,0,this.simWidth,this.simHeight);for(const n of this.framebuffers)e.bindFramebuffer(e.FRAMEBUFFER,n),e.clearColor(0,0,0,1),e.clear(e.COLOR_BUFFER_BIT)}e.bindFramebuffer(e.FRAMEBUFFER,null),e.viewport(0,0,this.canvas.width,this.canvas.height),e.clearColor(0,0,0,0),e.clear(e.COLOR_BUFFER_BIT)}dispose(){var n,t;const e=this.gl;(n=this.stateTextures)==null||n.forEach(i=>e.deleteTexture(i)),(t=this.framebuffers)==null||t.forEach(i=>e.deleteFramebuffer(i)),e.deleteTexture(this.backgroundTexture),e.deleteTexture(this.causticTexture),e.deleteBuffer(this.quadBuffer),e.deleteProgram(this.simulationProgram.program),e.deleteProgram(this.materialProgram.program)}recreateState(){var s,u;const e=this.gl;(s=this.stateTextures)==null||s.forEach(c=>e.deleteTexture(c)),(u=this.framebuffers)==null||u.forEach(c=>e.deleteFramebuffer(c));const n=this.createStateTexture(),t=this.createStateTexture(),i=this.createFramebuffer(n),a=this.createFramebuffer(t);this.stateTextures=[n,t],this.framebuffers=[i,a],this.readIndex=0,this.clear()}createStateTexture(){const e=this.gl,n=V(e.createTexture(),"WebGL texture");if(e.bindTexture(e.TEXTURE_2D,n),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MIN_FILTER,this.canLinearFloat?e.LINEAR:e.NEAREST),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MAG_FILTER,this.canLinearFloat?e.LINEAR:e.NEAREST),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_WRAP_S,e.CLAMP_TO_EDGE),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_WRAP_T,e.CLAMP_TO_EDGE),this.isWebGL2){const t=e;t.texImage2D(t.TEXTURE_2D,0,t.RGBA32F,this.simWidth,this.simHeight,0,t.RGBA,t.FLOAT,null)}else e.texImage2D(e.TEXTURE_2D,0,e.RGBA,this.simWidth,this.simHeight,0,e.RGBA,e.FLOAT,null);return n}createFramebuffer(e){const n=this.gl,t=V(n.createFramebuffer(),"WebGL framebuffer");if(n.bindFramebuffer(n.FRAMEBUFFER,t),n.framebufferTexture2D(n.FRAMEBUFFER,n.COLOR_ATTACHMENT0,n.TEXTURE_2D,e,0),n.checkFramebufferStatus(n.FRAMEBUFFER)!==n.FRAMEBUFFER_COMPLETE)throw new Error("WaterDistortion could not create a float simulation target.");return n.bindFramebuffer(n.FRAMEBUFFER,null),t}initializeBackgroundTexture(){const e=this.gl;e.bindTexture(e.TEXTURE_2D,this.backgroundTexture),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MIN_FILTER,e.LINEAR),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MAG_FILTER,e.LINEAR),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_WRAP_S,e.CLAMP_TO_EDGE),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_WRAP_T,e.CLAMP_TO_EDGE),e.texImage2D(e.TEXTURE_2D,0,e.RGBA,1,1,0,e.RGBA,e.UNSIGNED_BYTE,new Uint8Array([18,28,26,255]))}initializeCausticTexture(){const e=this.gl;e.bindTexture(e.TEXTURE_2D,this.causticTexture),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MIN_FILTER,e.LINEAR_MIPMAP_LINEAR),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MAG_FILTER,e.LINEAR),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_WRAP_S,e.REPEAT),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_WRAP_T,e.REPEAT),e.texImage2D(e.TEXTURE_2D,0,e.RGBA,C,C,0,e.RGBA,e.UNSIGNED_BYTE,rt()),e.generateMipmap(e.TEXTURE_2D)}uploadTextureIfNeeded(e){if(e.mode==="dom"||!this.textureImage||!this.textureNeedsUpload&&!it(this.textureImage))return;const n=this.gl;try{n.bindTexture(n.TEXTURE_2D,this.backgroundTexture),n.pixelStorei(n.UNPACK_FLIP_Y_WEBGL,1),n.texImage2D(n.TEXTURE_2D,0,n.RGBA,n.RGBA,n.UNSIGNED_BYTE,this.textureImage),n.pixelStorei(n.UNPACK_FLIP_Y_WEBGL,0),[this.textureWidth,this.textureHeight]=tt(this.textureImage),this.textureReady=!0,this.textureNeedsUpload=!1}catch{this.textureReady=!1,this.textureNeedsUpload=!1,this.textureWidth=0,this.textureHeight=0}}prepareQuad(e){const n=this.gl;n.bindBuffer(n.ARRAY_BUFFER,this.quadBuffer),n.enableVertexAttribArray(e.position),n.vertexAttribPointer(e.position,2,n.FLOAT,!1,0,0)}setSimulationUniforms(e,n,t){const i=this.gl,a=this.simulationProgram.program,s=Math.min(e.length,J),u=this.wakeAUniforms,c=this.wakeBUniforms,h=this.wakeShapeUniforms,x=Math.max(0,e.length-J);u.fill(0),c.fill(0),h.fill(0);for(let E=0;E<s;E+=1){const g=e[x+E],p=E*4;u[p]=g.ax,u[p+1]=g.ay,u[p+2]=g.radius,u[p+3]=g.wakeStrength,c[p]=g.bx,c[p+1]=g.by,c[p+2]=g.wakeLength,c[p+3]=g.velocity,h[p]=g.troughStrength,h[p+1]=g.ridgeStrength,h[p+2]=g.ridgeOffset}i.uniform1i(S(i,a,"u_state"),0),i.uniform2f(S(i,a,"u_texel"),1/this.simWidth,1/this.simHeight),i.uniform1f(S(i,a,"u_delta"),t),i.uniform1f(S(i,a,"u_damping"),n.damping),i.uniform1f(S(i,a,"u_stiffness"),n.waveSpeed),i.uniform1f(S(i,a,"u_aspect"),this.cssWidth/this.cssHeight),i.uniform1i(S(i,a,"u_wakeCount"),s),i.uniform4fv(S(i,a,"u_wakeA[0]"),u),i.uniform4fv(S(i,a,"u_wakeB[0]"),c),i.uniform4fv(S(i,a,"u_wakeShape[0]"),h)}setMaterialUniforms(e,n){const t=this.gl,i=this.materialProgram.program,[a,s]=et(e.textureFit,this.textureWidth,this.textureHeight,this.cssWidth,this.cssHeight);t.uniform1i(S(t,i,"u_state"),0),t.uniform1i(S(t,i,"u_background"),1),t.uniform1i(S(t,i,"u_causticMap"),2),t.uniform2f(S(t,i,"u_texel"),1/this.simWidth,1/this.simHeight),t.uniform2f(S(t,i,"u_backgroundScale"),a,s),t.uniform1f(S(t,i,"u_domMode"),e.mode==="dom"?1:0),t.uniform1f(S(t,i,"u_normalScale"),e.normalScale),t.uniform1f(S(t,i,"u_refractionStrength"),e.refractionStrength),t.uniform1f(S(t,i,"u_specularIntensity"),e.specularIntensity),t.uniform1f(S(t,i,"u_crestIntensity"),e.crestIntensity),t.uniform1f(S(t,i,"u_causticIntensity"),e.causticIntensity),t.uniform1f(S(t,i,"u_time"),n%1e3)}}function et(r,e,n,t,i){if(r==="fill"||!Number.isFinite(e)||!Number.isFinite(n)||!Number.isFinite(t)||!Number.isFinite(i)||e<=0||n<=0||t<=0||i<=0)return[1,1];if(r==="none")return[t/e,i/n];const a=e/n,s=t/i;return r==="cover"?a>s?[s/a,1]:[1,a/s]:a>s?[1,a/s]:[s/a,1]}function tt(r){const e=r,n=[[e.naturalWidth,e.naturalHeight],[e.videoWidth,e.videoHeight],[e.displayWidth,e.displayHeight],[e.width,e.height]];for(const[t,i]of n)if(typeof t=="number"&&typeof i=="number"&&Number.isFinite(t)&&Number.isFinite(i)&&t>0&&i>0)return[t,i];return[0,0]}function rt(){const r=new Uint8Array(C*C*4);for(let e=0;e<C;e+=1)for(let n=0;n<C;n+=1){const t=(n+.5)/C,i=(e+.5)/C,a=Math.round(ce(t,i,0)*255),s=Math.round(ce(t,i,11)*255),u=Math.round(ce(t,i,23)*255),c=Math.round(ce(t,i,37)*255),h=(e*C+n)*4;r[h]=a,r[h+1]=s,r[h+2]=u,r[h+3]=c}return r}function ce(r,e,n){const t=Math.sin(se*(e*2+n*.013))*.12+Math.sin(se*(r*3+e+n*.021))*.06,i=Math.cos(se*(r*2+n*.017))*.12+Math.sin(se*(e*3-r+n*.019))*.06,a=r*oe+t,s=e*oe+i,u=Math.floor(a),c=Math.floor(s);let h=Number.POSITIVE_INFINITY,x=Number.POSITIVE_INFINITY,E=0,g=0;for(let P=-1;P<=1;P+=1)for(let U=-1;U<=1;U+=1){const k=u+U,B=c+P,b=Fe(k,oe),I=Fe(B,oe),z=k+.16+me(b,I,n)*.68,W=B+.16+me(b,I,n+1)*.68,D=Math.hypot(a-z,s-W);D<h?(x=h,h=D,E=b,g=I):D<x&&(x=D)}const p=x-h,A=1-Le(.025,.13,p),w=1-Le(.08,.34,p),N=.74+me(E,g,n+2)*.26,H=A*A*.58+w*.34;return We(Math.pow(H*N,1.12))}function me(r,e,n){const t=Math.sin(r*127.1+e*311.7+n*74.7)*43758.5453123;return t-Math.floor(t)}function Fe(r,e){return(r%e+e)%e}function Le(r,e,n){const t=We((n-r)/(e-r));return t*t*(3-t*2)}function We(r){return Math.min(1,Math.max(0,r))}function nt(r){const e={alpha:!0,antialias:!1,depth:!1,stencil:!1,premultipliedAlpha:!1,preserveDrawingBuffer:!1},n=r.getContext("webgl2",e);if(n){if(!n.getExtension("EXT_color_buffer_float"))throw new Error("WaterDistortion requires float render targets.");return{gl:n,isWebGL2:!0,canLinearFloat:!!n.getExtension("OES_texture_float_linear")}}const t=r.getContext("webgl",e)||r.getContext("experimental-webgl",e);if(!t)throw new Error("WaterDistortion requires WebGL.");if(!t.getExtension("OES_texture_float")||!t.getExtension("WEBGL_color_buffer_float")&&!t.getExtension("EXT_color_buffer_float"))throw new Error("WaterDistortion requires float texture support.");return{gl:t,isWebGL2:!1,canLinearFloat:!!t.getExtension("OES_texture_float_linear")}}function ke(r,e,n){const t=Ue(r,r.VERTEX_SHADER,e),i=Ue(r,r.FRAGMENT_SHADER,n),a=V(r.createProgram(),"WebGL program");if(r.attachShader(a,t),r.attachShader(a,i),r.linkProgram(a),r.deleteShader(t),r.deleteShader(i),!r.getProgramParameter(a,r.LINK_STATUS)){const u=r.getProgramInfoLog(a)||"Unknown shader link error.";throw r.deleteProgram(a),new Error(u)}const s=r.getAttribLocation(a,"a_position");if(s<0)throw new Error("WaterDistortion could not bind its quad attribute.");return{program:a,position:s}}function Ue(r,e,n){const t=V(r.createShader(e),"WebGL shader");if(r.shaderSource(t,n),r.compileShader(t),!r.getShaderParameter(t,r.COMPILE_STATUS)){const i=r.getShaderInfoLog(t)||"Unknown shader compile error.";throw r.deleteShader(t),new Error(i)}return t}function S(r,e,n){const t=r.getUniformLocation(e,n);if(!t)throw new Error(`WaterDistortion could not bind uniform ${n}.`);return t}function V(r,e){if(!r)throw new Error(`WaterDistortion could not create ${e}.`);return r}function it(r){return typeof HTMLCanvasElement<"u"&&r instanceof HTMLCanvasElement||typeof HTMLVideoElement<"u"&&r instanceof HTMLVideoElement||typeof OffscreenCanvas<"u"&&r instanceof OffscreenCanvas}function at(r,e,n,t=$e){const i=Math.max(0,Math.floor(e)),a=Math.max(0,Math.floor(n));if(i===0||a===0)return!1;const s=(u,c)=>r[(c*i+u)*4]??0;for(let u=0;u<a;u+=1)for(let c=0;c<i;c+=1){const h=(u*i+c)*4,x=r[h]??0,E=r[h+1]??0;if(x<-t.trough||Math.abs(E)>t.velocity)return!0;const g=c>0?s(c-1,u):x,p=c<i-1?s(c+1,u):x,A=u>0?s(c,u-1):x,w=u<a-1?s(c,u+1):x,N=Math.hypot(p-g,w-A),H=Math.abs(g+p+A+w-x*4);if(N>t.gradient||H>t.curvature)return!0}return!1}const L={width:1,height:1,interactionRadius:25,wakeStrength:.54,troughStrength:.92,ridgeStrength:.46,ridgeOffset:10,wakeLength:84,velocityScale:1,velocityClamp:1.35,cursorSmoothing:.2,segmentSpacing:18},ot=24;function ge(r){return{width:Math.max(1,r.width??L.width),height:Math.max(1,r.height??L.height),interactionRadius:Math.max(1,r.interactionRadius??L.interactionRadius),wakeStrength:Math.max(0,r.wakeStrength??L.wakeStrength),troughStrength:Math.max(0,r.troughStrength??L.troughStrength),ridgeStrength:Math.max(0,r.ridgeStrength??L.ridgeStrength),ridgeOffset:Math.max(0,r.ridgeOffset??L.ridgeOffset),wakeLength:Math.max(1,r.wakeLength??L.wakeLength),velocityScale:Math.max(.01,r.velocityScale??L.velocityScale),velocityClamp:Math.max(.05,r.velocityClamp??L.velocityClamp),cursorSmoothing:d(r.cursorSmoothing??L.cursorSmoothing,0,.9),segmentSpacing:Math.max(1,r.segmentSpacing??L.segmentSpacing)}}function De(r,e,n=r.timeStamp){const t=typeof r.getCoalescedEvents=="function"?r.getCoalescedEvents():[],i=t.length>0?t:[r],a=n-r.timeStamp;return i.map(s=>({x:s.clientX-e.left,y:s.clientY-e.top,time:s.timeStamp+a}))}class st{constructor(e={}){f(this,"options");f(this,"previous");f(this,"smoothedVelocity",0);f(this,"disturbances",[]);this.options=ge(e)}configure(e){this.options=ge({...this.options,...e})}reset(){this.previous=void 0,this.smoothedVelocity=0,this.disturbances.length=0}addSample(e){this.disturbances.length=0;const n=this.clampSample(e),t=this.previous;if(!t)return this.previous=n,this.disturbances;n.time<=t.time&&(n.time=t.time+.01);const i=this.smoothSample(t,n),a=je(t,i);if(a<.35)return this.previous=i,this.disturbances;const s=a/Math.max(.01,i.time-t.time),u=d(1-this.options.cursorSmoothing,.12,1);this.smoothedVelocity=O(this.smoothedVelocity,s,u),this.previous=i;const c=Math.min(ot,Math.max(1,Math.ceil(a/this.options.segmentSpacing)));for(let h=0;h<c;h+=1){const x=h/c,E=(h+1)/c;this.disturbances.push(ve(Pe(t,i,x),Pe(t,i,E),this.smoothedVelocity,this.options))}return this.disturbances}clampSample(e){return{x:d(e.x,0,this.options.width),y:d(e.y,0,this.options.height),time:e.time}}smoothSample(e,n){const t=1-this.options.cursorSmoothing;return{x:O(e.x,n.x,t),y:O(e.y,n.y,t),time:n.time}}}function ve(r,e,n,t){const i=ge(t),a=d(n*i.velocityScale/i.velocityClamp,0,1),s=d(r.y/i.height,0,1),u=d(e.y/i.height,0,1),c=i.wakeLength*O(.55,1.35,a);return{ax:d(r.x/i.width,0,1),ay:1-s,bx:d(e.x/i.width,0,1),by:1-u,radius:i.interactionRadius/i.height,wakeStrength:i.wakeStrength*O(.18,1,a),troughStrength:i.troughStrength,ridgeStrength:i.ridgeStrength,ridgeOffset:i.ridgeOffset/i.height,wakeLength:c/i.height,velocity:a}}function Pe(r,e,n){return{x:O(r.x,e.x,n),y:O(r.y,e.y,n),time:O(r.time,e.time,n)}}function ct(r){const e=d(r,.85,.998),n=Math.ceil(Math.log(.012)/Math.log(e));return d(n*(1e3/60),900,5200)}const _={mode:"texture",textureFit:"fill",damping:.98,waveSpeed:.4,normalScale:20,refractionStrength:.7,specularIntensity:1,crestIntensity:.2,causticIntensity:0,simulationResolution:192,wakeStrength:.54,interactionRadius:25,troughStrength:.92,ridgeStrength:.46,ridgeOffset:10,wakeLength:84,velocityScale:1,velocityClamp:1.35,cursorSmoothing:.2,segmentSpacing:18,idleTimeout:900,interactionMode:"move",runInBackground:!1,pauseKey:void 0},G=1e3/60,ut=4,Be=360,Ce=24,lt=200;function ht(r){return r instanceof Element&&r.closest("a, button, input, select, textarea, [contenteditable]:not([contenteditable=false])")!==null}function dt(r){const e=r.strength===void 0?void 0:r.strength/48;return{mode:r.mode??_.mode,texture:r.texture,textureFit:r.textureFit??_.textureFit,damping:d(r.damping??r.dissipation??_.damping,.85,.998),waveSpeed:d(r.waveSpeed??_.waveSpeed,.05,1),normalScale:d(r.normalScale??_.normalScale,1,80),refractionStrength:d(r.refractionStrength??_.refractionStrength,0,2.5),specularIntensity:d(r.specularIntensity??_.specularIntensity,0,3),crestIntensity:d(r.crestIntensity??_.crestIntensity,0,3),causticIntensity:d(r.causticIntensity??_.causticIntensity,0,3),simulationResolution:d(Math.round(r.simulationResolution??_.simulationResolution),64,384),wakeStrength:d(r.wakeStrength??r.rippleStrength??e??_.wakeStrength,0,3),interactionRadius:d(r.interactionRadius??_.interactionRadius,2,80),troughStrength:d(r.troughStrength??_.troughStrength,0,3),ridgeStrength:d(r.ridgeStrength??_.ridgeStrength,0,3),ridgeOffset:d(r.ridgeOffset??_.ridgeOffset,0,80),wakeLength:d(r.wakeLength??_.wakeLength,1,240),velocityScale:d(r.velocityScale??_.velocityScale,.01,4),velocityClamp:d(r.velocityClamp??_.velocityClamp,.05,8),cursorSmoothing:d(r.cursorSmoothing??_.cursorSmoothing,0,.9),segmentSpacing:d(r.segmentSpacing??_.segmentSpacing,1,96),idleTimeout:Math.max(120,r.idleTimeout??_.idleTimeout),interactionMode:r.interactionMode??_.interactionMode,runInBackground:r.runInBackground??_.runInBackground,pauseKey:r.pauseKey||_.pauseKey}}function Ne(r,e,n){const t=d(r.x,0,1)*n.width,i=d(r.y,0,1)*n.height,a=Math.max(.5,e.interactionRadius*.08),s=e.velocityClamp/e.velocityScale,u={...e,width:n.width,height:n.height,wakeLength:e.interactionRadius*1.5};return[ve({x:t-a,y:i},{x:t+a,y:i},s,u),ve({x:t,y:i-a},{x:t,y:i+a},s,u)]}function ft(r){const[e,n]=m.useState(!1);return m.useEffect(()=>{if(!r||typeof window>"u"||!window.matchMedia){n(!1);return}const t=window.matchMedia("(prefers-reduced-motion: reduce)");n(t.matches);const i=a=>{n(a.matches)};return t.addEventListener("change",i),()=>{t.removeEventListener("change",i)}},[r]),e}const Xe=m.forwardRef(function(e,n){const{underlay:t,children:i,foreground:a,className:s,style:u,reducedMotion:c="respect"}=e,h=m.useRef(null),x=m.useRef(null),E=m.useRef(null),g=m.useRef(new st),p=m.useRef(null),A=m.useRef(null),w=m.useRef(()=>{}),N=m.useRef(()=>{}),H=m.useRef(()=>{}),P=m.useRef([]),U=m.useRef(!0),k=m.useRef(!0),B=m.useRef(!1),b=m.useRef(!1),I=m.useRef(null),z=m.useRef(0),W=m.useRef(0),D=m.useRef(0),R=dt(e),v=m.useRef(R),j=m.useRef({width:1,height:1}),Ge=ft(c==="respect"),ue=c==="disable"||c==="respect"&&Ge,Oe=a??i;v.current=R,m.useImperativeHandle(n,()=>({triggerRipple(T){B.current||b.current||H.current(Ne(T,v.current,j.current))}}),[]),m.useEffect(()=>{var T;B.current=ue,ue&&(g.current.reset(),I.current=null,P.current=[],z.current=0,W.current=0,D.current=0,(T=E.current)==null||T.clear()),w.current()},[ue]),m.useEffect(()=>{const T=E.current;if(!T)return;const{width:K,height:M}=j.current;T.resize(K,M,window.devicePixelRatio,R.simulationResolution),T.setTextureSource(R.texture),w.current()},[R.mode,R.texture,R.textureFit,R.damping,R.waveSpeed,R.normalScale,R.refractionStrength,R.specularIntensity,R.crestIntensity,R.causticIntensity,R.simulationResolution]),m.useEffect(()=>{const T=h.current,K=x.current;if(!T||!K)return;k.current=typeof document.hasFocus=="function"?document.hasFocus():!0;let M=null,ie,ee=G,xe=!1,te;const Y=()=>{p.current!==null&&(window.cancelAnimationFrame(p.current),p.current=null),A.current!==null&&(window.clearTimeout(A.current),A.current=null)},ze=(o,l)=>{g.current.configure({width:o,height:l,interactionRadius:v.current.interactionRadius,wakeStrength:v.current.wakeStrength,troughStrength:v.current.troughStrength,ridgeStrength:v.current.ridgeStrength,ridgeOffset:v.current.ridgeOffset,wakeLength:v.current.wakeLength,velocityScale:v.current.velocityScale,velocityClamp:v.current.velocityClamp,cursorSmoothing:v.current.cursorSmoothing,segmentSpacing:v.current.segmentSpacing})},Ke=(o,l)=>{const F=Math.max(1,o),y=Math.max(1,l);j.current={width:F,height:y},ze(F,y),M==null||M.resize(F,y,window.devicePixelRatio,v.current.simulationResolution)},Ee=()=>{M==null||M.render(v.current,performance.now()*.001)},X=()=>{ie=void 0,ee=G},re=()=>{Y(),g.current.reset(),I.current=null,X(),te===void 0&&(te=performance.now())},$=()=>{const o=v.current;let l=!1;if(!(!B.current&&!b.current&&U.current&&(o.runInBackground||!document.hidden&&k.current))){X();return}if(te!==void 0){const y=performance.now()-te;z.current+=y,W.current+=y,D.current+=y,te=void 0,l=!0}(!o.runInBackground||l)&&X(),Ee(),w.current()},pe=o=>{p.current=null;const l=v.current;if(!M||b.current||!U.current||!l.runInBackground&&(document.hidden||!k.current)){X();return}if(B.current){P.current=[],M.render(l,o*.001),X();return}const F=l.runInBackground?Be:ut,y=ie===void 0?G:d(o-ie,0,l.runInBackground?G*Be:64);ie=o,ee=Math.min(ee+y,G*F);let Z=P.current.splice(0),Ae=0;for(;ee>=G&&Ae<F;)M.step(Z,l,1),Z=[],ee-=G,Ae+=1;if(M.render(l,o*.001),P.current.length>0){w.current();return}if(o<z.current){w.current();return}if(xe){o<W.current?w.current():X();return}if(o<D.current){w.current();return}try{M.hasVisibleActivity()?(D.current=o+lt,w.current()):X()}catch{xe=!0,o<W.current?w.current():X()}},le=()=>{b.current||p.current!==null||A.current!==null||(v.current.runInBackground&&document.hidden?A.current=window.setTimeout(()=>{A.current=null,pe(performance.now())},G):p.current=window.requestAnimationFrame(pe))};w.current=le;try{M=new Je(K,()=>{w.current()}),E.current=M,M.setTextureSource(v.current.texture)}catch{return K.style.display="none",E.current=null,w.current=()=>{},()=>{}}const he=()=>{const o=K.getBoundingClientRect();return Ke(o.width,o.height),o},_e=()=>{he(),Ee()},de=o=>{if(b.current||o.length===0)return;const l=P.current;for(const Z of o)l.push(Z);l.length>Ce&&l.splice(0,l.length-Ce);const y=performance.now()+v.current.idleTimeout;z.current=Math.max(z.current,y),W.current=Math.max(W.current,y+ct(v.current.damping)),D.current=0,le()};H.current=de;const Se=o=>{const l=v.current;if(B.current||b.current||!U.current||l.interactionMode==="event"||!l.runInBackground&&(document.hidden||!k.current)||o.pointerType==="touch"&&!o.isPrimary)return;g.current.reset();const F=he(),[y]=De(o,F,performance.now());y&&((l.interactionMode==="click"||l.interactionMode==="drag")&&de(Ne({x:y.x/j.current.width,y:y.y/j.current.height},l,j.current)),l.interactionMode==="drag"?(I.current=o.pointerId,g.current.addSample(y)):l.interactionMode==="move"&&g.current.addSample(y))},Te=o=>{const l=v.current;if(B.current||b.current||!U.current||l.interactionMode!=="move"&&(l.interactionMode!=="drag"||I.current!==o.pointerId)||!l.runInBackground&&(document.hidden||!k.current)||o.pointerType==="touch"&&!o.isPrimary)return;const F=he(),y=De(o,F,performance.now());for(const Z of y)de(g.current.addSample(Z))},Q=o=>{I.current!==null&&I.current!==o.pointerId||(I.current=null,g.current.reset())},Re=o=>{const l=v.current.pauseKey;!l||o.code!==l||o.repeat||o.altKey||o.ctrlKey||o.metaKey||ht(o.target)||(o.preventDefault(),b.current=!b.current,b.current?re():(Y(),$()))},ye=()=>{Y(),document.hidden&&!v.current.runInBackground?re():$()},we=()=>{k.current=!1,v.current.runInBackground?(Y(),$()):re()},be=()=>{k.current=!0,Y(),$()},Ye=()=>{Y(),!v.current.runInBackground&&(document.hidden||!k.current)?re():$()};N.current=Ye,_e();const Me=new ResizeObserver(()=>{_e(),le()});Me.observe(K);let ne;return"IntersectionObserver"in window&&(ne=new IntersectionObserver(o=>{const l=o[0];U.current=l?l.isIntersecting:!0,U.current?$():re()}),ne.observe(T)),T.addEventListener("pointerdown",Se,{passive:!0}),T.addEventListener("pointermove",Te,{passive:!0}),T.addEventListener("pointerup",Q,{passive:!0}),T.addEventListener("pointerleave",Q,{passive:!0}),T.addEventListener("pointercancel",Q,{passive:!0}),window.addEventListener("blur",we),window.addEventListener("focus",be),document.addEventListener("keydown",Re),document.addEventListener("visibilitychange",ye),()=>{var o;Y(),Me.disconnect(),ne==null||ne.disconnect(),T.removeEventListener("pointerdown",Se),T.removeEventListener("pointermove",Te),T.removeEventListener("pointerup",Q),T.removeEventListener("pointerleave",Q),T.removeEventListener("pointercancel",Q),window.removeEventListener("blur",we),window.removeEventListener("focus",be),document.removeEventListener("keydown",Re),document.removeEventListener("visibilitychange",ye),(o=E.current)==null||o.dispose(),E.current=null,w.current=()=>{},N.current=()=>{},H.current=()=>{}}},[]),m.useEffect(()=>{g.current.reset(),I.current=null},[R.interactionMode]),m.useEffect(()=>{N.current()},[R.runInBackground]),m.useEffect(()=>{!R.pauseKey&&b.current&&(b.current=!1,N.current())},[R.pauseKey]);const He={...u,position:"relative",overflow:"hidden",isolation:"isolate"};return ae.jsxs("div",{ref:h,className:s,style:He,children:[t?ae.jsx("div",{style:{position:"absolute",inset:0,zIndex:0,pointerEvents:"none",transform:"translateZ(0)"},children:t}):null,ae.jsx("canvas",{ref:x,"aria-hidden":"true",style:{position:"absolute",inset:0,zIndex:1,width:"100%",height:"100%",pointerEvents:"none",mixBlendMode:R.mode==="dom"?"screen":"normal"}}),ae.jsx("div",{style:{position:"relative",zIndex:2},children:Oe})]})}),mt=Xe;exports.WaterDistortion=Xe;exports.WaterLayer=mt;
+`;class Je{constructor(e,n=()=>{}){f(this,"gl");f(this,"isWebGL2");f(this,"canLinearFloat");f(this,"quadBuffer");f(this,"simulationProgram");f(this,"materialProgram");f(this,"backgroundTexture");f(this,"causticTexture");f(this,"stateTextures");f(this,"framebuffers");f(this,"readIndex",0);f(this,"simWidth",1);f(this,"simHeight",1);f(this,"cssWidth",1);f(this,"cssHeight",1);f(this,"textureSource");f(this,"textureImage");f(this,"textureReady",!1);f(this,"textureNeedsUpload",!1);f(this,"textureWidth",0);f(this,"textureHeight",0);f(this,"activityPixels");f(this,"wakeAUniforms",new Float32Array(J*4));f(this,"wakeBUniforms",new Float32Array(J*4));f(this,"wakeShapeUniforms",new Float32Array(J*4));this.canvas=e,this.requestRender=n;const{gl:t,isWebGL2:i,canLinearFloat:a}=nt(e);this.gl=t,this.isWebGL2=i,this.canLinearFloat=a,this.quadBuffer=V(t.createBuffer(),"WebGL buffer"),this.simulationProgram=ke(t,Ie,Qe),this.materialProgram=ke(t,Ie,Ze),this.backgroundTexture=V(t.createTexture(),"WebGL texture"),this.causticTexture=V(t.createTexture(),"WebGL texture"),t.bindBuffer(t.ARRAY_BUFFER,this.quadBuffer),t.bufferData(t.ARRAY_BUFFER,new Float32Array([-1,-1,1,-1,-1,1,1,1]),t.STATIC_DRAW),t.disable(t.DEPTH_TEST),t.disable(t.STENCIL_TEST),t.disable(t.BLEND),this.initializeBackgroundTexture(),this.initializeCausticTexture(),this.resize(1,1,1,192)}resize(e,n,t,i){this.cssWidth=Math.max(1,e),this.cssHeight=Math.max(1,n);const a=Math.min(2,Math.max(1,t||1)),s=Math.max(1,Math.round(this.cssWidth*a)),u=Math.max(1,Math.round(this.cssHeight*a));(this.canvas.width!==s||this.canvas.height!==u)&&(this.canvas.width=s,this.canvas.height=u);const c=Math.max(q,Math.round(i)),h=this.cssWidth/this.cssHeight;let x=c,E=c;h>=1?(E=Math.round(c/h),E<q&&(E=q,x=Math.round(q*h))):(x=Math.round(c*h),x<q&&(x=q,E=Math.round(q/h))),!(x===this.simWidth&&E===this.simHeight)&&(this.simWidth=x,this.simHeight=E,this.recreateState())}setTextureSource(e){if(e===this.textureSource||(this.textureSource=e,this.textureImage=void 0,this.textureReady=!1,this.textureNeedsUpload=!1,this.textureWidth=0,this.textureHeight=0,!e))return;if(typeof e!="string"){this.textureImage=e,this.textureNeedsUpload=!0;return}const n=new Image;n.crossOrigin="anonymous",n.onload=()=>{this.textureSource===e&&(this.textureImage=n,this.textureNeedsUpload=!0,this.requestRender())},n.onerror=()=>{this.textureSource===e&&(this.textureImage=void 0,this.textureReady=!1,this.textureNeedsUpload=!1)},n.src=e}step(e,n,t){if(!this.stateTextures||!this.framebuffers)return;const i=this.gl,a=1-this.readIndex;i.useProgram(this.simulationProgram.program),i.bindFramebuffer(i.FRAMEBUFFER,this.framebuffers[a]),i.viewport(0,0,this.simWidth,this.simHeight),i.activeTexture(i.TEXTURE0),i.bindTexture(i.TEXTURE_2D,this.stateTextures[this.readIndex]),this.prepareQuad(this.simulationProgram),this.setSimulationUniforms(e,n,t),i.drawArrays(i.TRIANGLE_STRIP,0,4),i.bindFramebuffer(i.FRAMEBUFFER,null),this.readIndex=a}render(e,n=0){const t=this.gl;this.stateTextures&&(e.texture?this.setTextureSource(e.texture):this.setTextureSource(void 0),this.uploadTextureIfNeeded(e),t.useProgram(this.materialProgram.program),t.bindFramebuffer(t.FRAMEBUFFER,null),t.viewport(0,0,this.canvas.width,this.canvas.height),t.clearColor(0,0,0,0),t.clear(t.COLOR_BUFFER_BIT),!(e.mode!=="dom"&&!this.textureReady)&&(t.activeTexture(t.TEXTURE0),t.bindTexture(t.TEXTURE_2D,this.stateTextures[this.readIndex]),t.activeTexture(t.TEXTURE1),t.bindTexture(t.TEXTURE_2D,this.backgroundTexture),t.activeTexture(t.TEXTURE2),t.bindTexture(t.TEXTURE_2D,this.causticTexture),this.prepareQuad(this.materialProgram),this.setMaterialUniforms(e,n),t.drawArrays(t.TRIANGLE_STRIP,0,4)))}hasVisibleActivity(){if(!this.framebuffers)return!1;const e=this.gl,n=this.framebuffers[this.readIndex],t=this.simWidth*this.simHeight*4;(!this.activityPixels||this.activityPixels.length!==t)&&(this.activityPixels=new Float32Array(t)),e.bindFramebuffer(e.FRAMEBUFFER,n);try{e.readPixels(0,0,this.simWidth,this.simHeight,e.RGBA,e.FLOAT,this.activityPixels)}finally{e.bindFramebuffer(e.FRAMEBUFFER,null)}return at(this.activityPixels,this.simWidth,this.simHeight)}clear(){const e=this.gl;if(this.framebuffers){e.viewport(0,0,this.simWidth,this.simHeight);for(const n of this.framebuffers)e.bindFramebuffer(e.FRAMEBUFFER,n),e.clearColor(0,0,0,1),e.clear(e.COLOR_BUFFER_BIT)}e.bindFramebuffer(e.FRAMEBUFFER,null),e.viewport(0,0,this.canvas.width,this.canvas.height),e.clearColor(0,0,0,0),e.clear(e.COLOR_BUFFER_BIT)}dispose(){var n,t;const e=this.gl;(n=this.stateTextures)==null||n.forEach(i=>e.deleteTexture(i)),(t=this.framebuffers)==null||t.forEach(i=>e.deleteFramebuffer(i)),e.deleteTexture(this.backgroundTexture),e.deleteTexture(this.causticTexture),e.deleteBuffer(this.quadBuffer),e.deleteProgram(this.simulationProgram.program),e.deleteProgram(this.materialProgram.program)}recreateState(){var s,u;const e=this.gl;(s=this.stateTextures)==null||s.forEach(c=>e.deleteTexture(c)),(u=this.framebuffers)==null||u.forEach(c=>e.deleteFramebuffer(c));const n=this.createStateTexture(),t=this.createStateTexture(),i=this.createFramebuffer(n),a=this.createFramebuffer(t);this.stateTextures=[n,t],this.framebuffers=[i,a],this.readIndex=0,this.clear()}createStateTexture(){const e=this.gl,n=V(e.createTexture(),"WebGL texture");if(e.bindTexture(e.TEXTURE_2D,n),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MIN_FILTER,this.canLinearFloat?e.LINEAR:e.NEAREST),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MAG_FILTER,this.canLinearFloat?e.LINEAR:e.NEAREST),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_WRAP_S,e.CLAMP_TO_EDGE),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_WRAP_T,e.CLAMP_TO_EDGE),this.isWebGL2){const t=e;t.texImage2D(t.TEXTURE_2D,0,t.RGBA32F,this.simWidth,this.simHeight,0,t.RGBA,t.FLOAT,null)}else e.texImage2D(e.TEXTURE_2D,0,e.RGBA,this.simWidth,this.simHeight,0,e.RGBA,e.FLOAT,null);return n}createFramebuffer(e){const n=this.gl,t=V(n.createFramebuffer(),"WebGL framebuffer");if(n.bindFramebuffer(n.FRAMEBUFFER,t),n.framebufferTexture2D(n.FRAMEBUFFER,n.COLOR_ATTACHMENT0,n.TEXTURE_2D,e,0),n.checkFramebufferStatus(n.FRAMEBUFFER)!==n.FRAMEBUFFER_COMPLETE)throw new Error("WaterDistortion could not create a float simulation target.");return n.bindFramebuffer(n.FRAMEBUFFER,null),t}initializeBackgroundTexture(){const e=this.gl;e.bindTexture(e.TEXTURE_2D,this.backgroundTexture),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MIN_FILTER,e.LINEAR),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MAG_FILTER,e.LINEAR),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_WRAP_S,e.CLAMP_TO_EDGE),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_WRAP_T,e.CLAMP_TO_EDGE),e.texImage2D(e.TEXTURE_2D,0,e.RGBA,1,1,0,e.RGBA,e.UNSIGNED_BYTE,new Uint8Array([18,28,26,255]))}initializeCausticTexture(){const e=this.gl;e.bindTexture(e.TEXTURE_2D,this.causticTexture),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MIN_FILTER,e.LINEAR_MIPMAP_LINEAR),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MAG_FILTER,e.LINEAR),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_WRAP_S,e.REPEAT),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_WRAP_T,e.REPEAT),e.texImage2D(e.TEXTURE_2D,0,e.RGBA,C,C,0,e.RGBA,e.UNSIGNED_BYTE,rt()),e.generateMipmap(e.TEXTURE_2D)}uploadTextureIfNeeded(e){if(e.mode==="dom"||!this.textureImage||!this.textureNeedsUpload&&!it(this.textureImage))return;const n=this.gl;try{n.bindTexture(n.TEXTURE_2D,this.backgroundTexture),n.pixelStorei(n.UNPACK_FLIP_Y_WEBGL,1),n.texImage2D(n.TEXTURE_2D,0,n.RGBA,n.RGBA,n.UNSIGNED_BYTE,this.textureImage),n.pixelStorei(n.UNPACK_FLIP_Y_WEBGL,0),[this.textureWidth,this.textureHeight]=tt(this.textureImage),this.textureReady=!0,this.textureNeedsUpload=!1}catch{this.textureReady=!1,this.textureNeedsUpload=!1,this.textureWidth=0,this.textureHeight=0}}prepareQuad(e){const n=this.gl;n.bindBuffer(n.ARRAY_BUFFER,this.quadBuffer),n.enableVertexAttribArray(e.position),n.vertexAttribPointer(e.position,2,n.FLOAT,!1,0,0)}setSimulationUniforms(e,n,t){const i=this.gl,a=this.simulationProgram.program,s=Math.min(e.length,J),u=this.wakeAUniforms,c=this.wakeBUniforms,h=this.wakeShapeUniforms,x=Math.max(0,e.length-J);u.fill(0),c.fill(0),h.fill(0);for(let E=0;E<s;E+=1){const g=e[x+E],p=E*4;u[p]=g.ax,u[p+1]=g.ay,u[p+2]=g.radius,u[p+3]=g.wakeStrength,c[p]=g.bx,c[p+1]=g.by,c[p+2]=g.wakeLength,c[p+3]=g.velocity,h[p]=g.troughStrength,h[p+1]=g.ridgeStrength,h[p+2]=g.ridgeOffset}i.uniform1i(S(i,a,"u_state"),0),i.uniform2f(S(i,a,"u_texel"),1/this.simWidth,1/this.simHeight),i.uniform1f(S(i,a,"u_delta"),t),i.uniform1f(S(i,a,"u_damping"),n.damping),i.uniform1f(S(i,a,"u_stiffness"),n.waveSpeed),i.uniform1f(S(i,a,"u_aspect"),this.cssWidth/this.cssHeight),i.uniform1i(S(i,a,"u_wakeCount"),s),i.uniform4fv(S(i,a,"u_wakeA[0]"),u),i.uniform4fv(S(i,a,"u_wakeB[0]"),c),i.uniform4fv(S(i,a,"u_wakeShape[0]"),h)}setMaterialUniforms(e,n){const t=this.gl,i=this.materialProgram.program,[a,s]=et(e.textureFit,this.textureWidth,this.textureHeight,this.cssWidth,this.cssHeight);t.uniform1i(S(t,i,"u_state"),0),t.uniform1i(S(t,i,"u_background"),1),t.uniform1i(S(t,i,"u_causticMap"),2),t.uniform2f(S(t,i,"u_texel"),1/this.simWidth,1/this.simHeight),t.uniform2f(S(t,i,"u_backgroundScale"),a,s),t.uniform1f(S(t,i,"u_domMode"),e.mode==="dom"?1:0),t.uniform1f(S(t,i,"u_normalScale"),e.normalScale),t.uniform1f(S(t,i,"u_refractionStrength"),e.refractionStrength),t.uniform1f(S(t,i,"u_specularIntensity"),e.specularIntensity),t.uniform1f(S(t,i,"u_crestIntensity"),e.crestIntensity),t.uniform1f(S(t,i,"u_causticIntensity"),e.causticIntensity),t.uniform1f(S(t,i,"u_time"),n%1e3)}}function et(r,e,n,t,i){if(r==="fill"||!Number.isFinite(e)||!Number.isFinite(n)||!Number.isFinite(t)||!Number.isFinite(i)||e<=0||n<=0||t<=0||i<=0)return[1,1];if(r==="none")return[t/e,i/n];const a=e/n,s=t/i;return r==="cover"?a>s?[s/a,1]:[1,a/s]:a>s?[1,a/s]:[s/a,1]}function tt(r){const e=r,n=[[e.naturalWidth,e.naturalHeight],[e.videoWidth,e.videoHeight],[e.displayWidth,e.displayHeight],[e.width,e.height]];for(const[t,i]of n)if(typeof t=="number"&&typeof i=="number"&&Number.isFinite(t)&&Number.isFinite(i)&&t>0&&i>0)return[t,i];return[0,0]}function rt(){const r=new Uint8Array(C*C*4);for(let e=0;e<C;e+=1)for(let n=0;n<C;n+=1){const t=(n+.5)/C,i=(e+.5)/C,a=Math.round(ce(t,i,0)*255),s=Math.round(ce(t,i,11)*255),u=Math.round(ce(t,i,23)*255),c=Math.round(ce(t,i,37)*255),h=(e*C+n)*4;r[h]=a,r[h+1]=s,r[h+2]=u,r[h+3]=c}return r}function ce(r,e,n){const t=Math.sin(se*(e*2+n*.013))*.12+Math.sin(se*(r*3+e+n*.021))*.06,i=Math.cos(se*(r*2+n*.017))*.12+Math.sin(se*(e*3-r+n*.019))*.06,a=r*oe+t,s=e*oe+i,u=Math.floor(a),c=Math.floor(s);let h=Number.POSITIVE_INFINITY,x=Number.POSITIVE_INFINITY,E=0,g=0;for(let P=-1;P<=1;P+=1)for(let U=-1;U<=1;U+=1){const k=u+U,B=c+P,b=Fe(k,oe),I=Fe(B,oe),z=k+.16+me(b,I,n)*.68,W=B+.16+me(b,I,n+1)*.68,D=Math.hypot(a-z,s-W);D<h?(x=h,h=D,E=b,g=I):D<x&&(x=D)}const p=x-h,A=1-Le(.025,.13,p),w=1-Le(.08,.34,p),N=.74+me(E,g,n+2)*.26,H=A*A*.58+w*.34;return We(Math.pow(H*N,1.12))}function me(r,e,n){const t=Math.sin(r*127.1+e*311.7+n*74.7)*43758.5453123;return t-Math.floor(t)}function Fe(r,e){return(r%e+e)%e}function Le(r,e,n){const t=We((n-r)/(e-r));return t*t*(3-t*2)}function We(r){return Math.min(1,Math.max(0,r))}function nt(r){const e={alpha:!0,antialias:!1,depth:!1,stencil:!1,premultipliedAlpha:!1,preserveDrawingBuffer:!1},n=r.getContext("webgl2",e);if(n){if(!n.getExtension("EXT_color_buffer_float"))throw new Error("WaterDistortion requires float render targets.");return{gl:n,isWebGL2:!0,canLinearFloat:!!n.getExtension("OES_texture_float_linear")}}const t=r.getContext("webgl",e)||r.getContext("experimental-webgl",e);if(!t)throw new Error("WaterDistortion requires WebGL.");if(!t.getExtension("OES_texture_float")||!t.getExtension("WEBGL_color_buffer_float")&&!t.getExtension("EXT_color_buffer_float"))throw new Error("WaterDistortion requires float texture support.");return{gl:t,isWebGL2:!1,canLinearFloat:!!t.getExtension("OES_texture_float_linear")}}function ke(r,e,n){const t=Ue(r,r.VERTEX_SHADER,e),i=Ue(r,r.FRAGMENT_SHADER,n),a=V(r.createProgram(),"WebGL program");if(r.attachShader(a,t),r.attachShader(a,i),r.linkProgram(a),r.deleteShader(t),r.deleteShader(i),!r.getProgramParameter(a,r.LINK_STATUS)){const u=r.getProgramInfoLog(a)||"Unknown shader link error.";throw r.deleteProgram(a),new Error(u)}const s=r.getAttribLocation(a,"a_position");if(s<0)throw new Error("WaterDistortion could not bind its quad attribute.");return{program:a,position:s}}function Ue(r,e,n){const t=V(r.createShader(e),"WebGL shader");if(r.shaderSource(t,n),r.compileShader(t),!r.getShaderParameter(t,r.COMPILE_STATUS)){const i=r.getShaderInfoLog(t)||"Unknown shader compile error.";throw r.deleteShader(t),new Error(i)}return t}function S(r,e,n){const t=r.getUniformLocation(e,n);if(!t)throw new Error(`WaterDistortion could not bind uniform ${n}.`);return t}function V(r,e){if(!r)throw new Error(`WaterDistortion could not create ${e}.`);return r}function it(r){return typeof HTMLCanvasElement<"u"&&r instanceof HTMLCanvasElement||typeof HTMLVideoElement<"u"&&r instanceof HTMLVideoElement||typeof OffscreenCanvas<"u"&&r instanceof OffscreenCanvas}function at(r,e,n,t=$e){const i=Math.max(0,Math.floor(e)),a=Math.max(0,Math.floor(n));if(i===0||a===0)return!1;const s=(u,c)=>r[(c*i+u)*4]??0;for(let u=0;u<a;u+=1)for(let c=0;c<i;c+=1){const h=(u*i+c)*4,x=r[h]??0,E=r[h+1]??0;if(x<-t.trough||Math.abs(E)>t.velocity)return!0;const g=c>0?s(c-1,u):x,p=c<i-1?s(c+1,u):x,A=u>0?s(c,u-1):x,w=u<a-1?s(c,u+1):x,N=Math.hypot(p-g,w-A),H=Math.abs(g+p+A+w-x*4);if(N>t.gradient||H>t.curvature)return!0}return!1}const L={width:1,height:1,interactionRadius:25,wakeStrength:.54,troughStrength:.92,ridgeStrength:.46,ridgeOffset:10,wakeLength:84,velocityScale:1,velocityClamp:1.35,cursorSmoothing:.2,segmentSpacing:18},ot=24;function ge(r){return{width:Math.max(1,r.width??L.width),height:Math.max(1,r.height??L.height),interactionRadius:Math.max(1,r.interactionRadius??L.interactionRadius),wakeStrength:Math.max(0,r.wakeStrength??L.wakeStrength),troughStrength:Math.max(0,r.troughStrength??L.troughStrength),ridgeStrength:Math.max(0,r.ridgeStrength??L.ridgeStrength),ridgeOffset:Math.max(0,r.ridgeOffset??L.ridgeOffset),wakeLength:Math.max(1,r.wakeLength??L.wakeLength),velocityScale:Math.max(.01,r.velocityScale??L.velocityScale),velocityClamp:Math.max(.05,r.velocityClamp??L.velocityClamp),cursorSmoothing:d(r.cursorSmoothing??L.cursorSmoothing,0,.9),segmentSpacing:Math.max(1,r.segmentSpacing??L.segmentSpacing)}}function De(r,e,n=r.timeStamp){const t=typeof r.getCoalescedEvents=="function"?r.getCoalescedEvents():[],i=t.length>0?t:[r],a=n-r.timeStamp;return i.map(s=>({x:s.clientX-e.left,y:s.clientY-e.top,time:s.timeStamp+a}))}class st{constructor(e={}){f(this,"options");f(this,"previous");f(this,"smoothedVelocity",0);f(this,"disturbances",[]);this.options=ge(e)}configure(e){this.options=ge({...this.options,...e})}reset(){this.previous=void 0,this.smoothedVelocity=0,this.disturbances.length=0}addSample(e){this.disturbances.length=0;const n=this.clampSample(e),t=this.previous;if(!t)return this.previous=n,this.disturbances;n.time<=t.time&&(n.time=t.time+.01);const i=this.smoothSample(t,n),a=je(t,i);if(a<.35)return this.previous=i,this.disturbances;const s=a/Math.max(.01,i.time-t.time),u=d(1-this.options.cursorSmoothing,.12,1);this.smoothedVelocity=O(this.smoothedVelocity,s,u),this.previous=i;const c=Math.min(ot,Math.max(1,Math.ceil(a/this.options.segmentSpacing)));for(let h=0;h<c;h+=1){const x=h/c,E=(h+1)/c;this.disturbances.push(ve(Pe(t,i,x),Pe(t,i,E),this.smoothedVelocity,this.options))}return this.disturbances}clampSample(e){return{x:d(e.x,0,this.options.width),y:d(e.y,0,this.options.height),time:e.time}}smoothSample(e,n){const t=1-this.options.cursorSmoothing;return{x:O(e.x,n.x,t),y:O(e.y,n.y,t),time:n.time}}}function ve(r,e,n,t){const i=ge(t),a=d(n*i.velocityScale/i.velocityClamp,0,1),s=d(r.y/i.height,0,1),u=d(e.y/i.height,0,1),c=i.wakeLength*O(.55,1.35,a);return{ax:d(r.x/i.width,0,1),ay:1-s,bx:d(e.x/i.width,0,1),by:1-u,radius:i.interactionRadius/i.height,wakeStrength:i.wakeStrength*O(.18,1,a),troughStrength:i.troughStrength,ridgeStrength:i.ridgeStrength,ridgeOffset:i.ridgeOffset/i.height,wakeLength:c/i.height,velocity:a}}function Pe(r,e,n){return{x:O(r.x,e.x,n),y:O(r.y,e.y,n),time:O(r.time,e.time,n)}}function ct(r){const e=d(r,.85,.998),n=Math.ceil(Math.log(.012)/Math.log(e));return d(n*(1e3/60),900,5200)}const _={mode:"texture",textureFit:"fill",damping:.98,waveSpeed:.4,normalScale:20,refractionStrength:.7,specularIntensity:1,crestIntensity:.2,causticIntensity:0,simulationResolution:192,wakeStrength:.54,interactionRadius:25,troughStrength:.92,ridgeStrength:.46,ridgeOffset:10,wakeLength:84,velocityScale:1,velocityClamp:1.35,cursorSmoothing:.2,segmentSpacing:18,idleTimeout:900,interactionMode:"move",runInBackground:!1,pauseKey:void 0},G=1e3/60,ut=4,Be=360,Ce=24,lt=200;function ht(r){return r instanceof Element&&r.closest("a, button, input, select, textarea, [contenteditable]:not([contenteditable=false])")!==null}function dt(r){const e=r.strength===void 0?void 0:r.strength/48;return{mode:r.mode??_.mode,texture:r.texture,textureFit:r.textureFit??_.textureFit,damping:d(r.damping??r.dissipation??_.damping,.85,.998),waveSpeed:d(r.waveSpeed??_.waveSpeed,.05,1),normalScale:d(r.normalScale??_.normalScale,1,80),refractionStrength:d(r.refractionStrength??_.refractionStrength,0,2.5),specularIntensity:d(r.specularIntensity??_.specularIntensity,0,3),crestIntensity:d(r.crestIntensity??_.crestIntensity,0,3),causticIntensity:d(r.causticIntensity??_.causticIntensity,0,3),simulationResolution:d(Math.round(r.simulationResolution??_.simulationResolution),64,384),wakeStrength:d(r.wakeStrength??r.rippleStrength??e??_.wakeStrength,0,3),interactionRadius:d(r.interactionRadius??_.interactionRadius,2,80),troughStrength:d(r.troughStrength??_.troughStrength,0,3),ridgeStrength:d(r.ridgeStrength??_.ridgeStrength,0,3),ridgeOffset:d(r.ridgeOffset??_.ridgeOffset,0,80),wakeLength:d(r.wakeLength??_.wakeLength,1,240),velocityScale:d(r.velocityScale??_.velocityScale,.01,4),velocityClamp:d(r.velocityClamp??_.velocityClamp,.05,8),cursorSmoothing:d(r.cursorSmoothing??_.cursorSmoothing,0,.9),segmentSpacing:d(r.segmentSpacing??_.segmentSpacing,1,96),idleTimeout:Math.max(120,r.idleTimeout??_.idleTimeout),interactionMode:r.interactionMode??_.interactionMode,runInBackground:r.runInBackground??_.runInBackground,pauseKey:r.pauseKey||_.pauseKey}}function Ne(r,e,n){const t=d(r.x,0,1)*n.width,i=d(r.y,0,1)*n.height,a=Math.max(.5,e.interactionRadius*.08),s=e.velocityClamp/e.velocityScale,u={...e,width:n.width,height:n.height,wakeLength:e.interactionRadius*1.5};return[ve({x:t-a,y:i},{x:t+a,y:i},s,u),ve({x:t,y:i-a},{x:t,y:i+a},s,u)]}function ft(r){const[e,n]=m.useState(!1);return m.useEffect(()=>{if(!r||typeof window>"u"||!window.matchMedia){n(!1);return}const t=window.matchMedia("(prefers-reduced-motion: reduce)");n(t.matches);const i=a=>{n(a.matches)};return t.addEventListener("change",i),()=>{t.removeEventListener("change",i)}},[r]),e}const Xe=m.forwardRef(function(e,n){const{underlay:t,children:i,foreground:a,className:s,style:u,reducedMotion:c="respect"}=e,h=m.useRef(null),x=m.useRef(null),E=m.useRef(null),g=m.useRef(new st),p=m.useRef(null),A=m.useRef(null),w=m.useRef(()=>{}),N=m.useRef(()=>{}),H=m.useRef(()=>{}),P=m.useRef([]),U=m.useRef(!0),k=m.useRef(!0),B=m.useRef(!1),b=m.useRef(!1),I=m.useRef(null),z=m.useRef(0),W=m.useRef(0),D=m.useRef(0),R=dt(e),v=m.useRef(R),j=m.useRef({width:1,height:1}),Ge=ft(c==="respect"),ue=c==="disable"||c==="respect"&&Ge,Oe=a??i;v.current=R,m.useImperativeHandle(n,()=>({triggerRipple(T){B.current||b.current||H.current(Ne(T,v.current,j.current))}}),[]),m.useEffect(()=>{var T;B.current=ue,ue&&(g.current.reset(),I.current=null,P.current=[],z.current=0,W.current=0,D.current=0,(T=E.current)==null||T.clear()),w.current()},[ue]),m.useEffect(()=>{const T=E.current;if(!T)return;const{width:K,height:M}=j.current;T.resize(K,M,window.devicePixelRatio,R.simulationResolution),T.setTextureSource(R.texture),w.current()},[R.mode,R.texture,R.textureFit,R.damping,R.waveSpeed,R.normalScale,R.refractionStrength,R.specularIntensity,R.crestIntensity,R.causticIntensity,R.simulationResolution]),m.useEffect(()=>{const T=h.current,K=x.current;if(!T||!K)return;k.current=typeof document.hasFocus=="function"?document.hasFocus():!0;let M=null,ie,ee=G,xe=!1,te;const Y=()=>{p.current!==null&&(window.cancelAnimationFrame(p.current),p.current=null),A.current!==null&&(window.clearTimeout(A.current),A.current=null)},ze=(o,l)=>{g.current.configure({width:o,height:l,interactionRadius:v.current.interactionRadius,wakeStrength:v.current.wakeStrength,troughStrength:v.current.troughStrength,ridgeStrength:v.current.ridgeStrength,ridgeOffset:v.current.ridgeOffset,wakeLength:v.current.wakeLength,velocityScale:v.current.velocityScale,velocityClamp:v.current.velocityClamp,cursorSmoothing:v.current.cursorSmoothing,segmentSpacing:v.current.segmentSpacing})},Ke=(o,l)=>{const F=Math.max(1,o),y=Math.max(1,l);j.current={width:F,height:y},ze(F,y),M==null||M.resize(F,y,window.devicePixelRatio,v.current.simulationResolution)},Ee=()=>{M==null||M.render(v.current,performance.now()*.001)},X=()=>{ie=void 0,ee=G},re=()=>{Y(),g.current.reset(),I.current=null,X(),te===void 0&&(te=performance.now())},$=()=>{const o=v.current;let l=!1;if(!(!B.current&&!b.current&&U.current&&(o.runInBackground||!document.hidden&&k.current))){X();return}if(te!==void 0){const y=performance.now()-te;z.current+=y,W.current+=y,D.current+=y,te=void 0,l=!0}(!o.runInBackground||l)&&X(),Ee(),w.current()},pe=o=>{p.current=null;const l=v.current;if(!M||b.current||!U.current||!l.runInBackground&&(document.hidden||!k.current)){X();return}if(B.current){P.current=[],M.render(l,o*.001),X();return}const F=l.runInBackground?Be:ut,y=ie===void 0?G:d(o-ie,0,l.runInBackground?G*Be:64);ie=o,ee=Math.min(ee+y,G*F);let Z=P.current.splice(0),Ae=0;for(;ee>=G&&Ae<F;)M.step(Z,l,1),Z=[],ee-=G,Ae+=1;if(M.render(l,o*.001),P.current.length>0){w.current();return}if(o<z.current){w.current();return}if(xe){o<W.current?w.current():X();return}if(o<D.current){w.current();return}try{M.hasVisibleActivity()?(D.current=o+lt,w.current()):X()}catch{xe=!0,o<W.current?w.current():X()}},le=()=>{b.current||p.current!==null||A.current!==null||(v.current.runInBackground&&document.hidden?A.current=window.setTimeout(()=>{A.current=null,pe(performance.now())},G):p.current=window.requestAnimationFrame(pe))};w.current=le;try{M=new Je(K,()=>{w.current()}),E.current=M,M.setTextureSource(v.current.texture)}catch{return K.style.display="none",E.current=null,w.current=()=>{},()=>{}}const he=()=>{const o=K.getBoundingClientRect();return Ke(o.width,o.height),o},_e=()=>{he(),Ee()},de=o=>{if(b.current||o.length===0)return;const l=P.current;for(const Z of o)l.push(Z);l.length>Ce&&l.splice(0,l.length-Ce);const y=performance.now()+v.current.idleTimeout;z.current=Math.max(z.current,y),W.current=Math.max(W.current,y+ct(v.current.damping)),D.current=0,le()};H.current=de;const Se=o=>{const l=v.current;if(B.current||b.current||!U.current||l.interactionMode==="event"||!l.runInBackground&&(document.hidden||!k.current)||o.pointerType==="touch"&&!o.isPrimary)return;g.current.reset();const F=he(),[y]=De(o,F,performance.now());y&&((l.interactionMode==="click"||l.interactionMode==="both"||l.interactionMode==="drag")&&de(Ne({x:y.x/j.current.width,y:y.y/j.current.height},l,j.current)),l.interactionMode==="drag"?(I.current=o.pointerId,g.current.addSample(y)):(l.interactionMode==="move"||l.interactionMode==="both")&&g.current.addSample(y))},Te=o=>{const l=v.current;if(B.current||b.current||!U.current||l.interactionMode!=="move"&&l.interactionMode!=="both"&&(l.interactionMode!=="drag"||I.current!==o.pointerId)||!l.runInBackground&&(document.hidden||!k.current)||o.pointerType==="touch"&&!o.isPrimary)return;const F=he(),y=De(o,F,performance.now());for(const Z of y)de(g.current.addSample(Z))},Q=o=>{I.current!==null&&I.current!==o.pointerId||(I.current=null,g.current.reset())},Re=o=>{const l=v.current.pauseKey;!l||o.code!==l||o.repeat||o.altKey||o.ctrlKey||o.metaKey||ht(o.target)||(o.preventDefault(),b.current=!b.current,b.current?re():(Y(),$()))},ye=()=>{Y(),document.hidden&&!v.current.runInBackground?re():$()},we=()=>{k.current=!1,v.current.runInBackground?(Y(),$()):re()},be=()=>{k.current=!0,Y(),$()},Ye=()=>{Y(),!v.current.runInBackground&&(document.hidden||!k.current)?re():$()};N.current=Ye,_e();const Me=new ResizeObserver(()=>{_e(),le()});Me.observe(K);let ne;return"IntersectionObserver"in window&&(ne=new IntersectionObserver(o=>{const l=o[0];U.current=l?l.isIntersecting:!0,U.current?$():re()}),ne.observe(T)),T.addEventListener("pointerdown",Se,{passive:!0}),T.addEventListener("pointermove",Te,{passive:!0}),T.addEventListener("pointerup",Q,{passive:!0}),T.addEventListener("pointerleave",Q,{passive:!0}),T.addEventListener("pointercancel",Q,{passive:!0}),window.addEventListener("blur",we),window.addEventListener("focus",be),document.addEventListener("keydown",Re),document.addEventListener("visibilitychange",ye),()=>{var o;Y(),Me.disconnect(),ne==null||ne.disconnect(),T.removeEventListener("pointerdown",Se),T.removeEventListener("pointermove",Te),T.removeEventListener("pointerup",Q),T.removeEventListener("pointerleave",Q),T.removeEventListener("pointercancel",Q),window.removeEventListener("blur",we),window.removeEventListener("focus",be),document.removeEventListener("keydown",Re),document.removeEventListener("visibilitychange",ye),(o=E.current)==null||o.dispose(),E.current=null,w.current=()=>{},N.current=()=>{},H.current=()=>{}}},[]),m.useEffect(()=>{g.current.reset(),I.current=null},[R.interactionMode]),m.useEffect(()=>{N.current()},[R.runInBackground]),m.useEffect(()=>{!R.pauseKey&&b.current&&(b.current=!1,N.current())},[R.pauseKey]);const He={...u,position:"relative",overflow:"hidden",isolation:"isolate"};return ae.jsxs("div",{ref:h,className:s,style:He,children:[t?ae.jsx("div",{style:{position:"absolute",inset:0,zIndex:0,pointerEvents:"none",transform:"translateZ(0)"},children:t}):null,ae.jsx("canvas",{ref:x,"aria-hidden":"true",style:{position:"absolute",inset:0,zIndex:1,width:"100%",height:"100%",pointerEvents:"none",mixBlendMode:R.mode==="dom"?"screen":"normal"}}),ae.jsx("div",{style:{position:"relative",zIndex:2},children:Oe})]})}),mt=Xe;exports.WaterDistortion=Xe;exports.WaterLayer=mt;
 //# sourceMappingURL=water-distortion.cjs.map