react-smokey-fluid-cursor 2.0.0 → 2.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -211,6 +211,44 @@ main { position: relative; z-index: 1; }
211
211
  In development the package detects this and warns in the console rather than
212
212
  leaving you with a blank screen.
213
213
 
214
+ ## Presets
215
+
216
+ 100 ready-made looks ship with the package — every colour palette crossed with
217
+ every motion character, named `"<Palette> <Character>"`:
218
+
219
+ ```tsx
220
+ import { presets } from "react-smokey-fluid-cursor";
221
+
222
+ <SmokeyFluidCursor config={presets["Ocean Swirl"]} />
223
+ ```
224
+
225
+ | | |
226
+ | --- | --- |
227
+ | **Palettes** (20) | Spectrum, Sunset, Ocean, Mono, Aurora, Ember, Lagoon, Candy, Toxic, Royal, Sakura, Mint, Copper, Ultraviolet, Ice, Magma, Forest, Dusk, Cyber, Pastel |
228
+ | **Characters** (5) | Calm, Flow, Swirl, Storm, Wisp |
229
+
230
+ So `"Magma Storm"` is the magma palette at storm intensity, `"Ice Wisp"` is
231
+ pale and sparse, and so on.
232
+
233
+ Presets only set **appearance and physics** — never mounting or placement — so
234
+ they compose with your own `container`, `zIndex` and the rest:
235
+
236
+ ```tsx
237
+ initFluid({ ...presets["Cyber Swirl"], container: "#hero", position: "absolute" });
238
+ ```
239
+
240
+ Browse all 100 on the [live demo](https://faraasat.github.io/react-smokey-fluid-cursor/).
241
+
242
+ ### Helpers
243
+
244
+ | Export | Type | Description |
245
+ | --- | --- | --- |
246
+ | `presets` | `Record<PresetName, Preset>` | Every preset, keyed by name. |
247
+ | `presetNames` | `PresetName[]` | All 100 names, in order. |
248
+ | `paletteNames` | `PaletteName[]` | The 20 palettes. |
249
+ | `characterNames` | `CharacterName[]` | The 5 motion characters. |
250
+ | `getPreset(name)` | `Preset \| undefined` | Safe lookup for a user-supplied name. |
251
+
214
252
  ## Configuration
215
253
 
216
254
  Every option is optional.
package/dist/index.d.mts CHANGED
@@ -267,6 +267,114 @@ interface FluidHandle {
267
267
  */
268
268
  declare const initFluid: (incomingConfig?: Partial<ISmokeyFluidConfig>) => FluidHandle;
269
269
 
270
+ /**
271
+ * A named, ready-made configuration.
272
+ *
273
+ * Presets only set appearance and physics — never mounting or placement — so
274
+ * they compose with whatever `canvas`, `container` or `zIndex` you pass.
275
+ */
276
+ type Preset = Pick<Partial<ISmokeyFluidConfig>, "palette" | "colorIntensity" | "colorUpdateSpeed" | "curl" | "splatForce" | "splatRadius" | "densityDissipation" | "velocityDissipation" | "pressure" | "pressureIteration" | "shading">;
277
+ /**
278
+ * The colour side of a preset.
279
+ *
280
+ * `null` means "no palette": hues are generated across the full spectrum,
281
+ * which is the library's default behaviour.
282
+ */
283
+ declare const palettes: {
284
+ readonly Spectrum: null;
285
+ readonly Sunset: readonly ["#ff4ecd", "#ff8a4e", "#ffd24e"];
286
+ readonly Ocean: readonly ["#4ea8ff", "#4effd2", "#7c4dff"];
287
+ readonly Mono: readonly ["#ffffff"];
288
+ readonly Aurora: readonly ["#3affa3", "#38d9ff", "#8f7bff"];
289
+ readonly Ember: readonly ["#ff5722", "#ff9100", "#ffc400"];
290
+ readonly Lagoon: readonly ["#00c2a8", "#00a3ff", "#0057d9"];
291
+ readonly Candy: readonly ["#ff8fd0", "#ffa9f0", "#c79bff"];
292
+ readonly Toxic: readonly ["#b6ff00", "#4dff88", "#00ffc8"];
293
+ readonly Royal: readonly ["#5b2bff", "#8f4dff", "#c44dff"];
294
+ readonly Sakura: readonly ["#ffc2dd", "#ff8fb1", "#ff6f91"];
295
+ readonly Mint: readonly ["#9cffd6", "#5ef2c0", "#2fd6a5"];
296
+ readonly Copper: readonly ["#ff9a5a", "#e2703a", "#b34700"];
297
+ readonly Ultraviolet: readonly ["#7b2cff", "#b429ff", "#ff29f0"];
298
+ readonly Ice: readonly ["#c9f0ff", "#8ad4ff", "#4fb3ff"];
299
+ readonly Magma: readonly ["#ff2d2d", "#ff6a00", "#ffb300"];
300
+ readonly Forest: readonly ["#2f9e44", "#69db7c", "#a9e34b"];
301
+ readonly Dusk: readonly ["#3b3b98", "#7158e2", "#cd84f1"];
302
+ readonly Cyber: readonly ["#00fff0", "#ff00e0", "#fffb00"];
303
+ readonly Pastel: readonly ["#ffd6e0", "#c7ceea", "#b5ead7"];
304
+ };
305
+ /**
306
+ * The motion side of a preset — how the fluid moves, independent of colour.
307
+ */
308
+ declare const characters: {
309
+ readonly Calm: {
310
+ readonly curl: 3;
311
+ readonly splatForce: 4200;
312
+ readonly splatRadius: 0.45;
313
+ readonly densityDissipation: 4.6;
314
+ readonly velocityDissipation: 2.6;
315
+ readonly pressureIteration: 16;
316
+ readonly colorUpdateSpeed: 6;
317
+ };
318
+ readonly Flow: {
319
+ readonly curl: 10;
320
+ readonly splatForce: 6000;
321
+ readonly splatRadius: 0.5;
322
+ readonly densityDissipation: 3.5;
323
+ readonly velocityDissipation: 2;
324
+ readonly pressureIteration: 20;
325
+ readonly colorUpdateSpeed: 10;
326
+ };
327
+ readonly Swirl: {
328
+ readonly curl: 24;
329
+ readonly splatForce: 7200;
330
+ readonly splatRadius: 0.55;
331
+ readonly densityDissipation: 3;
332
+ readonly velocityDissipation: 1.6;
333
+ readonly pressureIteration: 24;
334
+ readonly colorUpdateSpeed: 12;
335
+ };
336
+ readonly Storm: {
337
+ readonly curl: 40;
338
+ readonly splatForce: 9500;
339
+ readonly splatRadius: 0.65;
340
+ readonly densityDissipation: 2.2;
341
+ readonly velocityDissipation: 1.2;
342
+ readonly pressureIteration: 28;
343
+ readonly colorUpdateSpeed: 16;
344
+ };
345
+ readonly Wisp: {
346
+ readonly curl: 6;
347
+ readonly splatForce: 3200;
348
+ readonly splatRadius: 0.32;
349
+ readonly densityDissipation: 6.5;
350
+ readonly velocityDissipation: 3.4;
351
+ readonly pressureIteration: 12;
352
+ readonly colorUpdateSpeed: 8;
353
+ };
354
+ };
355
+ type PaletteName = keyof typeof palettes;
356
+ type CharacterName = keyof typeof characters;
357
+ type PresetName = `${PaletteName} ${CharacterName}`;
358
+ /**
359
+ * 100 ready-made looks: every colour palette crossed with every motion
360
+ * character, named `"<Palette> <Character>"` — e.g. `"Ocean Swirl"`.
361
+ *
362
+ * ```ts
363
+ * import { initFluid, presets } from "smokey-fluid-cursor";
364
+ *
365
+ * initFluid(presets["Ocean Swirl"]);
366
+ * ```
367
+ */
368
+ declare const presets: Record<PresetName, Preset>;
369
+ /** Every preset name, in definition order. */
370
+ declare const presetNames: PresetName[];
371
+ /** The palette names presets are built from. */
372
+ declare const paletteNames: PaletteName[];
373
+ /** The motion characters presets are built from. */
374
+ declare const characterNames: CharacterName[];
375
+ /** Looks up a preset by name, returning `undefined` when it does not exist. */
376
+ declare const getPreset: (name: string) => Preset | undefined;
377
+
270
378
  interface SmokeyFluidCursorProps {
271
379
  /** Simulation options. See ISmokeyFluidConfig. */
272
380
  config?: Partial<ISmokeyFluidConfig>;
@@ -298,4 +406,4 @@ declare function useSmokeyFluidCursor(config?: Partial<ISmokeyFluidConfig>, cont
298
406
  */
299
407
  declare const SmokeyFluidCursor: React.ForwardRefExoticComponent<SmokeyFluidCursorProps & React.RefAttributes<FluidHandle>>;
300
408
 
301
- export { type DoubleFBO, type FBO, type FluidHandle, type GL, type GLExtInfo, type ISmokeyFluidConfig, SmokeyFluidCursor, type SmokeyFluidCursorProps, initFluid, useSmokeyFluidCursor };
409
+ export { type CharacterName, type DoubleFBO, type FBO, type FluidHandle, type GL, type GLExtInfo, type ISmokeyFluidConfig, type PaletteName, type Preset, type PresetName, SmokeyFluidCursor, type SmokeyFluidCursorProps, characterNames, getPreset, initFluid, paletteNames, presetNames, presets, useSmokeyFluidCursor };
package/dist/index.d.ts CHANGED
@@ -267,6 +267,114 @@ interface FluidHandle {
267
267
  */
268
268
  declare const initFluid: (incomingConfig?: Partial<ISmokeyFluidConfig>) => FluidHandle;
269
269
 
270
+ /**
271
+ * A named, ready-made configuration.
272
+ *
273
+ * Presets only set appearance and physics — never mounting or placement — so
274
+ * they compose with whatever `canvas`, `container` or `zIndex` you pass.
275
+ */
276
+ type Preset = Pick<Partial<ISmokeyFluidConfig>, "palette" | "colorIntensity" | "colorUpdateSpeed" | "curl" | "splatForce" | "splatRadius" | "densityDissipation" | "velocityDissipation" | "pressure" | "pressureIteration" | "shading">;
277
+ /**
278
+ * The colour side of a preset.
279
+ *
280
+ * `null` means "no palette": hues are generated across the full spectrum,
281
+ * which is the library's default behaviour.
282
+ */
283
+ declare const palettes: {
284
+ readonly Spectrum: null;
285
+ readonly Sunset: readonly ["#ff4ecd", "#ff8a4e", "#ffd24e"];
286
+ readonly Ocean: readonly ["#4ea8ff", "#4effd2", "#7c4dff"];
287
+ readonly Mono: readonly ["#ffffff"];
288
+ readonly Aurora: readonly ["#3affa3", "#38d9ff", "#8f7bff"];
289
+ readonly Ember: readonly ["#ff5722", "#ff9100", "#ffc400"];
290
+ readonly Lagoon: readonly ["#00c2a8", "#00a3ff", "#0057d9"];
291
+ readonly Candy: readonly ["#ff8fd0", "#ffa9f0", "#c79bff"];
292
+ readonly Toxic: readonly ["#b6ff00", "#4dff88", "#00ffc8"];
293
+ readonly Royal: readonly ["#5b2bff", "#8f4dff", "#c44dff"];
294
+ readonly Sakura: readonly ["#ffc2dd", "#ff8fb1", "#ff6f91"];
295
+ readonly Mint: readonly ["#9cffd6", "#5ef2c0", "#2fd6a5"];
296
+ readonly Copper: readonly ["#ff9a5a", "#e2703a", "#b34700"];
297
+ readonly Ultraviolet: readonly ["#7b2cff", "#b429ff", "#ff29f0"];
298
+ readonly Ice: readonly ["#c9f0ff", "#8ad4ff", "#4fb3ff"];
299
+ readonly Magma: readonly ["#ff2d2d", "#ff6a00", "#ffb300"];
300
+ readonly Forest: readonly ["#2f9e44", "#69db7c", "#a9e34b"];
301
+ readonly Dusk: readonly ["#3b3b98", "#7158e2", "#cd84f1"];
302
+ readonly Cyber: readonly ["#00fff0", "#ff00e0", "#fffb00"];
303
+ readonly Pastel: readonly ["#ffd6e0", "#c7ceea", "#b5ead7"];
304
+ };
305
+ /**
306
+ * The motion side of a preset — how the fluid moves, independent of colour.
307
+ */
308
+ declare const characters: {
309
+ readonly Calm: {
310
+ readonly curl: 3;
311
+ readonly splatForce: 4200;
312
+ readonly splatRadius: 0.45;
313
+ readonly densityDissipation: 4.6;
314
+ readonly velocityDissipation: 2.6;
315
+ readonly pressureIteration: 16;
316
+ readonly colorUpdateSpeed: 6;
317
+ };
318
+ readonly Flow: {
319
+ readonly curl: 10;
320
+ readonly splatForce: 6000;
321
+ readonly splatRadius: 0.5;
322
+ readonly densityDissipation: 3.5;
323
+ readonly velocityDissipation: 2;
324
+ readonly pressureIteration: 20;
325
+ readonly colorUpdateSpeed: 10;
326
+ };
327
+ readonly Swirl: {
328
+ readonly curl: 24;
329
+ readonly splatForce: 7200;
330
+ readonly splatRadius: 0.55;
331
+ readonly densityDissipation: 3;
332
+ readonly velocityDissipation: 1.6;
333
+ readonly pressureIteration: 24;
334
+ readonly colorUpdateSpeed: 12;
335
+ };
336
+ readonly Storm: {
337
+ readonly curl: 40;
338
+ readonly splatForce: 9500;
339
+ readonly splatRadius: 0.65;
340
+ readonly densityDissipation: 2.2;
341
+ readonly velocityDissipation: 1.2;
342
+ readonly pressureIteration: 28;
343
+ readonly colorUpdateSpeed: 16;
344
+ };
345
+ readonly Wisp: {
346
+ readonly curl: 6;
347
+ readonly splatForce: 3200;
348
+ readonly splatRadius: 0.32;
349
+ readonly densityDissipation: 6.5;
350
+ readonly velocityDissipation: 3.4;
351
+ readonly pressureIteration: 12;
352
+ readonly colorUpdateSpeed: 8;
353
+ };
354
+ };
355
+ type PaletteName = keyof typeof palettes;
356
+ type CharacterName = keyof typeof characters;
357
+ type PresetName = `${PaletteName} ${CharacterName}`;
358
+ /**
359
+ * 100 ready-made looks: every colour palette crossed with every motion
360
+ * character, named `"<Palette> <Character>"` — e.g. `"Ocean Swirl"`.
361
+ *
362
+ * ```ts
363
+ * import { initFluid, presets } from "smokey-fluid-cursor";
364
+ *
365
+ * initFluid(presets["Ocean Swirl"]);
366
+ * ```
367
+ */
368
+ declare const presets: Record<PresetName, Preset>;
369
+ /** Every preset name, in definition order. */
370
+ declare const presetNames: PresetName[];
371
+ /** The palette names presets are built from. */
372
+ declare const paletteNames: PaletteName[];
373
+ /** The motion characters presets are built from. */
374
+ declare const characterNames: CharacterName[];
375
+ /** Looks up a preset by name, returning `undefined` when it does not exist. */
376
+ declare const getPreset: (name: string) => Preset | undefined;
377
+
270
378
  interface SmokeyFluidCursorProps {
271
379
  /** Simulation options. See ISmokeyFluidConfig. */
272
380
  config?: Partial<ISmokeyFluidConfig>;
@@ -298,4 +406,4 @@ declare function useSmokeyFluidCursor(config?: Partial<ISmokeyFluidConfig>, cont
298
406
  */
299
407
  declare const SmokeyFluidCursor: React.ForwardRefExoticComponent<SmokeyFluidCursorProps & React.RefAttributes<FluidHandle>>;
300
408
 
301
- export { type DoubleFBO, type FBO, type FluidHandle, type GL, type GLExtInfo, type ISmokeyFluidConfig, SmokeyFluidCursor, type SmokeyFluidCursorProps, initFluid, useSmokeyFluidCursor };
409
+ export { type CharacterName, type DoubleFBO, type FBO, type FluidHandle, type GL, type GLExtInfo, type ISmokeyFluidConfig, type PaletteName, type Preset, type PresetName, SmokeyFluidCursor, type SmokeyFluidCursorProps, characterNames, getPreset, initFluid, paletteNames, presetNames, presets, useSmokeyFluidCursor };
package/dist/index.js CHANGED
@@ -1,7 +1,7 @@
1
1
  "use client";
2
- "use strict";var ct=Object.create;var K=Object.defineProperty;var lt=Object.getOwnPropertyDescriptor;var dt=Object.getOwnPropertyNames;var ft=Object.getPrototypeOf,mt=Object.prototype.hasOwnProperty;var vt=(s,i)=>{for(var m in i)K(s,m,{get:i[m],enumerable:!0})},Ae=(s,i,m,a)=>{if(i&&typeof i=="object"||typeof i=="function")for(let F of dt(i))!mt.call(s,F)&&F!==m&&K(s,F,{get:()=>i[F],enumerable:!(a=lt(i,F))||a.enumerable});return s};var ht=(s,i,m)=>(m=s!=null?ct(ft(s)):{},Ae(i||!s||!s.__esModule?K(m,"default",{value:s,enumerable:!0}):m,s)),pt=s=>Ae(K({},"__esModule",{value:!0}),s);var Ft={};vt(Ft,{SmokeyFluidCursor:()=>yt,initFluid:()=>ae,useSmokeyFluidCursor:()=>Ue});module.exports=pt(Ft);var P=ht(require("react"));var xt={simResolution:128,dyeResolution:1440,captureResolution:512,densityDissipation:3.5,velocityDissipation:2,pressure:.1,pressureIteration:20,curl:10,splatRadius:.5,splatForce:6e3,shading:!0,colorUpdateSpeed:10,paused:!1,backColor:{r:0,g:0,b:0},transparent:!0,id:"smokey-fluid-canvas",position:"fixed",zIndex:-9999,pointerEvents:!1,maxDpr:2,pauseOnHidden:!0,respectReducedMotion:!0,palette:null,colorIntensity:.15},Pe=s=>{var i;return s?typeof s!="string"?s:(i=document.querySelector(s))!=null?i:document.getElementById(s):null},gt=s=>{let i=s.trim().replace(/^#/,"");return i.length===3&&(i=i[0]+i[0]+i[1]+i[1]+i[2]+i[2]),/^[0-9a-f]{6}$/i.test(i)?{r:parseInt(i.slice(0,2),16)/255,g:parseInt(i.slice(2,4),16)/255,b:parseInt(i.slice(4,6),16)/255}:null},bt=s=>{var a;if(s>=0||typeof document=="undefined"||typeof process!="undefined"&&((a=process.env)==null?void 0:a.NODE_ENV)==="production")return;let i=window.getComputedStyle(document.body).backgroundColor;i&&i!=="transparent"&&!/rgba\(\s*0\s*,\s*0\s*,\s*0\s*,\s*0\s*\)/.test(i)&&console.warn("[smokey-fluid-cursor] <body> has an opaque background ("+i+") and the canvas sits at z-index "+s+`, so the effect will be painted over and stay invisible.
3
- Move the background to <html>, or give the canvas a zIndex above your background.`)},Rt=()=>typeof window!="undefined"&&typeof window.matchMedia=="function"&&window.matchMedia("(prefers-reduced-motion: reduce)").matches,se={dispose:()=>{},pause:()=>{},resume:()=>{},isPaused:()=>!0,setConfig:()=>{},splat:()=>{},canvas:null},ae=(s={})=>{var _e,Be,Ce;let i={...xt,...s};if(typeof document=="undefined")return se;let m=!1,a=(_e=Pe(i.canvas))!=null?_e:document.getElementById(i.id);if(!a){let e=(Be=Pe(i.container))!=null?Be:document.body;if(!e)return se;a=document.createElement("canvas"),a.id=i.id,e.appendChild(a),m=!0}i.className&&a.classList.add(...i.className.split(/\s+/));let F=i.position==="fixed"||i.position==="absolute";Object.assign(a.style,{position:i.position,...F?{top:"0",left:"0",width:"100%",height:"100%"}:{},display:"block",pointerEvents:i.pointerEvents?"auto":"none",zIndex:String(i.zIndex)}),bt(i.zIndex),I();class w{constructor(){this.id=-1;this.texcoordX=0;this.texcoordY=0;this.prevTexcoordX=0;this.prevTexcoordY=0;this.deltaX=0;this.deltaY=0;this.down=!1;this.moved=!1;this.color=[30,0,300]}}let b=[];b.push(new w);let t,p;try{({gl:t,ext:p}=v(a))}catch(e){typeof console!="undefined"&&console.warn("[smokey-fluid-cursor] WebGL is unavailable; the cursor effect is disabled.",e);let r=a,n=m;return{...se,dispose:()=>{n&&r.remove()},setConfig:o=>{o.zIndex!==void 0&&(r.style.zIndex=String(o.zIndex)),o.pointerEvents!==void 0&&(r.style.pointerEvents=o.pointerEvents?"auto":"none")},get canvas(){return r}}}p.supportLinearFiltering||(i.dyeResolution=512,i.shading=!1);function v(e){let r={alpha:!0,depth:!1,stencil:!1,antialias:!1,preserveDrawingBuffer:!1},n=e.getContext("webgl2",r),o=!!n;if(o||(n=e.getContext("webgl",r)||e.getContext("experimental-webgl",r)),!n)throw new Error("WebGL not supported");let u=null,l,c;if(o){let f=n;f.getExtension("EXT_color_buffer_float"),l=!!f.getExtension("OES_texture_float_linear"),c=f.HALF_FLOAT}else{let f=n;if(u=f.getExtension("OES_texture_half_float"),l=!!f.getExtension("OES_texture_half_float_linear"),!u)throw new Error("OES_texture_half_float not supported on WebGL1");c=u.HALF_FLOAT_OES}n.clearColor(0,0,0,1);let h=null,g=null,B=null;if(o){let f=n;h=x(f,f.RGBA16F,f.RGBA,c),g=x(f,f.RG16F,f.RG,c),B=x(f,f.R16F,f.RED,c)}else{let f=n;h=x(f,f.RGBA,f.RGBA,c),g=x(f,f.RGBA,f.RGBA,c),B=x(f,f.RGBA,f.RGBA,c)}return{gl:n,ext:{formatRGBA:h,formatRG:g,formatR:B,halfFloatTexType:c,supportLinearFiltering:l,isWebGL2:o}}}function x(e,r,n,o){if(!j(e,r,n,o)){if(e.RGBA16F!==void 0){let u=e;switch(r){case u.R16F:return x(u,u.RG16F,u.RG,o);case u.RG16F:return x(u,u.RGBA16F,u.RGBA,o);default:return null}}return null}return{internalFormat:r,format:n}}function j(e,r,n,o){let u=e.createTexture();if(!u)return!1;e.bindTexture(e.TEXTURE_2D,u),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MIN_FILTER,e.NEAREST),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MAG_FILTER,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),e.texImage2D(e.TEXTURE_2D,0,r,4,4,0,n,o,null);let l=e.createFramebuffer();if(!l)return!1;e.bindFramebuffer(e.FRAMEBUFFER,l),e.framebufferTexture2D(e.FRAMEBUFFER,e.COLOR_ATTACHMENT0,e.TEXTURE_2D,u,0);let c=e.checkFramebufferStatus(e.FRAMEBUFFER);return e.bindFramebuffer(e.FRAMEBUFFER,null),e.deleteFramebuffer(l),e.deleteTexture(u),c===e.FRAMEBUFFER_COMPLETE}class X{constructor(r,n){this.vertexShader=r,this.fragmentShaderSource=n,this.programs={},this.activeProgram=null,this.uniforms={}}setKeywords(r){let n=0;for(let u=0;u<r.length;u++)n+=st(r[u]);let o=this.programs[n];if(!o){let u=S(t,t.FRAGMENT_SHADER,de(this.fragmentShaderSource,r));o=ce(t,this.vertexShader,u),this.programs[n]=o}o!==this.activeProgram&&(this.uniforms=le(t,o),this.activeProgram=o)}bind(){this.activeProgram&&t.useProgram(this.activeProgram)}}class _{constructor(r,n){this.program=ce(t,r,n),this.uniforms=le(t,this.program)}bind(){this.program&&t.useProgram(this.program)}}function ce(e,r,n){let o=e.createProgram();return e.attachShader(o,r),e.attachShader(o,n),e.bindAttribLocation(o,0,"aPosition"),e.linkProgram(o),e.getProgramParameter(o,e.LINK_STATUS)||console.trace(e.getProgramInfoLog(o)),o}function le(e,r){let n={},o=e.getProgramParameter(r,e.ACTIVE_UNIFORMS);for(let u=0;u<o;u++){let l=e.getActiveUniform(r,u);if(!l)continue;let c=l.name,h=e.getUniformLocation(r,c);h&&(n[c]=h)}return n}function S(e,r,n){let o=e.createShader(r);return e.shaderSource(o,n),e.compileShader(o),e.getShaderParameter(o,e.COMPILE_STATUS)||console.trace(e.getShaderInfoLog(o)),o}function de(e,r){if(!r||r.length===0)return e;let n="";return r.forEach(o=>{n+="#define "+o+`
4
- `}),n+e}let L=S(t,t.VERTEX_SHADER,`precision highp float;
2
+ "use strict";var ht=Object.create;var q=Object.defineProperty;var xt=Object.getOwnPropertyDescriptor;var bt=Object.getOwnPropertyNames;var gt=Object.getPrototypeOf,Rt=Object.prototype.hasOwnProperty;var yt=(a,i)=>{for(var m in i)q(a,m,{get:i[m],enumerable:!0})},Ae=(a,i,m,u)=>{if(i&&typeof i=="object"||typeof i=="function")for(let g of bt(i))!Rt.call(a,g)&&g!==m&&q(a,g,{get:()=>i[g],enumerable:!(u=xt(i,g))||u.enumerable});return a};var Et=(a,i,m)=>(m=a!=null?ht(gt(a)):{},Ae(i||!a||!a.__esModule?q(m,"default",{value:a,enumerable:!0}):m,a)),Tt=a=>Ae(q({},"__esModule",{value:!0}),a);var Bt={};yt(Bt,{SmokeyFluidCursor:()=>_t,characterNames:()=>ze,getPreset:()=>Oe,initFluid:()=>ce,paletteNames:()=>Ne,presetNames:()=>Ie,presets:()=>K,useSmokeyFluidCursor:()=>Xe});module.exports=Tt(Bt);var A=Et(require("react"));var Ft={simResolution:128,dyeResolution:1440,captureResolution:512,densityDissipation:3.5,velocityDissipation:2,pressure:.1,pressureIteration:20,curl:10,splatRadius:.5,splatForce:6e3,shading:!0,colorUpdateSpeed:10,paused:!1,backColor:{r:0,g:0,b:0},transparent:!0,id:"smokey-fluid-canvas",position:"fixed",zIndex:-9999,pointerEvents:!1,maxDpr:2,pauseOnHidden:!0,respectReducedMotion:!0,palette:null,colorIntensity:.15},Ue=a=>{var i;return a?typeof a!="string"?a:(i=document.querySelector(a))!=null?i:document.getElementById(a):null},St=a=>{let i=a.trim().replace(/^#/,"");return i.length===3&&(i=i[0]+i[0]+i[1]+i[1]+i[2]+i[2]),/^[0-9a-f]{6}$/i.test(i)?{r:parseInt(i.slice(0,2),16)/255,g:parseInt(i.slice(2,4),16)/255,b:parseInt(i.slice(4,6),16)/255}:null},Dt=a=>{var u;if(a>=0||typeof document=="undefined"||typeof process!="undefined"&&((u=process.env)==null?void 0:u.NODE_ENV)==="production")return;let i=window.getComputedStyle(document.body).backgroundColor;i&&i!=="transparent"&&!/rgba\(\s*0\s*,\s*0\s*,\s*0\s*,\s*0\s*\)/.test(i)&&console.warn("[smokey-fluid-cursor] <body> has an opaque background ("+i+") and the canvas sits at z-index "+a+`, so the effect will be painted over and stay invisible.
3
+ Move the background to <html>, or give the canvas a zIndex above your background.`)},Lt=()=>typeof window!="undefined"&&typeof window.matchMedia=="function"&&window.matchMedia("(prefers-reduced-motion: reduce)").matches,ue={dispose:()=>{},pause:()=>{},resume:()=>{},isPaused:()=>!0,setConfig:()=>{},splat:()=>{},canvas:null},ce=(a={})=>{var Ce,_e,Be;let i={...Ft,...a};if(typeof document=="undefined")return ue;let m=!1,u=(Ce=Ue(i.canvas))!=null?Ce:document.getElementById(i.id);if(!u){let e=(_e=Ue(i.container))!=null?_e:document.body;if(!e)return ue;u=document.createElement("canvas"),u.id=i.id,e.appendChild(u),m=!0}i.className&&u.classList.add(...i.className.split(/\s+/));let g=i.position==="fixed"||i.position==="absolute";Object.assign(u.style,{position:i.position,...g?{top:"0",left:"0",width:"100%",height:"100%"}:{},display:"block",pointerEvents:i.pointerEvents?"auto":"none",zIndex:String(i.zIndex)}),Dt(i.zIndex),N();class S{constructor(){this.id=-1;this.texcoordX=0;this.texcoordY=0;this.prevTexcoordX=0;this.prevTexcoordY=0;this.deltaX=0;this.deltaY=0;this.down=!1;this.moved=!1;this.color=[30,0,300]}}let R=[];R.push(new S);let t,h;try{({gl:t,ext:h}=v(u))}catch(e){typeof console!="undefined"&&console.warn("[smokey-fluid-cursor] WebGL is unavailable; the cursor effect is disabled.",e);let r=u,n=m;return{...ue,dispose:()=>{n&&r.remove()},setConfig:o=>{o.zIndex!==void 0&&(r.style.zIndex=String(o.zIndex)),o.pointerEvents!==void 0&&(r.style.pointerEvents=o.pointerEvents?"auto":"none")},get canvas(){return r}}}h.supportLinearFiltering||(i.dyeResolution=512,i.shading=!1);function v(e){let r={alpha:!0,depth:!1,stencil:!1,antialias:!1,preserveDrawingBuffer:!1},n=e.getContext("webgl2",r),o=!!n;if(o||(n=e.getContext("webgl",r)||e.getContext("experimental-webgl",r)),!n)throw new Error("WebGL not supported");let s=null,l,c;if(o){let d=n;d.getExtension("EXT_color_buffer_float"),l=!!d.getExtension("OES_texture_float_linear"),c=d.HALF_FLOAT}else{let d=n;if(s=d.getExtension("OES_texture_half_float"),l=!!d.getExtension("OES_texture_half_float_linear"),!s)throw new Error("OES_texture_half_float not supported on WebGL1");c=s.HALF_FLOAT_OES}n.clearColor(0,0,0,1);let p=null,b=null,C=null;if(o){let d=n;p=x(d,d.RGBA16F,d.RGBA,c),b=x(d,d.RG16F,d.RG,c),C=x(d,d.R16F,d.RED,c)}else{let d=n;p=x(d,d.RGBA,d.RGBA,c),b=x(d,d.RGBA,d.RGBA,c),C=x(d,d.RGBA,d.RGBA,c)}return{gl:n,ext:{formatRGBA:p,formatRG:b,formatR:C,halfFloatTexType:c,supportLinearFiltering:l,isWebGL2:o}}}function x(e,r,n,o){if(!$(e,r,n,o)){if(e.RGBA16F!==void 0){let s=e;switch(r){case s.R16F:return x(s,s.RG16F,s.RG,o);case s.RG16F:return x(s,s.RGBA16F,s.RGBA,o);default:return null}}return null}return{internalFormat:r,format:n}}function $(e,r,n,o){let s=e.createTexture();if(!s)return!1;e.bindTexture(e.TEXTURE_2D,s),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MIN_FILTER,e.NEAREST),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MAG_FILTER,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),e.texImage2D(e.TEXTURE_2D,0,r,4,4,0,n,o,null);let l=e.createFramebuffer();if(!l)return!1;e.bindFramebuffer(e.FRAMEBUFFER,l),e.framebufferTexture2D(e.FRAMEBUFFER,e.COLOR_ATTACHMENT0,e.TEXTURE_2D,s,0);let c=e.checkFramebufferStatus(e.FRAMEBUFFER);return e.bindFramebuffer(e.FRAMEBUFFER,null),e.deleteFramebuffer(l),e.deleteTexture(s),c===e.FRAMEBUFFER_COMPLETE}class z{constructor(r,n){this.vertexShader=r,this.fragmentShaderSource=n,this.programs={},this.activeProgram=null,this.uniforms={}}setKeywords(r){let n=0;for(let s=0;s<r.length;s++)n+=vt(r[s]);let o=this.programs[n];if(!o){let s=D(t,t.FRAGMENT_SHADER,de(this.fragmentShaderSource,r));o=le(t,this.vertexShader,s),this.programs[n]=o}o!==this.activeProgram&&(this.uniforms=fe(t,o),this.activeProgram=o)}bind(){this.activeProgram&&t.useProgram(this.activeProgram)}}class P{constructor(r,n){this.program=le(t,r,n),this.uniforms=fe(t,this.program)}bind(){this.program&&t.useProgram(this.program)}}function le(e,r,n){let o=e.createProgram();return e.attachShader(o,r),e.attachShader(o,n),e.bindAttribLocation(o,0,"aPosition"),e.linkProgram(o),e.getProgramParameter(o,e.LINK_STATUS)||console.trace(e.getProgramInfoLog(o)),o}function fe(e,r){let n={},o=e.getProgramParameter(r,e.ACTIVE_UNIFORMS);for(let s=0;s<o;s++){let l=e.getActiveUniform(r,s);if(!l)continue;let c=l.name,p=e.getUniformLocation(r,c);p&&(n[c]=p)}return n}function D(e,r,n){let o=e.createShader(r);return e.shaderSource(o,n),e.compileShader(o),e.getShaderParameter(o,e.COMPILE_STATUS)||console.trace(e.getShaderInfoLog(o)),o}function de(e,r){if(!r||r.length===0)return e;let n="";return r.forEach(o=>{n+="#define "+o+`
4
+ `}),n+e}let w=D(t,t.VERTEX_SHADER,`precision highp float;
5
5
  attribute vec2 aPosition;
6
6
  varying vec2 vUv;
7
7
  varying vec2 vL;
@@ -16,20 +16,20 @@ vR = vUv + vec2(texelSize.x, 0.0);
16
16
  vT = vUv + vec2(0.0, texelSize.y);
17
17
  vB = vUv - vec2(0.0, texelSize.y);
18
18
  gl_Position = vec4(aPosition, 0.0, 1.0);
19
- }`),Me=S(t,t.FRAGMENT_SHADER,`precision mediump float;
19
+ }`),He=D(t,t.FRAGMENT_SHADER,`precision mediump float;
20
20
  precision mediump sampler2D;
21
21
  varying highp vec2 vUv;
22
22
  uniform sampler2D uTexture;
23
23
  void main () {
24
24
  gl_FragColor = texture2D(uTexture, vUv);
25
- }`),ze=S(t,t.FRAGMENT_SHADER,`precision mediump float;
25
+ }`),Ye=D(t,t.FRAGMENT_SHADER,`precision mediump float;
26
26
  precision mediump sampler2D;
27
27
  varying highp vec2 vUv;
28
28
  uniform sampler2D uTexture;
29
29
  uniform float value;
30
30
  void main () {
31
31
  gl_FragColor = value * texture2D(uTexture, vUv);
32
- }`),Ie=`precision highp float;
32
+ }`),We=`precision highp float;
33
33
  precision highp sampler2D;
34
34
  varying vec2 vUv;
35
35
  varying vec2 vL;
@@ -54,7 +54,7 @@ c *= diffuse;
54
54
  #endif
55
55
  float a = max(c.r, max(c.g, c.b));
56
56
  gl_FragColor = vec4(c, a);
57
- }`,Xe=S(t,t.FRAGMENT_SHADER,`precision highp float;
57
+ }`,Ve=D(t,t.FRAGMENT_SHADER,`precision highp float;
58
58
  precision highp sampler2D;
59
59
  varying vec2 vUv;
60
60
  uniform sampler2D uTarget;
@@ -68,7 +68,7 @@ p.x *= aspectRatio;
68
68
  vec3 splat = exp(-dot(p, p) / radius) * color;
69
69
  vec3 base = texture2D(uTarget, vUv).xyz;
70
70
  gl_FragColor = vec4(base + splat, 1.0);
71
- }`),Oe=S(t,t.FRAGMENT_SHADER,de(`precision highp float;
71
+ }`),je=D(t,t.FRAGMENT_SHADER,de(`precision highp float;
72
72
  precision highp sampler2D;
73
73
  varying vec2 vUv;
74
74
  uniform sampler2D uVelocity;
@@ -97,7 +97,7 @@ vec4 result = texture2D(uSource, coord);
97
97
  #endif
98
98
  float decay = 1.0 + dissipation * dt;
99
99
  gl_FragColor = result / decay;
100
- }`,p.supportLinearFiltering?null:["MANUAL_FILTERING"])),Ne=S(t,t.FRAGMENT_SHADER,`precision mediump float;
100
+ }`,h.supportLinearFiltering?null:["MANUAL_FILTERING"])),qe=D(t,t.FRAGMENT_SHADER,`precision mediump float;
101
101
  precision mediump sampler2D;
102
102
  varying highp vec2 vUv;
103
103
  varying highp vec2 vL;
@@ -117,7 +117,7 @@ if (vT.y > 1.0) { T = -C.y; }
117
117
  if (vB.y < 0.0) { B = -C.y; }
118
118
  float div = 0.5 * (R - L + T - B);
119
119
  gl_FragColor = vec4(div, 0.0, 0.0, 1.0);
120
- }`),He=S(t,t.FRAGMENT_SHADER,`precision mediump float;
120
+ }`),Ke=D(t,t.FRAGMENT_SHADER,`precision mediump float;
121
121
  precision mediump sampler2D;
