@andresclua/perlindom 0.0.6 → 0.1.1

package/dist/perlindom.es.js

@@ -0,0 +1,212 @@
+var C = (i) => {
+  throw TypeError(i);
+};
+var I = (i, t, e) => t.has(i) || C("Cannot " + e);
+var M = (i, t, e) => (I(i, t, "read from private field"), e ? e.call(i) : t.get(i)), B = (i, t, e) => t.has(i) ? C("Cannot add the same private member more than once") : t instanceof WeakSet ? t.add(i) : t.set(i, e), D = (i, t, e, s) => (I(i, t, "write to private field"), s ? s.call(i, e) : t.set(i, e), e), h = (i, t, e) => (I(i, t, "access private method"), e);
+const w = /* @__PURE__ */ new Set();
+let v = null;
+function G() {
+  v = null;
+  for (const i of [...w])
+    w.has(i) && (!i.onScreen && !i._dirty || (i._dirty = !1, i.step() === !1 && w.delete(i)));
+  w.size > 0 && v === null && (v = requestAnimationFrame(G));
+}
+function $(i) {
+  w.add(i), v === null && (v = requestAnimationFrame(G));
+}
+function Z(i) {
+  w.delete(i), w.size === 0 && v !== null && (cancelAnimationFrame(v), v = null);
+}
+const z = /* @__PURE__ */ new Map(), Y = /* @__PURE__ */ new WeakMap();
+let O = null;
+function V(i) {
+  if (typeof IntersectionObserver > "u" || !i.el || !i.pauseOffscreen || Y.has(i)) return;
+  O ?? (O = new IntersectionObserver((s) => {
+    for (const r of s) {
+      const a = z.get(r.target);
+      if (a) {
+        a.visible = r.isIntersecting;
+        for (const n of a.insts) n.onScreen = r.isIntersecting;
+      }
+    }
+  }));
+  const t = i.el.parentElement || i.el;
+  let e = z.get(t);
+  e || (e = { visible: !0, insts: /* @__PURE__ */ new Set() }, z.set(t, e), O.observe(t)), e.insts.add(i), Y.set(i, t), i.onScreen = e.visible;
+}
+function _(i) {
+  const t = Y.get(i);
+  if (!t) return;
+  Y.delete(i);
+  const e = z.get(t);
+  e && (e.insts.delete(i), e.insts.size === 0 && (z.delete(t), O.unobserve(t)));
+}
+var F, l, J, K, y, L, c, Q, U, S, X, E;
+const f = class f {
+  constructor({
+    element: t,
+    x: e = null,
+    y: s = null,
+    speed: r = 0.01,
+    seed: a = 0,
+    lerpSpeed: n = 0.1,
+    preserveBaseTranslation: o = !1,
+    // <-- si querés mantener la traslación base
+    amplitude: u = 1,
+    target: m = null,
+    // {x, y} en px, offset desde la posición base
+    legacyNoise: g = !1,
+    // true = sample noise at y=0/100 like <=0.0.6 (flat spots on one axis)
+    pauseOffscreen: R = !0
+    // false = keep stepping even when the parent box is out of view
+  }) {
+    B(this, c);
+    B(this, F, 1);
+    var b, x, T, d;
+    if (this._dirty = !1, this.pauseOffscreen = R !== !1, this._ny = g ? [0, 100] : [0.5, 100.5], this.amplitude = u, this.setTarget(m), this.el = t, this.xRange = e, this.yRange = s, this.speed = r, this.seed = a, this.time = a, this.isPlaying = !0, this.lerpFactor = 1, this.lerpSpeed = n, this.targetLerpFactor = 1, this.lastX = 0, this.lastY = 0, this.preserveBaseTranslation = o, this.hasPercentages = !!(e && (h(b = f, l, y).call(b, e.min) || h(x = f, l, y).call(x, e.max)) || s && (h(T = f, l, y).call(T, s.min) || h(d = f, l, y).call(d, s.max))), t) {
+      const p = window.getComputedStyle(t);
+      p.position === "static" && (t.style.position = "relative"), this.originalInlineTransform = t.style.transform || "", this.baseTransform = h(this, c, E).call(this, p.transform, this.preserveBaseTranslation), this.hasPercentages && (this.handleResize = this.handleResize.bind(this), window.addEventListener("resize", this.handleResize));
+    } else
+      this.originalInlineTransform = "", this.baseTransform = "";
+    this.onScreen = !0, this.init(a);
+  }
+  init(t) {
+    var e;
+    this._destroyed = !1, this.noise = h(this, c, Q).call(this, h(e = f, l, K).call(e, t)), this.isPlaying = !0, this.lerpFactor = 1, this.targetLerpFactor = 1, V(this), $(this);
+  }
+  // 0 = clavado en target (o 0,0), 1 = deriva libre; siempre clampeado a [0, 1], NaN cuenta como 1
+  get amplitude() {
+    return M(this, F);
+  }
+  set amplitude(t) {
+    const e = typeof t == "number" && !Number.isNaN(t) ? Math.min(1, Math.max(0, t)) : 1;
+    e !== M(this, F) && (this._dirty = !0), D(this, F, e);
+  }
+  setTarget(t) {
+    const e = this.target;
+    if (t === null || typeof t != "object")
+      this.target = null;
+    else {
+      const r = (a) => typeof a == "number" && Number.isFinite(a) ? a : 0;
+      this.target = { x: r(t.x), y: r(t.y) };
+    }
+    const s = this.target;
+    ((e == null ? void 0 : e.x) !== (s == null ? void 0 : s.x) || (e == null ? void 0 : e.y) !== (s == null ? void 0 : s.y)) && (this._dirty = !0);
+  }
+  // Permite refrescar el transform base si cambian clases/estilos en runtime
+  refreshBaseTransform(t = this.preserveBaseTranslation) {
+    if (!this.el) return;
+    const e = window.getComputedStyle(this.el);
+    this.baseTransform = h(this, c, E).call(this, e.transform, t);
+  }
+  // Handle window resize for percentage-based values
+  handleResize() {
+  }
+  pause() {
+    this.isPlaying && (this.targetLerpFactor = 0, this.isPlaying = !1);
+  }
+  play() {
+    this.isPlaying || (this.targetLerpFactor = 1, this.isPlaying = !0, this.lerpFactor === 0 && $(this));
+  }
+  // Un frame de este instance; devuelve false cuando queda totalmente pausado
+  step() {
+    var t, e, s, r, a, n, o, u, m, g, R, b;
+    if (this.lerpFactor !== this.targetLerpFactor && (this.lerpFactor = h(this, c, U).call(this, this.lerpFactor, this.targetLerpFactor, this.lerpSpeed), Math.abs(this.lerpFactor - this.targetLerpFactor) < 1e-3 && (this.lerpFactor = this.targetLerpFactor)), this.lerpFactor > 0) {
+      this.time += this.speed * this.lerpFactor;
+      const x = this.noise.perlin2(this.time, this._ny[0]), T = this.noise.perlin2(this.time, this._ny[1]);
+      if (this.el) {
+        let d, p, P, A;
+        if (this.hasPercentages) {
+          const j = this.el.parentElement || document.body, k = j.clientWidth, q = j.clientHeight;
+          this.xRange && (d = h(t = f, l, y).call(t, this.xRange.min) ? h(e = f, l, L).call(e, this.xRange.min, k) : this.xRange.min, p = h(s = f, l, y).call(s, this.xRange.max) ? h(r = f, l, L).call(r, this.xRange.max, k) : this.xRange.max), this.yRange && (P = h(a = f, l, y).call(a, this.yRange.min) ? h(n = f, l, L).call(n, this.yRange.min, q) : this.yRange.min, A = h(o = f, l, y).call(o, this.yRange.max) ? h(u = f, l, L).call(u, this.yRange.max, q) : this.yRange.max);
+        } else
+          d = (m = this.xRange) == null ? void 0 : m.min, p = (g = this.xRange) == null ? void 0 : g.max, P = (R = this.yRange) == null ? void 0 : R.min, A = (b = this.yRange) == null ? void 0 : b.max;
+        const N = h(this, c, S).call(this, this.xRange ? h(this, c, X).call(this, x, -1, 1, d, p) : 0, "x"), W = h(this, c, S).call(this, this.yRange ? h(this, c, X).call(this, T, -1, 1, P, A) : 0, "y");
+        this.lastX = N, this.lastY = W, this.el.style.transform = `translate3d(${N}px, ${W}px, 0) ${this.baseTransform}`.trim();
+      } else {
+        const d = h(this, c, S).call(this, this.xRange ? h(this, c, X).call(this, x, -1, 1, this.xRange.min, this.xRange.max) : 0, "x"), p = h(this, c, S).call(this, this.yRange ? h(this, c, X).call(this, T, -1, 1, this.yRange.min, this.yRange.max) : 0, "y");
+        this.lastX = d, this.lastY = p;
+      }
+    }
+    return this.lerpFactor > 0 || this.targetLerpFactor > 0;
+  }
+  // Back to the starting state, as if just created: the noise path rewinds to its seed and the
+  // element returns to its own transform (no drift). Keeps play/pause, amplitude and target.
+  reset() {
+    this._destroyed || (this.time = this.seed, this.lastX = 0, this.lastY = 0, this.el && (this.el.style.transform = this.originalInlineTransform || ""), this.isPlaying && $(this));
+  }
+  destroy() {
+    this._destroyed = !0, Z(this), _(this), this.el && (this.el.style.transform = this.originalInlineTransform || ""), this.hasPercentages && window.removeEventListener("resize", this.handleResize);
+  }
+};
+F = new WeakMap(), l = new WeakSet(), J = function(t) {
+  return function() {
+    let e = t += 1831565813;
+    return e = Math.imul(e ^ e >>> 15, e | 1), e ^= e + Math.imul(e ^ e >>> 7, e | 61), ((e ^ e >>> 14) >>> 0) / 4294967296;
+  };
+}, K = function(t = 0) {
+  var r;
+  const e = Array.from({ length: 256 }, (a, n) => n), s = h(r = f, l, J).call(r, t);
+  for (let a = 255; a > 0; a--) {
+    const n = Math.floor(s() * (a + 1));
+    [e[a], e[n]] = [e[n], e[a]];
+  }
+  return e.concat(e);
+}, y = function(t) {
+  return typeof t == "string" && t.endsWith("%");
+}, L = function(t, e) {
+  var r;
+  return h(r = f, l, y).call(r, t) ? parseFloat(t) / 100 * e : t;
+}, c = new WeakSet(), Q = function(t) {
+  const e = (n) => n * n * n * (n * (n * 6 - 15) + 10), s = (n, o, u) => o + n * (u - o), r = (n, o, u) => {
+    const m = n & 15, g = m < 8 ? o : u, R = m < 4 ? u : m === 12 || m === 14 ? o : 0;
+    return (m & 1 ? -g : g) + (m & 2 ? -R : R);
+  }, a = (n, o) => n & 1 ? -o : o;
+  return {
+    // Original 1D Perlin noise function
+    perlin1(n) {
+      const o = Math.floor(n) & 255;
+      n -= Math.floor(n);
+      const u = e(n);
+      return s(u, a(t[o], n), a(t[o + 1], n - 1));
+    },
+    // New 2D Perlin noise function
+    perlin2(n, o) {
+      const u = Math.floor(n) & 255, m = Math.floor(o) & 255;
+      n -= Math.floor(n), o -= Math.floor(o);
+      const g = e(n), R = e(o), b = t[u] + m, x = t[u + 1] + m, T = t[b], d = t[b + 1], p = t[x], P = t[x + 1];
+      return s(
+        R,
+        s(g, r(t[T], n, o), r(t[p], n - 1, o)),
+        s(g, r(t[d], n, o - 1), r(t[P], n - 1, o - 1))
+      );
+    }
+  };
+}, U = function(t, e, s) {
+  return t + s * (e - t);
+}, // target + (noise - target) * amplitude; amplitude 1 returns noise untouched (exact legacy values)
+S = function(t, e) {
+  var r;
+  if (M(this, F) === 1) return t;
+  const s = ((r = this.target) == null ? void 0 : r[e]) ?? 0;
+  return s + (t - s) * M(this, F);
+}, X = function(t, e, s, r, a) {
+  return (t - e) * (a - r) / (s - e) + r;
+}, // Quita o preserva la traslación del transform base en 2D según flag
+E = function(t, e = !1) {
+  if (!t || t === "none") return "";
+  try {
+    const s = new DOMMatrixReadOnly(t);
+    if (s.is2D) {
+      const r = e ? s.e : 0, a = e ? s.f : 0;
+      return `matrix(${s.a}, ${s.b}, ${s.c}, ${s.d}, ${r}, ${a})`;
+    } else
+      return t;
+  } catch {
+    return t;
+  }
+}, B(f, l);
+let H = f;
+export {
+  H as default
+};

