39 lines
773 B
TypeScript
39 lines
773 B
TypeScript
'use client'
|
|
|
|
interface WaterDistortionProps {
|
|
id?: string
|
|
intensity?: number
|
|
}
|
|
|
|
export default function WaterDistortion({
|
|
id = 'water-distortion',
|
|
intensity = 0.003,
|
|
}: WaterDistortionProps) {
|
|
return (
|
|
<filter id={id}>
|
|
<feTurbulence
|
|
type="fractalNoise"
|
|
baseFrequency={`${intensity} ${intensity * 1.5}`}
|
|
numOctaves={3}
|
|
seed={42}
|
|
result="turbulence"
|
|
>
|
|
<animate
|
|
attributeName="seed"
|
|
from="0"
|
|
to="100"
|
|
dur="10s"
|
|
repeatCount="indefinite"
|
|
/>
|
|
</feTurbulence>
|
|
<feDisplacementMap
|
|
in="SourceGraphic"
|
|
in2="turbulence"
|
|
scale={4}
|
|
xChannelSelector="R"
|
|
yChannelSelector="G"
|
|
/>
|
|
</filter>
|
|
)
|
|
}
|