nfx-ui 0.1.0

package/dist/chunk-animations-Brp-bsaE.mjs

@@ -0,0 +1,1243 @@
+import { n as ue } from "./chunk-useTheme-oHcq3d0o.mjs";
+import { memo as fe, useCallback as te, useEffect as ce, useMemo as ae, useRef as E } from "react";
+import { jsx as W, jsxs as Ee } from "react/jsx-runtime";
+import { Effect as Re, EffectComposer as ve, EffectPass as pe, RenderPass as ge } from "postprocessing";
+import { Clock as be, Color as Pe, GLSL3 as Te, LinearFilter as xe, Mesh as _e, OrthographicCamera as Se, PlaneGeometry as Ae, Scene as Ie, ShaderMaterial as ke, Texture as Le, Uniform as oe, Vector2 as ye, WebGLRenderer as Fe } from "three";
+const $e = "style-module__waves___oR3u7", Be = "style-module__wavesCanvas___zkhTC";
+var we = {
+  waves: $e,
+  wavesCanvas: Be
+}, O = class {
+  x;
+  y;
+  z;
+  constructor(a, r, o) {
+    this.x = a, this.y = r, this.z = o;
+  }
+  dot2(a, r) {
+    return this.x * a + this.y * r;
+  }
+}, Ne = class {
+  grad3;
+  p;
+  perm;
+  gradP;
+  constructor(a = 0) {
+    this.grad3 = [
+      new O(1, 1, 0),
+      new O(-1, 1, 0),
+      new O(1, -1, 0),
+      new O(-1, -1, 0),
+      new O(1, 0, 1),
+      new O(-1, 0, 1),
+      new O(1, 0, -1),
+      new O(-1, 0, -1),
+      new O(0, 1, 1),
+      new O(0, -1, 1),
+      new O(0, 1, -1),
+      new O(0, -1, -1)
+    ], this.p = [
+      151,
+      160,
+      137,
+      91,
+      90,
+      15,
+      131,
+      13,
+      201,
+      95,
+      96,
+      53,
+      194,
+      233,
+      7,
+      225,
+      140,
+      36,
+      103,
+      30,
+      69,
+      142,
+      8,
+      99,
+      37,
+      240,
+      21,
+      10,
+      23,
+      190,
+      6,
+      148,
+      247,
+      120,
+      234,
+      75,
+      0,
+      26,
+      197,
+      62,
+      94,
+      252,
+      219,
+      203,
+      117,
+      35,
+      11,
+      32,
+      57,
+      177,
+      33,
+      88,
+      237,
+      149,
+      56,
+      87,
+      174,
+      20,
+      125,
+      136,
+      171,
+      168,
+      68,
+      175,
+      74,
+      165,
+      71,
+      134,
+      139,
+      48,
+      27,
+      166,
+      77,
+      146,
+      158,
+      231,
+      83,
+      111,
+      229,
+      122,
+      60,
+      211,
+      133,
+      230,
+      220,
+      105,
+      92,
+      41,
+      55,
+      46,
+      245,
+      40,
+      244,
+      102,
+      143,
+      54,
+      65,
+      25,
+      63,
+      161,
+      1,
+      216,
+      80,
+      73,
+      209,
+      76,
+      132,
+      187,
+      208,
+      89,
+      18,
+      169,
+      200,
+      196,
+      135,
+      130,
+      116,
+      188,
+      159,
+      86,
+      164,
+      100,
+      109,
+      198,
+      173,
+      186,
+      3,
+      64,
+      52,
+      217,
+      226,
+      250,
+      124,
+      123,
+      5,
+      202,
+      38,
+      147,
+      118,
+      126,
+      255,
+      82,
+      85,
+      212,
+      207,
+      206,
+      59,
+      227,
+      47,
+      16,
+      58,
+      17,
+      182,
+      189,
+      28,
+      42,
+      223,
+      183,
+      170,
+      213,
+      119,
+      248,
+      152,
+      2,
+      44,
+      154,
+      163,
+      70,
+      221,
+      153,
+      101,
+      155,
+      167,
+      43,
+      172,
+      9,
+      129,
+      22,
+      39,
+      253,
+      19,
+      98,
+      108,
+      110,
+      79,
+      113,
+      224,
+      232,
+      178,
+      185,
+      112,
+      104,
+      218,
+      246,
+      97,
+      228,
+      251,
+      34,
+      242,
+      193,
+      238,
+      210,
+      144,
+      12,
+      191,
+      179,
+      162,
+      241,
+      81,
+      51,
+      145,
+      235,
+      249,
+      14,
+      239,
+      107,
+      49,
+      192,
+      214,
+      31,
+      181,
+      199,
+      106,
+      157,
+      184,
+      84,
+      204,
+      176,
+      115,
+      121,
+      50,
+      45,
+      127,
+      4,
+      150,
+      254,
+      138,
+      236,
+      205,
+      93,
+      222,
+      114,
+      67,
+      29,
+      24,
+      72,
+      243,
+      141,
+      128,
+      195,
+      78,
+      66,
+      215,
+      61,
+      156,
+      180
+    ], this.perm = new Array(512), this.gradP = new Array(512), this.seed(a);
+  }
+  seed(a) {
+    a > 0 && a < 1 && (a *= 65536), a = Math.floor(a), a < 256 && (a |= a << 8);
+    for (let r = 0; r < 256; r++) {
+      let o = r & 1 ? this.p[r] ^ a & 255 : this.p[r] ^ a >> 8 & 255;
+      this.perm[r] = this.perm[r + 256] = o, this.gradP[r] = this.gradP[r + 256] = this.grad3[o % 12];
+    }
+  }
+  fade(a) {
+    return a * a * a * (a * (a * 6 - 15) + 10);
+  }
+  lerp(a, r, o) {
+    return (1 - o) * a + o * r;
+  }
+  perlin2(a, r) {
+    let o = Math.floor(a), t = Math.floor(r);
+    a -= o, r -= t, o &= 255, t &= 255;
+    const f = this.gradP[o + this.perm[t]].dot2(a, r), d = this.gradP[o + this.perm[t + 1]].dot2(a, r - 1), m = this.gradP[o + 1 + this.perm[t]].dot2(a - 1, r), y = this.gradP[o + 1 + this.perm[t + 1]].dot2(a - 1, r - 1), w = this.fade(a);
+    return this.lerp(this.lerp(f, m, w), this.lerp(d, y, w), this.fade(r));
+  }
+}, Ve = ({ lineColor: a = "black", backgroundColor: r = "transparent", waveSpeedX: o = 0.0125, waveSpeedY: t = 5e-3, waveAmpX: f = 32, waveAmpY: d = 16, xGap: m = 10, yGap: y = 32, friction: w = 0.925, tension: A = 5e-3, maxCursorMove: R = 100, style: g = {}, className: I = "" }) => {
+  const n = E(null), h = E(null), C = E(null), $ = E({
+    width: 0,
+    height: 0,
+    left: 0,
+    top: 0
+  }), B = E(new Ne(Math.random())), k = E([]), _ = E({
+    x: -10,
+    y: 0,
+    lx: 0,
+    ly: 0,
+    sx: 0,
+    sy: 0,
+    v: 0,
+    vs: 0,
+    a: 0,
+    set: !1
+  }), v = E({
+    lineColor: a,
+    waveSpeedX: o,
+    waveSpeedY: t,
+    waveAmpX: f,
+    waveAmpY: d,
+    friction: w,
+    tension: A,
+    maxCursorMove: R,
+    xGap: m,
+    yGap: y
+  }), L = E(null);
+  return ce(() => {
+    v.current = {
+      lineColor: a,
+      waveSpeedX: o,
+      waveSpeedY: t,
+      waveAmpX: f,
+      waveAmpY: d,
+      friction: w,
+      tension: A,
+      maxCursorMove: R,
+      xGap: m,
+      yGap: y
+    };
+  }, [
+    a,
+    o,
+    t,
+    f,
+    d,
+    w,
+    A,
+    R,
+    m,
+    y
+  ]), ce(() => {
+    const X = h.current, N = n.current;
+    if (!X || !N) return;
+    C.current = X.getContext("2d");
+    function G() {
+      if (!N || !X) return;
+      const i = N.getBoundingClientRect();
+      $.current = {
+        width: i.width,
+        height: i.height,
+        left: i.left,
+        top: i.top
+      }, X.width = i.width, X.height = i.height;
+    }
+    function b() {
+      const { width: i, height: l } = $.current;
+      k.current = [];
+      const u = i + 200, P = l + 30, { xGap: V, yGap: K } = v.current, Q = Math.ceil(u / V), U = Math.ceil(P / K), T = (i - V * Q) / 2, D = (l - K * U) / 2;
+      for (let z = 0; z <= Q; z++) {
+        const Z = [];
+        for (let M = 0; M <= U; M++) Z.push({
+          x: T + V * z,
+          y: D + K * M,
+          wave: {
+            x: 0,
+            y: 0
+          },
+          cursor: {
+            x: 0,
+            y: 0,
+            vx: 0,
+            vy: 0
+          }
+        });
+        k.current.push(Z);
+      }
+    }
+    function H(i) {
+      const l = k.current, u = _.current, P = B.current, { waveSpeedX: V, waveSpeedY: K, waveAmpX: Q, waveAmpY: U, friction: T, tension: D, maxCursorMove: z } = v.current;
+      l.forEach((Z) => {
+        Z.forEach((M) => {
+          const ie = P.perlin2((M.x + i * V) * 2e-3, (M.y + i * K) * 15e-4) * 12;
+          M.wave.x = Math.cos(ie) * Q, M.wave.y = Math.sin(ie) * U;
+          const ee = M.x - u.sx, se = M.y - u.sy, ne = Math.hypot(ee, se), J = Math.max(175, u.vs);
+          if (ne < J) {
+            const p = 1 - ne / J, S = Math.cos(ne * 1e-3) * p;
+            M.cursor.vx += Math.cos(u.a) * S * J * u.vs * 65e-5, M.cursor.vy += Math.sin(u.a) * S * J * u.vs * 65e-5;
+          }
+          M.cursor.vx += (0 - M.cursor.x) * D, M.cursor.vy += (0 - M.cursor.y) * D, M.cursor.vx *= T, M.cursor.vy *= T, M.cursor.x += M.cursor.vx * 2, M.cursor.y += M.cursor.vy * 2, M.cursor.x = Math.min(z, Math.max(-z, M.cursor.x)), M.cursor.y = Math.min(z, Math.max(-z, M.cursor.y));
+        });
+      });
+    }
+    function F(i, l = !0) {
+      const u = i.x + i.wave.x + (l ? i.cursor.x : 0), P = i.y + i.wave.y + (l ? i.cursor.y : 0);
+      return {
+        x: Math.round(u * 10) / 10,
+        y: Math.round(P * 10) / 10
+      };
+    }
+    function re() {
+      const { width: i, height: l } = $.current, u = C.current;
+      u && (u.clearRect(0, 0, i, l), u.beginPath(), u.strokeStyle = v.current.lineColor, k.current.forEach((P) => {
+        let V = F(P[0], !1);
+        u.moveTo(V.x, V.y), P.forEach((K, Q) => {
+          const U = Q === P.length - 1;
+          V = F(K, !U);
+          const T = F(P[Q + 1] || P[P.length - 1], !U);
+          u.lineTo(V.x, V.y), U && u.moveTo(T.x, T.y);
+        });
+      }), u.stroke());
+    }
+    function q(i) {
+      if (!N) return;
+      const l = _.current;
+      l.sx += (l.x - l.sx) * 0.1, l.sy += (l.y - l.sy) * 0.1;
+      const u = l.x - l.lx, P = l.y - l.ly, V = Math.hypot(u, P);
+      l.v = V, l.vs += (V - l.vs) * 0.1, l.vs = Math.min(100, l.vs), l.lx = l.x, l.ly = l.y, l.a = Math.atan2(P, u), N.style.setProperty("--x", `${l.sx}px`), N.style.setProperty("--y", `${l.sy}px`), H(i), re(), L.current = requestAnimationFrame(q);
+    }
+    function c() {
+      G(), b();
+    }
+    function e(i) {
+      x(i.clientX, i.clientY);
+    }
+    function s(i) {
+      const l = i.touches[0];
+      x(l.clientX, l.clientY);
+    }
+    function x(i, l) {
+      const u = _.current, P = $.current;
+      u.x = i - P.left, u.y = l - P.top, u.set || (u.sx = u.x, u.sy = u.y, u.lx = u.x, u.ly = u.y, u.set = !0);
+    }
+    return G(), b(), L.current = requestAnimationFrame(q), window.addEventListener("resize", c), window.addEventListener("mousemove", e), window.addEventListener("touchmove", s, { passive: !1 }), () => {
+      window.removeEventListener("resize", c), window.removeEventListener("mousemove", e), window.removeEventListener("touchmove", s), L.current !== null && cancelAnimationFrame(L.current);
+    };
+  }, []), W("div", {
+    ref: n,
+    className: `${we.waves} ${I}`,
+    style: {
+      position: "absolute",
+      top: 0,
+      left: 0,
+      margin: 0,
+      padding: 0,
+      width: "100%",
+      height: "100%",
+      overflow: "hidden",
+      backgroundColor: r,
+      ...g
+    },
+    children: W("canvas", {
+      ref: h,
+      className: we.wavesCanvas
+    })
+  });
+}, st = (a) => {
+  const { currentTheme: r } = ue();
+  return W(Ve, {
+    lineColor: ae(() => {
+      const o = r.colors.variables.primary || "rgb(59, 130, 246)", t = (m, y, w, A = 0.4) => `rgb(${Math.round(m + (255 - m) * A)}, ${Math.round(y + (255 - y) * A)}, ${Math.round(w + (255 - w) * A)})`;
+      if (o.startsWith("#")) {
+        const m = o.slice(1);
+        return t(parseInt(m.slice(0, 2), 16), parseInt(m.slice(2, 4), 16), parseInt(m.slice(4, 6), 16));
+      }
+      const f = o.match(/rgb\((\d+),\s*(\d+),\s*(\d+)\)/);
+      if (f) return t(parseInt(f[1], 10), parseInt(f[2], 10), parseInt(f[3], 10));
+      const d = o.match(/rgba?\((\d+),\s*(\d+),\s*(\d+)/);
+      return d ? t(parseInt(d[1], 10), parseInt(d[2], 10), parseInt(d[3], 10)) : o;
+    }, [r]),
+    backgroundColor: "transparent",
+    waveSpeedX: 0.05,
+    waveSpeedY: 0.01,
+    waveAmpX: 40,
+    waveAmpY: 20,
+    ...a
+  });
+};
+const Xe = "style-module__squaresCanvas___22kMc";
+var He = { squaresCanvas: Xe }, Ge = ({ direction: a = "right", speed: r = 1, borderColor: o = "#999", squareSize: t = 40, hoverFillColor: f = "#222", className: d = "", style: m = {} }) => {
+  const y = E(null), w = E(null), A = E(0), R = E(0), g = E({
+    x: 0,
+    y: 0
+  }), I = E(null);
+  return ce(() => {
+    const n = y.current;
+    if (!n) return;
+    const h = n.getContext("2d"), C = () => {
+      n.width = n.offsetWidth, n.height = n.offsetHeight, A.current = Math.ceil(n.width / t) + 1, R.current = Math.ceil(n.height / t) + 1;
+    };
+    window.addEventListener("resize", C), C();
+    const $ = () => {
+      if (!h) return;
+      h.clearRect(0, 0, n.width, n.height);
+      const v = Math.floor(g.current.x / t) * t, L = Math.floor(g.current.y / t) * t;
+      for (let N = v; N < n.width + t; N += t) for (let G = L; G < n.height + t; G += t) {
+        const b = N - g.current.x % t, H = G - g.current.y % t;
+        I.current && Math.floor((N - v) / t) === I.current.x && Math.floor((G - L) / t) === I.current.y && (h.fillStyle = f, h.fillRect(b, H, t, t)), h.strokeStyle = o, h.strokeRect(b, H, t, t);
+      }
+      const X = h.createRadialGradient(n.width / 2, n.height / 2, 0, n.width / 2, n.height / 2, Math.sqrt(n.width ** 2 + n.height ** 2) / 2);
+      X.addColorStop(0, "rgba(0, 0, 0, 0)"), X.addColorStop(1, "#060010"), h.fillStyle = X, h.fillRect(0, 0, n.width, n.height);
+    }, B = () => {
+      const v = Math.max(r, 0.1);
+      switch (a) {
+        case "right":
+          g.current.x = (g.current.x - v + t) % t;
+          break;
+        case "left":
+          g.current.x = (g.current.x + v + t) % t;
+          break;
+        case "up":
+          g.current.y = (g.current.y + v + t) % t;
+          break;
+        case "down":
+          g.current.y = (g.current.y - v + t) % t;
+          break;
+        case "diagonal":
+          g.current.x = (g.current.x - v + t) % t, g.current.y = (g.current.y - v + t) % t;
+          break;
+        default:
+          break;
+      }
+      $(), w.current = requestAnimationFrame(B);
+    }, k = (v) => {
+      const L = n.getBoundingClientRect(), X = v.clientX - L.left, N = v.clientY - L.top, G = Math.floor(g.current.x / t) * t, b = Math.floor(g.current.y / t) * t, H = Math.floor((X + g.current.x - G) / t), F = Math.floor((N + g.current.y - b) / t);
+      (!I.current || I.current.x !== H || I.current.y !== F) && (I.current = {
+        x: H,
+        y: F
+      });
+    }, _ = () => {
+      I.current = null;
+    };
+    return n.addEventListener("mousemove", k), n.addEventListener("mouseleave", _), w.current = requestAnimationFrame(B), () => {
+      window.removeEventListener("resize", C), w.current && cancelAnimationFrame(w.current), n.removeEventListener("mousemove", k), n.removeEventListener("mouseleave", _);
+    };
+  }, [
+    a,
+    r,
+    o,
+    f,
+    t
+  ]), W("canvas", {
+    ref: y,
+    className: `${He.squaresCanvas} ${d}`,
+    style: m
+  });
+}, ct = (a) => {
+  const { currentTheme: r } = ue();
+  return W(Ge, {
+    borderColor: ae(() => {
+      const o = r.colors.variables.border5 || r.colors.variables.fg || "#271E37";
+      if (o.startsWith("#")) return o;
+      const t = o.match(/rgb\((\d+),\s*(\d+),\s*(\d+)\)/);
+      return t ? `#${parseInt(t[1], 10).toString(16).padStart(2, "0")}${parseInt(t[2], 10).toString(16).padStart(2, "0")}${parseInt(t[3], 10).toString(16).padStart(2, "0")}` : o;
+    }, [r]),
+    hoverFillColor: ae(() => {
+      const o = r.colors.variables.bg3 || r.colors.variables.border3 || "#222222", t = (d, m, y, w = 0.3) => `rgb(${Math.round(d * (1 - w))}, ${Math.round(m * (1 - w))}, ${Math.round(y * (1 - w))})`;
+      if (o.startsWith("#")) {
+        const d = o.slice(1);
+        return t(parseInt(d.slice(0, 2), 16), parseInt(d.slice(2, 4), 16), parseInt(d.slice(4, 6), 16));
+      }
+      const f = o.match(/rgb\((\d+),\s*(\d+),\s*(\d+)\)/);
+      return f ? t(parseInt(f[1], 10), parseInt(f[2], 10), parseInt(f[3], 10)) : o;
+    }, [r]),
+    speed: 0.5,
+    squareSize: 40,
+    direction: "diagonal",
+    ...a
+  });
+};
+const ze = "style-module__container___HkxIe", De = "style-module__canvas___MR9JX", Ye = "style-module__outerVignette___i75nw", Oe = "style-module__centerVignette___n9uVG";
+var le = {
+  container: ze,
+  canvas: De,
+  outerVignette: Ye,
+  centerVignette: Oe
+}, Ue = fe(({ glitchColors: a = [
+  "#2b4539",
+  "#61dca3",
+  "#61b3dc"
+], glitchSpeed: r = 500, centerVignette: o = !1, outerVignette: t = !0, smooth: f = !0, characters: d = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz!@#$&*()-_+=/[]{};:<>.,0123456789", className: m = "", style: y = {} }) => {
+  const w = E(null), A = E(null), R = E([]), g = E({
+    columns: 0,
+    rows: 0
+  }), I = E(null), n = E(Date.now()), h = ae(() => Array.from(d), [d]), C = E(/* @__PURE__ */ new Map()), $ = 16, B = 10, k = 20, _ = te(() => h[Math.floor(Math.random() * h.length)], [h]), v = te(() => a[Math.floor(Math.random() * a.length)], [a]), L = te((c) => {
+    if (C.current.has(c)) return C.current.get(c);
+    const e = c.replace(/^#?([a-f\d])([a-f\d])([a-f\d])$/i, (i, l, u, P) => l + l + u + u + P + P), s = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(e), x = s ? {
+      r: parseInt(s[1], 16),
+      g: parseInt(s[2], 16),
+      b: parseInt(s[3], 16)
+    } : null;
+    return C.current.set(c, x), x;
+  }, []), X = (c, e, s) => {
+    const x = {
+      r: Math.round(c.r + (e.r - c.r) * s),
+      g: Math.round(c.g + (e.g - c.g) * s),
+      b: Math.round(c.b + (e.b - c.b) * s)
+    };
+    return `rgb(${x.r}, ${x.g}, ${x.b})`;
+  }, N = (c, e) => ({
+    columns: Math.ceil(c / B),
+    rows: Math.ceil(e / k)
+  }), G = (c, e) => {
+    g.current = {
+      columns: c,
+      rows: e
+    };
+    const s = c * e;
+    R.current = Array.from({ length: s }, () => ({
+      char: _(),
+      color: v(),
+      targetColor: v(),
+      colorProgress: 1
+    }));
+  }, b = () => {
+    const c = w.current;
+    if (!c) return;
+    const e = c.parentElement;
+    if (!e) return;
+    const s = window.devicePixelRatio || 1, x = e.getBoundingClientRect();
+    c.width = x.width * s, c.height = x.height * s, c.style.width = `${x.width}px`, c.style.height = `${x.height}px`, I.current && I.current.setTransform(s, 0, 0, s, 0, 0);
+    const { columns: i, rows: l } = N(x.width, x.height);
+    G(i, l), H();
+  }, H = te(() => {
+    if (!I.current || R.current.length === 0) return;
+    const c = I.current, e = w.current;
+    e && (c.clearRect(0, 0, e.width, e.height), c.font = `${$}px monospace`, c.textBaseline = "top", c.textAlign = "left", R.current.forEach((s, x) => {
+      const i = x % g.current.columns * B, l = Math.floor(x / g.current.columns) * k;
+      c.fillStyle = s.color, c.fillText(s.char, i, l);
+    }));
+  }, []), F = te(() => {
+    if (!R.current || R.current.length === 0) return;
+    const c = Math.max(1, Math.floor(R.current.length * 0.02));
+    for (let e = 0; e < c; e++) {
+      const s = Math.floor(Math.random() * R.current.length);
+      R.current[s] && (R.current[s].char = _(), R.current[s].targetColor = v(), f ? R.current[s].colorProgress = 0 : (R.current[s].color = R.current[s].targetColor, R.current[s].colorProgress = 1));
+    }
+  }, [
+    _,
+    v,
+    f
+  ]), re = te(() => {
+    let c = !1, e = 0;
+    R.current.forEach((s) => {
+      if (s.colorProgress < 1) {
+        e++, s.colorProgress += 0.03, s.colorProgress > 1 && (s.colorProgress = 1);
+        const x = L(s.color), i = L(s.targetColor);
+        x && i && (s.color = X(x, i, s.colorProgress), c = !0);
+      }
+    }), c && e > 0 && H();
+  }, [L, H]), q = te(() => {
+    const c = Date.now();
+    c - n.current >= r ? (F(), H(), n.current = c) : f && re(), A.current = requestAnimationFrame(q);
+  }, [
+    r,
+    f,
+    F,
+    re
+  ]);
+  return ce(() => {
+    const c = w.current;
+    if (!c) return;
+    I.current = c.getContext("2d"), b(), q();
+    let e;
+    const s = () => {
+      clearTimeout(e), e = setTimeout(() => {
+        A.current && cancelAnimationFrame(A.current), b(), q();
+      }, 100);
+    };
+    return window.addEventListener("resize", s), () => {
+      A.current && cancelAnimationFrame(A.current), window.removeEventListener("resize", s), clearTimeout(e), C.current.clear();
+    };
+  }, [
+    r,
+    f,
+    a,
+    q
+  ]), Ee("div", {
+    className: `${le.container} ${m}`,
+    style: y,
+    children: [
+      W("canvas", {
+        ref: w,
+        className: le.canvas
+      }),
+      t && W("div", { className: le.outerVignette }),
+      o && W("div", { className: le.centerVignette })
+    ]
+  });
+}), We = fe((a) => {
+  const { currentTheme: r } = ue();
+  return W(Ue, {
+    glitchColors: ae(() => {
+      const o = r.colors.variables.primary || "#FA1E16", t = r.colors.variables.info || "#0095ff", f = r.colors.variables.success || "#00d68f", d = (m) => {
+        if (m.startsWith("#")) return m;
+        const y = m.match(/rgb\((\d+),\s*(\d+),\s*(\d+)\)/);
+        return y ? `#${parseInt(y[1], 10).toString(16).padStart(2, "0")}${parseInt(y[2], 10).toString(16).padStart(2, "0")}${parseInt(y[3], 10).toString(16).padStart(2, "0")}` : m;
+      };
+      return [
+        d(o),
+        d(t),
+        d(f)
+      ];
+    }, [r]),
+    glitchSpeed: 300,
+    centerVignette: !0,
+    outerVignette: !1,
+    smooth: !0,
+    ...a
+  });
+});
+We.displayName = "LetterGlitchBackground";
+const qe = "style-module__container___Hh3-c";
+var Ke = { container: qe }, je = () => {
+  const r = document.createElement("canvas");
+  r.width = 64, r.height = 64;
+  const o = r.getContext("2d");
+  if (!o) throw new Error("2D context not available");
+  o.fillStyle = "black", o.fillRect(0, 0, r.width, r.height);
+  const t = new Le(r);
+  t.minFilter = xe, t.magFilter = xe, t.generateMipmaps = !1;
+  const f = [];
+  let d = null;
+  const m = 64;
+  let y = 0.1 * 64;
+  const w = 1 / m, A = () => {
+    o.fillStyle = "black", o.fillRect(0, 0, r.width, r.height);
+  }, R = (n) => {
+    const h = {
+      x: n.x * 64,
+      y: (1 - n.y) * 64
+    };
+    let C = 1;
+    const $ = (v) => Math.sin(v * Math.PI / 2), B = (v) => -v * (v - 2);
+    n.age < m * 0.3 ? C = $(n.age / (m * 0.3)) : C = B(1 - (n.age - m * 0.3) / (m * 0.7)) || 0, C *= n.force;
+    const k = `${(n.vx + 1) / 2 * 255}, ${(n.vy + 1) / 2 * 255}, ${C * 255}`, _ = 320;
+    o.shadowOffsetX = _, o.shadowOffsetY = _, o.shadowBlur = y, o.shadowColor = `rgba(${k},${0.22 * C})`, o.beginPath(), o.fillStyle = "rgba(255,0,0,1)", o.arc(h.x - _, h.y - _, y, 0, Math.PI * 2), o.fill();
+  };
+  return {
+    canvas: r,
+    texture: t,
+    addTouch: (n) => {
+      let h = 0, C = 0, $ = 0;
+      if (d) {
+        const B = n.x - d.x, k = n.y - d.y;
+        if (B === 0 && k === 0) return;
+        const _ = B * B + k * k, v = Math.sqrt(_);
+        C = B / (v || 1), $ = k / (v || 1), h = Math.min(_ * 1e4, 1);
+      }
+      d = {
+        x: n.x,
+        y: n.y
+      }, f.push({
+        x: n.x,
+        y: n.y,
+        age: 0,
+        force: h,
+        vx: C,
+        vy: $
+      });
+    },
+    update: () => {
+      A();
+      for (let n = f.length - 1; n >= 0; n--) {
+        const h = f[n], C = h.force * w * (1 - h.age / m);
+        h.x += h.vx * C, h.y += h.vy * C, h.age++, h.age > m && f.splice(n, 1);
+      }
+      for (let n = 0; n < f.length; n++) R(f[n]);
+      t.needsUpdate = !0;
+    },
+    set radiusScale(n) {
+      y = 0.1 * 64 * n;
+    },
+    get radiusScale() {
+      return y / (0.1 * 64);
+    },
+    size: 64
+  };
+}, Je = (a, r) => new Re("LiquidEffect", `
+    uniform sampler2D uTexture;
+    uniform float uStrength;
+    uniform float uTime;
+    uniform float uFreq;
+
+    void mainUv(inout vec2 uv) {
+      vec4 tex = texture2D(uTexture, uv);
+      float vx = tex.r * 2.0 - 1.0;
+      float vy = tex.g * 2.0 - 1.0;
+      float intensity = tex.b;
+
+      float wave = 0.5 + 0.5 * sin(uTime * uFreq + intensity * 6.2831853);
+
+      float amt = uStrength * intensity * wave;
+
+      uv += vec2(vx, vy) * amt;
+    }
+    `, { uniforms: /* @__PURE__ */ new Map([
+  ["uTexture", new oe(a)],
+  ["uStrength", new oe(r?.strength ?? 0.025)],
+  ["uTime", new oe(0)],
+  ["uFreq", new oe(r?.freq ?? 4.5)]
+]) }), Me = {
+  square: 0,
+  circle: 1,
+  triangle: 2,
+  diamond: 3
+}, Qe = `
+void main() {
+  gl_Position = vec4(position, 1.0);
+}
+`, Ze = `
+precision highp float;
+
+uniform vec3  uColor;
+uniform vec2  uResolution;
+uniform float uTime;
+uniform float uPixelSize;
+uniform float uScale;
+uniform float uDensity;
+uniform float uPixelJitter;
+uniform int   uEnableRipples;
+uniform float uRippleSpeed;
+uniform float uRippleThickness;
+uniform float uRippleIntensity;
+uniform float uEdgeFade;
+
+uniform int   uShapeType;
+const int SHAPE_SQUARE   = 0;
+const int SHAPE_CIRCLE   = 1;
+const int SHAPE_TRIANGLE = 2;
+const int SHAPE_DIAMOND  = 3;
+
+const int   MAX_CLICKS = 10;
+
+uniform vec2  uClickPos  [MAX_CLICKS];
+uniform float uClickTimes[MAX_CLICKS];
+
+out vec4 fragColor;
+
+float Bayer2(vec2 a) {
+  a = floor(a);
+  return fract(a.x / 2. + a.y * a.y * .75);
+}
+#define Bayer4(a) (Bayer2(.5*(a))*0.25 + Bayer2(a))
+#define Bayer8(a) (Bayer4(.5*(a))*0.25 + Bayer2(a))
+
+#define FBM_OCTAVES     5
+#define FBM_LACUNARITY  1.25
+#define FBM_GAIN        1.0
+
+float hash11(float n){ return fract(sin(n)*43758.5453); }
+
+float vnoise(vec3 p){
+  vec3 ip = floor(p);
+  vec3 fp = fract(p);
+  float n000 = hash11(dot(ip + vec3(0.0,0.0,0.0), vec3(1.0,57.0,113.0)));
+  float n100 = hash11(dot(ip + vec3(1.0,0.0,0.0), vec3(1.0,57.0,113.0)));
+  float n010 = hash11(dot(ip + vec3(0.0,1.0,0.0), vec3(1.0,57.0,113.0)));
+  float n110 = hash11(dot(ip + vec3(1.0,1.0,0.0), vec3(1.0,57.0,113.0)));
+  float n001 = hash11(dot(ip + vec3(0.0,0.0,1.0), vec3(1.0,57.0,113.0)));
+  float n101 = hash11(dot(ip + vec3(1.0,0.0,1.0), vec3(1.0,57.0,113.0)));
+  float n011 = hash11(dot(ip + vec3(0.0,1.0,1.0), vec3(1.0,57.0,113.0)));
+  float n111 = hash11(dot(ip + vec3(1.0,1.0,1.0), vec3(1.0,57.0,113.0)));
+  vec3 w = fp*fp*fp*(fp*(fp*6.0-15.0)+10.0);
+  float x00 = mix(n000, n100, w.x);
+  float x10 = mix(n010, n110, w.x);
+  float x01 = mix(n001, n101, w.x);
+  float x11 = mix(n011, n111, w.x);
+  float y0  = mix(x00, x10, w.y);
+  float y1  = mix(x01, x11, w.y);
+  return mix(y0, y1, w.z) * 2.0 - 1.0;
+}
+
+float fbm2(vec2 uv, float t){
+  vec3 p = vec3(uv * uScale, t);
+  float amp = 1.0;
+  float freq = 1.0;
+  float sum = 1.0;
+  for (int i = 0; i < FBM_OCTAVES; ++i){
+    sum  += amp * vnoise(p * freq);
+    freq *= FBM_LACUNARITY;
+    amp  *= FBM_GAIN;
+  }
+  return sum * 0.5 + 0.5;
+}
+
+float maskCircle(vec2 p, float cov){
+  float r = sqrt(cov) * .25;
+  float d = length(p - 0.5) - r;
+  float aa = 0.5 * fwidth(d);
+  return cov * (1.0 - smoothstep(-aa, aa, d * 2.0));
+}
+
+float maskTriangle(vec2 p, vec2 id, float cov){
+  bool flip = mod(id.x + id.y, 2.0) > 0.5;
+  if (flip) p.x = 1.0 - p.x;
+  float r = sqrt(cov);
+  float d  = p.y - r*(1.0 - p.x);
+  float aa = fwidth(d);
+  return cov * clamp(0.5 - d/aa, 0.0, 1.0);
+}
+
+float maskDiamond(vec2 p, float cov){
+  float r = sqrt(cov) * 0.564;
+  return step(abs(p.x - 0.49) + abs(p.y - 0.49), r);
+}
+
+void main(){
+  float pixelSize = uPixelSize;
+  vec2 fragCoord = gl_FragCoord.xy - uResolution * .5;
+  float aspectRatio = uResolution.x / uResolution.y;
+
+  vec2 pixelId = floor(fragCoord / pixelSize);
+  vec2 pixelUV = fract(fragCoord / pixelSize);
+
+  float cellPixelSize = 8.0 * pixelSize;
+  vec2 cellId = floor(fragCoord / cellPixelSize);
+  vec2 cellCoord = cellId * cellPixelSize;
+  vec2 uv = cellCoord / uResolution * vec2(aspectRatio, 1.0);
+
+  float base = fbm2(uv, uTime * 0.05);
+  base = base * 0.5 - 0.65;
+
+  float feed = base + (uDensity - 0.5) * 0.3;
+
+  float speed     = uRippleSpeed;
+  float thickness = uRippleThickness;
+  const float dampT     = 1.0;
+  const float dampR     = 10.0;
+
+  if (uEnableRipples == 1) {
+    for (int i = 0; i < MAX_CLICKS; ++i){
+      vec2 pos = uClickPos[i];
+      if (pos.x < 0.0) continue;
+      float cellPixelSize = 8.0 * pixelSize;
+      vec2 cuv = (((pos - uResolution * .5 - cellPixelSize * .5) / (uResolution))) * vec2(aspectRatio, 1.0);
+      float t = max(uTime - uClickTimes[i], 0.0);
+      float r = distance(uv, cuv);
+      float waveR = speed * t;
+      float ring  = exp(-pow((r - waveR) / thickness, 2.0));
+      float atten = exp(-dampT * t) * exp(-dampR * r);
+      feed = max(feed, ring * atten * uRippleIntensity);
+    }
+  }
+
+  float bayer = Bayer8(fragCoord / uPixelSize) - 0.5;
+  float bw = step(0.5, feed + bayer);
+
+  float h = fract(sin(dot(floor(fragCoord / uPixelSize), vec2(127.1, 311.7))) * 43758.5453);
+  float jitterScale = 1.0 + (h - 0.5) * uPixelJitter;
+  float coverage = bw * jitterScale;
+  float M;
+  if      (uShapeType == SHAPE_CIRCLE)   M = maskCircle (pixelUV, coverage);
+  else if (uShapeType == SHAPE_TRIANGLE) M = maskTriangle(pixelUV, pixelId, coverage);
+  else if (uShapeType == SHAPE_DIAMOND)  M = maskDiamond(pixelUV, coverage);
+  else                                   M = coverage;
+
+  if (uEdgeFade > 0.0) {
+    vec2 norm = gl_FragCoord.xy / uResolution;
+    float edge = min(min(norm.x, norm.y), min(1.0 - norm.x, 1.0 - norm.y));
+    float fade = smoothstep(0.0, uEdgeFade, edge);
+    M *= fade;
+  }
+
+  vec3 color = uColor;
+
+  // sRGB gamma correction - convert linear to sRGB for accurate color output
+  vec3 srgbColor = mix(
+    color * 12.92,
+    1.055 * pow(color, vec3(1.0 / 2.4)) - 0.055,
+    step(0.0031308, color)
+  );
+
+  fragColor = vec4(srgbColor, M);
+}
+`, me = 10, Ce = fe(({ variant: a = "square", pixelSize: r = 3, color: o = "#B19EEF", className: t, style: f, antialias: d = !0, patternScale: m = 2, patternDensity: y = 1, liquid: w = !1, liquidStrength: A = 0.1, liquidRadius: R = 1, pixelSizeJitter: g = 0, enableRipples: I = !0, rippleIntensityScale: n = 1, rippleThickness: h = 0.1, rippleSpeed: C = 0.3, liquidWobbleSpeed: $ = 4.5, autoPauseOffscreen: B = !0, speed: k = 0.5, transparent: _ = !0, edgeFade: v = 0.5, noiseAmount: L = 0 }) => {
+  const X = E(null), N = E({ visible: !0 }), G = E(k), b = E(null), H = E(null);
+  return ce(() => {
+    const F = X.current;
+    if (!F) return;
+    G.current = k;
+    const re = [
+      "antialias",
+      "liquid",
+      "noiseAmount"
+    ], q = {
+      antialias: d,
+      liquid: w,
+      noiseAmount: L
+    };
+    let c = !1;
+    if (!b.current) c = !0;
+    else if (H.current) {
+      for (const e of re) if (H.current[e] !== q[e]) {
+        c = !0;
+        break;
+      }
+    }
+    if (c) {
+      if (b.current) {
+        const p = b.current;
+        p.resizeObserver?.disconnect(), cancelAnimationFrame(p.raf), p.quad?.geometry.dispose(), p.material.dispose(), p.composer?.dispose(), p.renderer.dispose(), p.renderer.domElement.parentElement === F && F.removeChild(p.renderer.domElement), b.current = null;
+      }
+      const e = new Fe({
+        canvas: document.createElement("canvas"),
+        antialias: d,
+        alpha: !0,
+        powerPreference: "high-performance"
+      });
+      e.domElement.style.width = "100%", e.domElement.style.height = "100%", e.setPixelRatio(Math.min(window.devicePixelRatio || 1, 1.5)), F.appendChild(e.domElement), _ ? e.setClearAlpha(0) : e.setClearColor(0, 1);
+      const s = {
+        uResolution: { value: new ye(0, 0) },
+        uTime: { value: 0 },
+        uColor: { value: new Pe(o) },
+        uClickPos: { value: Array.from({ length: me }, () => new ye(-1, -1)) },
+        uClickTimes: { value: new Float32Array(me) },
+        uShapeType: { value: Me[a] ?? 0 },
+        uPixelSize: { value: r * e.getPixelRatio() },
+        uScale: { value: m },
+        uDensity: { value: y },
+        uPixelJitter: { value: g },
+        uEnableRipples: { value: I ? 1 : 0 },
+        uRippleSpeed: { value: C },
+        uRippleThickness: { value: h },
+        uRippleIntensity: { value: n },
+        uEdgeFade: { value: v }
+      }, x = new Ie(), i = new Se(-1, 1, 1, -1, 0, 1), l = new ke({
+        vertexShader: Qe,
+        fragmentShader: Ze,
+        uniforms: s,
+        transparent: !0,
+        depthTest: !1,
+        depthWrite: !1,
+        glslVersion: Te
+      }), u = new _e(new Ae(2, 2), l);
+      x.add(u);
+      const P = new be(), V = () => {
+        const p = F.clientWidth || 1, S = F.clientHeight || 1;
+        e.setSize(p, S, !1), s.uResolution.value.set(e.domElement.width, e.domElement.height), b.current?.composer && b.current.composer.setSize(e.domElement.width, e.domElement.height), s.uPixelSize.value = r * e.getPixelRatio();
+      };
+      V();
+      const K = new ResizeObserver(V);
+      K.observe(F);
+      const U = (() => {
+        if (typeof window < "u" && window.crypto?.getRandomValues) {
+          const p = new Uint32Array(1);
+          return window.crypto.getRandomValues(p), p[0] / 4294967295;
+        }
+        return Math.random();
+      })() * 1e3;
+      let T, D, z;
+      if (w) {
+        D = je(), D.radiusScale = R, T = new ve(e);
+        const p = new ge(x, i);
+        z = Je(D.texture, {
+          strength: A,
+          freq: $
+        });
+        const S = new pe(i, z);
+        S.renderToScreen = !0, T.addPass(p), T.addPass(S);
+      }
+      if (L > 0) {
+        T || (T = new ve(e), T.addPass(new ge(x, i)));
+        const p = new pe(i, new Re("NoiseEffect", "uniform float uTime; uniform float uAmount; float hash(vec2 p){ return fract(sin(dot(p, vec2(127.1,311.7))) * 43758.5453);} void mainUv(inout vec2 uv){} void mainImage(const in vec4 inputColor,const in vec2 uv,out vec4 outputColor){ float n=hash(floor(uv*vec2(1920.0,1080.0))+floor(uTime*60.0)); float g=(n-0.5)*uAmount; outputColor=inputColor+vec4(vec3(g),0.0);} ", { uniforms: /* @__PURE__ */ new Map([["uTime", new oe(0)], ["uAmount", new oe(L)]]) }));
+        p.renderToScreen = !0, T && T.passes.length > 0 && T.passes.forEach((S) => {
+          const Y = S;
+          Y.renderToScreen = !1;
+        }), T.addPass(p);
+      }
+      T && T.setSize(e.domElement.width, e.domElement.height);
+      const Z = (p) => {
+        const S = e.domElement.getBoundingClientRect(), Y = e.domElement.width / S.width, j = e.domElement.height / S.height;
+        return {
+          fx: (p.clientX - S.left) * Y,
+          fy: (S.height - (p.clientY - S.top)) * j,
+          w: e.domElement.width,
+          h: e.domElement.height
+        };
+      }, M = (p) => {
+        const { fx: S, fy: Y } = Z(p), j = b.current?.clickIx ?? 0;
+        s.uClickPos.value[j].set(S, Y), s.uClickTimes.value[j] = s.uTime.value, b.current && (b.current.clickIx = (j + 1) % me);
+      }, ie = (p) => {
+        if (!D) return;
+        const { fx: S, fy: Y, w: j, h: de } = Z(p);
+        D.addTouch({
+          x: S / j,
+          y: Y / de
+        });
+      };
+      e.domElement.addEventListener("pointerdown", M, { passive: !0 }), e.domElement.addEventListener("pointermove", ie, { passive: !0 });
+      let ee = 0, se = 0;
+      const ne = 1e3 / 30, J = (p) => {
+        if (B && !N.current.visible) {
+          ee = requestAnimationFrame(J);
+          return;
+        }
+        const S = p - se;
+        if (S < ne) {
+          ee = requestAnimationFrame(J);
+          return;
+        }
+        if (se = p - S % ne, s.uTime.value = U + P.getElapsedTime() * G.current, z) {
+          const Y = z.uniforms.get("uTime");
+          Y && (Y.value = s.uTime.value);
+        }
+        T ? (D && D.update(), T.passes.forEach((Y) => {
+          const j = Y;
+          j.effects && j.effects.forEach((de) => {
+            const he = de.uniforms?.get("uTime");
+            he && (he.value = s.uTime.value);
+          });
+        }), T.render()) : e.render(x, i), ee = requestAnimationFrame(J);
+      };
+      ee = requestAnimationFrame((p) => {
+        se = p, J(p);
+      }), b.current = {
+        renderer: e,
+        scene: x,
+        camera: i,
+        material: l,
+        clock: P,
+        clickIx: 0,
+        uniforms: s,
+        resizeObserver: K,
+        raf: ee,
+        quad: u,
+        timeOffset: U,
+        composer: T,
+        touch: D,
+        liquidEffect: z
+      };
+    } else {
+      const e = b.current;
+      if (e.uniforms.uShapeType.value = Me[a] ?? 0, e.uniforms.uPixelSize.value = r * e.renderer.getPixelRatio(), e.uniforms.uColor.value.set(o), e.uniforms.uScale.value = m, e.uniforms.uDensity.value = y, e.uniforms.uPixelJitter.value = g, e.uniforms.uEnableRipples.value = I ? 1 : 0, e.uniforms.uRippleIntensity.value = n, e.uniforms.uRippleThickness.value = h, e.uniforms.uRippleSpeed.value = C, e.uniforms.uEdgeFade.value = v, _ ? e.renderer.setClearAlpha(0) : e.renderer.setClearColor(0, 1), e.liquidEffect) {
+        const s = e.liquidEffect, x = s.uniforms.get("uStrength");
+        x && (x.value = A);
+        const i = s.uniforms.get("uFreq");
+        i && (i.value = $);
+      }
+      e.touch && (e.touch.radiusScale = R);
+    }
+    return H.current = q, () => {
+      if (b.current && c || !b.current) return;
+      const e = b.current;
+      e.resizeObserver?.disconnect(), cancelAnimationFrame(e.raf), e.quad?.geometry.dispose(), e.material.dispose(), e.composer?.dispose(), e.renderer.dispose(), e.renderer.domElement.parentElement === F && F.removeChild(e.renderer.domElement), b.current = null;
+    };
+  }, [
+    d,
+    w,
+    L,
+    r,
+    m,
+    y,
+    I,
+    n,
+    h,
+    C,
+    g,
+    v,
+    _,
+    A,
+    R,
+    $,
+    B,
+    a,
+    o,
+    k
+  ]), W("div", {
+    ref: X,
+    className: `${Ke.container} ${t ?? ""}`,
+    style: f,
+    "aria-label": "PixelBlast interactive background"
+  });
+});
+Ce.displayName = "PixelBlast";
+var et = fe((a) => {
+  const { currentTheme: r } = ue();
+  return W(Ce, {
+    color: ae(() => {
+      const o = r.colors.variables.primary || "#B19EEF";
+      return ((f) => {
+        if (f.startsWith("#")) return f;
+        const d = f.match(/rgb\((\d+),\s*(\d+),\s*(\d+)\)/);
+        return d ? `#${parseInt(d[1], 10).toString(16).padStart(2, "0")}${parseInt(d[2], 10).toString(16).padStart(2, "0")}${parseInt(d[3], 10).toString(16).padStart(2, "0")}` : f;
+      })(o);
+    }, [r]),
+    variant: "square",
+    pixelSize: 6,
+    patternScale: 2,
+    patternDensity: 1,
+    pixelSizeJitter: 0,
+    enableRipples: !0,
+    rippleSpeed: 0.3,
+    rippleThickness: 0.12,
+    rippleIntensityScale: 1.2,
+    liquid: !1,
+    liquidStrength: 0.12,
+    liquidRadius: 1.2,
+    liquidWobbleSpeed: 5,
+    speed: 0.3,
+    edgeFade: 0.25,
+    transparent: !0,
+    antialias: !1,
+    ...a
+  });
+});
+et.displayName = "PixelBlastBackground";
+export {
+  st as i,
+  We as n,
+  ct as r,
+  et as t
+};
+
+//# sourceMappingURL=chunk-animations-Brp-bsaE.mjs.map