package/dist/perlindom.umd.js

@@ -0,0 +1 @@
+(function(r,o){typeof exports=="object"&&typeof module<"u"?module.exports=o():typeof define=="function"&&define.amd?define(o):(r=typeof globalThis<"u"?globalThis:r||self,r.PerlinDOM=o())})(this,function(){"use strict";var H=r=>{throw TypeError(r)};var N=(r,o,d)=>o.has(r)||H("Cannot "+d);var X=(r,o,d)=>(N(r,o,"read from private field"),d?d.call(r):o.get(r)),I=(r,o,d)=>o.has(r)?H("Cannot add the same private member more than once"):o instanceof WeakSet?o.add(r):o.set(r,d),G=(r,o,d,M)=>(N(r,o,"write to private field"),M?M.call(r,d):o.set(r,d),d),h=(r,o,d)=>(N(r,o,"access private method"),d);var v,f,J,K,x,z,u,Q,U,B,Y,W;const r=new Set;let o=null;function d(){o=null;for(const c of[...r])r.has(c)&&(!c.onScreen&&!c._dirty||(c._dirty=!1,c.step()===!1&&r.delete(c)));r.size>0&&o===null&&(o=requestAnimationFrame(d))}function M(c){r.add(c),o===null&&(o=requestAnimationFrame(d))}function Z(c){r.delete(c),r.size===0&&o!==null&&(cancelAnimationFrame(o),o=null)}const L=new Map,A=new WeakMap;let $=null;function V(c){if(typeof IntersectionObserver>"u"||!c.el||!c.pauseOffscreen||A.has(c))return;$??($=new IntersectionObserver(s=>{for(const n of s){const a=L.get(n.target);if(a){a.visible=n.isIntersecting;for(const i of a.insts)i.onScreen=n.isIntersecting}}}));const t=c.el.parentElement||c.el;let e=L.get(t);e||(e={visible:!0,insts:new Set},L.set(t,e),$.observe(t)),e.insts.add(c),A.set(c,t),c.onScreen=e.visible}function _(c){const t=A.get(c);if(!t)return;A.delete(c);const e=L.get(t);e&&(e.insts.delete(c),e.insts.size===0&&(L.delete(t),$.unobserve(t)))}const m=class m{constructor({element:t,x:e=null,y:s=null,speed:n=.01,seed:a=0,lerpSpeed:i=.1,preserveBaseTranslation:l=!1,amplitude:g=1,target:p=null,legacyNoise:y=!1,pauseOffscreen:F=!0}){I(this,u);I(this,v,1);var T,w,P,R;if(this._dirty=!1,this.pauseOffscreen=F!==!1,this._ny=y?[0,100]:[.5,100.5],this.amplitude=g,this.setTarget(p),this.el=t,this.xRange=e,this.yRange=s,this.speed=n,this.seed=a,this.time=a,this.isPlaying=!0,this.lerpFactor=1,this.lerpSpeed=i,this.targetLerpFactor=1,this.lastX=0,this.lastY=0,this.preserveBaseTranslation=l,this.hasPercentages=!!(e&&(h(T=m,f,x).call(T,e.min)||h(w=m,f,x).call(w,e.max))||s&&(h(P=m,f,x).call(P,s.min)||h(R=m,f,x).call(R,s.max))),t){const b=window.getComputedStyle(t);b.position==="static"&&(t.style.position="relative"),this.originalInlineTransform=t.style.transform||"",this.baseTransform=h(this,u,W).call(this,b.transform,this.preserveBaseTranslation),this.hasPercentages&&(this.handleResize=this.handleResize.bind(this),window.addEventListener("resize",this.handleResize))}else this.originalInlineTransform="",this.baseTransform="";this.onScreen=!0,this.init(a)}init(t){var e;this._destroyed=!1,this.noise=h(this,u,Q).call(this,h(e=m,f,K).call(e,t)),this.isPlaying=!0,this.lerpFactor=1,this.targetLerpFactor=1,V(this),M(this)}get amplitude(){return X(this,v)}set amplitude(t){const e=typeof t=="number"&&!Number.isNaN(t)?Math.min(1,Math.max(0,t)):1;e!==X(this,v)&&(this._dirty=!0),G(this,v,e)}setTarget(t){const e=this.target;if(t===null||typeof t!="object")this.target=null;else{const n=a=>typeof a=="number"&&Number.isFinite(a)?a:0;this.target={x:n(t.x),y:n(t.y)}}const s=this.target;((e==null?void 0:e.x)!==(s==null?void 0:s.x)||(e==null?void 0:e.y)!==(s==null?void 0:s.y))&&(this._dirty=!0)}refreshBaseTransform(t=this.preserveBaseTranslation){if(!this.el)return;const e=window.getComputedStyle(this.el);this.baseTransform=h(this,u,W).call(this,e.transform,t)}handleResize(){}pause(){this.isPlaying&&(this.targetLerpFactor=0,this.isPlaying=!1)}play(){this.isPlaying||(this.targetLerpFactor=1,this.isPlaying=!0,this.lerpFactor===0&&M(this))}step(){var t,e,s,n,a,i,l,g,p,y,F,T;if(this.lerpFactor!==this.targetLerpFactor&&(this.lerpFactor=h(this,u,U).call(this,this.lerpFactor,this.targetLerpFactor,this.lerpSpeed),Math.abs(this.lerpFactor-this.targetLerpFactor)<.001&&(this.lerpFactor=this.targetLerpFactor)),this.lerpFactor>0){this.time+=this.speed*this.lerpFactor;const w=this.noise.perlin2(this.time,this._ny[0]),P=this.noise.perlin2(this.time,this._ny[1]);if(this.el){let R,b,S,E;if(this.hasPercentages){const k=this.el.parentElement||document.body,q=k.clientWidth,C=k.clientHeight;this.xRange&&(R=h(t=m,f,x).call(t,this.xRange.min)?h(e=m,f,z).call(e,this.xRange.min,q):this.xRange.min,b=h(s=m,f,x).call(s,this.xRange.max)?h(n=m,f,z).call(n,this.xRange.max,q):this.xRange.max),this.yRange&&(S=h(a=m,f,x).call(a,this.yRange.min)?h(i=m,f,z).call(i,this.yRange.min,C):this.yRange.min,E=h(l=m,f,x).call(l,this.yRange.max)?h(g=m,f,z).call(g,this.yRange.max,C):this.yRange.max)}else R=(p=this.xRange)==null?void 0:p.min,b=(y=this.xRange)==null?void 0:y.max,S=(F=this.yRange)==null?void 0:F.min,E=(T=this.yRange)==null?void 0:T.max;const j=h(this,u,B).call(this,this.xRange?h(this,u,Y).call(this,w,-1,1,R,b):0,"x"),D=h(this,u,B).call(this,this.yRange?h(this,u,Y).call(this,P,-1,1,S,E):0,"y");this.lastX=j,this.lastY=D,this.el.style.transform=`translate3d(${j}px, ${D}px, 0) ${this.baseTransform}`.trim()}else{const R=h(this,u,B).call(this,this.xRange?h(this,u,Y).call(this,w,-1,1,this.xRange.min,this.xRange.max):0,"x"),b=h(this,u,B).call(this,this.yRange?h(this,u,Y).call(this,P,-1,1,this.yRange.min,this.yRange.max):0,"y");this.lastX=R,this.lastY=b}}return this.lerpFactor>0||this.targetLerpFactor>0}reset(){this._destroyed||(this.time=this.seed,this.lastX=0,this.lastY=0,this.el&&(this.el.style.transform=this.originalInlineTransform||""),this.isPlaying&&M(this))}destroy(){this._destroyed=!0,Z(this),_(this),this.el&&(this.el.style.transform=this.originalInlineTransform||""),this.hasPercentages&&window.removeEventListener("resize",this.handleResize)}};v=new WeakMap,f=new WeakSet,J=function(t){return function(){let e=t+=1831565813;return e=Math.imul(e^e>>>15,e|1),e^=e+Math.imul(e^e>>>7,e|61),((e^e>>>14)>>>0)/4294967296}},K=function(t=0){var n;const e=Array.from({length:256},(a,i)=>i),s=h(n=m,f,J).call(n,t);for(let a=255;a>0;a--){const i=Math.floor(s()*(a+1));[e[a],e[i]]=[e[i],e[a]]}return e.concat(e)},x=function(t){return typeof t=="string"&&t.endsWith("%")},z=function(t,e){var n;return h(n=m,f,x).call(n,t)?parseFloat(t)/100*e:t},u=new WeakSet,Q=function(t){const e=i=>i*i*i*(i*(i*6-15)+10),s=(i,l,g)=>l+i*(g-l),n=(i,l,g)=>{const p=i&15,y=p<8?l:g,F=p<4?g:p===12||p===14?l:0;return(p&1?-y:y)+(p&2?-F:F)},a=(i,l)=>i&1?-l:l;return{perlin1(i){const l=Math.floor(i)&255;i-=Math.floor(i);const g=e(i);return s(g,a(t[l],i),a(t[l+1],i-1))},perlin2(i,l){const g=Math.floor(i)&255,p=Math.floor(l)&255;i-=Math.floor(i),l-=Math.floor(l);const y=e(i),F=e(l),T=t[g]+p,w=t[g+1]+p,P=t[T],R=t[T+1],b=t[w],S=t[w+1];return s(F,s(y,n(t[P],i,l),n(t[b],i-1,l)),s(y,n(t[R],i,l-1),n(t[S],i-1,l-1)))}}},U=function(t,e,s){return t+s*(e-t)},B=function(t,e){var n;if(X(this,v)===1)return t;const s=((n=this.target)==null?void 0:n[e])??0;return s+(t-s)*X(this,v)},Y=function(t,e,s,n,a){return(t-e)*(a-n)/(s-e)+n},W=function(t,e=!1){if(!t||t==="none")return"";try{const s=new DOMMatrixReadOnly(t);if(s.is2D){const n=e?s.e:0,a=e?s.f:0;return`matrix(${s.a}, ${s.b}, ${s.c}, ${s.d}, ${n}, ${a})`}else return t}catch{return t}},I(m,f);let O=m;return O});