122
122
  varying highp vec2 vUv;
123
123
  varying highp vec2 vL;
@@ -132,7 +132,7 @@ float T = texture2D(uVelocity, vT).x;
132
132
  float B = texture2D(uVelocity, vB).x;
133
133
  float vorticity = R - L - T + B;
134
134
  gl_FragColor = vec4(0.5 * vorticity, 0.0, 0.0, 1.0);
135
- }`),Ye=S(t,t.FRAGMENT_SHADER,`precision highp float;
135
+ }`),$e=D(t,t.FRAGMENT_SHADER,`precision highp float;
136
136
  precision highp sampler2D;
137
137
  varying vec2 vUv;
138
138
  varying vec2 vL;
@@ -157,7 +157,7 @@ vec2 velocity = texture2D(uVelocity, vUv).xy;
157
157
  velocity += force * dt;
158
158
  velocity = min(max(velocity, -1000.0), 1000.0);
159
159
  gl_FragColor = vec4(velocity, 0.0, 1.0);
160
- }`),We=S(t,t.FRAGMENT_SHADER,`precision mediump float;
160
+ }`),Je=D(t,t.FRAGMENT_SHADER,`precision mediump float;
161
161
  precision mediump sampler2D;
162
162
  varying highp vec2 vUv;
163
163
  varying highp vec2 vL;
