@actioneer/ads 0.1.0

package/components/agents-ui/react-shader-toy.js

@@ -0,0 +1,531 @@
+"use client";
+var Be = Object.defineProperty;
+var $e = (c, i, n) => i in c ? Be(c, i, { enumerable: !0, configurable: !0, writable: !0, value: n }) : c[i] = n;
+var v = (c, i, n) => $e(c, typeof i != "symbol" ? i + "" : i, n);
+import { jsx as Ve } from "react/jsx-runtime";
+import { useRef as p, useEffect as q } from "react";
+const de = ["lowp", "mediump", "highp"], Ye = `
+void main(void){
+    vec4 color = vec4(0.0,0.0,0.0,1.0);
+    mainImage( color, gl_FragCoord.xy );
+    gl_FragColor = color;
+}`, Ge = `void mainImage( out vec4 fragColor, in vec2 fragCoord ) {
+    vec2 uv = fragCoord/iResolution.xy;
+    vec3 col = 0.5 + 0.5*cos(iTime+uv.xyx+vec3(0,2,4));
+    fragColor = vec4(col,1.0);
+}`, me = `attribute vec3 aVertexPosition;
+void main(void) {
+    gl_Position = vec4(aVertexPosition, 1.0);
+}`, le = "iTime", he = "iTimeDelta", ve = "iDate", pe = "iFrame", ge = "iMouse", Te = "iResolution", He = "iChannel", Ee = "iChannelResolution", Re = "iDeviceOrientation";
+function je(c, i) {
+  return c.includes("Matrix") && Array.isArray(i);
+}
+function ze(c, i) {
+  return c.includes("v") && Array.isArray(i) && i.length > Number.parseInt(c.charAt(0));
+}
+function ke(c, i) {
+  return !c.includes("v") && Array.isArray(i) && i.length > Number.parseInt(c.charAt(0));
+}
+const qe = (c, i, n, s) => {
+  if (ke(n, s))
+    switch (n) {
+      case "2f":
+        return c.uniform2f(i, s[0], s[1]);
+      case "3f":
+        return c.uniform3f(i, s[0], s[1], s[2]);
+      case "4f":
+        return c.uniform4f(i, s[0], s[1], s[2], s[3]);
+      case "2i":
+        return c.uniform2i(i, s[0], s[1]);
+      case "3i":
+        return c.uniform3i(i, s[0], s[1], s[2]);
+      case "4i":
+        return c.uniform4i(i, s[0], s[1], s[2], s[3]);
+    }
+  if (typeof s == "number")
+    switch (n) {
+      case "1i":
+        return c.uniform1i(i, s);
+      default:
+        return c.uniform1f(i, s);
+    }
+  switch (n) {
+    case "1iv":
+      return c.uniform1iv(i, s);
+    case "2iv":
+      return c.uniform2iv(i, s);
+    case "3iv":
+      return c.uniform3iv(i, s);
+    case "4iv":
+      return c.uniform4iv(i, s);
+    case "1fv":
+      return c.uniform1fv(i, s);
+    case "2fv":
+      return c.uniform2fv(i, s);
+    case "3fv":
+      return c.uniform3fv(i, s);
+    case "4fv":
+      return c.uniform4fv(i, s);
+    case "Matrix2fv":
+      return c.uniformMatrix2fv(i, !1, s);
+    case "Matrix3fv":
+      return c.uniformMatrix3fv(i, !1, s);
+    case "Matrix4fv":
+      return c.uniformMatrix4fv(i, !1, s);
+  }
+}, Ke = (c) => {
+  switch (c) {
+    case "1f":
+      return "float";
+    case "2f":
+      return "vec2";
+    case "3f":
+      return "vec3";
+    case "4f":
+      return "vec4";
+    case "1i":
+      return "int";
+    case "2i":
+      return "ivec2";
+    case "3i":
+      return "ivec3";
+    case "4i":
+      return "ivec4";
+    case "1iv":
+      return "int";
+    case "2iv":
+      return "ivec2";
+    case "3iv":
+      return "ivec3";
+    case "4iv":
+      return "ivec4";
+    case "1fv":
+      return "float";
+    case "2fv":
+      return "vec2";
+    case "3fv":
+      return "vec3";
+    case "4fv":
+      return "vec4";
+    case "Matrix2fv":
+      return "mat2";
+    case "Matrix3fv":
+      return "mat3";
+    case "Matrix4fv":
+      return "mat4";
+    default:
+      console.error(
+        N(`The uniform type "${c}" is not valid, please make sure your uniform type is valid`)
+      );
+  }
+}, ie = 9729, we = 9728, We = 9987, _e = 33071, ye = 10497;
+class Qe {
+  constructor(i) {
+    v(this, "gl");
+    v(this, "url");
+    v(this, "wrapS");
+    v(this, "wrapT");
+    v(this, "minFilter");
+    v(this, "magFilter");
+    v(this, "source");
+    v(this, "pow2canvas");
+    v(this, "isLoaded", !1);
+    v(this, "isVideo", !1);
+    v(this, "flipY", -1);
+    v(this, "width", 0);
+    v(this, "height", 0);
+    v(this, "_webglTexture", null);
+    v(this, "updateTexture", (i, n, s) => {
+      const { gl: T } = this, L = 0, H = T.RGBA, D = T.RGBA, F = T.UNSIGNED_BYTE;
+      T.bindTexture(T.TEXTURE_2D, i), T.pixelStorei(T.UNPACK_FLIP_Y_WEBGL, s), T.texImage2D(T.TEXTURE_2D, L, H, D, F, n);
+    });
+    v(this, "setupVideo", (i) => {
+      const n = document.createElement("video");
+      let s = !1, T = !1;
+      n.autoplay = !0, n.muted = !0, n.loop = !0, n.crossOrigin = "anonymous";
+      const L = () => {
+        s && T && (this.isLoaded = !0);
+      };
+      return n.addEventListener(
+        "playing",
+        () => {
+          s = !0, this.width = n.videoWidth || 0, this.height = n.videoHeight || 0, L();
+        },
+        !0
+      ), n.addEventListener(
+        "timeupdate",
+        () => {
+          T = !0, L();
+        },
+        !0
+      ), n.src = i, n;
+    });
+    v(this, "makePowerOf2", (i) => {
+      if (i instanceof HTMLImageElement || i instanceof HTMLCanvasElement || i instanceof ImageBitmap) {
+        this.pow2canvas === void 0 && (this.pow2canvas = document.createElement("canvas")), this.pow2canvas.width = 2 ** Math.floor(Math.log(i.width) / Math.LN2), this.pow2canvas.height = 2 ** Math.floor(Math.log(i.height) / Math.LN2);
+        const n = this.pow2canvas.getContext("2d");
+        return n == null || n.drawImage(i, 0, 0, this.pow2canvas.width, this.pow2canvas.height), console.warn(
+          N(
+            `Image is not power of two ${i.width} x ${i.height}. Resized to ${this.pow2canvas.width} x ${this.pow2canvas.height};`
+          )
+        ), this.pow2canvas;
+      }
+      return i;
+    });
+    v(this, "load", async (i) => {
+      const { gl: n } = this, { url: s, wrapS: T, wrapT: L, minFilter: H, magFilter: D, flipY: F = -1 } = i;
+      if (!s)
+        return Promise.reject(
+          new Error(
+            N("Missing url, please make sure to pass the url of your texture { url: ... }")
+          )
+        );
+      const b = /(\.jpg|\.jpeg|\.png|\.gif|\.bmp)$/i.exec(s), M = /(\.mp4|\.3gp|\.webm|\.ogv)$/i.exec(s);
+      if (b === null && M === null)
+        return Promise.reject(
+          new Error(N(`Please upload a video or an image with a valid format (url: ${s})`))
+        );
+      Object.assign(this, { url: s, wrapS: T, wrapT: L, minFilter: H, magFilter: D, flipY: F });
+      const w = 0, I = n.RGBA, S = 1, P = 1, re = 0, u = n.RGBA, g = n.UNSIGNED_BYTE, j = new Uint8Array([255, 255, 255, 0]), m = n.createTexture();
+      if (n.bindTexture(n.TEXTURE_2D, m), n.texImage2D(
+        n.TEXTURE_2D,
+        w,
+        I,
+        S,
+        P,
+        re,
+        u,
+        g,
+        j
+      ), M) {
+        const x = this.setupVideo(s);
+        return n.texParameteri(n.TEXTURE_2D, n.TEXTURE_WRAP_S, n.CLAMP_TO_EDGE), n.texParameteri(n.TEXTURE_2D, n.TEXTURE_WRAP_T, n.CLAMP_TO_EDGE), n.texParameteri(n.TEXTURE_2D, n.TEXTURE_MIN_FILTER, n.LINEAR), this._webglTexture = m, this.source = x, this.isVideo = !0, x.play().then(() => this);
+      }
+      async function z() {
+        return new Promise((x, K) => {
+          const _ = new Image();
+          _.crossOrigin = "anonymous", _.onload = () => {
+            x(_);
+          }, _.onerror = () => {
+            K(new Error(N(`failed loading url: ${s}`)));
+          }, _.src = s ?? "";
+        });
+      }
+      let E = await z(), C = (E.width & E.width - 1) === 0 && (E.height & E.height - 1) === 0;
+      return (i.wrapS !== _e || i.wrapT !== _e || i.minFilter !== we && i.minFilter !== ie) && !C && (E = this.makePowerOf2(E), C = !0), n.bindTexture(n.TEXTURE_2D, m), n.pixelStorei(n.UNPACK_FLIP_Y_WEBGL, F), n.texImage2D(n.TEXTURE_2D, w, I, u, g, E), C && i.minFilter !== we && i.minFilter !== ie && n.generateMipmap(n.TEXTURE_2D), n.texParameteri(n.TEXTURE_2D, n.TEXTURE_WRAP_S, this.wrapS || ye), n.texParameteri(n.TEXTURE_2D, n.TEXTURE_WRAP_T, this.wrapT || ye), n.texParameteri(
+        n.TEXTURE_2D,
+        n.TEXTURE_MIN_FILTER,
+        this.minFilter || We
+      ), n.texParameteri(n.TEXTURE_2D, n.TEXTURE_MAG_FILTER, this.magFilter || ie), this._webglTexture = m, this.source = E, this.isVideo = !1, this.isLoaded = !0, this.width = E.width || 0, this.height = E.height || 0, this;
+    });
+    this.gl = i;
+  }
+}
+const N = (c) => `react-shaders: ${c}`, Ae = (c) => {
+  if ("changedTouches" in c) {
+    const i = c.changedTouches[0];
+    return [(i == null ? void 0 : i.clientX) ?? 0, (i == null ? void 0 : i.clientY) ?? 0];
+  }
+  return [c.clientX, c.clientY];
+}, Le = (c, i, n) => c * (1 - n) + i * n, Je = (c, i, n) => n > 0 ? c.substring(0, n) + i + c.substring(n, c.length) : i + c;
+function rt({
+  fs: c,
+  vs: i = me,
+  textures: n = [],
+  uniforms: s,
+  clearColor: T = [0, 0, 0, 1],
+  precision: L = "highp",
+  style: H,
+  contextAttributes: D = {},
+  lerp: F = 1,
+  devicePixelRatio: b = 1,
+  onDoneLoadingTextures: M,
+  onError: w = console.error,
+  onWarning: I = console.warn,
+  animateWhenNotVisible: S = !1,
+  paused: P = !1,
+  ...re
+}) {
+  const u = p(null), g = p(null), j = p(null), m = p(null), z = p(void 0), E = p(void 0), C = p(void 0), x = p(!0), K = p(S), _ = p(P), Ue = p(!1), U = p(void 0), Fe = p(0), X = p([0, 0]), B = p([]), W = p(0), Q = p(void 0), a = p({
+    [le]: { type: "float", isNeeded: !1, value: 0 },
+    [he]: { type: "float", isNeeded: !1, value: 0 },
+    [ve]: { type: "vec4", isNeeded: !1, value: [0, 0, 0, 0] },
+    [ge]: { type: "vec4", isNeeded: !1, value: [0, 0, 0, 0] },
+    [Te]: { type: "vec2", isNeeded: !1, value: [0, 0] },
+    [pe]: { type: "int", isNeeded: !1, value: 0 },
+    [Re]: { type: "vec4", isNeeded: !1, value: [0, 0, 0, 0] }
+  }), se = p(s), ce = (e, t) => {
+    const r = "width" in e ? e.width ?? 0 : 0, o = "height" in e ? e.height ?? 0 : 0, f = a.current.iChannelResolution;
+    if (!f) return;
+    const l = Array.isArray(f.value) ? f.value : f.value = [];
+    l[t * 3] = r * b, l[t * 3 + 1] = o * b, l[t * 3 + 2] = 0;
+  }, Me = () => {
+    var e, t;
+    u.current && (g.current = u.current.getContext("webgl", D) || u.current.getContext(
+      "experimental-webgl",
+      D
+    ), (e = g.current) == null || e.getExtension("OES_standard_derivatives"), (t = g.current) == null || t.getExtension("EXT_shader_texture_lod"));
+  }, Ie = () => {
+    const e = g.current;
+    j.current = (e == null ? void 0 : e.createBuffer()) ?? null, e == null || e.bindBuffer(e.ARRAY_BUFFER, j.current);
+    const t = [1, 1, 0, -1, 1, 0, 1, -1, 0, -1, -1, 0];
+    e == null || e.bufferData(e.ARRAY_BUFFER, new Float32Array(t), e.STATIC_DRAW);
+  }, oe = ({ alpha: e, beta: t, gamma: r }) => {
+    a.current.iDeviceOrientation.value = [
+      e ?? 0,
+      t ?? 0,
+      r ?? 0,
+      window.orientation ?? 0
+    ];
+  }, J = (e) => {
+    var h, R, y, O;
+    const [t = 0, r = 0] = Ae(e), o = t - (((h = U.current) == null ? void 0 : h.left) ?? 0) - window.pageXOffset, f = (((R = U.current) == null ? void 0 : R.height) ?? 0) - r - (((y = U.current) == null ? void 0 : y.top) ?? 0) - window.pageYOffset;
+    Ue.current = !0;
+    const l = Array.isArray((O = a.current.iMouse) == null ? void 0 : O.value) ? a.current.iMouse.value : void 0;
+    l && (l[2] = o, l[3] = f), X.current[0] = o, X.current[1] = f;
+  }, Z = (e) => {
+    var l, h, R, y, O;
+    U.current = (l = u.current) == null ? void 0 : l.getBoundingClientRect();
+    const [t = 0, r = 0] = Ae(e), o = t - (((h = U.current) == null ? void 0 : h.left) ?? 0), f = (((R = U.current) == null ? void 0 : R.height) ?? 0) - r - (((y = U.current) == null ? void 0 : y.top) ?? 0);
+    if (F !== 1)
+      X.current[0] = o, X.current[1] = f;
+    else {
+      const Y = Array.isArray((O = a.current.iMouse) == null ? void 0 : O.value) ? a.current.iMouse.value : void 0;
+      Y && (Y[0] = o, Y[1] = f);
+    }
+  }, $ = () => {
+    var t;
+    const e = Array.isArray((t = a.current.iMouse) == null ? void 0 : t.value) ? a.current.iMouse.value : void 0;
+    e && (e[2] = 0, e[3] = 0);
+  }, ee = () => {
+    var f, l, h, R;
+    const e = g.current;
+    if (!e) return;
+    U.current = (f = u.current) == null ? void 0 : f.getBoundingClientRect();
+    const t = b, r = Math.floor((((l = U.current) == null ? void 0 : l.width) ?? 1) * t), o = Math.floor((((h = U.current) == null ? void 0 : h.height) ?? 1) * t);
+    if (e.canvas.width = r, e.canvas.height = o, (R = a.current.iResolution) != null && R.isNeeded && m.current) {
+      const y = e.getUniformLocation(m.current, Te);
+      e.uniform2fv(y, [e.canvas.width, e.canvas.height]);
+    }
+  }, ue = (e, t) => {
+    const r = g.current;
+    if (!r) return null;
+    const o = r.createShader(e);
+    if (!o) return null;
+    if (r.shaderSource(o, t), r.compileShader(o), !r.getShaderParameter(o, r.COMPILE_STATUS)) {
+      I == null || I(N(`Error compiling the shader:
+${t}`));
+      const f = r.getShaderInfoLog(o);
+      r.deleteShader(o), w == null || w(N(`Shader compiler log: ${f}`));
+    }
+    return o;
+  }, Ne = (e, t) => {
+    const r = g.current;
+    if (!r) return;
+    const o = ue(r.FRAGMENT_SHADER, e), f = ue(r.VERTEX_SHADER, t);
+    if (m.current = r.createProgram(), !(!m.current || !f || !o)) {
+      if (r.attachShader(m.current, f), r.attachShader(m.current, o), r.linkProgram(m.current), !r.getProgramParameter(m.current, r.LINK_STATUS)) {
+        w == null || w(
+          N(
+            `Unable to initialize the shader program: ${r.getProgramInfoLog(m.current)}`
+          )
+        );
+        return;
+      }
+      r.useProgram(m.current), z.current = r.getAttribLocation(
+        m.current,
+        "aVertexPosition"
+      ), r.enableVertexAttribArray(z.current);
+    }
+  }, Se = () => {
+    if (s)
+      for (const e of Object.keys(s)) {
+        const t = s[e];
+        if (!t) continue;
+        const { value: r, type: o } = t, f = Ke(o);
+        if (!f) continue;
+        const l = {};
+        if (je(o, r)) {
+          const h = o.length, R = Number.parseInt(o.charAt(h - 3)), y = Math.floor(r.length / (R * R));
+          r.length > R * R && (l.arraySize = `[${y}]`);
+        } else ze(o, r) && (l.arraySize = `[${Math.floor(r.length / Number.parseInt(o.charAt(0)))}]`);
+        a.current[e] = { type: f, isNeeded: !1, value: r, ...l };
+      }
+  }, xe = () => {
+    const e = g.current;
+    if (e)
+      if (n && n.length > 0) {
+        a.current[`${Ee}`] = {
+          type: "vec3",
+          isNeeded: !1,
+          arraySize: `[${n.length}]`,
+          value: []
+        };
+        const t = n.map((r, o) => {
+          var f;
+          return a.current[`${He}${o}`] = {
+            type: "sampler2D",
+            isNeeded: !1
+          }, ce(r, o), B.current[o] = new Qe(e), (f = B.current[o]) == null ? void 0 : f.load(r).then((l) => {
+            ce(l, o);
+          });
+        });
+        Promise.all(t).then(() => {
+          M && M();
+        }).catch((r) => {
+          w == null || w(r), M && M();
+        });
+      } else M && M();
+  }, Oe = (e) => {
+    const t = de.includes(L ?? "highp"), r = `precision ${t ? L : de[1]} float;
+`;
+    t || I == null || I(
+      N(
+        `wrong precision type ${L}, please make sure to pass one of a valid precision lowp, mediump, highp, by default you shader precision will be set to highp.`
+      )
+    );
+    let o = r.concat(`#define DPR ${b.toFixed(1)}
+`).concat(e.replace(/texture\(/g, "texture2D("));
+    for (const l of Object.keys(a.current))
+      if (e.includes(l)) {
+        const h = a.current[l];
+        if (!h) continue;
+        o = Je(
+          o,
+          `uniform ${h.type} ${l}${h.arraySize || ""}; 
+`,
+          o.lastIndexOf(r) + r.length
+        ), h.isNeeded = !0;
+      }
+    return e.includes("mainImage") && (o = o.concat(Ye)), o;
+  }, Pe = (e) => {
+    var f, l, h, R, y, O, Y, ae, fe;
+    const t = g.current;
+    if (!t || !m.current) return;
+    const r = !_.current && W.current ? (e - W.current) / 1e3 : 0;
+    W.current = e;
+    const o = se.current;
+    if (o)
+      for (const d of Object.keys(o)) {
+        const A = o[d];
+        if (A && (f = a.current[d]) != null && f.isNeeded) {
+          if (!m.current) return;
+          const G = t.getUniformLocation(m.current, d);
+          if (!G) return;
+          qe(
+            t,
+            G,
+            A.type,
+            A.value
+          );
+        }
+      }
+    if ((l = a.current.iMouse) != null && l.isNeeded) {
+      const d = t.getUniformLocation(m.current, ge);
+      t.uniform4fv(d, a.current.iMouse.value);
+    }
+    if ((h = a.current.iChannelResolution) != null && h.isNeeded) {
+      const d = t.getUniformLocation(
+        m.current,
+        Ee
+      );
+      t.uniform3fv(d, a.current.iChannelResolution.value);
+    }
+    if ((R = a.current.iDeviceOrientation) != null && R.isNeeded) {
+      const d = t.getUniformLocation(
+        m.current,
+        Re
+      );
+      t.uniform4fv(
+        d,
+        a.current.iDeviceOrientation.value
+      );
+    }
+    if ((y = a.current.iTime) != null && y.isNeeded) {
+      const d = t.getUniformLocation(m.current, le);
+      t.uniform1f(d, Fe.current += r);
+    }
+    if ((O = a.current.iTimeDelta) != null && O.isNeeded) {
+      const d = t.getUniformLocation(m.current, he);
+      t.uniform1f(d, r);
+    }
+    if ((Y = a.current.iDate) != null && Y.isNeeded) {
+      const d = /* @__PURE__ */ new Date(), A = d.getMonth() + 1, G = d.getDate(), k = d.getFullYear(), te = d.getHours() * 60 * 60 + d.getMinutes() * 60 + d.getSeconds() + d.getMilliseconds() * 1e-3, ne = t.getUniformLocation(m.current, ve);
+      t.uniform4fv(ne, [k, A, G, te]);
+    }
+    if ((ae = a.current.iFrame) != null && ae.isNeeded) {
+      const d = t.getUniformLocation(m.current, pe), A = a.current.iFrame.value;
+      t.uniform1i(d, A), a.current.iFrame.value = A + 1;
+    }
+    if (B.current.length > 0)
+      for (let d = 0; d < B.current.length; d++) {
+        const A = B.current[d];
+        if (!A) return;
+        const { isVideo: G, _webglTexture: k, source: te, flipY: ne, isLoaded: Ce } = A;
+        if (!Ce || !k || !te) return;
+        if ((fe = a.current[`iChannel${d}`]) != null && fe.isNeeded) {
+          if (!m.current) return;
+          const Xe = t.getUniformLocation(m.current, `iChannel${d}`);
+          t.activeTexture(t.TEXTURE0 + d), t.bindTexture(t.TEXTURE_2D, k), t.uniform1i(Xe, d), G && A.updateTexture(k, te, ne);
+        }
+      }
+  }, V = (e) => {
+    var o, f;
+    const t = g.current;
+    if (!t) return;
+    t.viewport(0, 0, t.drawingBufferWidth, t.drawingBufferHeight), t.clear(t.COLOR_BUFFER_BIT | t.DEPTH_BUFFER_BIT), t.bindBuffer(t.ARRAY_BUFFER, j.current), t.vertexAttribPointer(z.current ?? 0, 3, t.FLOAT, !1, 0, 0), Pe(e), t.drawArrays(t.TRIANGLE_STRIP, 0, 4);
+    const r = (o = a.current.iMouse) == null ? void 0 : o.value;
+    if ((f = a.current.iMouse) != null && f.isNeeded && F !== 1 && Array.isArray(r)) {
+      const l = r[0] ?? 0, h = r[1] ?? 0;
+      r[0] = Le(l, X.current[0] ?? 0, F), r[1] = Le(h, X.current[1] ?? 0, F);
+    }
+    !_.current && (K.current || x.current) && (E.current = requestAnimationFrame(V));
+  }, De = () => {
+    var t, r;
+    const e = { passive: !0 };
+    (t = a.current.iMouse) != null && t.isNeeded && u.current && (u.current.addEventListener("mousemove", Z, e), u.current.addEventListener("mouseout", $, e), u.current.addEventListener("mouseup", $, e), u.current.addEventListener("mousedown", J, e), u.current.addEventListener("touchmove", Z, e), u.current.addEventListener("touchend", $, e), u.current.addEventListener("touchstart", J, e)), (r = a.current.iDeviceOrientation) != null && r.isNeeded && window.addEventListener("deviceorientation", oe, e), u.current && (Q.current = new ResizeObserver(ee), Q.current.observe(u.current), window.addEventListener("resize", ee, e));
+  }, be = () => {
+    var t, r;
+    const e = { passive: !0 };
+    (t = a.current.iMouse) != null && t.isNeeded && u.current && (u.current.removeEventListener("mousemove", Z, e), u.current.removeEventListener("mouseout", $, e), u.current.removeEventListener("mouseup", $, e), u.current.removeEventListener("mousedown", J, e), u.current.removeEventListener("touchmove", Z, e), u.current.removeEventListener("touchend", $, e), u.current.removeEventListener("touchstart", J, e)), (r = a.current.iDeviceOrientation) != null && r.isNeeded && window.removeEventListener("deviceorientation", oe, e), Q.current && (Q.current.disconnect(), window.removeEventListener("resize", ee, e));
+  };
+  return q(() => {
+    se.current = s, _.current && g.current && (E.current = requestAnimationFrame(V));
+  }, [s]), q(() => {
+    const e = _.current;
+    _.current = P, !P && e && g.current ? (W.current = performance.now(), E.current = requestAnimationFrame(V)) : P && g.current && (E.current = requestAnimationFrame(V));
+  }, [P]), q(() => {
+    K.current = S, S && (x.current = !0);
+  }, [S]), q(() => {
+    if (S || !u.current) return;
+    const e = u.current, t = new IntersectionObserver(
+      (r) => {
+        for (const o of r)
+          x.current = o.isIntersecting, o.isIntersecting && !_.current && requestAnimationFrame(V);
+      },
+      { threshold: 0 }
+    );
+    return t.observe(e), () => t.disconnect();
+  }, [S]), q(() => {
+    const e = B.current;
+    function t() {
+      Me();
+      const r = g.current;
+      r && u.current && (r.clearColor(...T), r.clearDepth(1), r.enable(r.DEPTH_TEST), r.depthFunc(r.LEQUAL), r.viewport(0, 0, u.current.width, u.current.height), u.current.height = u.current.clientHeight, u.current.width = u.current.clientWidth, Se(), xe(), Ne(Oe(c || Ge), i || me), Ie(), requestAnimationFrame(V), De(), ee());
+    }
+    return C.current = requestAnimationFrame(t), () => {
+      var o;
+      const r = g.current;
+      if (r) {
+        if ((o = r.getExtension("WEBGL_lose_context")) == null || o.loseContext(), r.useProgram(null), r.deleteProgram(m.current ?? null), e.length > 0)
+          for (const f of e)
+            r.deleteTexture(f._webglTexture);
+        m.current = null;
+      }
+      be(), cancelAnimationFrame(C.current ?? 0), cancelAnimationFrame(E.current ?? 0);
+    };
+  }, []), /* @__PURE__ */ Ve("canvas", { ref: u, style: H, ...re });
+}
+export {
+  rt as ReactShaderToy
+};

package/components/ai-elements/chain-of-thought.d.ts

@@ -0,0 +1,30 @@
+import { Badge } from '../badge';
+import { CollapsibleContent, CollapsibleTrigger } from '../collapsible';
+import { ComponentProps, ComponentType, ReactNode } from 'react';
+export type ChainOfThoughtProps = ComponentProps<"div"> & {
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+};
+export declare const ChainOfThought: import('react').MemoExoticComponent<({ className, open, defaultOpen, onOpenChange, children, ...props }: ChainOfThoughtProps) => import("react").JSX.Element>;
+export type ChainOfThoughtHeaderProps = ComponentProps<typeof CollapsibleTrigger>;
+export declare const ChainOfThoughtHeader: import('react').MemoExoticComponent<({ className, children, ...props }: ChainOfThoughtHeaderProps) => import("react").JSX.Element>;
+export type ChainOfThoughtStepProps = ComponentProps<"div"> & {
+    icon?: ComponentType<{
+        className?: string;
+    }>;
+    label: ReactNode;
+    description?: ReactNode;
+    status?: "complete" | "active" | "pending";
+};
+export declare const ChainOfThoughtStep: import('react').MemoExoticComponent<({ className, icon: Icon, label, description, status, children, ...props }: ChainOfThoughtStepProps) => import("react").JSX.Element>;
+export type ChainOfThoughtSearchResultsProps = ComponentProps<"div">;
+export declare const ChainOfThoughtSearchResults: import('react').MemoExoticComponent<({ className, ...props }: ChainOfThoughtSearchResultsProps) => import("react").JSX.Element>;
+export type ChainOfThoughtSearchResultProps = ComponentProps<typeof Badge>;
+export declare const ChainOfThoughtSearchResult: import('react').MemoExoticComponent<({ className, children, ...props }: ChainOfThoughtSearchResultProps) => import("react").JSX.Element>;
+export type ChainOfThoughtContentProps = ComponentProps<typeof CollapsibleContent>;
+export declare const ChainOfThoughtContent: import('react').MemoExoticComponent<({ className, children, ...props }: ChainOfThoughtContentProps) => import("react").JSX.Element>;
+export type ChainOfThoughtImageProps = ComponentProps<"div"> & {
+    caption?: string;
+};
+export declare const ChainOfThoughtImage: import('react').MemoExoticComponent<({ className, children, caption, ...props }: ChainOfThoughtImageProps) => import("react").JSX.Element>;