package/package.json

@@ -1,15 +1,19 @@
 {
     "name": "@andresclua/perlindom",
     "private": false,
-    "version": "0.0.6",
+    "version": "0.1.1",
     "description": "A lightweight JavaScript library for creating smooth, organic animations for DOM elements using Perlin noise",
+    "homepage": "https://perlindom.js.org",
+    "repository": { "type": "git", "url": "git+https://github.com/andresclua/PerlinDOM.git" },
+    "bugs": "https://github.com/andresclua/PerlinDOM/issues",
+    "files": ["dist", "CHANGELOG.md"],
     "type": "module",
-    "main": "./dist/PerlinDOM.umd.js",
-    "module": "./dist/PerlinDOM.es.js",
+    "main": "./dist/perlindom.umd.js",
+    "module": "./dist/perlindom.es.js",
     "exports": {
         ".": {
-            "import": "./dist/PerlinDOM.es.js",
-            "require": "./dist/PerlinDOM.umd.js"
+            "import": "./dist/perlindom.es.js",
+            "require": "./dist/perlindom.umd.js"
         }
     },
     "keywords": [
@@ -24,9 +28,13 @@
     "scripts": {
         "dev": "vite",
         "build": "vite build",
-        "preview": "vite preview"
+        "build:lib": "vite build",
+        "build:site": "vite build --mode site",
+        "preview": "vite preview",
+        "test": "node --test 'tests/*.test.mjs'"
     },
     "devDependencies": {
+        "gsap": "^3.15.1",
         "sass": "^1.80.6",
         "vite": "^5.4.10"
     }

package/dist/PerlinDOM.es.js

@@ -1,138 +0,0 @@
-var D = Object.defineProperty;
-var z = (c) => {
-  throw TypeError(c);
-};
-var H = (c, t, s) => t in c ? D(c, t, { enumerable: !0, configurable: !0, writable: !0, value: s }) : c[t] = s;
-var S = (c, t, s) => H(c, typeof t != "symbol" ? t + "" : t, s), j = (c, t, s) => t.has(c) || z("Cannot " + s);
-var A = (c, t, s) => t.has(c) ? z("Cannot add the same private member more than once") : t instanceof WeakSet ? t.add(c) : t.set(c, s);
-var n = (c, t, s) => (j(c, t, "access private method"), s);
-var r, E, I, d, P, f, W, C, T, B;
-const l = class l {
-  constructor({
-    element: t,
-    x: s = null,
-    y: e = null,
-    speed: h = 0.01,
-    seed: o = 0,
-    lerpSpeed: i = 0.1,
-    preserveBaseTranslation: a = !1
-    // <-- si querés mantener la traslación base
-  }) {
-    A(this, f);
-    S(this, "animate", () => {
-      var t, s, e, h, o, i, a, m, g, p, u, R;
-      if (this.lerpFactor !== this.targetLerpFactor && (this.lerpFactor = n(this, f, C).call(this, this.lerpFactor, this.targetLerpFactor, this.lerpSpeed), Math.abs(this.lerpFactor - this.targetLerpFactor) < 1e-3 && (this.lerpFactor = this.targetLerpFactor)), this.lerpFactor > 0) {
-        this.time += this.speed * this.lerpFactor;
-        const x = this.noise.perlin2(this.time, 0), b = this.noise.perlin2(this.time, 100);
-        if (this.el) {
-          let F, y, v, L;
-          if (this.hasPercentages) {
-            const Y = this.el.parentElement || document.body, $ = Y.clientWidth, M = Y.clientHeight;
-            this.xRange && (F = n(t = l, r, d).call(t, this.xRange.min) ? n(s = l, r, P).call(s, this.xRange.min, $) : this.xRange.min, y = n(e = l, r, d).call(e, this.xRange.max) ? n(h = l, r, P).call(h, this.xRange.max, $) : this.xRange.max), this.yRange && (v = n(o = l, r, d).call(o, this.yRange.min) ? n(i = l, r, P).call(i, this.yRange.min, M) : this.yRange.min, L = n(a = l, r, d).call(a, this.yRange.max) ? n(m = l, r, P).call(m, this.yRange.max, M) : this.yRange.max);
-          } else
-            F = (g = this.xRange) == null ? void 0 : g.min, y = (p = this.xRange) == null ? void 0 : p.max, v = (u = this.yRange) == null ? void 0 : u.min, L = (R = this.yRange) == null ? void 0 : R.max;
-          const X = this.xRange ? n(this, f, T).call(this, x, -1, 1, F, y) : 0, w = this.yRange ? n(this, f, T).call(this, b, -1, 1, v, L) : 0;
-          this.lastX = X, this.lastY = w, this.el.style.transform = `translate3d(${X}px, ${w}px, 0) ${this.baseTransform}`.trim();
-        } else {
-          const F = this.xRange ? n(this, f, T).call(this, x, -1, 1, this.xRange.min, this.xRange.max) : 0, y = this.yRange ? n(this, f, T).call(this, b, -1, 1, this.yRange.min, this.yRange.max) : 0;
-          this.lastX = F, this.lastY = y;
-        }
-      }
-      (this.lerpFactor > 0 || this.targetLerpFactor > 0) && (this.raf = requestAnimationFrame(this.animate));
-    });
-    var m, g, p, u;
-    if (this.el = t, this.xRange = s, this.yRange = e, this.speed = h, this.time = o, this.isPlaying = !0, this.lerpFactor = 1, this.lerpSpeed = i, this.targetLerpFactor = 1, this.lastX = 0, this.lastY = 0, this.preserveBaseTranslation = a, this.hasPercentages = !!(s && (n(m = l, r, d).call(m, s.min) || n(g = l, r, d).call(g, s.max)) || e && (n(p = l, r, d).call(p, e.min) || n(u = l, r, d).call(u, e.max))), t) {
-      const R = window.getComputedStyle(t);
-      R.position === "static" && (t.style.position = "relative"), this.originalInlineTransform = t.style.transform || "", this.baseTransform = n(this, f, B).call(this, R.transform, this.preserveBaseTranslation), this.hasPercentages && (this.handleResize = this.handleResize.bind(this), window.addEventListener("resize", this.handleResize));
-    } else
-      this.originalInlineTransform = "", this.baseTransform = "";
-    this.animate = this.animate.bind(this), this.init(o);
-  }
-  init(t) {
-    var s;
-    this.noise = n(this, f, W).call(this, n(s = l, r, I).call(s, t)), this.isPlaying = !0, this.lerpFactor = 1, this.targetLerpFactor = 1, this.raf = requestAnimationFrame(this.animate);
-  }
-  // Permite refrescar el transform base si cambian clases/estilos en runtime
-  refreshBaseTransform(t = this.preserveBaseTranslation) {
-    if (!this.el) return;
-    const s = window.getComputedStyle(this.el);
-    this.baseTransform = n(this, f, B).call(this, s.transform, t);
-  }
-  // Handle window resize for percentage-based values
-  handleResize() {
-  }
-  pause() {
-    this.isPlaying && (this.targetLerpFactor = 0, this.isPlaying = !1);
-  }
-  play() {
-    this.isPlaying || (this.targetLerpFactor = 1, this.isPlaying = !0, this.lerpFactor === 0 && (this.raf = requestAnimationFrame(this.animate)));
-  }
-  destroy() {
-    cancelAnimationFrame(this.raf), this.el && (this.el.style.transform = this.originalInlineTransform || ""), this.hasPercentages && window.removeEventListener("resize", this.handleResize);
-  }
-};
-r = new WeakSet(), E = function(t) {
-  return function() {
-    let s = t += 1831565813;
-    return s = Math.imul(s ^ s >>> 15, s | 1), s ^= s + Math.imul(s ^ s >>> 7, s | 61), ((s ^ s >>> 14) >>> 0) / 4294967296;
-  };
-}, I = function(t = 0) {
-  var h;
-  const s = Array.from({ length: 256 }, (o, i) => i), e = n(h = l, r, E).call(h, t);
-  for (let o = 255; o > 0; o--) {
-    const i = Math.floor(e() * (o + 1));
-    [s[o], s[i]] = [s[i], s[o]];
-  }
-  return s.concat(s);
-}, d = function(t) {
-  return typeof t == "string" && t.endsWith("%");
-}, P = function(t, s) {
-  var h;
-  return n(h = l, r, d).call(h, t) ? parseFloat(t) / 100 * s : t;
-}, f = new WeakSet(), W = function(t) {
-  const s = (i) => i * i * i * (i * (i * 6 - 15) + 10), e = (i, a, m) => a + i * (m - a), h = (i, a, m) => {
-    const g = i & 15, p = g < 8 ? a : m, u = g < 4 ? m : g === 12 || g === 14 ? a : 0;
-    return (g & 1 ? -p : p) + (g & 2 ? -u : u);
-  }, o = (i, a) => i & 1 ? -a : a;
-  return {
-    // Original 1D Perlin noise function
-    perlin1(i) {
-      const a = Math.floor(i) & 255;
-      i -= Math.floor(i);
-      const m = s(i);
-      return e(m, o(t[a], i), o(t[a + 1], i - 1));
-    },
-    // New 2D Perlin noise function
-    perlin2(i, a) {
-      const m = Math.floor(i) & 255, g = Math.floor(a) & 255;
-      i -= Math.floor(i), a -= Math.floor(a);
-      const p = s(i), u = s(a), R = t[m] + g, x = t[m + 1] + g, b = t[R], F = t[R + 1], y = t[x], v = t[x + 1];
-      return e(
-        u,
-        e(p, h(t[b], i, a), h(t[y], i - 1, a)),
-        e(p, h(t[F], i, a - 1), h(t[v], i - 1, a - 1))
-      );
-    }
-  };
-}, C = function(t, s, e) {
-  return t + e * (s - t);
-}, T = function(t, s, e, h, o) {
-  return (t - s) * (o - h) / (e - s) + h;
-}, // Quita o preserva la traslación del transform base en 2D según flag
-B = function(t, s = !1) {
-  if (!t || t === "none") return "";
-  try {
-    const e = new DOMMatrixReadOnly(t);
-    if (e.is2D) {
-      const h = s ? e.e : 0, o = s ? e.f : 0;
-      return `matrix(${e.a}, ${e.b}, ${e.c}, ${e.d}, ${h}, ${o})`;
-    } else
-      return t;
-  } catch {
-    return t;
-  }
-}, A(l, r);
-let q = l;
-export {
-  q as default
-};

package/dist/PerlinDOM.umd.js

@@ -1 +0,0 @@
-(function(h,s){typeof exports=="object"&&typeof module<"u"?module.exports=s():typeof define=="function"&&define.amd?define(s):(h=typeof globalThis<"u"?globalThis:h||self,h.PerlinDOM=s())})(this,function(){"use strict";var j=Object.defineProperty;var S=h=>{throw TypeError(h)};var C=(h,s,u)=>s in h?j(h,s,{enumerable:!0,configurable:!0,writable:!0,value:u}):h[s]=u;var q=(h,s,u)=>C(h,typeof s!="symbol"?s+"":s,u),H=(h,s,u)=>s.has(h)||S("Cannot "+u);var B=(h,s,u)=>s.has(h)?S("Cannot add the same private member more than once"):s instanceof WeakSet?s.add(h):s.set(h,u);var r=(h,s,u)=>(H(h,s,"access private method"),u);var s,D,E,R,P,g,I,W,b,X;const c=class c{constructor({element:t,x:i=null,y:n=null,speed:o=.01,seed:l=0,lerpSpeed:e=.1,preserveBaseTranslation:a=!1}){B(this,g);q(this,"animate",()=>{var t,i,n,o,l,e,a,m,f,p,d,y;if(this.lerpFactor!==this.targetLerpFactor&&(this.lerpFactor=r(this,g,W).call(this,this.lerpFactor,this.targetLerpFactor,this.lerpSpeed),Math.abs(this.lerpFactor-this.targetLerpFactor)<.001&&(this.lerpFactor=this.targetLerpFactor)),this.lerpFactor>0){this.time+=this.speed*this.lerpFactor;const T=this.noise.perlin2(this.time,0),L=this.noise.perlin2(this.time,100);if(this.el){let F,x,v,A;if(this.hasPercentages){const Y=this.el.parentElement||document.body,$=Y.clientWidth,z=Y.clientHeight;this.xRange&&(F=r(t=c,s,R).call(t,this.xRange.min)?r(i=c,s,P).call(i,this.xRange.min,$):this.xRange.min,x=r(n=c,s,R).call(n,this.xRange.max)?r(o=c,s,P).call(o,this.xRange.max,$):this.xRange.max),this.yRange&&(v=r(l=c,s,R).call(l,this.yRange.min)?r(e=c,s,P).call(e,this.yRange.min,z):this.yRange.min,A=r(a=c,s,R).call(a,this.yRange.max)?r(m=c,s,P).call(m,this.yRange.max,z):this.yRange.max)}else F=(f=this.xRange)==null?void 0:f.min,x=(p=this.xRange)==null?void 0:p.max,v=(d=this.yRange)==null?void 0:d.min,A=(y=this.yRange)==null?void 0:y.max;const w=this.xRange?r(this,g,b).call(this,T,-1,1,F,x):0,M=this.yRange?r(this,g,b).call(this,L,-1,1,v,A):0;this.lastX=w,this.lastY=M,this.el.style.transform=`translate3d(${w}px, ${M}px, 0) ${this.baseTransform}`.trim()}else{const F=this.xRange?r(this,g,b).call(this,T,-1,1,this.xRange.min,this.xRange.max):0,x=this.yRange?r(this,g,b).call(this,L,-1,1,this.yRange.min,this.yRange.max):0;this.lastX=F,this.lastY=x}}(this.lerpFactor>0||this.targetLerpFactor>0)&&(this.raf=requestAnimationFrame(this.animate))});var m,f,p,d;if(this.el=t,this.xRange=i,this.yRange=n,this.speed=o,this.time=l,this.isPlaying=!0,this.lerpFactor=1,this.lerpSpeed=e,this.targetLerpFactor=1,this.lastX=0,this.lastY=0,this.preserveBaseTranslation=a,this.hasPercentages=!!(i&&(r(m=c,s,R).call(m,i.min)||r(f=c,s,R).call(f,i.max))||n&&(r(p=c,s,R).call(p,n.min)||r(d=c,s,R).call(d,n.max))),t){const y=window.getComputedStyle(t);y.position==="static"&&(t.style.position="relative"),this.originalInlineTransform=t.style.transform||"",this.baseTransform=r(this,g,X).call(this,y.transform,this.preserveBaseTranslation),this.hasPercentages&&(this.handleResize=this.handleResize.bind(this),window.addEventListener("resize",this.handleResize))}else this.originalInlineTransform="",this.baseTransform="";this.animate=this.animate.bind(this),this.init(l)}init(t){var i;this.noise=r(this,g,I).call(this,r(i=c,s,E).call(i,t)),this.isPlaying=!0,this.lerpFactor=1,this.targetLerpFactor=1,this.raf=requestAnimationFrame(this.animate)}refreshBaseTransform(t=this.preserveBaseTranslation){if(!this.el)return;const i=window.getComputedStyle(this.el);this.baseTransform=r(this,g,X).call(this,i.transform,t)}handleResize(){}pause(){this.isPlaying&&(this.targetLerpFactor=0,this.isPlaying=!1)}play(){this.isPlaying||(this.targetLerpFactor=1,this.isPlaying=!0,this.lerpFactor===0&&(this.raf=requestAnimationFrame(this.animate)))}destroy(){cancelAnimationFrame(this.raf),this.el&&(this.el.style.transform=this.originalInlineTransform||""),this.hasPercentages&&window.removeEventListener("resize",this.handleResize)}};s=new WeakSet,D=function(t){return function(){let i=t+=1831565813;return i=Math.imul(i^i>>>15,i|1),i^=i+Math.imul(i^i>>>7,i|61),((i^i>>>14)>>>0)/4294967296}},E=function(t=0){var o;const i=Array.from({length:256},(l,e)=>e),n=r(o=c,s,D).call(o,t);for(let l=255;l>0;l--){const e=Math.floor(n()*(l+1));[i[l],i[e]]=[i[e],i[l]]}return i.concat(i)},R=function(t){return typeof t=="string"&&t.endsWith("%")},P=function(t,i){var o;return r(o=c,s,R).call(o,t)?parseFloat(t)/100*i:t},g=new WeakSet,I=function(t){const i=e=>e*e*e*(e*(e*6-15)+10),n=(e,a,m)=>a+e*(m-a),o=(e,a,m)=>{const f=e&15,p=f<8?a:m,d=f<4?m:f===12||f===14?a:0;return(f&1?-p:p)+(f&2?-d:d)},l=(e,a)=>e&1?-a:a;return{perlin1(e){const a=Math.floor(e)&255;e-=Math.floor(e);const m=i(e);return n(m,l(t[a],e),l(t[a+1],e-1))},perlin2(e,a){const m=Math.floor(e)&255,f=Math.floor(a)&255;e-=Math.floor(e),a-=Math.floor(a);const p=i(e),d=i(a),y=t[m]+f,T=t[m+1]+f,L=t[y],F=t[y+1],x=t[T],v=t[T+1];return n(d,n(p,o(t[L],e,a),o(t[x],e-1,a)),n(p,o(t[F],e,a-1),o(t[v],e-1,a-1)))}}},W=function(t,i,n){return t+n*(i-t)},b=function(t,i,n,o,l){return(t-i)*(l-o)/(n-i)+o},X=function(t,i=!1){if(!t||t==="none")return"";try{const n=new DOMMatrixReadOnly(t);if(n.is2D){const o=i?n.e:0,l=i?n.f:0;return`matrix(${n.a}, ${n.b}, ${n.c}, ${n.d}, ${o}, ${l})`}else return t}catch{return t}},B(c,s);let h=c;return h});