@@ -175,7 +175,7 @@ float C = texture2D(uPressure, vUv).x;
175
175
  float divergence = texture2D(uDivergence, vUv).x;
176
176
  float pressure = (L + R + B + T - divergence) * 0.25;
177
177
  gl_FragColor = vec4(pressure, 0.0, 0.0, 1.0);
178
- }`),ke=S(t,t.FRAGMENT_SHADER,`precision mediump float;
178
+ }`),Ze=D(t,t.FRAGMENT_SHADER,`precision mediump float;
179
179
  precision mediump sampler2D;
180
180
  varying highp vec2 vUv;
181
181
  varying highp vec2 vL;
@@ -192,4 +192,4 @@ float B = texture2D(uPressure, vB).x;
192
192
  vec2 velocity = texture2D(uVelocity, vUv).xy;
193
193
  velocity.xy -= vec2(R - L, T - B);
194
194
  gl_FragColor = vec4(velocity, 0.0, 1.0);
195
- }`),T=(()=>{let e=t.createBuffer();t.bindBuffer(t.ARRAY_BUFFER,e),t.bufferData(t.ARRAY_BUFFER,new Float32Array([-1,-1,-1,1,1,1,1,-1]),t.STATIC_DRAW);let r=t.createBuffer();return t.bindBuffer(t.ELEMENT_ARRAY_BUFFER,r),t.bufferData(t.ELEMENT_ARRAY_BUFFER,new Uint16Array([0,1,2,0,2,3]),t.STATIC_DRAW),t.vertexAttribPointer(0,2,t.FLOAT,!1,0,0),t.enableVertexAttribArray(0),(n,o=!1)=>{n==null?(t.viewport(0,0,t.drawingBufferWidth,t.drawingBufferHeight),t.bindFramebuffer(t.FRAMEBUFFER,null)):(t.viewport(0,0,n.width,n.height),t.bindFramebuffer(t.FRAMEBUFFER,n.fbo)),o&&(t.clearColor(0,0,0,1),t.clear(t.COLOR_BUFFER_BIT)),t.drawElements(t.TRIANGLES,6,t.UNSIGNED_SHORT,0)}})(),R,d,J,$,C,fe=new _(L,Me),Z=new _(L,ze),A=new _(L,Xe),D=new _(L,Oe),Q=new _(L,Ne),ee=new _(L,He),U=new _(L,Ye),O=new _(L,We),N=new _(L,ke),H=new X(L,Ie);function te(){let e=Se(i.simResolution),r=Se(i.dyeResolution),n=p.halfFloatTexType,o=p.formatRGBA,u=p.formatRG,l=p.formatR,c=p.supportLinearFiltering?t.LINEAR:t.NEAREST;t.disable(t.BLEND),R==null?R=re(r.width,r.height,o.internalFormat,o.format,n,c):R=me(R,r.width,r.height,o.internalFormat,o.format,n,c),d==null?d=re(e.width,e.height,u.internalFormat,u.format,n,c):d=me(d,e.width,e.height,u.internalFormat,u.format,n,c),J=G(e.width,e.height,l.internalFormat,l.format,n,t.NEAREST),$=G(e.width,e.height,l.internalFormat,l.format,n,t.NEAREST),C=re(e.width,e.height,l.internalFormat,l.format,n,t.NEAREST)}function G(e,r,n,o,u,l){t.activeTexture(t.TEXTURE0);let c=t.createTexture();t.bindTexture(t.TEXTURE_2D,c),t.texParameteri(t.TEXTURE_2D,t.TEXTURE_MIN_FILTER,l),t.texParameteri(t.TEXTURE_2D,t.TEXTURE_MAG_FILTER,l),t.texParameteri(t.TEXTURE_2D,t.TEXTURE_WRAP_S,t.CLAMP_TO_EDGE),t.texParameteri(t.TEXTURE_2D,t.TEXTURE_WRAP_T,t.CLAMP_TO_EDGE),t.texImage2D(t.TEXTURE_2D,0,n,e,r,0,o,u,null);let h=t.createFramebuffer();t.bindFramebuffer(t.FRAMEBUFFER,h),t.framebufferTexture2D(t.FRAMEBUFFER,t.COLOR_ATTACHMENT0,t.TEXTURE_2D,c,0),t.viewport(0,0,e,r),t.clear(t.COLOR_BUFFER_BIT);let g=1/e,B=1/r;return{texture:c,fbo:h,width:e,height:r,texelSizeX:g,texelSizeY:B,attach(f){return t.activeTexture(t.TEXTURE0+f),t.bindTexture(t.TEXTURE_2D,c),f}}}function re(e,r,n,o,u,l){let c=G(e,r,n,o,u,l),h=G(e,r,n,o,u,l);return{width:e,height:r,texelSizeX:c.texelSizeX,texelSizeY:c.texelSizeY,get read(){return c},set read(g){c=g},get write(){return h},set write(g){h=g},swap(){let g=c;c=h,h=g}}}function Ve(e,r,n,o,u,l,c){let h=G(r,n,o,u,l,c);return fe.bind(),t.uniform1i(fe.uniforms.uTexture,e.attach(0)),T(h),h}function me(e,r,n,o,u,l,c){return e.width===r&&e.height===n||(e.read=Ve(e.read,r,n,o,u,l,c),e.write=G(r,n,o,u,l,c),e.width=r,e.height=n,e.texelSizeX=1/r,e.texelSizeY=1/n),e}function qe(){let e=[];i.shading&&e.push("shading"),H.setKeywords(e)}qe(),te();let ne=Date.now(),Y=0,oe=0;function ve(){let e=Ke();I()&&te(),je(e),Je(),i.paused||$e(e),he(null),oe=requestAnimationFrame(ve)}function Ke(){let e=Date.now(),r=(e-ne)/1e3;return r=Math.min(r,.016666),ne=e,r}function I(){let e=y(a.clientWidth),r=y(a.clientHeight);return a.width!==e||a.height!==r?(a.width=e,a.height=r,!0):!1}function je(e){Y+=e*i.colorUpdateSpeed,Y>=1&&(Y=ut(Y,0,1),b.forEach(r=>{r.color=Fe(W())}))}function Je(){b.forEach(e=>{e.moved&&(e.moved=!1,Qe(e))})}function $e(e){t.disable(t.BLEND),ee.bind(),t.uniform2f(ee.uniforms.texelSize,d.texelSizeX,d.texelSizeY),t.uniform1i(ee.uniforms.uVelocity,d.read.attach(0)),T($),U.bind(),t.uniform2f(U.uniforms.texelSize,d.texelSizeX,d.texelSizeY),t.uniform1i(U.uniforms.uVelocity,d.read.attach(0)),t.uniform1i(U.uniforms.uCurl,$.attach(1)),t.uniform1f(U.uniforms.curl,i.curl),t.uniform1f(U.uniforms.dt,e),T(d.write),d.swap(),Q.bind(),t.uniform2f(Q.uniforms.texelSize,d.texelSizeX,d.texelSizeY),t.uniform1i(Q.uniforms.uVelocity,d.read.attach(0)),T(J),Z.bind(),t.uniform1i(Z.uniforms.uTexture,C.read.attach(0)),t.uniform1f(Z.uniforms.value,i.pressure),T(C.write),C.swap(),O.bind(),t.uniform2f(O.uniforms.texelSize,d.texelSizeX,d.texelSizeY),t.uniform1i(O.uniforms.uDivergence,J.attach(0));for(let n=0;n<i.pressureIteration;n++)t.uniform1i(O.uniforms.uPressure,C.read.attach(1)),T(C.write),C.swap();N.bind(),t.uniform2f(N.uniforms.texelSize,d.texelSizeX,d.texelSizeY),t.uniform1i(N.uniforms.uPressure,C.read.attach(0)),t.uniform1i(N.uniforms.uVelocity,d.read.attach(1)),T(d.write),d.swap(),D.bind(),t.uniform2f(D.uniforms.texelSize,d.texelSizeX,d.texelSizeY),p.supportLinearFiltering||t.uniform2f(D.uniforms.dyeTexelSize,d.texelSizeX,d.texelSizeY);let r=d.read.attach(0);t.uniform1i(D.uniforms.uVelocity,r),t.uniform1i(D.uniforms.uSource,r),t.uniform1f(D.uniforms.dt,e),t.uniform1f(D.uniforms.dissipation,i.velocityDissipation),T(d.write),d.swap(),p.supportLinearFiltering||t.uniform2f(D.uniforms.dyeTexelSize,R.texelSizeX,R.texelSizeY),t.uniform1i(D.uniforms.uVelocity,d.read.attach(0)),t.uniform1i(D.uniforms.uSource,R.read.attach(1)),t.uniform1f(D.uniforms.dissipation,i.densityDissipation),T(R.write),R.swap()}function he(e){t.blendFunc(t.ONE,t.ONE_MINUS_SRC_ALPHA),t.enable(t.BLEND),Ze(e)}function Ze(e){let r=e==null?t.drawingBufferWidth:e.width,n=e==null?t.drawingBufferHeight:e.height;H.bind(),i.shading&&t.uniform2f(H.uniforms.texelSize,1/r,1/n),t.uniform1i(H.uniforms.uTexture,R.read.attach(0)),T(e)}function Qe(e){let r=e.deltaX*i.splatForce,n=e.deltaY*i.splatForce,o=ot(e.color);ie(e.texcoordX,e.texcoordY,r,n,o)}function pe(e){let r=W();r.r*=10,r.g*=10,r.b*=10;let n=10*(Math.random()-.5),o=30*(Math.random()-.5);ie(e.texcoordX,e.texcoordY,n,o,r)}function ie(e,r,n,o,u){A.bind(),t.uniform1i(A.uniforms.uTarget,d.read.attach(0)),t.uniform1f(A.uniforms.aspectRatio,a.width/a.height),t.uniform2f(A.uniforms.point,e,r),t.uniform3f(A.uniforms.color,n,o,0),t.uniform1f(A.uniforms.radius,et(i.splatRadius/100)),T(d.write),d.swap(),t.uniform1i(A.uniforms.uTarget,R.read.attach(0)),t.uniform3f(A.uniforms.color,u.r,u.g,u.b),T(R.write),R.swap()}function et(e){let r=a.width/a.height;return r>1&&(e*=r),e}let xe=e=>{let r=b[0],n=a.getBoundingClientRect(),o=y(e.clientX-n.left),u=y(e.clientY-n.top);Te(r,-1,o,u),pe(r)},ge=e=>{let r=b[0],n=a.getBoundingClientRect(),o=y(e.clientX-n.left),u=y(e.clientY-n.top),l=r.color;ye(r,o,u,l)},be=e=>{let r=e.targetTouches,n=a.getBoundingClientRect(),o=b[0];for(let u=0;u<r.length;u++){let l=y(r[u].clientX-n.left),c=y(r[u].clientY-n.top);Te(o,r[u].identifier,l,c),pe(o)}},Re=e=>{e.preventDefault();let r=e.targetTouches,n=a.getBoundingClientRect(),o=b[0];for(let u=0;u<r.length;u++){let l=y(r[u].clientX-n.left),c=y(r[u].clientY-n.top);ye(o,l,c,o.color)}},Ee=e=>{let r=e.changedTouches,n=b[0];for(let o=0;o<r.length;o++)tt(n)};window.addEventListener("mousedown",xe),window.addEventListener("mousemove",ge),window.addEventListener("touchstart",be),window.addEventListener("touchmove",Re,{passive:!1}),window.addEventListener("touchend",Ee);function Te(e,r,n,o){e.id=r,e.down=!0,e.moved=!1,e.texcoordX=n/a.width,e.texcoordY=1-o/a.height,e.prevTexcoordX=e.texcoordX,e.prevTexcoordY=e.texcoordY,e.deltaX=0,e.deltaY=0,e.color=Fe(W())}function ye(e,r,n,o){e.prevTexcoordX=e.texcoordX,e.prevTexcoordY=e.texcoordY,e.texcoordX=r/a.width,e.texcoordY=1-n/a.height,e.deltaX=rt(e.texcoordX-e.prevTexcoordX),e.deltaY=nt(e.texcoordY-e.prevTexcoordY),e.moved=Math.abs(e.deltaX)>0||Math.abs(e.deltaY)>0,e.color=o}function tt(e){e.down=!1}function rt(e){let r=a.width/a.height;return r<1&&(e*=r),e}function nt(e){let r=a.width/a.height;return r>1&&(e/=r),e}function W(){let e=i.colorIntensity,r=i.palette;if(r&&r.length>0){let o=r[Math.floor(Math.random()*r.length)],u=gt(o);if(u)return{r:u.r*e,g:u.g*e,b:u.b*e}}let n=it(Math.random(),1,1);return n.r*=e,n.g*=e,n.b*=e,n}function Fe(e){return[e.r,e.g,e.b]}function ot(e){return{r:e[0],g:e[1],b:e[2]}}function it(e,r,n){let o=0,u=0,l=0,c=Math.floor(e*6),h=e*6-c,g=n*(1-r),B=n*(1-h*r),f=n*(1-(1-h)*r);switch(c%6){case 0:o=n,u=f,l=g;break;case 1:o=B,u=n,l=g;break;case 2:o=g,u=n,l=f;break;case 3:o=g,u=B,l=n;break;case 4:o=f,u=g,l=n;break;case 5:o=n,u=g,l=B;break}return{r:o,g:u,b:l}}function ut(e,r,n){let o=n-r;return o===0?r:(e-r)%o+r}function Se(e){let r=t.drawingBufferWidth/t.drawingBufferHeight;r<1&&(r=1/r);let n=Math.round(e),o=Math.round(e*r);return t.drawingBufferWidth>t.drawingBufferHeight?{width:o,height:n}:{width:n,height:o}}function y(e){let r=Math.min(window.devicePixelRatio||1,Math.max(1,i.maxDpr));return Math.floor(e*r)}function st(e){if(e.length===0)return 0;let r=0;for(let n=0;n<e.length;n++)r=(r<<5)-r+e.charCodeAt(n),r|=0;return r}function at(){var e,r;ue||(ue=!0,q(),window.removeEventListener("mousedown",xe),window.removeEventListener("mousemove",ge),window.removeEventListener("touchstart",be),window.removeEventListener("touchmove",Re),window.removeEventListener("touchend",Ee),window.removeEventListener("resize",Le),document.removeEventListener("visibilitychange",De),(e=E==null?void 0:E.removeEventListener)==null||e.call(E,"change",we),M==null||M.disconnect(),m&&(a==null||a.remove()),(r=t.getExtension("WEBGL_lose_context"))==null||r.loseContext())}let ue=!1,k=!1;function V(){k||ue||(k=!0,ne=Date.now(),oe=requestAnimationFrame(ve))}function q(){k=!1,cancelAnimationFrame(oe)}let De=()=>{i.pauseOnHidden&&(document.hidden?q():z||V())},Le=()=>I(),M=typeof ResizeObserver!="undefined"?new ResizeObserver(()=>I()):null;M==null||M.observe(a);let E=typeof window.matchMedia=="function"?window.matchMedia("(prefers-reduced-motion: reduce)"):null,we=()=>{i.respectReducedMotion&&(E!=null&&E.matches?q():z||V())},z=!1;return window.addEventListener("resize",Le),document.addEventListener("visibilitychange",De),(Ce=E==null?void 0:E.addEventListener)==null||Ce.call(E,"change",we),i.respectReducedMotion&&Rt()?(z=!0,he(null)):V(),{dispose:at,pause(){z=!0,q()},resume(){z=!1,V()},isPaused:()=>z||!k,setConfig(e){let r=e.simResolution!==void 0&&e.simResolution!==i.simResolution||e.dyeResolution!==void 0&&e.dyeResolution!==i.dyeResolution;Object.assign(i,e),e.maxDpr!==void 0&&I(),r&&te(),e.zIndex!==void 0&&(a.style.zIndex=String(e.zIndex)),e.pointerEvents!==void 0&&(a.style.pointerEvents=e.pointerEvents?"auto":"none")},splat(e,r,n){let o=a.getBoundingClientRect(),u=y(e),l=y(r),c=n!=null?n:W();ie(u,a.height-l,0,0,c)},get canvas(){return a}}};var Ge=require("react/jsx-runtime"),Et=["densityDissipation","velocityDissipation","pressure","pressureIteration","curl","splatRadius","splatForce","shading","colorUpdateSpeed","paused","transparent","backColor","palette","colorIntensity","zIndex","pointerEvents","maxDpr","pauseOnHidden","respectReducedMotion"],Tt=s=>JSON.stringify([s==null?void 0:s.id,s==null?void 0:s.position,s==null?void 0:s.className,s==null?void 0:s.simResolution,s==null?void 0:s.dyeResolution,s==null?void 0:s.captureResolution]);function Ue(s,i){let m=P.default.useRef(null),a=P.default.useRef(s);a.current=s;let F=Tt(s);return P.default.useEffect(()=>{let w=ae({...a.current,...i!=null&&i.current?{container:i.current}:{}});return m.current=w,()=>{w.dispose(),m.current=null}},[F,i]),P.default.useEffect(()=>{let w=m.current;if(!w||!s)return;let b={};for(let t of Et)s[t]!==void 0&&(b[t]=s[t]);w.setConfig(b)}),m}var yt=P.default.forwardRef(function({config:i,scoped:m=!1,className:a,style:F,children:w},b){let t=P.default.useRef(null),p=Ue(i,m?t:void 0);return P.default.useImperativeHandle(b,()=>({dispose:()=>{var v;return(v=p.current)==null?void 0:v.dispose()},pause:()=>{var v;return(v=p.current)==null?void 0:v.pause()},resume:()=>{var v;return(v=p.current)==null?void 0:v.resume()},isPaused:()=>{var v,x;return(x=(v=p.current)==null?void 0:v.isPaused())!=null?x:!0},setConfig:v=>{var x;return(x=p.current)==null?void 0:x.setConfig(v)},splat:(v,x,j)=>{var X;return(X=p.current)==null?void 0:X.splat(v,x,j)},get canvas(){var v,x;return(x=(v=p.current)==null?void 0:v.canvas)!=null?x:null}}),[p]),m?(0,Ge.jsx)("div",{ref:t,className:a,style:{position:"relative",overflow:"hidden",...F},children:w}):null});0&&(module.exports={SmokeyFluidCursor,initFluid,useSmokeyFluidCursor});
195
+ }`),T=(()=>{let e=t.createBuffer();t.bindBuffer(t.ARRAY_BUFFER,e),t.bufferData(t.ARRAY_BUFFER,new Float32Array([-1,-1,-1,1,1,1,1,-1]),t.STATIC_DRAW);let r=t.createBuffer();return t.bindBuffer(t.ELEMENT_ARRAY_BUFFER,r),t.bufferData(t.ELEMENT_ARRAY_BUFFER,new Uint16Array([0,1,2,0,2,3]),t.STATIC_DRAW),t.vertexAttribPointer(0,2,t.FLOAT,!1,0,0),t.enableVertexAttribArray(0),(n,o=!1)=>{n==null?(t.viewport(0,0,t.drawingBufferWidth,t.drawingBufferHeight),t.bindFramebuffer(t.FRAMEBUFFER,null)):(t.viewport(0,0,n.width,n.height),t.bindFramebuffer(t.FRAMEBUFFER,n.fbo)),o&&(t.clearColor(0,0,0,1),t.clear(t.COLOR_BUFFER_BIT)),t.drawElements(t.TRIANGLES,6,t.UNSIGNED_SHORT,0)}})(),y,f,J,Z,_,me=new P(w,He),Q=new P(w,Ye),B=new P(w,Ve),L=new P(w,je),ee=new P(w,qe),te=new P(w,Ke),U=new P(w,$e),O=new P(w,Je),X=new P(w,Ze),k=new z(w,We);function re(){let e=De(i.simResolution),r=De(i.dyeResolution),n=h.halfFloatTexType,o=h.formatRGBA,s=h.formatRG,l=h.formatR,c=h.supportLinearFiltering?t.LINEAR:t.NEAREST;t.disable(t.BLEND),y==null?y=ne(r.width,r.height,o.internalFormat,o.format,n,c):y=ve(y,r.width,r.height,o.internalFormat,o.format,n,c),f==null?f=ne(e.width,e.height,s.internalFormat,s.format,n,c):f=ve(f,e.width,e.height,s.internalFormat,s.format,n,c),J=G(e.width,e.height,l.internalFormat,l.format,n,t.NEAREST),Z=G(e.width,e.height,l.internalFormat,l.format,n,t.NEAREST),_=ne(e.width,e.height,l.internalFormat,l.format,n,t.NEAREST)}function G(e,r,n,o,s,l){t.activeTexture(t.TEXTURE0);let c=t.createTexture();t.bindTexture(t.TEXTURE_2D,c),t.texParameteri(t.TEXTURE_2D,t.TEXTURE_MIN_FILTER,l),t.texParameteri(t.TEXTURE_2D,t.TEXTURE_MAG_FILTER,l),t.texParameteri(t.TEXTURE_2D,t.TEXTURE_WRAP_S,t.CLAMP_TO_EDGE),t.texParameteri(t.TEXTURE_2D,t.TEXTURE_WRAP_T,t.CLAMP_TO_EDGE),t.texImage2D(t.TEXTURE_2D,0,n,e,r,0,o,s,null);let p=t.createFramebuffer();t.bindFramebuffer(t.FRAMEBUFFER,p),t.framebufferTexture2D(t.FRAMEBUFFER,t.COLOR_ATTACHMENT0,t.TEXTURE_2D,c,0),t.viewport(0,0,e,r),t.clear(t.COLOR_BUFFER_BIT);let b=1/e,C=1/r;return{texture:c,fbo:p,width:e,height:r,texelSizeX:b,texelSizeY:C,attach(d){return t.activeTexture(t.TEXTURE0+d),t.bindTexture(t.TEXTURE_2D,c),d}}}function ne(e,r,n,o,s,l){let c=G(e,r,n,o,s,l),p=G(e,r,n,o,s,l);return{width:e,height:r,texelSizeX:c.texelSizeX,texelSizeY:c.texelSizeY,get read(){return c},set read(b){c=b},get write(){return p},set write(b){p=b},swap(){let b=c;c=p,p=b}}}function Qe(e,r,n,o,s,l,c){let p=G(r,n,o,s,l,c);return me.bind(),t.uniform1i(me.uniforms.uTexture,e.attach(0)),T(p),p}function ve(e,r,n,o,s,l,c){return e.width===r&&e.height===n||(e.read=Qe(e.read,r,n,o,s,l,c),e.write=G(r,n,o,s,l,c),e.width=r,e.height=n,e.texelSizeX=1/r,e.texelSizeY=1/n),e}function et(){let e=[];i.shading&&e.push("shading"),k.setKeywords(e)}et(),re();let oe=Date.now(),H=0,ie=0;function pe(){let e=tt();N()&&re(),rt(e),nt(),i.paused||ot(e),he(null),ie=requestAnimationFrame(pe)}function tt(){let e=Date.now(),r=(e-oe)/1e3;return r=Math.min(r,.016666),oe=e,r}function N(){let e=F(u.clientWidth),r=F(u.clientHeight);return u.width!==e||u.height!==r?(u.width=e,u.height=r,!0):!1}function rt(e){H+=e*i.colorUpdateSpeed,H>=1&&(H=mt(H,0,1),R.forEach(r=>{r.color=Se(Y())}))}function nt(){R.forEach(e=>{e.moved&&(e.moved=!1,st(e))})}function ot(e){t.disable(t.BLEND),te.bind(),t.uniform2f(te.uniforms.texelSize,f.texelSizeX,f.texelSizeY),t.uniform1i(te.uniforms.uVelocity,f.read.attach(0)),T(Z),U.bind(),t.uniform2f(U.uniforms.texelSize,f.texelSizeX,f.texelSizeY),t.uniform1i(U.uniforms.uVelocity,f.read.attach(0)),t.uniform1i(U.uniforms.uCurl,Z.attach(1)),t.uniform1f(U.uniforms.curl,i.curl),t.uniform1f(U.uniforms.dt,e),T(f.write),f.swap(),ee.bind(),t.uniform2f(ee.uniforms.texelSize,f.texelSizeX,f.texelSizeY),t.uniform1i(ee.uniforms.uVelocity,f.read.attach(0)),T(J),Q.bind(),t.uniform1i(Q.uniforms.uTexture,_.read.attach(0)),t.uniform1f(Q.uniforms.value,i.pressure),T(_.write),_.swap(),O.bind(),t.uniform2f(O.uniforms.texelSize,f.texelSizeX,f.texelSizeY),t.uniform1i(O.uniforms.uDivergence,J.attach(0));for(let n=0;n<i.pressureIteration;n++)t.uniform1i(O.uniforms.uPressure,_.read.attach(1)),T(_.write),_.swap();X.bind(),t.uniform2f(X.uniforms.texelSize,f.texelSizeX,f.texelSizeY),t.uniform1i(X.uniforms.uPressure,_.read.attach(0)),t.uniform1i(X.uniforms.uVelocity,f.read.attach(1)),T(f.write),f.swap(),L.bind(),t.uniform2f(L.uniforms.texelSize,f.texelSizeX,f.texelSizeY),h.supportLinearFiltering||t.uniform2f(L.uniforms.dyeTexelSize,f.texelSizeX,f.texelSizeY);let r=f.read.attach(0);t.uniform1i(L.uniforms.uVelocity,r),t.uniform1i(L.uniforms.uSource,r),t.uniform1f(L.uniforms.dt,e),t.uniform1f(L.uniforms.dissipation,i.velocityDissipation),T(f.write),f.swap(),h.supportLinearFiltering||t.uniform2f(L.uniforms.dyeTexelSize,y.texelSizeX,y.texelSizeY),t.uniform1i(L.uniforms.uVelocity,f.read.attach(0)),t.uniform1i(L.uniforms.uSource,y.read.attach(1)),t.uniform1f(L.uniforms.dissipation,i.densityDissipation),T(y.write),y.swap()}function he(e){t.blendFunc(t.ONE,t.ONE_MINUS_SRC_ALPHA),t.enable(t.BLEND),it(e)}function it(e){let r=e==null?t.drawingBufferWidth:e.width,n=e==null?t.drawingBufferHeight:e.height;k.bind(),i.shading&&t.uniform2f(k.uniforms.texelSize,1/r,1/n),t.uniform1i(k.uniforms.uTexture,y.read.attach(0)),T(e)}function st(e){let r=e.deltaX*i.splatForce,n=e.deltaY*i.splatForce,o=ft(e.color);se(e.texcoordX,e.texcoordY,r,n,o)}function xe(e){let r=Y();r.r*=10,r.g*=10,r.b*=10;let n=10*(Math.random()-.5),o=30*(Math.random()-.5);se(e.texcoordX,e.texcoordY,n,o,r)}function se(e,r,n,o,s){B.bind(),t.uniform1i(B.uniforms.uTarget,f.read.attach(0)),t.uniform1f(B.uniforms.aspectRatio,u.width/u.height),t.uniform2f(B.uniforms.point,e,r),t.uniform3f(B.uniforms.color,n,o,0),t.uniform1f(B.uniforms.radius,at(i.splatRadius/100)),T(f.write),f.swap(),t.uniform1i(B.uniforms.uTarget,y.read.attach(0)),t.uniform3f(B.uniforms.color,s.r,s.g,s.b),T(y.write),y.swap()}function at(e){let r=u.width/u.height;return r>1&&(e*=r),e}let be=e=>{let r=R[0],n=u.getBoundingClientRect(),o=F(e.clientX-n.left),s=F(e.clientY-n.top);Te(r,-1,o,s),xe(r)},ge=e=>{let r=R[0],n=u.getBoundingClientRect(),o=F(e.clientX-n.left),s=F(e.clientY-n.top),l=r.color;Fe(r,o,s,l)},Re=e=>{let r=e.targetTouches,n=u.getBoundingClientRect(),o=R[0];for(let s=0;s<r.length;s++){let l=F(r[s].clientX-n.left),c=F(r[s].clientY-n.top);Te(o,r[s].identifier,l,c),xe(o)}},ye=e=>{e.preventDefault();let r=e.targetTouches,n=u.getBoundingClientRect(),o=R[0];for(let s=0;s<r.length;s++){let l=F(r[s].clientX-n.left),c=F(r[s].clientY-n.top);Fe(o,l,c,o.color)}},Ee=e=>{let r=e.changedTouches,n=R[0];for(let o=0;o<r.length;o++)ut(n)};window.addEventListener("mousedown",be),window.addEventListener("mousemove",ge),window.addEventListener("touchstart",Re),window.addEventListener("touchmove",ye,{passive:!1}),window.addEventListener("touchend",Ee);function Te(e,r,n,o){e.id=r,e.down=!0,e.moved=!1,e.texcoordX=n/u.width,e.texcoordY=1-o/u.height,e.prevTexcoordX=e.texcoordX,e.prevTexcoordY=e.texcoordY,e.deltaX=0,e.deltaY=0,e.color=Se(Y())}function Fe(e,r,n,o){e.prevTexcoordX=e.texcoordX,e.prevTexcoordY=e.texcoordY,e.texcoordX=r/u.width,e.texcoordY=1-n/u.height,e.deltaX=ct(e.texcoordX-e.prevTexcoordX),e.deltaY=lt(e.texcoordY-e.prevTexcoordY),e.moved=Math.abs(e.deltaX)>0||Math.abs(e.deltaY)>0,e.color=o}function ut(e){e.down=!1}function ct(e){let r=u.width/u.height;return r<1&&(e*=r),e}function lt(e){let r=u.width/u.height;return r>1&&(e/=r),e}function Y(){let e=i.colorIntensity,r=i.palette;if(r&&r.length>0){let o=r[Math.floor(Math.random()*r.length)],s=St(o);if(s)return{r:s.r*e,g:s.g*e,b:s.b*e}}let n=dt(Math.random(),1,1);return n.r*=e,n.g*=e,n.b*=e,n}function Se(e){return[e.r,e.g,e.b]}function ft(e){return{r:e[0],g:e[1],b:e[2]}}function dt(e,r,n){let o=0,s=0,l=0,c=Math.floor(e*6),p=e*6-c,b=n*(1-r),C=n*(1-p*r),d=n*(1-(1-p)*r);switch(c%6){case 0:o=n,s=d,l=b;break;case 1:o=C,s=n,l=b;break;case 2:o=b,s=n,l=d;break;case 3:o=b,s=C,l=n;break;case 4:o=d,s=b,l=n;break;case 5:o=n,s=b,l=C;break}return{r:o,g:s,b:l}}function mt(e,r,n){let o=n-r;return o===0?r:(e-r)%o+r}function De(e){let r=t.drawingBufferWidth/t.drawingBufferHeight;r<1&&(r=1/r);let n=Math.round(e),o=Math.round(e*r);return t.drawingBufferWidth>t.drawingBufferHeight?{width:o,height:n}:{width:n,height:o}}function F(e){let r=Math.min(window.devicePixelRatio||1,Math.max(1,i.maxDpr));return Math.floor(e*r)}function vt(e){if(e.length===0)return 0;let r=0;for(let n=0;n<e.length;n++)r=(r<<5)-r+e.charCodeAt(n),r|=0;return r}function pt(){var e,r;ae||(ae=!0,j(),window.removeEventListener("mousedown",be),window.removeEventListener("mousemove",ge),window.removeEventListener("touchstart",Re),window.removeEventListener("touchmove",ye),window.removeEventListener("touchend",Ee),window.removeEventListener("resize",we),document.removeEventListener("visibilitychange",Le),(e=E==null?void 0:E.removeEventListener)==null||e.call(E,"change",Pe),M==null||M.disconnect(),m&&(u==null||u.remove()),(r=t.getExtension("WEBGL_lose_context"))==null||r.loseContext())}let ae=!1,W=!1;function V(){W||ae||(W=!0,oe=Date.now(),ie=requestAnimationFrame(pe))}function j(){W=!1,cancelAnimationFrame(ie)}let Le=()=>{i.pauseOnHidden&&(document.hidden?j():I||V())},we=()=>N(),M=typeof ResizeObserver!="undefined"?new ResizeObserver(()=>N()):null;M==null||M.observe(u);let E=typeof window.matchMedia=="function"?window.matchMedia("(prefers-reduced-motion: reduce)"):null,Pe=()=>{i.respectReducedMotion&&(E!=null&&E.matches?j():I||V())},I=!1;return window.addEventListener("resize",we),document.addEventListener("visibilitychange",Le),(Be=E==null?void 0:E.addEventListener)==null||Be.call(E,"change",Pe),i.respectReducedMotion&&Lt()?(I=!0,he(null)):V(),{dispose:pt,pause(){I=!0,j()},resume(){I=!1,V()},isPaused:()=>I||!W,setConfig(e){let r=e.simResolution!==void 0&&e.simResolution!==i.simResolution||e.dyeResolution!==void 0&&e.dyeResolution!==i.dyeResolution;Object.assign(i,e),e.maxDpr!==void 0&&N(),r&&re(),e.zIndex!==void 0&&(u.style.zIndex=String(e.zIndex)),e.pointerEvents!==void 0&&(u.style.pointerEvents=e.pointerEvents?"auto":"none")},splat(e,r,n){let o=u.getBoundingClientRect(),s=F(e),l=F(r),c=n!=null?n:Y();se(s,u.height-l,0,0,c)},get canvas(){return u}}};var Ge={Spectrum:null,Sunset:["#ff4ecd","#ff8a4e","#ffd24e"],Ocean:["#4ea8ff","#4effd2","#7c4dff"],Mono:["#ffffff"],Aurora:["#3affa3","#38d9ff","#8f7bff"],Ember:["#ff5722","#ff9100","#ffc400"],Lagoon:["#00c2a8","#00a3ff","#0057d9"],Candy:["#ff8fd0","#ffa9f0","#c79bff"],Toxic:["#b6ff00","#4dff88","#00ffc8"],Royal:["#5b2bff","#8f4dff","#c44dff"],Sakura:["#ffc2dd","#ff8fb1","#ff6f91"],Mint:["#9cffd6","#5ef2c0","#2fd6a5"],Copper:["#ff9a5a","#e2703a","#b34700"],Ultraviolet:["#7b2cff","#b429ff","#ff29f0"],Ice:["#c9f0ff","#8ad4ff","#4fb3ff"],Magma:["#ff2d2d","#ff6a00","#ffb300"],Forest:["#2f9e44","#69db7c","#a9e34b"],Dusk:["#3b3b98","#7158e2","#cd84f1"],Cyber:["#00fff0","#ff00e0","#fffb00"],Pastel:["#ffd6e0","#c7ceea","#b5ead7"]},Me={Calm:{curl:3,splatForce:4200,splatRadius:.45,densityDissipation:4.6,velocityDissipation:2.6,pressureIteration:16,colorUpdateSpeed:6},Flow:{curl:10,splatForce:6e3,splatRadius:.5,densityDissipation:3.5,velocityDissipation:2,pressureIteration:20,colorUpdateSpeed:10},Swirl:{curl:24,splatForce:7200,splatRadius:.55,densityDissipation:3,velocityDissipation:1.6,pressureIteration:24,colorUpdateSpeed:12},Storm:{curl:40,splatForce:9500,splatRadius:.65,densityDissipation:2.2,velocityDissipation:1.2,pressureIteration:28,colorUpdateSpeed:16},Wisp:{curl:6,splatForce:3200,splatRadius:.32,densityDissipation:6.5,velocityDissipation:3.4,pressureIteration:12,colorUpdateSpeed:8}},wt=()=>{let a={};for(let[i,m]of Object.entries(Ge))for(let[u,g]of Object.entries(Me)){let S=`${i} ${u}`;a[S]={...g,palette:m?[...m]:null,colorIntensity:m===null?.15:.18}}return a},K=wt(),Ie=Object.keys(K),Ne=Object.keys(Ge),ze=Object.keys(Me),Oe=a=>K[a];var ke=require("react/jsx-runtime"),Pt=["densityDissipation","velocityDissipation","pressure","pressureIteration","curl","splatRadius","splatForce","shading","colorUpdateSpeed","paused","transparent","backColor","palette","colorIntensity","zIndex","pointerEvents","maxDpr","pauseOnHidden","respectReducedMotion"],Ct=a=>JSON.stringify([a==null?void 0:a.id,a==null?void 0:a.position,a==null?void 0:a.className,a==null?void 0:a.simResolution,a==null?void 0:a.dyeResolution,a==null?void 0:a.captureResolution]);function Xe(a,i){let m=A.default.useRef(null),u=A.default.useRef(a);u.current=a;let g=Ct(a);return A.default.useEffect(()=>{let S=ce({...u.current,...i!=null&&i.current?{container:i.current}:{}});return m.current=S,()=>{S.dispose(),m.current=null}},[g,i]),A.default.useEffect(()=>{let S=m.current;if(!S||!a)return;let R={};for(let t of Pt)a[t]!==void 0&&(R[t]=a[t]);S.setConfig(R)}),m}var _t=A.default.forwardRef(function({config:i,scoped:m=!1,className:u,style:g,children:S},R){let t=A.default.useRef(null),h=Xe(i,m?t:void 0);return A.default.useImperativeHandle(R,()=>({dispose:()=>{var v;return(v=h.current)==null?void 0:v.dispose()},pause:()=>{var v;return(v=h.current)==null?void 0:v.pause()},resume:()=>{var v;return(v=h.current)==null?void 0:v.resume()},isPaused:()=>{var v,x;return(x=(v=h.current)==null?void 0:v.isPaused())!=null?x:!0},setConfig:v=>{var x;return(x=h.current)==null?void 0:x.setConfig(v)},splat:(v,x,$)=>{var z;return(z=h.current)==null?void 0:z.splat(v,x,$)},get canvas(){var v,x;return(x=(v=h.current)==null?void 0:v.canvas)!=null?x:null}}),[h]),m?(0,ke.jsx)("div",{ref:t,className:u,style:{position:"relative",overflow:"hidden",...g},children:S}):null});0&&(module.exports={SmokeyFluidCursor,characterNames,getPreset,initFluid,paletteNames,presetNames,presets,useSmokeyFluidCursor});
package/dist/index.mjs CHANGED
@@ -1,7 +1,7 @@
1
1
  "use client";
2
- import A from"react";var it={simResolution:128,dyeResolution:1440,captureResolution:512,densityDissipation:3.5,velocityDissipation:2,pressure:.1,pressureIteration:20,curl:10,splatRadius:.5,splatForce:6e3,shading:!0,colorUpdateSpeed:10,paused:!1,backColor:{r:0,g:0,b:0},transparent:!0,id:"smokey-fluid-canvas",position:"fixed",zIndex:-9999,pointerEvents:!1,maxDpr:2,pauseOnHidden:!0,respectReducedMotion:!0,palette:null,colorIntensity:.15},Be=l=>{var u;return l?typeof l!="string"?l:(u=document.querySelector(l))!=null?u:document.getElementById(l):null},ut=l=>{let u=l.trim().replace(/^#/,"");return u.length===3&&(u=u[0]+u[0]+u[1]+u[1]+u[2]+u[2]),/^[0-9a-f]{6}$/i.test(u)?{r:parseInt(u.slice(0,2),16)/255,g:parseInt(u.slice(2,4),16)/255,b:parseInt(u.slice(4,6),16)/255}:null},st=l=>{var s;if(l>=0||typeof document=="undefined"||typeof process!="undefined"&&((s=process.env)==null?void 0:s.NODE_ENV)==="production")return;let u=window.getComputedStyle(document.body).backgroundColor;u&&u!=="transparent"&&!/rgba\(\s*0\s*,\s*0\s*,\s*0\s*,\s*0\s*\)/.test(u)&&console.warn("[smokey-fluid-cursor] <body> has an opaque background ("+u+") and the canvas sits at z-index "+l+`, so the effect will be painted over and stay invisible.
3
- Move the background to <html>, or give the canvas a zIndex above your background.`)},at=()=>typeof window!="undefined"&&typeof window.matchMedia=="function"&&window.matchMedia("(prefers-reduced-motion: reduce)").matches,ue={dispose:()=>{},pause:()=>{},resume:()=>{},isPaused:()=>!0,setConfig:()=>{},splat:()=>{},canvas:null},Ce=(l={})=>{var Le,we,_e;let u={...it,...l};if(typeof document=="undefined")return ue;let E=!1,s=(Le=Be(u.canvas))!=null?Le:document.getElementById(u.id);if(!s){let e=(we=Be(u.container))!=null?we:document.body;if(!e)return ue;s=document.createElement("canvas"),s.id=u.id,e.appendChild(s),E=!0}u.className&&s.classList.add(...u.className.split(/\s+/));let z=u.position==="fixed"||u.position==="absolute";Object.assign(s.style,{position:u.position,...z?{top:"0",left:"0",width:"100%",height:"100%"}:{},display:"block",pointerEvents:u.pointerEvents?"auto":"none",zIndex:String(u.zIndex)}),st(u.zIndex),I();class L{constructor(){this.id=-1;this.texcoordX=0;this.texcoordY=0;this.prevTexcoordX=0;this.prevTexcoordY=0;this.deltaX=0;this.deltaY=0;this.down=!1;this.moved=!1;this.color=[30,0,300]}}let g=[];g.push(new L);let t,h;try{({gl:t,ext:h}=m(s))}catch(e){typeof console!="undefined"&&console.warn("[smokey-fluid-cursor] WebGL is unavailable; the cursor effect is disabled.",e);let r=s,n=E;return{...ue,dispose:()=>{n&&r.remove()},setConfig:o=>{o.zIndex!==void 0&&(r.style.zIndex=String(o.zIndex)),o.pointerEvents!==void 0&&(r.style.pointerEvents=o.pointerEvents?"auto":"none")},get canvas(){return r}}}h.supportLinearFiltering||(u.dyeResolution=512,u.shading=!1);function m(e){let r={alpha:!0,depth:!1,stencil:!1,antialias:!1,preserveDrawingBuffer:!1},n=e.getContext("webgl2",r),o=!!n;if(o||(n=e.getContext("webgl",r)||e.getContext("experimental-webgl",r)),!n)throw new Error("WebGL not supported");let i=null,c,a;if(o){let f=n;f.getExtension("EXT_color_buffer_float"),c=!!f.getExtension("OES_texture_float_linear"),a=f.HALF_FLOAT}else{let f=n;if(i=f.getExtension("OES_texture_half_float"),c=!!f.getExtension("OES_texture_half_float_linear"),!i)throw new Error("OES_texture_half_float not supported on WebGL1");a=i.HALF_FLOAT_OES}n.clearColor(0,0,0,1);let v=null,x=null,_=null;if(o){let f=n;v=p(f,f.RGBA16F,f.RGBA,a),x=p(f,f.RG16F,f.RG,a),_=p(f,f.R16F,f.RED,a)}else{let f=n;v=p(f,f.RGBA,f.RGBA,a),x=p(f,f.RGBA,f.RGBA,a),_=p(f,f.RGBA,f.RGBA,a)}return{gl:n,ext:{formatRGBA:v,formatRG:x,formatR:_,halfFloatTexType:a,supportLinearFiltering:c,isWebGL2:o}}}function p(e,r,n,o){if(!K(e,r,n,o)){if(e.RGBA16F!==void 0){let i=e;switch(r){case i.R16F:return p(i,i.RG16F,i.RG,o);case i.RG16F:return p(i,i.RGBA16F,i.RGBA,o);default:return null}}return null}return{internalFormat:r,format:n}}function K(e,r,n,o){let i=e.createTexture();if(!i)return!1;e.bindTexture(e.TEXTURE_2D,i),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MIN_FILTER,e.NEAREST),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MAG_FILTER,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),e.texImage2D(e.TEXTURE_2D,0,r,4,4,0,n,o,null);let c=e.createFramebuffer();if(!c)return!1;e.bindFramebuffer(e.FRAMEBUFFER,c),e.framebufferTexture2D(e.FRAMEBUFFER,e.COLOR_ATTACHMENT0,e.TEXTURE_2D,i,0);let a=e.checkFramebufferStatus(e.FRAMEBUFFER);return e.bindFramebuffer(e.FRAMEBUFFER,null),e.deleteFramebuffer(c),e.deleteTexture(i),a===e.FRAMEBUFFER_COMPLETE}class X{constructor(r,n){this.vertexShader=r,this.fragmentShaderSource=n,this.programs={},this.activeProgram=null,this.uniforms={}}setKeywords(r){let n=0;for(let i=0;i<r.length;i++)n+=nt(r[i]);let o=this.programs[n];if(!o){let i=F(t,t.FRAGMENT_SHADER,ce(this.fragmentShaderSource,r));o=se(t,this.vertexShader,i),this.programs[n]=o}o!==this.activeProgram&&(this.uniforms=ae(t,o),this.activeProgram=o)}bind(){this.activeProgram&&t.useProgram(this.activeProgram)}}class w{constructor(r,n){this.program=se(t,r,n),this.uniforms=ae(t,this.program)}bind(){this.program&&t.useProgram(this.program)}}function se(e,r,n){let o=e.createProgram();return e.attachShader(o,r),e.attachShader(o,n),e.bindAttribLocation(o,0,"aPosition"),e.linkProgram(o),e.getProgramParameter(o,e.LINK_STATUS)||console.trace(e.getProgramInfoLog(o)),o}function ae(e,r){let n={},o=e.getProgramParameter(r,e.ACTIVE_UNIFORMS);for(let i=0;i<o;i++){let c=e.getActiveUniform(r,i);if(!c)continue;let a=c.name,v=e.getUniformLocation(r,a);v&&(n[a]=v)}return n}function F(e,r,n){let o=e.createShader(r);return e.shaderSource(o,n),e.compileShader(o),e.getShaderParameter(o,e.COMPILE_STATUS)||console.trace(e.getShaderInfoLog(o)),o}function ce(e,r){if(!r||r.length===0)return e;let n="";return r.forEach(o=>{n+="#define "+o+`
4
- `}),n+e}let D=F(t,t.VERTEX_SHADER,`precision highp float;
2
+ import A from"react";var ut={simResolution:128,dyeResolution:1440,captureResolution:512,densityDissipation:3.5,velocityDissipation:2,pressure:.1,pressureIteration:20,curl:10,splatRadius:.5,splatForce:6e3,shading:!0,colorUpdateSpeed:10,paused:!1,backColor:{r:0,g:0,b:0},transparent:!0,id:"smokey-fluid-canvas",position:"fixed",zIndex:-9999,pointerEvents:!1,maxDpr:2,pauseOnHidden:!0,respectReducedMotion:!0,palette:null,colorIntensity:.15},_e=c=>{var s;return c?typeof c!="string"?c:(s=document.querySelector(c))!=null?s:document.getElementById(c):null},ct=c=>{let s=c.trim().replace(/^#/,"");return s.length===3&&(s=s[0]+s[0]+s[1]+s[1]+s[2]+s[2]),/^[0-9a-f]{6}$/i.test(s)?{r:parseInt(s.slice(0,2),16)/255,g:parseInt(s.slice(2,4),16)/255,b:parseInt(s.slice(4,6),16)/255}:null},lt=c=>{var a;if(c>=0||typeof document=="undefined"||typeof process!="undefined"&&((a=process.env)==null?void 0:a.NODE_ENV)==="production")return;let s=window.getComputedStyle(document.body).backgroundColor;s&&s!=="transparent"&&!/rgba\(\s*0\s*,\s*0\s*,\s*0\s*,\s*0\s*\)/.test(s)&&console.warn("[smokey-fluid-cursor] <body> has an opaque background ("+s+") and the canvas sits at z-index "+c+`, so the effect will be painted over and stay invisible.
3
+ Move the background to <html>, or give the canvas a zIndex above your background.`)},ft=()=>typeof window!="undefined"&&typeof window.matchMedia=="function"&&window.matchMedia("(prefers-reduced-motion: reduce)").matches,se={dispose:()=>{},pause:()=>{},resume:()=>{},isPaused:()=>!0,setConfig:()=>{},splat:()=>{},canvas:null},Be=(c={})=>{var we,Pe,Ce;let s={...ut,...c};if(typeof document=="undefined")return se;let b=!1,a=(we=_e(s.canvas))!=null?we:document.getElementById(s.id);if(!a){let e=(Pe=_e(s.container))!=null?Pe:document.body;if(!e)return se;a=document.createElement("canvas"),a.id=s.id,e.appendChild(a),b=!0}s.className&&a.classList.add(...s.className.split(/\s+/));let B=s.position==="fixed"||s.position==="absolute";Object.assign(a.style,{position:s.position,...B?{top:"0",left:"0",width:"100%",height:"100%"}:{},display:"block",pointerEvents:s.pointerEvents?"auto":"none",zIndex:String(s.zIndex)}),lt(s.zIndex),N();class F{constructor(){this.id=-1;this.texcoordX=0;this.texcoordY=0;this.prevTexcoordX=0;this.prevTexcoordY=0;this.deltaX=0;this.deltaY=0;this.down=!1;this.moved=!1;this.color=[30,0,300]}}let g=[];g.push(new F);let t,p;try{({gl:t,ext:p}=m(a))}catch(e){typeof console!="undefined"&&console.warn("[smokey-fluid-cursor] WebGL is unavailable; the cursor effect is disabled.",e);let r=a,n=b;return{...se,dispose:()=>{n&&r.remove()},setConfig:o=>{o.zIndex!==void 0&&(r.style.zIndex=String(o.zIndex)),o.pointerEvents!==void 0&&(r.style.pointerEvents=o.pointerEvents?"auto":"none")},get canvas(){return r}}}p.supportLinearFiltering||(s.dyeResolution=512,s.shading=!1);function m(e){let r={alpha:!0,depth:!1,stencil:!1,antialias:!1,preserveDrawingBuffer:!1},n=e.getContext("webgl2",r),o=!!n;if(o||(n=e.getContext("webgl",r)||e.getContext("experimental-webgl",r)),!n)throw new Error("WebGL not supported");let i=null,l,u;if(o){let d=n;d.getExtension("EXT_color_buffer_float"),l=!!d.getExtension("OES_texture_float_linear"),u=d.HALF_FLOAT}else{let d=n;if(i=d.getExtension("OES_texture_half_float"),l=!!d.getExtension("OES_texture_half_float_linear"),!i)throw new Error("OES_texture_half_float not supported on WebGL1");u=i.HALF_FLOAT_OES}n.clearColor(0,0,0,1);let v=null,x=null,P=null;if(o){let d=n;v=h(d,d.RGBA16F,d.RGBA,u),x=h(d,d.RG16F,d.RG,u),P=h(d,d.R16F,d.RED,u)}else{let d=n;v=h(d,d.RGBA,d.RGBA,u),x=h(d,d.RGBA,d.RGBA,u),P=h(d,d.RGBA,d.RGBA,u)}return{gl:n,ext:{formatRGBA:v,formatRG:x,formatR:P,halfFloatTexType:u,supportLinearFiltering:l,isWebGL2:o}}}function h(e,r,n,o){if(!q(e,r,n,o)){if(e.RGBA16F!==void 0){let i=e;switch(r){case i.R16F:return h(i,i.RG16F,i.RG,o);case i.RG16F:return h(i,i.RGBA16F,i.RGBA,o);default:return null}}return null}return{internalFormat:r,format:n}}function q(e,r,n,o){let i=e.createTexture();if(!i)return!1;e.bindTexture(e.TEXTURE_2D,i),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MIN_FILTER,e.NEAREST),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MAG_FILTER,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),e.texImage2D(e.TEXTURE_2D,0,r,4,4,0,n,o,null);let l=e.createFramebuffer();if(!l)return!1;e.bindFramebuffer(e.FRAMEBUFFER,l),e.framebufferTexture2D(e.FRAMEBUFFER,e.COLOR_ATTACHMENT0,e.TEXTURE_2D,i,0);let u=e.checkFramebufferStatus(e.FRAMEBUFFER);return e.bindFramebuffer(e.FRAMEBUFFER,null),e.deleteFramebuffer(l),e.deleteTexture(i),u===e.FRAMEBUFFER_COMPLETE}class z{constructor(r,n){this.vertexShader=r,this.fragmentShaderSource=n,this.programs={},this.activeProgram=null,this.uniforms={}}setKeywords(r){let n=0;for(let i=0;i<r.length;i++)n+=st(r[i]);let o=this.programs[n];if(!o){let i=S(t,t.FRAGMENT_SHADER,le(this.fragmentShaderSource,r));o=ue(t,this.vertexShader,i),this.programs[n]=o}o!==this.activeProgram&&(this.uniforms=ce(t,o),this.activeProgram=o)}bind(){this.activeProgram&&t.useProgram(this.activeProgram)}}class w{constructor(r,n){this.program=ue(t,r,n),this.uniforms=ce(t,this.program)}bind(){this.program&&t.useProgram(this.program)}}function ue(e,r,n){let o=e.createProgram();return e.attachShader(o,r),e.attachShader(o,n),e.bindAttribLocation(o,0,"aPosition"),e.linkProgram(o),e.getProgramParameter(o,e.LINK_STATUS)||console.trace(e.getProgramInfoLog(o)),o}function ce(e,r){let n={},o=e.getProgramParameter(r,e.ACTIVE_UNIFORMS);for(let i=0;i<o;i++){let l=e.getActiveUniform(r,i);if(!l)continue;let u=l.name,v=e.getUniformLocation(r,u);v&&(n[u]=v)}return n}function S(e,r,n){let o=e.createShader(r);return e.shaderSource(o,n),e.compileShader(o),e.getShaderParameter(o,e.COMPILE_STATUS)||console.trace(e.getShaderInfoLog(o)),o}function le(e,r){if(!r||r.length===0)return e;let n="";return r.forEach(o=>{n+="#define "+o+`
4
+ `}),n+e}let L=S(t,t.VERTEX_SHADER,`precision highp float;
5
5
  attribute vec2 aPosition;
6
6
  varying vec2 vUv;
7
7
  varying vec2 vL;
@@ -16,20 +16,20 @@ vR = vUv + vec2(texelSize.x, 0.0);
16
16
  vT = vUv + vec2(0.0, texelSize.y);
17
17
  vB = vUv - vec2(0.0, texelSize.y);
18
18
  gl_Position = vec4(aPosition, 0.0, 1.0);
19
- }`),Ae=F(t,t.FRAGMENT_SHADER,`precision mediump float;
19
+ }`),Ge=S(t,t.FRAGMENT_SHADER,`precision mediump float;
20
20
  precision mediump sampler2D;
21
21
  varying highp vec2 vUv;
22
22
  uniform sampler2D uTexture;
23
23
  void main () {
24
24
  gl_FragColor = texture2D(uTexture, vUv);
25
- }`),Pe=F(t,t.FRAGMENT_SHADER,`precision mediump float;
25
+ }`),Me=S(t,t.FRAGMENT_SHADER,`precision mediump float;
26
26
  precision mediump sampler2D;
27
27
  varying highp vec2 vUv;
28
28
  uniform sampler2D uTexture;
29
29
  uniform float value;
30
30
  void main () {
31
31
  gl_FragColor = value * texture2D(uTexture, vUv);
32
- }`),Ue=`precision highp float;
32
+ }`),Ie=`precision highp float;
33
33
  precision highp sampler2D;
34
34
  varying vec2 vUv;
35
35
  varying vec2 vL;
@@ -54,7 +54,7 @@ c *= diffuse;
54
54
  #endif
55
55
  float a = max(c.r, max(c.g, c.b));
56
56
  gl_FragColor = vec4(c, a);
57
- }`,Ge=F(t,t.FRAGMENT_SHADER,`precision highp float;
57
+ }`,Ne=S(t,t.FRAGMENT_SHADER,`precision highp float;
58
58
  precision highp sampler2D;
59
59
  varying vec2 vUv;
60
60
  uniform sampler2D uTarget;
@@ -68,7 +68,7 @@ p.x *= aspectRatio;
68
68
  vec3 splat = exp(-dot(p, p) / radius) * color;
69
69
  vec3 base = texture2D(uTarget, vUv).xyz;
70
70
  gl_FragColor = vec4(base + splat, 1.0);
71
- }`),Me=F(t,t.FRAGMENT_SHADER,ce(`precision highp float;
71
+ }`),ze=S(t,t.FRAGMENT_SHADER,le(`precision highp float;
72
72
  precision highp sampler2D;
73
73
  varying vec2 vUv;
74
74
  uniform sampler2D uVelocity;
@@ -97,7 +97,7 @@ vec4 result = texture2D(uSource, coord);
97
97
  #endif
98
98
  float decay = 1.0 + dissipation * dt;
99
99
  gl_FragColor = result / decay;
100
- }`,h.supportLinearFiltering?null:["MANUAL_FILTERING"])),ze=F(t,t.FRAGMENT_SHADER,`precision mediump float;
100
+ }`,p.supportLinearFiltering?null:["MANUAL_FILTERING"])),Oe=S(t,t.FRAGMENT_SHADER,`precision mediump float;
101
101
  precision mediump sampler2D;
102
102
  varying highp vec2 vUv;
103
103
  varying highp vec2 vL;
@@ -117,7 +117,7 @@ if (vT.y > 1.0) { T = -C.y; }
117
117
  if (vB.y < 0.0) { B = -C.y; }
118
118
  float div = 0.5 * (R - L + T - B);
119
119
  gl_FragColor = vec4(div, 0.0, 0.0, 1.0);
120
- }`),Ie=F(t,t.FRAGMENT_SHADER,`precision mediump float;
120
+ }`),Xe=S(t,t.FRAGMENT_SHADER,`precision mediump float;
121
121
  precision mediump sampler2D;
122
122
  varying highp vec2 vUv;
123
123
  varying highp vec2 vL;
@@ -132,7 +132,7 @@ float T = texture2D(uVelocity, vT).x;
132
132
  float B = texture2D(uVelocity, vB).x;
133
133
  float vorticity = R - L - T + B;
134
134
  gl_FragColor = vec4(0.5 * vorticity, 0.0, 0.0, 1.0);
135
- }`),Xe=F(t,t.FRAGMENT_SHADER,`precision highp float;
135
+ }`),ke=S(t,t.FRAGMENT_SHADER,`precision highp float;
136
136
  precision highp sampler2D;
137
137
  varying vec2 vUv;
138
138
  varying vec2 vL;
@@ -157,7 +157,7 @@ vec2 velocity = texture2D(uVelocity, vUv).xy;
157
157
  velocity += force * dt;
158
158
  velocity = min(max(velocity, -1000.0), 1000.0);
159
159
  gl_FragColor = vec4(velocity, 0.0, 1.0);
160
- }`),Oe=F(t,t.FRAGMENT_SHADER,`precision mediump float;
160
+ }`),He=S(t,t.FRAGMENT_SHADER,`precision mediump float;
161
161
  precision mediump sampler2D;
162
162
  varying highp vec2 vUv;
163
163
  varying highp vec2 vL;
@@ -175,7 +175,7 @@ float C = texture2D(uPressure, vUv).x;
175
175
  float divergence = texture2D(uDivergence, vUv).x;
176
176
  float pressure = (L + R + B + T - divergence) * 0.25;
177
177
  gl_FragColor = vec4(pressure, 0.0, 0.0, 1.0);
178
- }`),Ne=F(t,t.FRAGMENT_SHADER,`precision mediump float;
178
+ }`),Ye=S(t,t.FRAGMENT_SHADER,`precision mediump float;
179
179
  precision mediump sampler2D;
180
180
  varying highp vec2 vUv;
181
181
  varying highp vec2 vL;
@@ -192,4 +192,4 @@ float B = texture2D(uPressure, vB).x;
192
192
  vec2 velocity = texture2D(uVelocity, vUv).xy;
193
193
  velocity.xy -= vec2(R - L, T - B);
194
194
  gl_FragColor = vec4(velocity, 0.0, 1.0);
195
- }`),T=(()=>{let e=t.createBuffer();t.bindBuffer(t.ARRAY_BUFFER,e),t.bufferData(t.ARRAY_BUFFER,new Float32Array([-1,-1,-1,1,1,1,1,-1]),t.STATIC_DRAW);let r=t.createBuffer();return t.bindBuffer(t.ELEMENT_ARRAY_BUFFER,r),t.bufferData(t.ELEMENT_ARRAY_BUFFER,new Uint16Array([0,1,2,0,2,3]),t.STATIC_DRAW),t.vertexAttribPointer(0,2,t.FLOAT,!1,0,0),t.enableVertexAttribArray(0),(n,o=!1)=>{n==null?(t.viewport(0,0,t.drawingBufferWidth,t.drawingBufferHeight),t.bindFramebuffer(t.FRAMEBUFFER,null)):(t.viewport(0,0,n.width,n.height),t.bindFramebuffer(t.FRAMEBUFFER,n.fbo)),o&&(t.clearColor(0,0,0,1),t.clear(t.COLOR_BUFFER_BIT)),t.drawElements(t.TRIANGLES,6,t.UNSIGNED_SHORT,0)}})(),b,d,j,J,B,le=new w(D,Ae),$=new w(D,Pe),C=new w(D,Ge),S=new w(D,Me),Z=new w(D,ze),Q=new w(D,Ie),P=new w(D,Xe),O=new w(D,Oe),N=new w(D,Ne),H=new X(D,Ue);function ee(){let e=ye(u.simResolution),r=ye(u.dyeResolution),n=h.halfFloatTexType,o=h.formatRGBA,i=h.formatRG,c=h.formatR,a=h.supportLinearFiltering?t.LINEAR:t.NEAREST;t.disable(t.BLEND),b==null?b=te(r.width,r.height,o.internalFormat,o.format,n,a):b=de(b,r.width,r.height,o.internalFormat,o.format,n,a),d==null?d=te(e.width,e.height,i.internalFormat,i.format,n,a):d=de(d,e.width,e.height,i.internalFormat,i.format,n,a),j=U(e.width,e.height,c.internalFormat,c.format,n,t.NEAREST),J=U(e.width,e.height,c.internalFormat,c.format,n,t.NEAREST),B=te(e.width,e.height,c.internalFormat,c.format,n,t.NEAREST)}function U(e,r,n,o,i,c){t.activeTexture(t.TEXTURE0);let a=t.createTexture();t.bindTexture(t.TEXTURE_2D,a),t.texParameteri(t.TEXTURE_2D,t.TEXTURE_MIN_FILTER,c),t.texParameteri(t.TEXTURE_2D,t.TEXTURE_MAG_FILTER,c),t.texParameteri(t.TEXTURE_2D,t.TEXTURE_WRAP_S,t.CLAMP_TO_EDGE),t.texParameteri(t.TEXTURE_2D,t.TEXTURE_WRAP_T,t.CLAMP_TO_EDGE),t.texImage2D(t.TEXTURE_2D,0,n,e,r,0,o,i,null);let v=t.createFramebuffer();t.bindFramebuffer(t.FRAMEBUFFER,v),t.framebufferTexture2D(t.FRAMEBUFFER,t.COLOR_ATTACHMENT0,t.TEXTURE_2D,a,0),t.viewport(0,0,e,r),t.clear(t.COLOR_BUFFER_BIT);let x=1/e,_=1/r;return{texture:a,fbo:v,width:e,height:r,texelSizeX:x,texelSizeY:_,attach(f){return t.activeTexture(t.TEXTURE0+f),t.bindTexture(t.TEXTURE_2D,a),f}}}function te(e,r,n,o,i,c){let a=U(e,r,n,o,i,c),v=U(e,r,n,o,i,c);return{width:e,height:r,texelSizeX:a.texelSizeX,texelSizeY:a.texelSizeY,get read(){return a},set read(x){a=x},get write(){return v},set write(x){v=x},swap(){let x=a;a=v,v=x}}}function He(e,r,n,o,i,c,a){let v=U(r,n,o,i,c,a);return le.bind(),t.uniform1i(le.uniforms.uTexture,e.attach(0)),T(v),v}function de(e,r,n,o,i,c,a){return e.width===r&&e.height===n||(e.read=He(e.read,r,n,o,i,c,a),e.write=U(r,n,o,i,c,a),e.width=r,e.height=n,e.texelSizeX=1/r,e.texelSizeY=1/n),e}function Ye(){let e=[];u.shading&&e.push("shading"),H.setKeywords(e)}Ye(),ee();let re=Date.now(),Y=0,ne=0;function fe(){let e=We();I()&&ee(),ke(e),Ve(),u.paused||qe(e),me(null),ne=requestAnimationFrame(fe)}function We(){let e=Date.now(),r=(e-re)/1e3;return r=Math.min(r,.016666),re=e,r}function I(){let e=y(s.clientWidth),r=y(s.clientHeight);return s.width!==e||s.height!==r?(s.width=e,s.height=r,!0):!1}function ke(e){Y+=e*u.colorUpdateSpeed,Y>=1&&(Y=rt(Y,0,1),g.forEach(r=>{r.color=Te(W())}))}function Ve(){g.forEach(e=>{e.moved&&(e.moved=!1,je(e))})}function qe(e){t.disable(t.BLEND),Q.bind(),t.uniform2f(Q.uniforms.texelSize,d.texelSizeX,d.texelSizeY),t.uniform1i(Q.uniforms.uVelocity,d.read.attach(0)),T(J),P.bind(),t.uniform2f(P.uniforms.texelSize,d.texelSizeX,d.texelSizeY),t.uniform1i(P.uniforms.uVelocity,d.read.attach(0)),t.uniform1i(P.uniforms.uCurl,J.attach(1)),t.uniform1f(P.uniforms.curl,u.curl),t.uniform1f(P.uniforms.dt,e),T(d.write),d.swap(),Z.bind(),t.uniform2f(Z.uniforms.texelSize,d.texelSizeX,d.texelSizeY),t.uniform1i(Z.uniforms.uVelocity,d.read.attach(0)),T(j),$.bind(),t.uniform1i($.uniforms.uTexture,B.read.attach(0)),t.uniform1f($.uniforms.value,u.pressure),T(B.write),B.swap(),O.bind(),t.uniform2f(O.uniforms.texelSize,d.texelSizeX,d.texelSizeY),t.uniform1i(O.uniforms.uDivergence,j.attach(0));for(let n=0;n<u.pressureIteration;n++)t.uniform1i(O.uniforms.uPressure,B.read.attach(1)),T(B.write),B.swap();N.bind(),t.uniform2f(N.uniforms.texelSize,d.texelSizeX,d.texelSizeY),t.uniform1i(N.uniforms.uPressure,B.read.attach(0)),t.uniform1i(N.uniforms.uVelocity,d.read.attach(1)),T(d.write),d.swap(),S.bind(),t.uniform2f(S.uniforms.texelSize,d.texelSizeX,d.texelSizeY),h.supportLinearFiltering||t.uniform2f(S.uniforms.dyeTexelSize,d.texelSizeX,d.texelSizeY);let r=d.read.attach(0);t.uniform1i(S.uniforms.uVelocity,r),t.uniform1i(S.uniforms.uSource,r),t.uniform1f(S.uniforms.dt,e),t.uniform1f(S.uniforms.dissipation,u.velocityDissipation),T(d.write),d.swap(),h.supportLinearFiltering||t.uniform2f(S.uniforms.dyeTexelSize,b.texelSizeX,b.texelSizeY),t.uniform1i(S.uniforms.uVelocity,d.read.attach(0)),t.uniform1i(S.uniforms.uSource,b.read.attach(1)),t.uniform1f(S.uniforms.dissipation,u.densityDissipation),T(b.write),b.swap()}function me(e){t.blendFunc(t.ONE,t.ONE_MINUS_SRC_ALPHA),t.enable(t.BLEND),Ke(e)}function Ke(e){let r=e==null?t.drawingBufferWidth:e.width,n=e==null?t.drawingBufferHeight:e.height;H.bind(),u.shading&&t.uniform2f(H.uniforms.texelSize,1/r,1/n),t.uniform1i(H.uniforms.uTexture,b.read.attach(0)),T(e)}function je(e){let r=e.deltaX*u.splatForce,n=e.deltaY*u.splatForce,o=et(e.color);oe(e.texcoordX,e.texcoordY,r,n,o)}function ve(e){let r=W();r.r*=10,r.g*=10,r.b*=10;let n=10*(Math.random()-.5),o=30*(Math.random()-.5);oe(e.texcoordX,e.texcoordY,n,o,r)}function oe(e,r,n,o,i){C.bind(),t.uniform1i(C.uniforms.uTarget,d.read.attach(0)),t.uniform1f(C.uniforms.aspectRatio,s.width/s.height),t.uniform2f(C.uniforms.point,e,r),t.uniform3f(C.uniforms.color,n,o,0),t.uniform1f(C.uniforms.radius,Je(u.splatRadius/100)),T(d.write),d.swap(),t.uniform1i(C.uniforms.uTarget,b.read.attach(0)),t.uniform3f(C.uniforms.color,i.r,i.g,i.b),T(b.write),b.swap()}function Je(e){let r=s.width/s.height;return r>1&&(e*=r),e}let he=e=>{let r=g[0],n=s.getBoundingClientRect(),o=y(e.clientX-n.left),i=y(e.clientY-n.top);Re(r,-1,o,i),ve(r)},pe=e=>{let r=g[0],n=s.getBoundingClientRect(),o=y(e.clientX-n.left),i=y(e.clientY-n.top),c=r.color;Ee(r,o,i,c)},xe=e=>{let r=e.targetTouches,n=s.getBoundingClientRect(),o=g[0];for(let i=0;i<r.length;i++){let c=y(r[i].clientX-n.left),a=y(r[i].clientY-n.top);Re(o,r[i].identifier,c,a),ve(o)}},ge=e=>{e.preventDefault();let r=e.targetTouches,n=s.getBoundingClientRect(),o=g[0];for(let i=0;i<r.length;i++){let c=y(r[i].clientX-n.left),a=y(r[i].clientY-n.top);Ee(o,c,a,o.color)}},be=e=>{let r=e.changedTouches,n=g[0];for(let o=0;o<r.length;o++)$e(n)};window.addEventListener("mousedown",he),window.addEventListener("mousemove",pe),window.addEventListener("touchstart",xe),window.addEventListener("touchmove",ge,{passive:!1}),window.addEventListener("touchend",be);function Re(e,r,n,o){e.id=r,e.down=!0,e.moved=!1,e.texcoordX=n/s.width,e.texcoordY=1-o/s.height,e.prevTexcoordX=e.texcoordX,e.prevTexcoordY=e.texcoordY,e.deltaX=0,e.deltaY=0,e.color=Te(W())}function Ee(e,r,n,o){e.prevTexcoordX=e.texcoordX,e.prevTexcoordY=e.texcoordY,e.texcoordX=r/s.width,e.texcoordY=1-n/s.height,e.deltaX=Ze(e.texcoordX-e.prevTexcoordX),e.deltaY=Qe(e.texcoordY-e.prevTexcoordY),e.moved=Math.abs(e.deltaX)>0||Math.abs(e.deltaY)>0,e.color=o}function $e(e){e.down=!1}function Ze(e){let r=s.width/s.height;return r<1&&(e*=r),e}function Qe(e){let r=s.width/s.height;return r>1&&(e/=r),e}function W(){let e=u.colorIntensity,r=u.palette;if(r&&r.length>0){let o=r[Math.floor(Math.random()*r.length)],i=ut(o);if(i)return{r:i.r*e,g:i.g*e,b:i.b*e}}let n=tt(Math.random(),1,1);return n.r*=e,n.g*=e,n.b*=e,n}function Te(e){return[e.r,e.g,e.b]}function et(e){return{r:e[0],g:e[1],b:e[2]}}function tt(e,r,n){let o=0,i=0,c=0,a=Math.floor(e*6),v=e*6-a,x=n*(1-r),_=n*(1-v*r),f=n*(1-(1-v)*r);switch(a%6){case 0:o=n,i=f,c=x;break;case 1:o=_,i=n,c=x;break;case 2:o=x,i=n,c=f;break;case 3:o=x,i=_,c=n;break;case 4:o=f,i=x,c=n;break;case 5:o=n,i=x,c=_;break}return{r:o,g:i,b:c}}function rt(e,r,n){let o=n-r;return o===0?r:(e-r)%o+r}function ye(e){let r=t.drawingBufferWidth/t.drawingBufferHeight;r<1&&(r=1/r);let n=Math.round(e),o=Math.round(e*r);return t.drawingBufferWidth>t.drawingBufferHeight?{width:o,height:n}:{width:n,height:o}}function y(e){let r=Math.min(window.devicePixelRatio||1,Math.max(1,u.maxDpr));return Math.floor(e*r)}function nt(e){if(e.length===0)return 0;let r=0;for(let n=0;n<e.length;n++)r=(r<<5)-r+e.charCodeAt(n),r|=0;return r}function ot(){var e,r;ie||(ie=!0,q(),window.removeEventListener("mousedown",he),window.removeEventListener("mousemove",pe),window.removeEventListener("touchstart",xe),window.removeEventListener("touchmove",ge),window.removeEventListener("touchend",be),window.removeEventListener("resize",Se),document.removeEventListener("visibilitychange",Fe),(e=R==null?void 0:R.removeEventListener)==null||e.call(R,"change",De),G==null||G.disconnect(),E&&(s==null||s.remove()),(r=t.getExtension("WEBGL_lose_context"))==null||r.loseContext())}let ie=!1,k=!1;function V(){k||ie||(k=!0,re=Date.now(),ne=requestAnimationFrame(fe))}function q(){k=!1,cancelAnimationFrame(ne)}let Fe=()=>{u.pauseOnHidden&&(document.hidden?q():M||V())},Se=()=>I(),G=typeof ResizeObserver!="undefined"?new ResizeObserver(()=>I()):null;G==null||G.observe(s);let R=typeof window.matchMedia=="function"?window.matchMedia("(prefers-reduced-motion: reduce)"):null,De=()=>{u.respectReducedMotion&&(R!=null&&R.matches?q():M||V())},M=!1;return window.addEventListener("resize",Se),document.addEventListener("visibilitychange",Fe),(_e=R==null?void 0:R.addEventListener)==null||_e.call(R,"change",De),u.respectReducedMotion&&at()?(M=!0,me(null)):V(),{dispose:ot,pause(){M=!0,q()},resume(){M=!1,V()},isPaused:()=>M||!k,setConfig(e){let r=e.simResolution!==void 0&&e.simResolution!==u.simResolution||e.dyeResolution!==void 0&&e.dyeResolution!==u.dyeResolution;Object.assign(u,e),e.maxDpr!==void 0&&I(),r&&ee(),e.zIndex!==void 0&&(s.style.zIndex=String(e.zIndex)),e.pointerEvents!==void 0&&(s.style.pointerEvents=e.pointerEvents?"auto":"none")},splat(e,r,n){let o=s.getBoundingClientRect(),i=y(e),c=y(r),a=n!=null?n:W();oe(i,s.height-c,0,0,a)},get canvas(){return s}}};import{jsx as ft}from"react/jsx-runtime";var ct=["densityDissipation","velocityDissipation","pressure","pressureIteration","curl","splatRadius","splatForce","shading","colorUpdateSpeed","paused","transparent","backColor","palette","colorIntensity","zIndex","pointerEvents","maxDpr","pauseOnHidden","respectReducedMotion"],lt=l=>JSON.stringify([l==null?void 0:l.id,l==null?void 0:l.position,l==null?void 0:l.className,l==null?void 0:l.simResolution,l==null?void 0:l.dyeResolution,l==null?void 0:l.captureResolution]);function dt(l,u){let E=A.useRef(null),s=A.useRef(l);s.current=l;let z=lt(l);return A.useEffect(()=>{let L=Ce({...s.current,...u!=null&&u.current?{container:u.current}:{}});return E.current=L,()=>{L.dispose(),E.current=null}},[z,u]),A.useEffect(()=>{let L=E.current;if(!L||!l)return;let g={};for(let t of ct)l[t]!==void 0&&(g[t]=l[t]);L.setConfig(g)}),E}var xt=A.forwardRef(function({config:u,scoped:E=!1,className:s,style:z,children:L},g){let t=A.useRef(null),h=dt(u,E?t:void 0);return A.useImperativeHandle(g,()=>({dispose:()=>{var m;return(m=h.current)==null?void 0:m.dispose()},pause:()=>{var m;return(m=h.current)==null?void 0:m.pause()},resume:()=>{var m;return(m=h.current)==null?void 0:m.resume()},isPaused:()=>{var m,p;return(p=(m=h.current)==null?void 0:m.isPaused())!=null?p:!0},setConfig:m=>{var p;return(p=h.current)==null?void 0:p.setConfig(m)},splat:(m,p,K)=>{var X;return(X=h.current)==null?void 0:X.splat(m,p,K)},get canvas(){var m,p;return(p=(m=h.current)==null?void 0:m.canvas)!=null?p:null}}),[h]),E?ft("div",{ref:t,className:s,style:{position:"relative",overflow:"hidden",...z},children:L}):null});export{xt as SmokeyFluidCursor,Ce as initFluid,dt as useSmokeyFluidCursor};
195
+ }`),E=(()=>{let e=t.createBuffer();t.bindBuffer(t.ARRAY_BUFFER,e),t.bufferData(t.ARRAY_BUFFER,new Float32Array([-1,-1,-1,1,1,1,1,-1]),t.STATIC_DRAW);let r=t.createBuffer();return t.bindBuffer(t.ELEMENT_ARRAY_BUFFER,r),t.bufferData(t.ELEMENT_ARRAY_BUFFER,new Uint16Array([0,1,2,0,2,3]),t.STATIC_DRAW),t.vertexAttribPointer(0,2,t.FLOAT,!1,0,0),t.enableVertexAttribArray(0),(n,o=!1)=>{n==null?(t.viewport(0,0,t.drawingBufferWidth,t.drawingBufferHeight),t.bindFramebuffer(t.FRAMEBUFFER,null)):(t.viewport(0,0,n.width,n.height),t.bindFramebuffer(t.FRAMEBUFFER,n.fbo)),o&&(t.clearColor(0,0,0,1),t.clear(t.COLOR_BUFFER_BIT)),t.drawElements(t.TRIANGLES,6,t.UNSIGNED_SHORT,0)}})(),R,f,K,$,C,fe=new w(L,Ge),J=new w(L,Me),_=new w(L,Ne),D=new w(L,ze),Z=new w(L,Oe),Q=new w(L,Xe),U=new w(L,ke),O=new w(L,He),X=new w(L,Ye),k=new z(L,Ie);function ee(){let e=Fe(s.simResolution),r=Fe(s.dyeResolution),n=p.halfFloatTexType,o=p.formatRGBA,i=p.formatRG,l=p.formatR,u=p.supportLinearFiltering?t.LINEAR:t.NEAREST;t.disable(t.BLEND),R==null?R=te(r.width,r.height,o.internalFormat,o.format,n,u):R=de(R,r.width,r.height,o.internalFormat,o.format,n,u),f==null?f=te(e.width,e.height,i.internalFormat,i.format,n,u):f=de(f,e.width,e.height,i.internalFormat,i.format,n,u),K=G(e.width,e.height,l.internalFormat,l.format,n,t.NEAREST),$=G(e.width,e.height,l.internalFormat,l.format,n,t.NEAREST),C=te(e.width,e.height,l.internalFormat,l.format,n,t.NEAREST)}function G(e,r,n,o,i,l){t.activeTexture(t.TEXTURE0);let u=t.createTexture();t.bindTexture(t.TEXTURE_2D,u),t.texParameteri(t.TEXTURE_2D,t.TEXTURE_MIN_FILTER,l),t.texParameteri(t.TEXTURE_2D,t.TEXTURE_MAG_FILTER,l),t.texParameteri(t.TEXTURE_2D,t.TEXTURE_WRAP_S,t.CLAMP_TO_EDGE),t.texParameteri(t.TEXTURE_2D,t.TEXTURE_WRAP_T,t.CLAMP_TO_EDGE),t.texImage2D(t.TEXTURE_2D,0,n,e,r,0,o,i,null);let v=t.createFramebuffer();t.bindFramebuffer(t.FRAMEBUFFER,v),t.framebufferTexture2D(t.FRAMEBUFFER,t.COLOR_ATTACHMENT0,t.TEXTURE_2D,u,0),t.viewport(0,0,e,r),t.clear(t.COLOR_BUFFER_BIT);let x=1/e,P=1/r;return{texture:u,fbo:v,width:e,height:r,texelSizeX:x,texelSizeY:P,attach(d){return t.activeTexture(t.TEXTURE0+d),t.bindTexture(t.TEXTURE_2D,u),d}}}function te(e,r,n,o,i,l){let u=G(e,r,n,o,i,l),v=G(e,r,n,o,i,l);return{width:e,height:r,texelSizeX:u.texelSizeX,texelSizeY:u.texelSizeY,get read(){return u},set read(x){u=x},get write(){return v},set write(x){v=x},swap(){let x=u;u=v,v=x}}}function We(e,r,n,o,i,l,u){let v=G(r,n,o,i,l,u);return fe.bind(),t.uniform1i(fe.uniforms.uTexture,e.attach(0)),E(v),v}function de(e,r,n,o,i,l,u){return e.width===r&&e.height===n||(e.read=We(e.read,r,n,o,i,l,u),e.write=G(r,n,o,i,l,u),e.width=r,e.height=n,e.texelSizeX=1/r,e.texelSizeY=1/n),e}function Ve(){let e=[];s.shading&&e.push("shading"),k.setKeywords(e)}Ve(),ee();let re=Date.now(),H=0,ne=0;function me(){let e=je();N()&&ee(),qe(e),Ke(),s.paused||$e(e),ve(null),ne=requestAnimationFrame(me)}function je(){let e=Date.now(),r=(e-re)/1e3;return r=Math.min(r,.016666),re=e,r}function N(){let e=T(a.clientWidth),r=T(a.clientHeight);return a.width!==e||a.height!==r?(a.width=e,a.height=r,!0):!1}function qe(e){H+=e*s.colorUpdateSpeed,H>=1&&(H=it(H,0,1),g.forEach(r=>{r.color=Te(Y())}))}function Ke(){g.forEach(e=>{e.moved&&(e.moved=!1,Ze(e))})}function $e(e){t.disable(t.BLEND),Q.bind(),t.uniform2f(Q.uniforms.texelSize,f.texelSizeX,f.texelSizeY),t.uniform1i(Q.uniforms.uVelocity,f.read.attach(0)),E($),U.bind(),t.uniform2f(U.uniforms.texelSize,f.texelSizeX,f.texelSizeY),t.uniform1i(U.uniforms.uVelocity,f.read.attach(0)),t.uniform1i(U.uniforms.uCurl,$.attach(1)),t.uniform1f(U.uniforms.curl,s.curl),t.uniform1f(U.uniforms.dt,e),E(f.write),f.swap(),Z.bind(),t.uniform2f(Z.uniforms.texelSize,f.texelSizeX,f.texelSizeY),t.uniform1i(Z.uniforms.uVelocity,f.read.attach(0)),E(K),J.bind(),t.uniform1i(J.uniforms.uTexture,C.read.attach(0)),t.uniform1f(J.uniforms.value,s.pressure),E(C.write),C.swap(),O.bind(),t.uniform2f(O.uniforms.texelSize,f.texelSizeX,f.texelSizeY),t.uniform1i(O.uniforms.uDivergence,K.attach(0));for(let n=0;n<s.pressureIteration;n++)t.uniform1i(O.uniforms.uPressure,C.read.attach(1)),E(C.write),C.swap();X.bind(),t.uniform2f(X.uniforms.texelSize,f.texelSizeX,f.texelSizeY),t.uniform1i(X.uniforms.uPressure,C.read.attach(0)),t.uniform1i(X.uniforms.uVelocity,f.read.attach(1)),E(f.write),f.swap(),D.bind(),t.uniform2f(D.uniforms.texelSize,f.texelSizeX,f.texelSizeY),p.supportLinearFiltering||t.uniform2f(D.uniforms.dyeTexelSize,f.texelSizeX,f.texelSizeY);let r=f.read.attach(0);t.uniform1i(D.uniforms.uVelocity,r),t.uniform1i(D.uniforms.uSource,r),t.uniform1f(D.uniforms.dt,e),t.uniform1f(D.uniforms.dissipation,s.velocityDissipation),E(f.write),f.swap(),p.supportLinearFiltering||t.uniform2f(D.uniforms.dyeTexelSize,R.texelSizeX,R.texelSizeY),t.uniform1i(D.uniforms.uVelocity,f.read.attach(0)),t.uniform1i(D.uniforms.uSource,R.read.attach(1)),t.uniform1f(D.uniforms.dissipation,s.densityDissipation),E(R.write),R.swap()}function ve(e){t.blendFunc(t.ONE,t.ONE_MINUS_SRC_ALPHA),t.enable(t.BLEND),Je(e)}function Je(e){let r=e==null?t.drawingBufferWidth:e.width,n=e==null?t.drawingBufferHeight:e.height;k.bind(),s.shading&&t.uniform2f(k.uniforms.texelSize,1/r,1/n),t.uniform1i(k.uniforms.uTexture,R.read.attach(0)),E(e)}function Ze(e){let r=e.deltaX*s.splatForce,n=e.deltaY*s.splatForce,o=nt(e.color);oe(e.texcoordX,e.texcoordY,r,n,o)}function pe(e){let r=Y();r.r*=10,r.g*=10,r.b*=10;let n=10*(Math.random()-.5),o=30*(Math.random()-.5);oe(e.texcoordX,e.texcoordY,n,o,r)}function oe(e,r,n,o,i){_.bind(),t.uniform1i(_.uniforms.uTarget,f.read.attach(0)),t.uniform1f(_.uniforms.aspectRatio,a.width/a.height),t.uniform2f(_.uniforms.point,e,r),t.uniform3f(_.uniforms.color,n,o,0),t.uniform1f(_.uniforms.radius,Qe(s.splatRadius/100)),E(f.write),f.swap(),t.uniform1i(_.uniforms.uTarget,R.read.attach(0)),t.uniform3f(_.uniforms.color,i.r,i.g,i.b),E(R.write),R.swap()}function Qe(e){let r=a.width/a.height;return r>1&&(e*=r),e}let he=e=>{let r=g[0],n=a.getBoundingClientRect(),o=T(e.clientX-n.left),i=T(e.clientY-n.top);ye(r,-1,o,i),pe(r)},xe=e=>{let r=g[0],n=a.getBoundingClientRect(),o=T(e.clientX-n.left),i=T(e.clientY-n.top),l=r.color;Ee(r,o,i,l)},be=e=>{let r=e.targetTouches,n=a.getBoundingClientRect(),o=g[0];for(let i=0;i<r.length;i++){let l=T(r[i].clientX-n.left),u=T(r[i].clientY-n.top);ye(o,r[i].identifier,l,u),pe(o)}},ge=e=>{e.preventDefault();let r=e.targetTouches,n=a.getBoundingClientRect(),o=g[0];for(let i=0;i<r.length;i++){let l=T(r[i].clientX-n.left),u=T(r[i].clientY-n.top);Ee(o,l,u,o.color)}},Re=e=>{let r=e.changedTouches,n=g[0];for(let o=0;o<r.length;o++)et(n)};window.addEventListener("mousedown",he),window.addEventListener("mousemove",xe),window.addEventListener("touchstart",be),window.addEventListener("touchmove",ge,{passive:!1}),window.addEventListener("touchend",Re);function ye(e,r,n,o){e.id=r,e.down=!0,e.moved=!1,e.texcoordX=n/a.width,e.texcoordY=1-o/a.height,e.prevTexcoordX=e.texcoordX,e.prevTexcoordY=e.texcoordY,e.deltaX=0,e.deltaY=0,e.color=Te(Y())}function Ee(e,r,n,o){e.prevTexcoordX=e.texcoordX,e.prevTexcoordY=e.texcoordY,e.texcoordX=r/a.width,e.texcoordY=1-n/a.height,e.deltaX=tt(e.texcoordX-e.prevTexcoordX),e.deltaY=rt(e.texcoordY-e.prevTexcoordY),e.moved=Math.abs(e.deltaX)>0||Math.abs(e.deltaY)>0,e.color=o}function et(e){e.down=!1}function tt(e){let r=a.width/a.height;return r<1&&(e*=r),e}function rt(e){let r=a.width/a.height;return r>1&&(e/=r),e}function Y(){let e=s.colorIntensity,r=s.palette;if(r&&r.length>0){let o=r[Math.floor(Math.random()*r.length)],i=ct(o);if(i)return{r:i.r*e,g:i.g*e,b:i.b*e}}let n=ot(Math.random(),1,1);return n.r*=e,n.g*=e,n.b*=e,n}function Te(e){return[e.r,e.g,e.b]}function nt(e){return{r:e[0],g:e[1],b:e[2]}}function ot(e,r,n){let o=0,i=0,l=0,u=Math.floor(e*6),v=e*6-u,x=n*(1-r),P=n*(1-v*r),d=n*(1-(1-v)*r);switch(u%6){case 0:o=n,i=d,l=x;break;case 1:o=P,i=n,l=x;break;case 2:o=x,i=n,l=d;break;case 3:o=x,i=P,l=n;break;case 4:o=d,i=x,l=n;break;case 5:o=n,i=x,l=P;break}return{r:o,g:i,b:l}}function it(e,r,n){let o=n-r;return o===0?r:(e-r)%o+r}function Fe(e){let r=t.drawingBufferWidth/t.drawingBufferHeight;r<1&&(r=1/r);let n=Math.round(e),o=Math.round(e*r);return t.drawingBufferWidth>t.drawingBufferHeight?{width:o,height:n}:{width:n,height:o}}function T(e){let r=Math.min(window.devicePixelRatio||1,Math.max(1,s.maxDpr));return Math.floor(e*r)}function st(e){if(e.length===0)return 0;let r=0;for(let n=0;n<e.length;n++)r=(r<<5)-r+e.charCodeAt(n),r|=0;return r}function at(){var e,r;ie||(ie=!0,j(),window.removeEventListener("mousedown",he),window.removeEventListener("mousemove",xe),window.removeEventListener("touchstart",be),window.removeEventListener("touchmove",ge),window.removeEventListener("touchend",Re),window.removeEventListener("resize",De),document.removeEventListener("visibilitychange",Se),(e=y==null?void 0:y.removeEventListener)==null||e.call(y,"change",Le),M==null||M.disconnect(),b&&(a==null||a.remove()),(r=t.getExtension("WEBGL_lose_context"))==null||r.loseContext())}let ie=!1,W=!1;function V(){W||ie||(W=!0,re=Date.now(),ne=requestAnimationFrame(me))}function j(){W=!1,cancelAnimationFrame(ne)}let Se=()=>{s.pauseOnHidden&&(document.hidden?j():I||V())},De=()=>N(),M=typeof ResizeObserver!="undefined"?new ResizeObserver(()=>N()):null;M==null||M.observe(a);let y=typeof window.matchMedia=="function"?window.matchMedia("(prefers-reduced-motion: reduce)"):null,Le=()=>{s.respectReducedMotion&&(y!=null&&y.matches?j():I||V())},I=!1;return window.addEventListener("resize",De),document.addEventListener("visibilitychange",Se),(Ce=y==null?void 0:y.addEventListener)==null||Ce.call(y,"change",Le),s.respectReducedMotion&&ft()?(I=!0,ve(null)):V(),{dispose:at,pause(){I=!0,j()},resume(){I=!1,V()},isPaused:()=>I||!W,setConfig(e){let r=e.simResolution!==void 0&&e.simResolution!==s.simResolution||e.dyeResolution!==void 0&&e.dyeResolution!==s.dyeResolution;Object.assign(s,e),e.maxDpr!==void 0&&N(),r&&ee(),e.zIndex!==void 0&&(a.style.zIndex=String(e.zIndex)),e.pointerEvents!==void 0&&(a.style.pointerEvents=e.pointerEvents?"auto":"none")},splat(e,r,n){let o=a.getBoundingClientRect(),i=T(e),l=T(r),u=n!=null?n:Y();oe(i,a.height-l,0,0,u)},get canvas(){return a}}};var Ae={Spectrum:null,Sunset:["#ff4ecd","#ff8a4e","#ffd24e"],Ocean:["#4ea8ff","#4effd2","#7c4dff"],Mono:["#ffffff"],Aurora:["#3affa3","#38d9ff","#8f7bff"],Ember:["#ff5722","#ff9100","#ffc400"],Lagoon:["#00c2a8","#00a3ff","#0057d9"],Candy:["#ff8fd0","#ffa9f0","#c79bff"],Toxic:["#b6ff00","#4dff88","#00ffc8"],Royal:["#5b2bff","#8f4dff","#c44dff"],Sakura:["#ffc2dd","#ff8fb1","#ff6f91"],Mint:["#9cffd6","#5ef2c0","#2fd6a5"],Copper:["#ff9a5a","#e2703a","#b34700"],Ultraviolet:["#7b2cff","#b429ff","#ff29f0"],Ice:["#c9f0ff","#8ad4ff","#4fb3ff"],Magma:["#ff2d2d","#ff6a00","#ffb300"],Forest:["#2f9e44","#69db7c","#a9e34b"],Dusk:["#3b3b98","#7158e2","#cd84f1"],Cyber:["#00fff0","#ff00e0","#fffb00"],Pastel:["#ffd6e0","#c7ceea","#b5ead7"]},Ue={Calm:{curl:3,splatForce:4200,splatRadius:.45,densityDissipation:4.6,velocityDissipation:2.6,pressureIteration:16,colorUpdateSpeed:6},Flow:{curl:10,splatForce:6e3,splatRadius:.5,densityDissipation:3.5,velocityDissipation:2,pressureIteration:20,colorUpdateSpeed:10},Swirl:{curl:24,splatForce:7200,splatRadius:.55,densityDissipation:3,velocityDissipation:1.6,pressureIteration:24,colorUpdateSpeed:12},Storm:{curl:40,splatForce:9500,splatRadius:.65,densityDissipation:2.2,velocityDissipation:1.2,pressureIteration:28,colorUpdateSpeed:16},Wisp:{curl:6,splatForce:3200,splatRadius:.32,densityDissipation:6.5,velocityDissipation:3.4,pressureIteration:12,colorUpdateSpeed:8}},dt=()=>{let c={};for(let[s,b]of Object.entries(Ae))for(let[a,B]of Object.entries(Ue)){let F=`${s} ${a}`;c[F]={...B,palette:b?[...b]:null,colorIntensity:b===null?.15:.18}}return c},ae=dt(),mt=Object.keys(ae),vt=Object.keys(Ae),pt=Object.keys(Ue),ht=c=>ae[c];import{jsx as Rt}from"react/jsx-runtime";var xt=["densityDissipation","velocityDissipation","pressure","pressureIteration","curl","splatRadius","splatForce","shading","colorUpdateSpeed","paused","transparent","backColor","palette","colorIntensity","zIndex","pointerEvents","maxDpr","pauseOnHidden","respectReducedMotion"],bt=c=>JSON.stringify([c==null?void 0:c.id,c==null?void 0:c.position,c==null?void 0:c.className,c==null?void 0:c.simResolution,c==null?void 0:c.dyeResolution,c==null?void 0:c.captureResolution]);function gt(c,s){let b=A.useRef(null),a=A.useRef(c);a.current=c;let B=bt(c);return A.useEffect(()=>{let F=Be({...a.current,...s!=null&&s.current?{container:s.current}:{}});return b.current=F,()=>{F.dispose(),b.current=null}},[B,s]),A.useEffect(()=>{let F=b.current;if(!F||!c)return;let g={};for(let t of xt)c[t]!==void 0&&(g[t]=c[t]);F.setConfig(g)}),b}var Dt=A.forwardRef(function({config:s,scoped:b=!1,className:a,style:B,children:F},g){let t=A.useRef(null),p=gt(s,b?t:void 0);return A.useImperativeHandle(g,()=>({dispose:()=>{var m;return(m=p.current)==null?void 0:m.dispose()},pause:()=>{var m;return(m=p.current)==null?void 0:m.pause()},resume:()=>{var m;return(m=p.current)==null?void 0:m.resume()},isPaused:()=>{var m,h;return(h=(m=p.current)==null?void 0:m.isPaused())!=null?h:!0},setConfig:m=>{var h;return(h=p.current)==null?void 0:h.setConfig(m)},splat:(m,h,q)=>{var z;return(z=p.current)==null?void 0:z.splat(m,h,q)},get canvas(){var m,h;return(h=(m=p.current)==null?void 0:m.canvas)!=null?h:null}}),[p]),b?Rt("div",{ref:t,className:a,style:{position:"relative",overflow:"hidden",...B},children:F}):null});export{Dt as SmokeyFluidCursor,pt as characterNames,ht as getPreset,Be as initFluid,vt as paletteNames,mt as presetNames,ae as presets,gt as useSmokeyFluidCursor};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "react-smokey-fluid-cursor",
3
- "version": "2.0.0",
3
+ "version": "2.1.0",
4
4
  "description": "A customizable fluid cursor effect for React & Next.js Apps running on the web. Enhance user experience with smooth, interactive cursor animations. Perfect for modern web designs.",
5
5
  "keywords": [
6
6
  "react",