@firecms/neat 0.9.0 → 0.9.2

package/dist/index.es.js

@@ -1,4 +1,4 @@
-const ct = `void main() {
+const ht = `void main() {
 vUv = uv;
 vPosition = position;
 float waveOffset = -u_y_offset * u_y_offset_wave_multiplier;
@@ -26,7 +26,7 @@ flowUv = mix(baseUv, vec2(baseUv.x * (1.0 - u_flow_ease) + r * u_flow_ease, base
 vFlowUv = flowUv;
 vec3 color = u_colors[0].color;
 vec3 distortedPos = position;
-if (u_shape_type > 0.5) {
+if (u_flat_shading < 0.5) {
 if (u_flow_enabled > 0.5) {
 if (u_flow_ease > 0.0 || u_flow_distortion_a > 0.0) {
 vec3 ppp = position / 25.0;
@@ -44,7 +44,7 @@ position.z * (1.0 - u_flow_ease) + r * u_flow_ease * 25.0
 }
 }
 vec3 noise_cord;
-if (u_shape_type > 0.5) {
+if (u_flat_shading < 0.5) {
 noise_cord = vec3(distortedPos.x / 50.0, (distortedPos.y + colorOffset) / 50.0, distortedPos.z / 50.0);
 } else {
 vec2 adjustedUv = flowUv;
@@ -60,7 +60,7 @@ float noiseFlow = (1. + float(i)) / 30.;
 float noiseSpeed = (1. + float(i)) * 0.11;
 float noiseSeed = 13. + float(i) * 7.;
 float noise_z = u_time * noiseSpeed;
-if (u_shape_type > 0.5) {
+if (u_flat_shading < 0.5) {
 noise_z = noise_cord.z * u_color_pressure.x * u_color_pressure.x + u_time * noiseSpeed;
 }
 float noise = snoise(
@@ -82,14 +82,14 @@ vViewPosition = mvPosition.xyz;
 vNormal = normalize((modelViewMatrix * vec4(normal, 0.0)).xyz);
 gl_Position = projectionMatrix * mvPosition;
 v_new_position = gl_Position;
-}`, ht = `float random(vec2 p) {
+}`, ft = `float random(vec2 p) {
 return fract(sin(dot(p, vec2(12.9898,78.233))) * 43758.5453);
 }
 float fbm(vec3 x) {
 float value = 0.0;
 float amplitude = 0.5;
 float frequency = 1.0;
-for (int i = 0; i < 4; i++) {
+for (int i = 0; i < 2; i++) {
 value += amplitude * snoise(x * frequency);
 frequency *= 2.0;
 amplitude *= 0.5;
@@ -105,7 +105,7 @@ vec2 finalUv = vFlowUv;
 vec3 baseColor;
 float texAlpha = 1.0;
 if (u_enable_procedural_texture > 0.5) {
-if (u_shape_type > 0.5) {
+if (u_flat_shading < 0.5) {
 float parallaxFactor = 0.25;
 float scrollOffset = (u_y_offset * u_y_offset_color_multiplier) * parallaxFactor;
 vec3 scrolledPos = vPosition;
@@ -114,9 +114,9 @@ vec3 p = (scrolledPos * 1.5) / 50.0;
 vec2 uvX = p.yz + vec2(0.5);
 vec2 uvY = p.zx + vec2(0.5);
 vec2 uvZ = p.xy + vec2(0.5);
-vec4 colX = texture2D(u_procedural_texture, fract(uvX));
-vec4 colY = texture2D(u_procedural_texture, fract(uvY));
-vec4 colZ = texture2D(u_procedural_texture, fract(uvZ));
+vec4 colX = texture2D(u_procedural_texture, uvX);
+vec4 colY = texture2D(u_procedural_texture, uvY);
+vec4 colZ = texture2D(u_procedural_texture, uvZ);
 vec3 n = normalize(vNormal);
 vec3 blendWeights = abs(n);
 blendWeights = blendWeights / (blendWeights.x + blendWeights.y + blendWeights.z + 0.0001);
@@ -138,7 +138,7 @@ vec2 texUv = vec2(vx, vy);
 float parallaxFactor = 0.25;
 texUv.y -= (u_y_offset * u_y_offset_color_multiplier / u_plane_height) * parallaxFactor;
 texUv *= 1.5;
-vec4 texSample = texture2D(u_procedural_texture, fract(texUv));
+vec4 texSample = texture2D(u_procedural_texture, texUv);
 baseColor = texSample.rgb;
 if (u_transparent_texture_void > 0.5) {
 texAlpha = texSample.a;
@@ -150,7 +150,7 @@ baseColor = v_color;
 vec3 color = baseColor;
 if (u_domain_warp_enabled > 0.5) {
 vec3 p;
-if (u_shape_type > 0.5) {
+if (u_flat_shading < 0.5) {
 p = vec3((vPosition / 50.0 + vec3(0.5)) * u_domain_warp_scale);
 p.z += u_time * 0.15;
 } else {
@@ -179,7 +179,7 @@ vec3 lightDir = normalize(vec3(1.0, 1.0, 1.0));
 float diffuse = max(dot(normal, lightDir), 0.0);
 vec3 halfDir = normalize(lightDir + viewDir);
 float specular = pow(max(dot(normal, halfDir), 0.0), 32.0);
-if (u_shape_type <= 0.5) {
+if (u_flat_shading > 0.5) {
 color += v_displacement_amount * u_highlights;
 float heightShadow = 1.0 - v_displacement_amount;
 color -= heightShadow * heightShadow * u_shadows;
@@ -204,7 +204,7 @@ color += u_fresnel_color * fresnel * u_fresnel_intensity;
 }
 if (u_vignette_intensity > 0.0) {
 vec2 vigUv = vUv;
-if (u_shape_type > 0.5) {
+if (u_flat_shading < 0.5) {
 vigUv = (v_new_position.xy / v_new_position.w) * 0.5 + vec2(0.5);
 }
 float dist = length(vigUv - vec2(0.5));
@@ -219,7 +219,7 @@ color += color * bloomMask * u_bloom_intensity;
 if (u_chromatic_aberration > 0.0) {
 float caAmount = u_chromatic_aberration * 0.008;
 vec2 caUv = vUv;
-if (u_shape_type > 0.5) {
+if (u_flat_shading < 0.5) {
 caUv = (v_new_position.xy / v_new_position.w) * 0.5 + vec2(0.5);
 }
 float dist = length(caUv - vec2(0.5));
@@ -231,7 +231,7 @@ color.b *= 1.0 - bShift * caAmount * 10.0;
 float grain = 0.0;
 if (u_grain_intensity > 0.0) {
 vec2 noiseCoords = gl_FragCoord.xy / u_grain_scale;
-if (u_grain_speed != 0.0 || u_shape_type <= 0.5) {
+if (u_grain_speed != 0.0 || u_flat_shading > 0.5) {
 grain = fbm(vec3(noiseCoords, u_time * u_grain_speed));
 } else {
 grain = random(noiseCoords) - 0.5;
@@ -243,7 +243,7 @@ grain *= u_grain_intensity;
 }
 color += vec3(grain);
 float edgeAlpha = 1.0;
-if (u_shape_type > 0.5) {
+if (u_silhouette_fade > 0.0 && u_flat_shading < 0.5) {
 edgeAlpha = smoothstep(0.0, u_silhouette_fade, ndotv);
 }
 if (u_shape_type == 3.0) {
@@ -257,7 +257,7 @@ edgeAlpha *= uFade * vFade;
 edgeAlpha *= texAlpha;
 gl_FragColor = vec4(color, edgeAlpha);
 }`;
-function ft() {
+function dt() {
   return `precision highp float;
 attribute vec3 position;
 attribute vec3 normal;
@@ -301,9 +301,10 @@ uniform float u_fresnel_enabled;
 uniform float u_fresnel_power;
 uniform float u_fresnel_intensity;
 uniform vec3 u_fresnel_color;
-uniform float u_shape_type;`;
+uniform float u_shape_type;
+uniform float u_flat_shading;`;
 }
-function dt() {
+function mt() {
   return `precision highp float;
 varying vec2 vUv;
 varying vec2 vFlowUv;
@@ -351,9 +352,10 @@ uniform float u_shape_type;
 uniform float u_transparent_texture_void;
 uniform float u_silhouette_fade;
 uniform float u_cylinder_fade;
-uniform float u_ribbon_fade;`;
+uniform float u_ribbon_fade;
+uniform float u_flat_shading;`;
 }
-function oe() {
+function se() {
   return `vec4 permute(vec4 x) {
 return floor(fract(sin(x) * 43758.5453123) * 289.0);
 }
@@ -497,23 +499,27 @@ class he {
       1
     ]);
   }
+  identity() {
+    const e = this.elements;
+    return e[0] = 1, e[1] = 0, e[2] = 0, e[3] = 0, e[4] = 0, e[5] = 1, e[6] = 0, e[7] = 0, e[8] = 0, e[9] = 0, e[10] = 1, e[11] = 0, e[12] = 0, e[13] = 0, e[14] = 0, e[15] = 1, this;
+  }
   translate(e, i, r) {
     return this.elements[12] += this.elements[0] * e + this.elements[4] * i + this.elements[8] * r, this.elements[13] += this.elements[1] * e + this.elements[5] * i + this.elements[9] * r, this.elements[14] += this.elements[2] * e + this.elements[6] * i + this.elements[10] * r, this.elements[15] += this.elements[3] * e + this.elements[7] * i + this.elements[11] * r, this;
   }
   rotateX(e) {
-    const i = Math.cos(e), r = Math.sin(e), t = this.elements[4], y = this.elements[5], x = this.elements[6], o = this.elements[7], l = this.elements[8], _ = this.elements[9], b = this.elements[10], a = this.elements[11];
-    return this.elements[4] = i * t + r * l, this.elements[5] = i * y + r * _, this.elements[6] = i * x + r * b, this.elements[7] = i * o + r * a, this.elements[8] = i * l - r * t, this.elements[9] = i * _ - r * y, this.elements[10] = i * b - r * x, this.elements[11] = i * a - r * o, this;
+    const i = Math.cos(e), r = Math.sin(e), t = this.elements[4], y = this.elements[5], v = this.elements[6], s = this.elements[7], l = this.elements[8], _ = this.elements[9], b = this.elements[10], a = this.elements[11];
+    return this.elements[4] = i * t + r * l, this.elements[5] = i * y + r * _, this.elements[6] = i * v + r * b, this.elements[7] = i * s + r * a, this.elements[8] = i * l - r * t, this.elements[9] = i * _ - r * y, this.elements[10] = i * b - r * v, this.elements[11] = i * a - r * s, this;
   }
   rotateY(e) {
-    const i = Math.cos(e), r = Math.sin(e), t = this.elements[0], y = this.elements[1], x = this.elements[2], o = this.elements[3], l = this.elements[8], _ = this.elements[9], b = this.elements[10], a = this.elements[11];
-    return this.elements[0] = i * t - r * l, this.elements[1] = i * y - r * _, this.elements[2] = i * x - r * b, this.elements[3] = i * o - r * a, this.elements[8] = r * t + i * l, this.elements[9] = r * y + i * _, this.elements[10] = r * x + i * b, this.elements[11] = r * o + i * a, this;
+    const i = Math.cos(e), r = Math.sin(e), t = this.elements[0], y = this.elements[1], v = this.elements[2], s = this.elements[3], l = this.elements[8], _ = this.elements[9], b = this.elements[10], a = this.elements[11];
+    return this.elements[0] = i * t - r * l, this.elements[1] = i * y - r * _, this.elements[2] = i * v - r * b, this.elements[3] = i * s - r * a, this.elements[8] = r * t + i * l, this.elements[9] = r * y + i * _, this.elements[10] = r * v + i * b, this.elements[11] = r * s + i * a, this;
   }
   rotateZ(e) {
-    const i = Math.cos(e), r = Math.sin(e), t = this.elements[0], y = this.elements[1], x = this.elements[2], o = this.elements[3], l = this.elements[4], _ = this.elements[5], b = this.elements[6], a = this.elements[7];
-    return this.elements[0] = i * t + r * l, this.elements[1] = i * y + r * _, this.elements[2] = i * x + r * b, this.elements[3] = i * o + r * a, this.elements[4] = -r * t + i * l, this.elements[5] = -r * y + i * _, this.elements[6] = -r * x + i * b, this.elements[7] = -r * o + i * a, this;
+    const i = Math.cos(e), r = Math.sin(e), t = this.elements[0], y = this.elements[1], v = this.elements[2], s = this.elements[3], l = this.elements[4], _ = this.elements[5], b = this.elements[6], a = this.elements[7];
+    return this.elements[0] = i * t + r * l, this.elements[1] = i * y + r * _, this.elements[2] = i * v + r * b, this.elements[3] = i * s + r * a, this.elements[4] = -r * t + i * l, this.elements[5] = -r * y + i * _, this.elements[6] = -r * v + i * b, this.elements[7] = -r * s + i * a, this;
   }
 }
-class mt {
+class pt {
   left;
   right;
   top;
@@ -523,11 +529,11 @@ class mt {
   position;
   projectionMatrix;
   zoom;
-  constructor(e, i, r, t, y, x) {
-    this.left = e, this.right = i, this.top = r, this.bottom = t, this.near = y, this.far = x, this.position = [0, 0, 0], this.zoom = 1, this.projectionMatrix = new he(), this.updateProjectionMatrix();
+  constructor(e, i, r, t, y, v) {
+    this.left = e, this.right = i, this.top = r, this.bottom = t, this.near = y, this.far = v, this.position = [0, 0, 0], this.zoom = 1, this.projectionMatrix = new he(), this.updateProjectionMatrix();
   }
   updateProjectionMatrix() {
-    const e = 1 / (this.right - this.left), i = 1 / (this.top - this.bottom), r = 1 / (this.far - this.near), t = (this.right + this.left) * e, y = (this.top + this.bottom) * i, x = (this.far + this.near) * r;
+    const e = 1 / (this.right - this.left), i = 1 / (this.top - this.bottom), r = 1 / (this.far - this.near), t = (this.right + this.left) * e, y = (this.top + this.bottom) * i, v = (this.far + this.near) * r;
     this.projectionMatrix.elements = new Float32Array([
       2 * e,
       0,
@@ -543,184 +549,184 @@ class mt {
       0,
       -t,
       -y,
-      -x,
+      -v,
       1
     ]);
   }
 }
-function G(s, e, i, r = 50, t = 50, y = "plane", x = 1) {
-  s.zoom = x;
-  const o = e / i;
+function j(n, e, i, r = 50, t = 50, y = "plane", v = 1) {
+  n.zoom = v;
+  const s = e / i;
   if (y === "plane") {
-    const b = e * i / 1e6 * r * t / 1.5, a = Math.sqrt(b * o), h = b / a;
-    let p = -r / 2, c = Math.min((p + a) / 1.5, r / 2), f = t / 4, R = Math.max((f - h) / 2, -t / 4);
-    if (o < 1) {
-      const g = o;
+    const b = e * i / 1e6 * r * t / 1.5, a = Math.sqrt(b * s), h = b / a;
+    let p = -r / 2, c = Math.min((p + a) / 1.5, r / 2), d = t / 4, R = Math.max((d - h) / 2, -t / 4);
+    if (s < 1) {
+      const g = s;
       p = p * g, c = c * g;
-      const v = 1.05;
-      p = p * v, c = c * v, f = f * v, R = R * v;
+      const x = 1.05;
+      p = p * x, c = c * x, d = d * x, R = R * x;
     }
-    s.left = p, s.right = c, s.top = f, s.bottom = R;
+    n.left = p, n.right = c, n.top = d, n.bottom = R;
   } else {
     let l = 25;
-    if (y === "sphere" ? l = 30 : y === "torus" ? l = 35 : y === "cylinder" && (l = 30), o >= 1)
-      s.left = -l * o, s.right = l * o, s.top = l, s.bottom = -l;
+    if (y === "sphere" ? l = 30 : y === "torus" ? l = 35 : y === "cylinder" && (l = 30), s >= 1)
+      n.left = -l * s, n.right = l * s, n.top = l, n.bottom = -l;
     else {
-      s.left = -l, s.right = l, s.top = l / o, s.bottom = -l / o;
+      n.left = -l, n.right = l, n.top = l / s, n.bottom = -l / s;
       const _ = 1.05;
-      s.left *= _, s.right *= _, s.top *= _, s.bottom *= _;
+      n.left *= _, n.right *= _, n.top *= _, n.bottom *= _;
     }
   }
-  s.left /= x, s.right /= x, s.top /= x, s.bottom /= x, s.near = -100, s.far = 1e3, s.updateProjectionMatrix();
+  n.left /= v, n.right /= v, n.top /= v, n.bottom /= v, n.near = -100, n.far = 1e3, n.updateProjectionMatrix();
 }
-function se(s, e, i, r) {
-  const t = s / 2, y = e / 2, x = Math.floor(i), o = Math.floor(r), l = x + 1, _ = o + 1, b = s / x, a = e / o, h = [], p = [], c = [], f = [];
-  for (let v = 0; v < _; v++) {
-    const w = v * a - y;
+function oe(n, e, i, r) {
+  const t = n / 2, y = e / 2, v = Math.floor(i), s = Math.floor(r), l = v + 1, _ = s + 1, b = n / v, a = e / s, h = [], p = [], c = [], d = [];
+  for (let x = 0; x < _; x++) {
+    const w = x * a - y;
     for (let u = 0; u < l; u++) {
       const T = u * b - t;
-      p.push(T, -w, 0), c.push(0, 0, 1), f.push(u / x), f.push(1 - v / o);
+      p.push(T, -w, 0), c.push(0, 0, 1), d.push(u / v), d.push(1 - x / s);
     }
   }
-  for (let v = 0; v < o; v++)
-    for (let w = 0; w < x; w++) {
-      const u = w + l * v, T = w + l * (v + 1), A = w + 1 + l * (v + 1), C = w + 1 + l * v;
-      h.push(u, T, C), h.push(T, A, C);
+  for (let x = 0; x < s; x++)
+    for (let w = 0; w < v; w++) {
+      const u = w + l * x, T = w + l * (x + 1), A = w + 1 + l * (x + 1), D = w + 1 + l * x;
+      h.push(u, T, D), h.push(T, A, D);
     }
   const R = p.length / 3 > 65535, g = [];
-  for (let v = 0; v < h.length; v += 3) {
-    const w = h[v], u = h[v + 1], T = h[v + 2];
+  for (let x = 0; x < h.length; x += 3) {
+    const w = h[x], u = h[x + 1], T = h[x + 2];
     g.push(w, u, u, T, T, w);
   }
   return {
     position: new Float32Array(p),
     normal: new Float32Array(c),
-    uv: new Float32Array(f),
+    uv: new Float32Array(d),
     index: R ? new Uint32Array(h) : new Uint16Array(h),
     wireframeIndex: R ? new Uint32Array(g) : new Uint16Array(g)
   };
 }
-function ne(s, e, i) {
-  const r = [], t = [], y = [], x = [], o = Math.floor(e), l = Math.floor(i);
+function ne(n, e, i) {
+  const r = [], t = [], y = [], v = [], s = Math.floor(e), l = Math.floor(i);
   for (let a = 0; a <= l; a++) {
     const h = a / l, p = h * Math.PI;
-    for (let c = 0; c <= o; c++) {
-      const f = c / o, R = f * Math.PI * 2, g = -s * Math.sin(p) * Math.cos(R), v = s * Math.cos(p), w = s * Math.sin(p) * Math.sin(R);
-      r.push(g, v, w);
-      const u = Math.sqrt(g * g + v * v + w * w);
-      t.push(g / u, v / u, w / u), y.push(f, 1 - h);
+    for (let c = 0; c <= s; c++) {
+      const d = c / s, R = d * Math.PI * 2, g = -n * Math.sin(p) * Math.cos(R), x = n * Math.cos(p), w = n * Math.sin(p) * Math.sin(R);
+      r.push(g, x, w);
+      const u = Math.sqrt(g * g + x * x + w * w);
+      t.push(g / u, x / u, w / u), y.push(d, 1 - h);
     }
   }
   for (let a = 0; a < l; a++)
-    for (let h = 0; h < o; h++) {
-      const p = h + (o + 1) * a, c = h + (o + 1) * (a + 1), f = h + 1 + (o + 1) * (a + 1), R = h + 1 + (o + 1) * a;
-      x.push(p, c, R), x.push(c, f, R);
+    for (let h = 0; h < s; h++) {
+      const p = h + (s + 1) * a, c = h + (s + 1) * (a + 1), d = h + 1 + (s + 1) * (a + 1), R = h + 1 + (s + 1) * a;
+      v.push(p, c, R), v.push(c, d, R);
     }
   const _ = r.length / 3 > 65535, b = [];
-  for (let a = 0; a < x.length; a += 3) {
-    const h = x[a], p = x[a + 1], c = x[a + 2];
+  for (let a = 0; a < v.length; a += 3) {
+    const h = v[a], p = v[a + 1], c = v[a + 2];
     b.push(h, p, p, c, c, h);
   }
   return {
     position: new Float32Array(r),
     normal: new Float32Array(t),
     uv: new Float32Array(y),
-    index: _ ? new Uint32Array(x) : new Uint16Array(x),
+    index: _ ? new Uint32Array(v) : new Uint16Array(v),
     wireframeIndex: _ ? new Uint32Array(b) : new Uint16Array(b)
   };
 }
-function ae(s, e, i, r) {
-  const t = [], y = [], x = [], o = [], l = Math.floor(i), _ = Math.floor(r);
+function ae(n, e, i, r) {
+  const t = [], y = [], v = [], s = [], l = Math.floor(i), _ = Math.floor(r);
   for (let h = 0; h <= l; h++) {
     const p = h / l * Math.PI * 2;
     for (let c = 0; c <= _; c++) {
-      const f = c / _ * Math.PI * 2, R = (s + e * Math.cos(p)) * Math.cos(f), g = (s + e * Math.cos(p)) * Math.sin(f), v = e * Math.sin(p);
-      t.push(R, g, v);
-      const w = s * Math.cos(f), u = s * Math.sin(f), T = R - w, A = g - u, C = v, m = Math.sqrt(T * T + A * A + C * C);
-      y.push(T / m, A / m, C / m), x.push(c / _, h / l);
+      const d = c / _ * Math.PI * 2, R = (n + e * Math.cos(p)) * Math.cos(d), g = (n + e * Math.cos(p)) * Math.sin(d), x = e * Math.sin(p);
+      t.push(R, g, x);
+      const w = n * Math.cos(d), u = n * Math.sin(d), T = R - w, A = g - u, D = x, m = Math.sqrt(T * T + A * A + D * D);
+      y.push(T / m, A / m, D / m), v.push(c / _, h / l);
     }
   }
   for (let h = 1; h <= l; h++)
     for (let p = 1; p <= _; p++) {
-      const c = (_ + 1) * h + p - 1, f = (_ + 1) * (h - 1) + p - 1, R = (_ + 1) * (h - 1) + p, g = (_ + 1) * h + p;
-      o.push(c, f, g), o.push(f, R, g);
+      const c = (_ + 1) * h + p - 1, d = (_ + 1) * (h - 1) + p - 1, R = (_ + 1) * (h - 1) + p, g = (_ + 1) * h + p;
+      s.push(c, d, g), s.push(d, R, g);
     }
   const b = t.length / 3 > 65535, a = [];
-  for (let h = 0; h < o.length; h += 3) {
-    const p = o[h], c = o[h + 1], f = o[h + 2];
-    a.push(p, c, c, f, f, p);
+  for (let h = 0; h < s.length; h += 3) {
+    const p = s[h], c = s[h + 1], d = s[h + 2];
+    a.push(p, c, c, d, d, p);
   }
   return {
     position: new Float32Array(t),
     normal: new Float32Array(y),
-    uv: new Float32Array(x),
-    index: b ? new Uint32Array(o) : new Uint16Array(o),
+    uv: new Float32Array(v),
+    index: b ? new Uint32Array(s) : new Uint16Array(s),
     wireframeIndex: b ? new Uint32Array(a) : new Uint16Array(a)
   };
 }
-function le(s, e, i, r, t) {
-  const y = [], x = [], o = [], l = [], _ = Math.floor(r), b = Math.floor(t), a = i / 2;
+function le(n, e, i, r, t) {
+  const y = [], v = [], s = [], l = [], _ = Math.floor(r), b = Math.floor(t), a = i / 2;
   for (let c = 0; c <= b; c++) {
-    const f = c / b, R = f * i - a, g = f * (e - s) + s;
-    for (let v = 0; v <= _; v++) {
-      const w = v / _, u = w * Math.PI * 2, T = Math.sin(u), A = Math.cos(u);
-      y.push(g * T, -R, g * A), x.push(T, 0, A), o.push(w, 1 - f);
+    const d = c / b, R = d * i - a, g = d * (e - n) + n;
+    for (let x = 0; x <= _; x++) {
+      const w = x / _, u = w * Math.PI * 2, T = Math.sin(u), A = Math.cos(u);
+      y.push(g * T, -R, g * A), v.push(T, 0, A), s.push(w, 1 - d);
     }
   }
   for (let c = 0; c < b; c++)
-    for (let f = 0; f < _; f++) {
-      const R = f + (_ + 1) * c, g = f + (_ + 1) * (c + 1), v = f + 1 + (_ + 1) * (c + 1), w = f + 1 + (_ + 1) * c;
-      l.push(R, g, w), l.push(g, v, w);
+    for (let d = 0; d < _; d++) {
+      const R = d + (_ + 1) * c, g = d + (_ + 1) * (c + 1), x = d + 1 + (_ + 1) * (c + 1), w = d + 1 + (_ + 1) * c;
+      l.push(R, g, w), l.push(g, x, w);
     }
   const h = y.length / 3 > 65535, p = [];
   for (let c = 0; c < l.length; c += 3) {
-    const f = l[c], R = l[c + 1], g = l[c + 2];
-    p.push(f, R, R, g, g, f);
+    const d = l[c], R = l[c + 1], g = l[c + 2];
+    p.push(d, R, R, g, g, d);
   }
   return {
     position: new Float32Array(y),
-    normal: new Float32Array(x),
-    uv: new Float32Array(o),
+    normal: new Float32Array(v),
+    uv: new Float32Array(s),
     index: h ? new Uint32Array(l) : new Uint16Array(l),
     wireframeIndex: h ? new Uint32Array(p) : new Uint16Array(p)
   };
 }
-function ue(s, e, i, r, t, y) {
-  const x = s / 2, o = e / 2, l = Math.floor(i), _ = Math.floor(r), b = l + 1, a = _ + 1, h = s / l, p = e / _, c = [], f = [], R = [], g = [];
+function ue(n, e, i, r, t, y) {
+  const v = n / 2, s = e / 2, l = Math.floor(i), _ = Math.floor(r), b = l + 1, a = _ + 1, h = n / l, p = e / _, c = [], d = [], R = [], g = [];
   for (let u = 0; u < a; u++) {
-    const T = u * p - o;
+    const T = u * p - s;
     for (let A = 0; A < b; A++) {
-      const C = A * h - x;
-      let m = C, F = T, D = 0, z = 0, M = 0, P = 1;
+      const D = A * h - v;
+      let m = D, F = T, C = 0, z = 0, M = 0, P = 1;
       if (Math.abs(t) > 1e-3) {
-        const E = s / t, S = C / E;
-        m = E * Math.sin(S), D = E * (1 - Math.cos(S)), z = Math.sin(S), P = Math.cos(S);
+        const E = n / t, S = D / E;
+        m = E * Math.sin(S), C = E * (1 - Math.cos(S)), z = Math.sin(S), P = Math.cos(S);
       }
       if (Math.abs(y) > 1e-3) {
-        const E = T / e * y, S = Math.cos(E), U = Math.sin(E), B = m * S - D * U, W = m * U + D * S;
-        m = B, D = W;
-        const I = z * S - P * U, O = z * U + P * S;
-        z = I, P = O;
+        const E = T / e * y, S = Math.cos(E), U = Math.sin(E), B = m * S - C * U, O = m * U + C * S;
+        m = B, C = O;
+        const I = z * S - P * U, Y = z * U + P * S;
+        z = I, P = Y;
       }
-      c.push(m, -F, D), f.push(z, M, P), R.push(A / l), R.push(1 - u / _);
+      c.push(m, -F, C), d.push(z, M, P), R.push(A / l), R.push(1 - u / _);
     }
   }
   for (let u = 0; u < _; u++)
     for (let T = 0; T < l; T++) {
-      const A = T + b * u, C = T + b * (u + 1), m = T + 1 + b * (u + 1), F = T + 1 + b * u;
-      g.push(A, C, F), g.push(C, m, F);
+      const A = T + b * u, D = T + b * (u + 1), m = T + 1 + b * (u + 1), F = T + 1 + b * u;
+      g.push(A, D, F), g.push(D, m, F);
     }
-  const v = c.length / 3 > 65535, w = [];
+  const x = c.length / 3 > 65535, w = [];
   for (let u = 0; u < g.length; u += 3) {
-    const T = g[u], A = g[u + 1], C = g[u + 2];
-    w.push(T, A, A, C, C, T);
+    const T = g[u], A = g[u + 1], D = g[u + 2];
+    w.push(T, A, A, D, D, T);
   }
   return {
     position: new Float32Array(c),
-    normal: new Float32Array(f),
+    normal: new Float32Array(d),
     uv: new Float32Array(R),
-    index: v ? new Uint32Array(g) : new Uint16Array(g),
-    wireframeIndex: v ? new Uint32Array(w) : new Uint16Array(w)
+    index: x ? new Uint32Array(g) : new Uint16Array(g),
+    wireframeIndex: x ? new Uint32Array(w) : new Uint16Array(w)
   };
 }
 console.info(
@@ -733,8 +739,8 @@ https://neat.firecms.co`,
   "font-weight: bold; font-size: 14px; color: #FF5772;",
   "color: inherit;"
 );
-const N = 50, Y = 80, j = 6, pt = xt();
-class bt {
+const X = 50, N = 80, $ = 6, gt = xt();
+class wt {
   _ref;
   _speed = -1;
   _horizontalPressure = -1;
@@ -791,6 +797,7 @@ class bt {
   _silhouetteFade = 0.25;
   _cylinderFade = 0.08;
   _ribbonFade = 0.05;
+  _flatShading = !0;
   _shapeType = "plane";
   _shapeRotationX = 0;
   _shapeRotationY = 0;
@@ -837,14 +844,19 @@ class bt {
   _colorsChanged = !0;
   _uniformsDirty = !0;
   _textureDirty = !0;
+  _yOffsetDirty = !1;
+  _modelViewMatrix = new he();
+  _isVisible = !0;
+  _visibilityObserver = null;
+  _visibilityHandler = null;
   constructor(e) {
     const {
       ref: i,
       speed: r = 4,
       horizontalPressure: t = 3,
       verticalPressure: y = 3,
-      waveFrequencyX: x = 5,
-      waveFrequencyY: o = 5,
+      waveFrequencyX: v = 5,
+      waveFrequencyY: s = 5,
       waveAmplitude: l = 3,
       colors: _,
       highlights: b = 4,
@@ -852,18 +864,18 @@ class bt {
       colorSaturation: h = 0,
       colorBrightness: p = 1,
       colorBlending: c = 5,
-      grainScale: f = 2,
+      grainScale: d = 2,
       grainIntensity: R = 0.55,
       grainSparsity: g = 0,
-      grainSpeed: v = 0.1,
+      grainSpeed: x = 0.1,
       wireframe: w = !1,
       backgroundColor: u = "#FFFFFF",
       backgroundAlpha: T = 1,
       resolution: A = 1,
-      seed: C,
+      seed: D,
       yOffset: m = 0,
       yOffsetWaveMultiplier: F = 4,
-      yOffsetColorMultiplier: D = 4,
+      yOffsetColorMultiplier: C = 4,
       yOffsetFlowMultiplier: z = 4,
       flowDistortionA: M = 0,
       flowDistortionB: P = 0,
@@ -871,17 +883,17 @@ class bt {
       flowEase: S = 0,
       flowEnabled: U = !0,
       enableProceduralTexture: B = !1,
-      textureVoidLikelihood: W = 0.45,
+      textureVoidLikelihood: O = 0.45,
       textureVoidWidthMin: I = 200,
-      textureVoidWidthMax: O = 486,
+      textureVoidWidthMax: Y = 486,
       textureBandDensity: fe = 2.15,
       textureColorBlending: de = 0.01,
       textureSeed: me = 333,
       textureEase: pe = 0.5,
       proceduralBackgroundColor: ge = "#000000",
       transparentTextureVoid: ye = !1,
-      textureShapeTriangles: xe = 20,
-      textureShapeCircles: ve = 15,
+      textureShapeTriangles: ve = 20,
+      textureShapeCircles: xe = 15,
       textureShapeBars: be = 15,
       textureShapeSquiggles: we = 10,
       domainWarpEnabled: Se = !1,
@@ -891,91 +903,100 @@ class bt {
       vignetteRadius: Ae = 0.8,
       fresnelEnabled: Fe = !1,
       fresnelPower: ze = 2,
-      fresnelIntensity: Ce = 0.5,
+      fresnelIntensity: De = 0.5,
       fresnelColor: Me = "#FFFFFF",
-      iridescenceEnabled: De = !1,
+      iridescenceEnabled: Ce = !1,
       iridescenceIntensity: Pe = 0.5,
       iridescenceSpeed: Ue = 1,
       bloomIntensity: Ie = 0,
       bloomThreshold: Be = 0.7,
       chromaticAberration: Le = 0,
-      silhouetteFade: We = 0.25,
-      cylinderFade: Xe = 0.08,
-      ribbonFade: Ne = 0.05,
+      silhouetteFade: Oe = 0.25,
+      cylinderFade: We = 0.08,
+      ribbonFade: Xe = 0.05,
+      flatShading: Ne = !0,
       cameraLock: Ye = !1,
-      cameraX: Oe = 0,
-      cameraY: ke = 0,
-      cameraZ: Ve = 0,
-      cameraRotationX: qe = 0,
-      cameraRotationY: Ze = 0,
+      cameraX: ke = 0,
+      cameraY: Ve = 0,
+      cameraZ: qe = 0,
+      cameraRotationX: Ze = 0,
+      cameraRotationY: He = 0,
       cameraRotationZ: Ge = 0,
       cameraZoom: je = 1,
-      shapeType: He = "plane",
-      shapeRotationX: $e = 0,
-      shapeRotationY: Ke = 0,
-      shapeRotationZ: Je = 0,
-      shapeAutoRotateSpeedX: Qe = 0,
-      shapeAutoRotateSpeedY: et = 0,
-      sphereRadius: tt = 15,
-      torusRadius: it = 15,
-      torusTube: ot = 5,
-      cylinderRadius: rt = 10,
-      cylinderHeight: st = 40,
-      planeBend: nt = 0,
-      planeTwist: at = 0
+      shapeType: $e = "plane",
+      shapeRotationX: Ke = 0,
+      shapeRotationY: Je = 0,
+      shapeRotationZ: Qe = 0,
+      shapeAutoRotateSpeedX: et = 0,
+      shapeAutoRotateSpeedY: tt = 0,
+      sphereRadius: it = 15,
+      torusRadius: st = 15,
+      torusTube: rt = 5,
+      cylinderRadius: ot = 10,
+      cylinderHeight: nt = 40,
+      planeBend: at = 0,
+      planeTwist: lt = 0
     } = e;
-    this._ref = i, this.destroy = this.destroy.bind(this), this._initScene = this._initScene.bind(this), this.speed = r, this.horizontalPressure = t, this.verticalPressure = y, this.waveFrequencyX = x, this.waveFrequencyY = o, this.waveAmplitude = l, this.colorBlending = c, this._resolution = A, this.grainScale = f, this.grainIntensity = R, this.grainSparsity = g, this.grainSpeed = v, this.colors = _, this.shadows = a, this.highlights = b, this.colorSaturation = h, this.colorBrightness = p, this.wireframe = w, this.backgroundColor = u, this.backgroundAlpha = T, this.yOffset = m, this.yOffsetWaveMultiplier = F, this.yOffsetColorMultiplier = D, this.yOffsetFlowMultiplier = z, this.flowDistortionA = M, this.flowDistortionB = P, this.flowScale = E, this.flowEase = S, this.flowEnabled = U, this.enableProceduralTexture = B, this.textureVoidLikelihood = W, this.textureVoidWidthMin = I, this.textureVoidWidthMax = O, this.textureBandDensity = fe, this.textureColorBlending = de, this.textureSeed = me, this.textureEase = pe, this._proceduralBackgroundColor = ge, this.transparentTextureVoid = ye, this._textureShapeTriangles = xe, this._textureShapeCircles = ve, this._textureShapeBars = be, this._textureShapeSquiggles = we, this.domainWarpEnabled = Se, this.domainWarpIntensity = Re, this.domainWarpScale = Te, this.vignetteIntensity = Ee, this.vignetteRadius = Ae, this.fresnelEnabled = Fe, this.fresnelPower = ze, this.fresnelIntensity = Ce, this.fresnelColor = Me, this.iridescenceEnabled = De, this.iridescenceIntensity = Pe, this.iridescenceSpeed = Ue, this.bloomIntensity = Ie, this.bloomThreshold = Be, this.chromaticAberration = Le, this.silhouetteFade = We, this.cylinderFade = Xe, this.ribbonFade = Ne, this._cameraLock = Ye, this._cameraX = Oe, this._cameraY = ke, this._cameraZ = Ve, this._cameraRotationX = qe, this._cameraRotationY = Ze, this._cameraRotationZ = Ge, this._cameraZoom = je, this._shapeType = He, this._shapeRotationX = $e, this._shapeRotationY = Ke, this._shapeRotationZ = Je, this._shapeAutoRotateSpeedX = Qe, this._shapeAutoRotateSpeedY = et, this._sphereRadius = tt, this._torusRadius = it, this._torusTube = ot, this._cylinderRadius = rt, this._cylinderHeight = st, this._planeBend = nt, this._planeTwist = at, this.glState = this._initScene(A), vt();
-    let q = C !== void 0 ? C : yt(), K = performance.now();
-    const J = () => {
-      const { gl: n, program: Z, locations: d, indexCount: k, indexType: V } = this.glState;
-      if (this._linkCheckCounter++, this._linkCheckCounter >= 300 && (this._linkCheckCounter = 0, (!this._linkElement || !document.contains(this._linkElement)) && (this._linkElement = gt(i))), this._initialized) {
+    this._ref = i, this.destroy = this.destroy.bind(this), this._initScene = this._initScene.bind(this), this.speed = r, this.horizontalPressure = t, this.verticalPressure = y, this.waveFrequencyX = v, this.waveFrequencyY = s, this.waveAmplitude = l, this.colorBlending = c, this._resolution = A, this.grainScale = d, this.grainIntensity = R, this.grainSparsity = g, this.grainSpeed = x, this.colors = _, this.shadows = a, this.highlights = b, this.colorSaturation = h, this.colorBrightness = p, this.wireframe = w, this.backgroundColor = u, this.backgroundAlpha = T, this.yOffset = m, this.yOffsetWaveMultiplier = F, this.yOffsetColorMultiplier = C, this.yOffsetFlowMultiplier = z, this.flowDistortionA = M, this.flowDistortionB = P, this.flowScale = E, this.flowEase = S, this.flowEnabled = U, this.enableProceduralTexture = B, this.textureVoidLikelihood = O, this.textureVoidWidthMin = I, this.textureVoidWidthMax = Y, this.textureBandDensity = fe, this.textureColorBlending = de, this.textureSeed = me, this.textureEase = pe, this._proceduralBackgroundColor = ge, this.transparentTextureVoid = ye, this._textureShapeTriangles = ve, this._textureShapeCircles = xe, this._textureShapeBars = be, this._textureShapeSquiggles = we, this.domainWarpEnabled = Se, this.domainWarpIntensity = Re, this.domainWarpScale = Te, this.vignetteIntensity = Ee, this.vignetteRadius = Ae, this.fresnelEnabled = Fe, this.fresnelPower = ze, this.fresnelIntensity = De, this.fresnelColor = Me, this.iridescenceEnabled = Ce, this.iridescenceIntensity = Pe, this.iridescenceSpeed = Ue, this.bloomIntensity = Ie, this.bloomThreshold = Be, this.chromaticAberration = Le, this.silhouetteFade = Oe, this.cylinderFade = We, this.ribbonFade = Xe, this._flatShading = Ne, this._cameraLock = Ye, this._cameraX = ke, this._cameraY = Ve, this._cameraZ = qe, this._cameraRotationX = Ze, this._cameraRotationY = He, this._cameraRotationZ = Ge, this._cameraZoom = je, this._shapeType = $e, this._shapeRotationX = Ke, this._shapeRotationY = Je, this._shapeRotationZ = Qe, this._shapeAutoRotateSpeedX = et, this._shapeAutoRotateSpeedY = tt, this._sphereRadius = it, this._torusRadius = st, this._torusTube = rt, this._cylinderRadius = ot, this._cylinderHeight = nt, this._planeBend = at, this._planeTwist = lt, this.glState = this._initScene(A), bt();
+    let Z = D !== void 0 ? D : vt(), H = performance.now();
+    const G = () => {
+      const { gl: o, program: k, locations: f, indexCount: V, indexType: q } = this.glState;
+      if (this._linkCheckCounter++, this._linkCheckCounter >= 300 && (this._linkCheckCounter = 0, (!this._linkElement || !document.contains(this._linkElement)) && (this._linkElement = yt(i))), this._initialized) {
         const Q = performance.now();
-        q += (Q - K) / 1e3 * this._speed, K = Q, n.useProgram(Z), n.uniform1f(d.uniforms.u_time, q);
-        const H = this.glState.camera, X = new he();
-        X.translate(
-          -H.position[0] - this._cameraX,
-          -H.position[1] - this._cameraY,
-          -H.position[2] - this._cameraZ
-        ), X.translate(0, 0, -1), X.rotateX(-this._cameraRotationX), X.rotateY(-this._cameraRotationY), X.rotateZ(-this._cameraRotationZ);
-        let $ = this._shapeRotationX, ee = this._shapeRotationY, ut = this._shapeRotationZ;
-        this._shapeAutoRotateSpeedX !== 0 && ($ += q * this._shapeAutoRotateSpeedX * 0.1), this._shapeAutoRotateSpeedY !== 0 && (ee += q * this._shapeAutoRotateSpeedY * 0.1), this._shapeType === "plane" || this._shapeType === "ribbon" ? X.rotateX($ - Math.PI / 3.5) : X.rotateX($), X.rotateY(ee), X.rotateZ(ut);
-        const te = d.uniforms.modelViewMatrix;
-        if (te && n.uniformMatrix4fv(te, !1, X.elements), this._uniformsDirty) {
-          n.uniform2f(d.uniforms.u_resolution, this._ref.clientWidth, this._ref.clientHeight), n.uniform2f(d.uniforms.u_color_pressure, this._horizontalPressure, this._verticalPressure), n.uniform1f(d.uniforms.u_wave_frequency_x, this._waveFrequencyX), n.uniform1f(d.uniforms.u_wave_frequency_y, this._waveFrequencyY), n.uniform1f(d.uniforms.u_wave_amplitude, this._waveAmplitude), n.uniform1f(d.uniforms.u_color_blending, this._colorBlending), n.uniform1f(d.uniforms.u_shadows, this._shadows), n.uniform1f(d.uniforms.u_highlights, this._highlights), n.uniform1f(d.uniforms.u_saturation, this._saturation), n.uniform1f(d.uniforms.u_brightness, this._brightness), n.uniform1f(d.uniforms.u_grain_intensity, this._grainIntensity), n.uniform1f(d.uniforms.u_grain_sparsity, this._grainSparsity), n.uniform1f(d.uniforms.u_grain_speed, this._grainSpeed), n.uniform1f(d.uniforms.u_grain_scale, this._grainScale), n.uniform1f(d.uniforms.u_y_offset, this._yOffset), n.uniform1f(d.uniforms.u_y_offset_wave_multiplier, this._yOffsetWaveMultiplier), n.uniform1f(d.uniforms.u_y_offset_color_multiplier, this._yOffsetColorMultiplier), n.uniform1f(d.uniforms.u_y_offset_flow_multiplier, this._yOffsetFlowMultiplier), n.uniform1f(d.uniforms.u_flow_distortion_a, this._flowDistortionA), n.uniform1f(d.uniforms.u_flow_distortion_b, this._flowDistortionB), n.uniform1f(d.uniforms.u_flow_scale, this._flowScale), n.uniform1f(d.uniforms.u_flow_ease, this._flowEase), n.uniform1f(d.uniforms.u_flow_enabled, this._flowEnabled ? 1 : 0);
+        Z += (Q - H) / 1e3 * this._speed, H = Q, o.useProgram(k), o.uniform1f(f.uniforms.u_time, Z);
+        const K = this.glState.camera, W = this._modelViewMatrix;
+        W.identity(), W.translate(
+          -K.position[0] - this._cameraX,
+          -K.position[1] - this._cameraY,
+          -K.position[2] - this._cameraZ
+        ), W.translate(0, 0, -1), W.rotateX(-this._cameraRotationX), W.rotateY(-this._cameraRotationY), W.rotateZ(-this._cameraRotationZ);
+        let J = this._shapeRotationX, ee = this._shapeRotationY, _t = this._shapeRotationZ;
+        this._shapeAutoRotateSpeedX !== 0 && (J += Z * this._shapeAutoRotateSpeedX * 0.1), this._shapeAutoRotateSpeedY !== 0 && (ee += Z * this._shapeAutoRotateSpeedY * 0.1), this._shapeType === "plane" || this._shapeType === "ribbon" ? W.rotateX(J - Math.PI / 3.5) : W.rotateX(J), W.rotateY(ee), W.rotateZ(_t);
+        const te = f.uniforms.modelViewMatrix;
+        if (te && o.uniformMatrix4fv(te, !1, W.elements), this._yOffsetDirty && !this._uniformsDirty && (o.uniform1f(f.uniforms.u_y_offset, this._yOffset), this._yOffsetDirty = !1), this._uniformsDirty) {
+          o.uniform2f(f.uniforms.u_resolution, this._ref.clientWidth, this._ref.clientHeight), o.uniform2f(f.uniforms.u_color_pressure, this._horizontalPressure, this._verticalPressure), o.uniform1f(f.uniforms.u_wave_frequency_x, this._waveFrequencyX), o.uniform1f(f.uniforms.u_wave_frequency_y, this._waveFrequencyY), o.uniform1f(f.uniforms.u_wave_amplitude, this._waveAmplitude), o.uniform1f(f.uniforms.u_color_blending, this._colorBlending), o.uniform1f(f.uniforms.u_shadows, this._shadows), o.uniform1f(f.uniforms.u_highlights, this._highlights), o.uniform1f(f.uniforms.u_saturation, this._saturation), o.uniform1f(f.uniforms.u_brightness, this._brightness), o.uniform1f(f.uniforms.u_grain_intensity, this._grainIntensity), o.uniform1f(f.uniforms.u_grain_sparsity, this._grainSparsity), o.uniform1f(f.uniforms.u_grain_speed, this._grainSpeed), o.uniform1f(f.uniforms.u_grain_scale, this._grainScale), o.uniform1f(f.uniforms.u_y_offset, this._yOffset), o.uniform1f(f.uniforms.u_y_offset_wave_multiplier, this._yOffsetWaveMultiplier), o.uniform1f(f.uniforms.u_y_offset_color_multiplier, this._yOffsetColorMultiplier), o.uniform1f(f.uniforms.u_y_offset_flow_multiplier, this._yOffsetFlowMultiplier), o.uniform1f(f.uniforms.u_flow_distortion_a, this._flowDistortionA), o.uniform1f(f.uniforms.u_flow_distortion_b, this._flowDistortionB), o.uniform1f(f.uniforms.u_flow_scale, this._flowScale), o.uniform1f(f.uniforms.u_flow_ease, this._flowEase), o.uniform1f(f.uniforms.u_flow_enabled, this._flowEnabled ? 1 : 0);
           let L = 0;
-          this._shapeType === "sphere" ? L = 1 : this._shapeType === "torus" ? L = 2 : this._shapeType === "cylinder" ? L = 3 : this._shapeType === "ribbon" && (L = 4), n.uniform1f(d.uniforms.u_shape_type, L), n.uniform1f(d.uniforms.u_enable_procedural_texture, this._enableProceduralTexture ? 1 : 0), n.uniform1f(d.uniforms.u_texture_ease, this._textureEase), n.uniform1f(d.uniforms.u_transparent_texture_void, this._transparentTextureVoid ? 1 : 0), n.uniform1f(d.uniforms.u_domain_warp_enabled, this._domainWarpEnabled ? 1 : 0), n.uniform1f(d.uniforms.u_domain_warp_intensity, this._domainWarpIntensity), n.uniform1f(d.uniforms.u_domain_warp_scale, this._domainWarpScale), n.uniform1f(d.uniforms.u_vignette_intensity, this._vignetteIntensity), n.uniform1f(d.uniforms.u_vignette_radius, this._vignetteRadius), n.uniform1f(d.uniforms.u_fresnel_enabled, this._fresnelEnabled ? 1 : 0), n.uniform1f(d.uniforms.u_fresnel_power, this._fresnelPower), n.uniform1f(d.uniforms.u_fresnel_intensity, this._fresnelIntensity), n.uniform3fv(d.uniforms.u_fresnel_color, this._fresnelColorRgb), n.uniform1f(d.uniforms.u_iridescence_enabled, this._iridescenceEnabled ? 1 : 0), n.uniform1f(d.uniforms.u_iridescence_intensity, this._iridescenceIntensity), n.uniform1f(d.uniforms.u_iridescence_speed, this._iridescenceSpeed), n.uniform1f(d.uniforms.u_bloom_intensity, this._bloomIntensity), n.uniform1f(d.uniforms.u_bloom_threshold, this._bloomThreshold), n.uniform1f(d.uniforms.u_chromatic_aberration, this._chromaticAberration), n.uniform1f(d.uniforms.u_silhouette_fade, this._silhouetteFade), n.uniform1f(d.uniforms.u_cylinder_fade, this._cylinderFade), n.uniform1f(d.uniforms.u_ribbon_fade, this._ribbonFade), this._uniformsDirty = !1;
+          this._shapeType === "sphere" ? L = 1 : this._shapeType === "torus" ? L = 2 : this._shapeType === "cylinder" ? L = 3 : this._shapeType === "ribbon" && (L = 4), o.uniform1f(f.uniforms.u_shape_type, L), o.uniform1f(f.uniforms.u_enable_procedural_texture, this._enableProceduralTexture ? 1 : 0), o.uniform1f(f.uniforms.u_texture_ease, this._textureEase), o.uniform1f(f.uniforms.u_transparent_texture_void, this._transparentTextureVoid ? 1 : 0), o.uniform1f(f.uniforms.u_domain_warp_enabled, this._domainWarpEnabled ? 1 : 0), o.uniform1f(f.uniforms.u_domain_warp_intensity, this._domainWarpIntensity), o.uniform1f(f.uniforms.u_domain_warp_scale, this._domainWarpScale), o.uniform1f(f.uniforms.u_vignette_intensity, this._vignetteIntensity), o.uniform1f(f.uniforms.u_vignette_radius, this._vignetteRadius), o.uniform1f(f.uniforms.u_fresnel_enabled, this._fresnelEnabled ? 1 : 0), o.uniform1f(f.uniforms.u_fresnel_power, this._fresnelPower), o.uniform1f(f.uniforms.u_fresnel_intensity, this._fresnelIntensity), o.uniform3fv(f.uniforms.u_fresnel_color, this._fresnelColorRgb), o.uniform1f(f.uniforms.u_iridescence_enabled, this._iridescenceEnabled ? 1 : 0), o.uniform1f(f.uniforms.u_iridescence_intensity, this._iridescenceIntensity), o.uniform1f(f.uniforms.u_iridescence_speed, this._iridescenceSpeed), o.uniform1f(f.uniforms.u_bloom_intensity, this._bloomIntensity), o.uniform1f(f.uniforms.u_bloom_threshold, this._bloomThreshold), o.uniform1f(f.uniforms.u_chromatic_aberration, this._chromaticAberration), o.uniform1f(f.uniforms.u_silhouette_fade, this._silhouetteFade), o.uniform1f(f.uniforms.u_cylinder_fade, this._cylinderFade), o.uniform1f(f.uniforms.u_ribbon_fade, this._ribbonFade), o.uniform1f(f.uniforms.u_flat_shading, this._flatShading ? 1 : 0), this._uniformsDirty = !1, this._yOffsetDirty = !1;
         }
-        if (this._textureNeedsUpdate && this._enableProceduralTexture && (this._proceduralTexture && n.deleteTexture(this._proceduralTexture), this._proceduralTexture = this._createProceduralTexture(n), this._textureNeedsUpdate = !1, this._textureDirty = !0), this._textureDirty && this._proceduralTexture && (n.activeTexture(n.TEXTURE1), n.bindTexture(n.TEXTURE_2D, this._proceduralTexture), n.uniform1i(d.uniforms.u_procedural_texture, 1), this._textureDirty = !1), this._colorsChanged) {
+        if (this._textureNeedsUpdate && this._enableProceduralTexture && (this._proceduralTexture && o.deleteTexture(this._proceduralTexture), this._proceduralTexture = this._createProceduralTexture(o), this._textureNeedsUpdate = !1, this._textureDirty = !0), this._textureDirty && this._proceduralTexture && (o.activeTexture(o.TEXTURE1), o.bindTexture(o.TEXTURE_2D, this._proceduralTexture), o.uniform1i(f.uniforms.u_procedural_texture, 1), this._textureDirty = !1), this._colorsChanged) {
           this._colorsChanged = !1;
-          for (let L = 0; L < j; L++)
+          for (let L = 0; L < $; L++)
             if (L < this._colors.length) {
-              const ie = this._colors[L], _t = this._cachedColorRgb[L] || [0, 0, 0];
-              n.uniform1f(d.uniforms[`u_colors[${L}].is_active`], ie.enabled ? 1 : 0), n.uniform3fv(d.uniforms[`u_colors[${L}].color`], _t), n.uniform1f(d.uniforms[`u_colors[${L}].influence`], ie.influence || 0);
+              const ie = this._colors[L], ct = this._cachedColorRgb[L] || [0, 0, 0];
+              o.uniform1f(f.uniforms[`u_colors[${L}].is_active`], ie.enabled ? 1 : 0), o.uniform3fv(f.uniforms[`u_colors[${L}].color`], ct), o.uniform1f(f.uniforms[`u_colors[${L}].influence`], ie.influence || 0);
             } else
-              n.uniform1f(d.uniforms[`u_colors[${L}].is_active`], 0);
-          n.uniform1i(d.uniforms.u_colors_count, j);
+              o.uniform1f(f.uniforms[`u_colors[${L}].is_active`], 0);
+          o.uniform1i(f.uniforms.u_colors_count, $);
         }
       }
-      n.clearColor(
+      o.clearColor(
         this._backgroundColorRgb[0],
         this._backgroundColorRgb[1],
         this._backgroundColorRgb[2],
         this._backgroundAlpha
-      ), n.clear(n.COLOR_BUFFER_BIT | n.DEPTH_BUFFER_BIT), this._wireframe ? (n.bindBuffer(n.ELEMENT_ARRAY_BUFFER, this.glState.buffers.wireframeIndex), n.drawElements(n.LINES, this.glState.wireframeIndexCount, V, 0), n.bindBuffer(n.ELEMENT_ARRAY_BUFFER, this.glState.buffers.index)) : n.drawElements(n.TRIANGLES, k, V, 0), this.requestRef = requestAnimationFrame(J);
-    }, lt = () => {
-      const { gl: n, camera: Z } = this.glState, d = this._ref.clientWidth, k = this._ref.clientHeight;
-      this._ref.width = d, this._ref.height = k, n.viewport(0, 0, d, k), G(Z, d, k, N, Y, this._shapeType, this._cameraZoom);
-      const V = this.glState.locations.uniforms.projectionMatrix;
-      n.useProgram(this.glState.program), V && n.uniformMatrix4fv(V, !1, Z.projectionMatrix.elements);
+      ), o.clear(o.COLOR_BUFFER_BIT | o.DEPTH_BUFFER_BIT), this._wireframe ? (o.bindBuffer(o.ELEMENT_ARRAY_BUFFER, this.glState.buffers.wireframeIndex), o.drawElements(o.LINES, this.glState.wireframeIndexCount, q, 0), o.bindBuffer(o.ELEMENT_ARRAY_BUFFER, this.glState.buffers.index)) : o.drawElements(o.TRIANGLES, V, q, 0), this._isVisible && (this.requestRef = requestAnimationFrame(G));
+    };
+    this._visibilityObserver = new IntersectionObserver((o) => {
+      const k = this._isVisible;
+      this._isVisible = o[0].isIntersecting && document.visibilityState !== "hidden", this._isVisible && !k && (H = performance.now(), this.requestRef = requestAnimationFrame(G));
+    }, { threshold: 0 }), this._visibilityObserver.observe(i), this._visibilityHandler = () => {
+      const o = this._isVisible;
+      document.visibilityState === "hidden" ? this._isVisible = !1 : (this._isVisible = !0, o || (H = performance.now(), this.requestRef = requestAnimationFrame(G)));
+    }, document.addEventListener("visibilitychange", this._visibilityHandler);
+    const ut = () => {
+      const { gl: o, camera: k } = this.glState, f = this._ref.clientWidth, V = this._ref.clientHeight;
+      this._ref.width = f, this._ref.height = V, o.viewport(0, 0, f, V), j(k, f, V, X, N, this._shapeType, this._cameraZoom);
+      const q = this.glState.locations.uniforms.projectionMatrix;
+      o.useProgram(this.glState.program), q && o.uniformMatrix4fv(q, !1, k.projectionMatrix.elements);
     };
     this.sizeObserver = new ResizeObserver(() => {
       this._resizeTimeoutId !== null && clearTimeout(this._resizeTimeoutId), this._resizeTimeoutId = window.setTimeout(() => {
-        lt(), this._resizeTimeoutId = null;
+        ut(), this._resizeTimeoutId = null;
       }, 100);
-    }), this.sizeObserver.observe(i), J();
+    }), this.sizeObserver.observe(i), G();
   }
   destroy() {
-    if (cancelAnimationFrame(this.requestRef), this.sizeObserver.disconnect(), this._resizeTimeoutId !== null && (clearTimeout(this._resizeTimeoutId), this._resizeTimeoutId = null), this._linkElement && this._linkElement.parentElement && (this._linkElement.parentElement.removeChild(this._linkElement), this._linkElement = null), this.glState) {
+    if (cancelAnimationFrame(this.requestRef), this.sizeObserver.disconnect(), this._visibilityObserver && (this._visibilityObserver.disconnect(), this._visibilityObserver = null), this._visibilityHandler && (document.removeEventListener("visibilitychange", this._visibilityHandler), this._visibilityHandler = null), this._resizeTimeoutId !== null && (clearTimeout(this._resizeTimeoutId), this._resizeTimeoutId = null), this._linkElement && this._linkElement.parentElement && (this._linkElement.parentElement.removeChild(this._linkElement), this._linkElement = null), this.glState) {
       const e = this.glState.gl;
       e.deleteProgram(this.glState.program), e.deleteBuffer(this.glState.buffers.position), e.deleteBuffer(this.glState.buffers.normal), e.deleteBuffer(this.glState.buffers.uv), e.deleteBuffer(this.glState.buffers.index), e.deleteBuffer(this.glState.buffers.wireframeIndex);
     }
@@ -991,52 +1012,52 @@ class bt {
       filename: r = "neat.firecms.co",
       format: t,
       onProgress: y,
-      onComplete: x
-    } = e, o = this._ref, l = e.width || o.width || o.clientWidth, _ = e.height || o.height || o.clientHeight, b = document.createElement("canvas");
+      onComplete: v
+    } = e, s = this._ref, l = e.width || s.width || s.clientWidth, _ = e.height || s.height || s.clientHeight, b = document.createElement("canvas");
     b.width = l, b.height = _;
     const a = b.getContext("2d"), h = b.captureStream(0), p = h.getVideoTracks()[0], c = [
       "video/mp4;codecs=avc1",
       "video/mp4;codecs=avc1,opus",
       "video/mp4"
-    ], f = [
+    ], d = [
       "video/webm;codecs=vp9,opus",
       "video/webm;codecs=vp9",
       "video/webm;codecs=vp8,opus",
       "video/webm"
     ];
     let R;
-    t === "mp4" ? R = [...c, ...f] : t === "webm" ? R = [...f, ...c] : R = [...c, ...f];
+    t === "mp4" ? R = [...c, ...d] : t === "webm" ? R = [...d, ...c] : R = [...c, ...d];
     let g = "video/webm";
     for (const E of R)
       if (MediaRecorder.isTypeSupported(E)) {
         g = E;
         break;
       }
-    const v = l * _, w = 8e6, u = 1280 * 720, T = Math.round(w * Math.max(1, v / u)), A = new MediaRecorder(h, {
+    const x = l * _, w = 8e6, u = 1280 * 720, T = Math.round(w * Math.max(1, x / u)), A = new MediaRecorder(h, {
       mimeType: g,
       videoBitsPerSecond: T
-    }), C = [];
+    }), D = [];
     A.ondataavailable = (E) => {
-      E.data.size > 0 && C.push(E.data);
+      E.data.size > 0 && D.push(E.data);
     };
     let m = !1, F;
-    const D = performance.now();
+    const C = performance.now();
     let z = 0;
     const M = () => {
       if (m)
         return;
-      a.clearRect(0, 0, l, _), a.drawImage(o, 0, 0, l, _);
+      a.clearRect(0, 0, l, _), a.drawImage(s, 0, 0, l, _);
       const E = Math.max(14, Math.round(_ * 0.025));
       if (a.font = `bold ${E}px "Sofia Sans", sans-serif`, a.textAlign = "right", a.textBaseline = "bottom", a.shadowColor = "rgba(0,0,0,0.5)", a.shadowBlur = 4, a.shadowOffsetX = 1, a.shadowOffsetY = 1, a.fillStyle = "rgba(255,255,255,0.7)", a.fillText("NEAT", l - E * 0.8, _ - E * 0.5), a.shadowColor = "transparent", a.shadowBlur = 0, a.shadowOffsetX = 0, a.shadowOffsetY = 0, p.requestFrame && p.requestFrame(), y) {
         const S = performance.now();
-        S - z > 250 && (z = S, y(Math.min(0.99, (S - D) / i)));
+        S - z > 250 && (z = S, y(Math.min(0.99, (S - C) / i)));
       }
       F = requestAnimationFrame(M);
     };
     A.onstop = () => {
       m = !0, cancelAnimationFrame(F);
-      const E = g.startsWith("video/mp4"), S = E ? ".mp4" : ".webm", U = E ? "video/mp4" : "video/webm", B = r + S, W = new Blob(C, { type: U }), I = URL.createObjectURL(W);
-      ce(I, B), setTimeout(() => URL.revokeObjectURL(I), 3e4), y?.(1), x?.();
+      const E = g.startsWith("video/mp4"), S = E ? ".mp4" : ".webm", U = E ? "video/mp4" : "video/webm", B = r + S, O = new Blob(D, { type: U }), I = URL.createObjectURL(O);
+      ce(I, B), setTimeout(() => URL.revokeObjectURL(I), 3e4), y?.(1), v?.();
     }, M(), A.start(100);
     const P = window.setTimeout(() => {
       A.state === "recording" && A.stop();
@@ -1169,7 +1190,7 @@ class bt {
     return this._yOffset;
   }
   set yOffset(e) {
-    this._uniformsDirty = !0, this._yOffset = e;
+    this._yOffset !== e && (this._yOffsetDirty = !0, this._yOffset = e);
   }
   get yOffsetWaveMultiplier() {
     return this._yOffsetWaveMultiplier * 1e3;
@@ -1308,11 +1329,11 @@ class bt {
       return;
     const e = this.glState.gl, i = this._resolution || 1;
     let r;
-    this._shapeType === "sphere" ? r = ne(this._sphereRadius, 120 * i, 120 * i) : this._shapeType === "torus" ? r = ae(this._torusRadius, this._torusTube, 120 * i, 120 * i) : this._shapeType === "cylinder" ? r = le(this._cylinderRadius, this._cylinderRadius, this._cylinderHeight, 120 * i, 120 * i) : this._shapeType === "ribbon" ? r = ue(N, Y, 240 * i, 240 * i, this._planeBend, this._planeTwist) : r = se(N, Y, 240 * i, 240 * i);
-    const { position: t, normal: y, uv: x, index: o, wireframeIndex: l } = r;
-    e.bindBuffer(e.ARRAY_BUFFER, this.glState.buffers.position), e.bufferData(e.ARRAY_BUFFER, t, e.STATIC_DRAW), e.bindBuffer(e.ARRAY_BUFFER, this.glState.buffers.normal), e.bufferData(e.ARRAY_BUFFER, y, e.STATIC_DRAW), e.bindBuffer(e.ARRAY_BUFFER, this.glState.buffers.uv), e.bufferData(e.ARRAY_BUFFER, x, e.STATIC_DRAW), e.bindBuffer(e.ELEMENT_ARRAY_BUFFER, this.glState.buffers.index), e.bufferData(e.ELEMENT_ARRAY_BUFFER, o, e.STATIC_DRAW), e.bindBuffer(e.ELEMENT_ARRAY_BUFFER, this.glState.buffers.wireframeIndex), e.bufferData(e.ELEMENT_ARRAY_BUFFER, l, e.STATIC_DRAW), e.bindBuffer(e.ELEMENT_ARRAY_BUFFER, this.glState.buffers.index), this.glState.indexCount = o.length, this.glState.wireframeIndexCount = l.length, this.glState.indexType = o instanceof Uint32Array ? e.UNSIGNED_INT : e.UNSIGNED_SHORT;
+    this._shapeType === "sphere" ? r = ne(this._sphereRadius, 120 * i, 120 * i) : this._shapeType === "torus" ? r = ae(this._torusRadius, this._torusTube, 120 * i, 120 * i) : this._shapeType === "cylinder" ? r = le(this._cylinderRadius, this._cylinderRadius, this._cylinderHeight, 120 * i, 120 * i) : this._shapeType === "ribbon" ? r = ue(X, N, 240 * i, 240 * i, this._planeBend, this._planeTwist) : r = oe(X, N, 240 * i, 240 * i);
+    const { position: t, normal: y, uv: v, index: s, wireframeIndex: l } = r;
+    e.bindBuffer(e.ARRAY_BUFFER, this.glState.buffers.position), e.bufferData(e.ARRAY_BUFFER, t, e.STATIC_DRAW), e.bindBuffer(e.ARRAY_BUFFER, this.glState.buffers.normal), e.bufferData(e.ARRAY_BUFFER, y, e.STATIC_DRAW), e.bindBuffer(e.ARRAY_BUFFER, this.glState.buffers.uv), e.bufferData(e.ARRAY_BUFFER, v, e.STATIC_DRAW), e.bindBuffer(e.ELEMENT_ARRAY_BUFFER, this.glState.buffers.index), e.bufferData(e.ELEMENT_ARRAY_BUFFER, s, e.STATIC_DRAW), e.bindBuffer(e.ELEMENT_ARRAY_BUFFER, this.glState.buffers.wireframeIndex), e.bufferData(e.ELEMENT_ARRAY_BUFFER, l, e.STATIC_DRAW), e.bindBuffer(e.ELEMENT_ARRAY_BUFFER, this.glState.buffers.index), this.glState.indexCount = s.length, this.glState.wireframeIndexCount = l.length, this.glState.indexType = s instanceof Uint32Array ? e.UNSIGNED_INT : e.UNSIGNED_SHORT;
     const _ = this._ref.clientWidth, b = this._ref.clientHeight;
-    G(this.glState.camera, _, b, N, Y, this._shapeType, this._cameraZoom);
+    j(this.glState.camera, _, b, X, N, this._shapeType, this._cameraZoom);
     const a = this.glState.locations.uniforms.projectionMatrix;
     e.useProgram(this.glState.program), a && e.uniformMatrix4fv(a, !1, this.glState.camera.projectionMatrix.elements), this._uniformsDirty = !0;
   }
@@ -1330,45 +1351,45 @@ class bt {
       throw new Error("WebGL not supported");
     t.getExtension("OES_standard_derivatives"), t.getExtension("OES_element_index_uint"), t.viewport(0, 0, i, r);
     let y;
-    this._shapeType === "sphere" ? y = ne(this._sphereRadius, 120 * e, 120 * e) : this._shapeType === "torus" ? y = ae(this._torusRadius, this._torusTube, 120 * e, 120 * e) : this._shapeType === "cylinder" ? y = le(this._cylinderRadius, this._cylinderRadius, this._cylinderHeight, 120 * e, 120 * e) : this._shapeType === "ribbon" ? y = ue(N, Y, 240 * e, 240 * e, this._planeBend, this._planeTwist) : y = se(N, Y, 240 * e, 240 * e);
-    const { position: x, normal: o, uv: l, index: _, wireframeIndex: b } = y, a = t.createBuffer();
-    t.bindBuffer(t.ARRAY_BUFFER, a), t.bufferData(t.ARRAY_BUFFER, x, t.STATIC_DRAW);
+    this._shapeType === "sphere" ? y = ne(this._sphereRadius, 120 * e, 120 * e) : this._shapeType === "torus" ? y = ae(this._torusRadius, this._torusTube, 120 * e, 120 * e) : this._shapeType === "cylinder" ? y = le(this._cylinderRadius, this._cylinderRadius, this._cylinderHeight, 120 * e, 120 * e) : this._shapeType === "ribbon" ? y = ue(X, N, 240 * e, 240 * e, this._planeBend, this._planeTwist) : y = oe(X, N, 240 * e, 240 * e);
+    const { position: v, normal: s, uv: l, index: _, wireframeIndex: b } = y, a = t.createBuffer();
+    t.bindBuffer(t.ARRAY_BUFFER, a), t.bufferData(t.ARRAY_BUFFER, v, t.STATIC_DRAW);
     const h = t.createBuffer();
-    t.bindBuffer(t.ARRAY_BUFFER, h), t.bufferData(t.ARRAY_BUFFER, o, t.STATIC_DRAW);
+    t.bindBuffer(t.ARRAY_BUFFER, h), t.bufferData(t.ARRAY_BUFFER, s, t.STATIC_DRAW);
     const p = t.createBuffer();
     t.bindBuffer(t.ARRAY_BUFFER, p), t.bufferData(t.ARRAY_BUFFER, l, t.STATIC_DRAW);
     const c = t.createBuffer();
     t.bindBuffer(t.ELEMENT_ARRAY_BUFFER, c), t.bufferData(t.ELEMENT_ARRAY_BUFFER, _, t.STATIC_DRAW);
-    const f = t.createBuffer();
-    t.bindBuffer(t.ELEMENT_ARRAY_BUFFER, f), t.bufferData(t.ELEMENT_ARRAY_BUFFER, b, t.STATIC_DRAW), t.bindBuffer(t.ELEMENT_ARRAY_BUFFER, c);
-    const R = ft() + `
-` + oe() + `
+    const d = t.createBuffer();
+    t.bindBuffer(t.ELEMENT_ARRAY_BUFFER, d), t.bufferData(t.ELEMENT_ARRAY_BUFFER, b, t.STATIC_DRAW), t.bindBuffer(t.ELEMENT_ARRAY_BUFFER, c);
+    const R = dt() + `
+` + se() + `
 ` + re() + `
-` + ct, g = t.createShader(t.VERTEX_SHADER);
+` + ht, g = t.createShader(t.VERTEX_SHADER);
     t.shaderSource(g, R), t.compileShader(g), t.getShaderParameter(g, t.COMPILE_STATUS) || (console.log("VERTEX_SHADER_ERROR_START"), console.log("Vertex shader error: ", t.getShaderInfoLog(g)), console.log("GL Error Code:", t.getError()), console.log("Vertex Shader Source Dump:"), console.log(R.split(`
 `).map((S, U) => `${U + 1}: ${S}`).join(`
 `)), console.log("VERTEX_SHADER_ERROR_END"));
-    const v = dt() + `
+    const x = mt() + `
 ` + re() + `
-` + oe() + `
-` + ht, w = t.createShader(t.FRAGMENT_SHADER);
-    t.shaderSource(w, v), t.compileShader(w), t.getShaderParameter(w, t.COMPILE_STATUS) || (console.log("FRAGMENT_SHADER_ERROR_START"), console.log("Fragment shader error: ", t.getShaderInfoLog(w)), console.log("GL Error Code:", t.getError()), console.log("Fragment Shader Source Dump:"), console.log(v.split(`
+` + se() + `
+` + ft, w = t.createShader(t.FRAGMENT_SHADER);
+    t.shaderSource(w, x), t.compileShader(w), t.getShaderParameter(w, t.COMPILE_STATUS) || (console.log("FRAGMENT_SHADER_ERROR_START"), console.log("Fragment shader error: ", t.getShaderInfoLog(w)), console.log("GL Error Code:", t.getError()), console.log("Fragment Shader Source Dump:"), console.log(x.split(`
 `).map((S, U) => `${U + 1}: ${S}`).join(`
 `)), console.log("FRAGMENT_SHADER_ERROR_END"));
     const u = t.createProgram();
     t.attachShader(u, g), t.attachShader(u, w), t.linkProgram(u), t.getProgramParameter(u, t.LINK_STATUS) || (console.log("PROGRAM_LINK_ERROR_START"), console.log("Program linking error: ", t.getProgramInfoLog(u)), console.log("GL Error Code:", t.getError()), console.log("PROGRAM_LINK_ERROR_END")), t.useProgram(u);
-    const T = new mt(0, 0, 0, 0, 0, 1e3);
-    T.position = [0, 0, 5], G(T, i, r, N, Y, this._shapeType, this._cameraZoom);
-    const A = t.getAttribLocation(u, "position"), C = t.getAttribLocation(u, "normal"), m = t.getAttribLocation(u, "uv");
-    t.enableVertexAttribArray(A), t.bindBuffer(t.ARRAY_BUFFER, a), t.vertexAttribPointer(A, 3, t.FLOAT, !1, 0, 0), t.enableVertexAttribArray(C), t.bindBuffer(t.ARRAY_BUFFER, h), t.vertexAttribPointer(C, 3, t.FLOAT, !1, 0, 0), t.enableVertexAttribArray(m), t.bindBuffer(t.ARRAY_BUFFER, p), t.vertexAttribPointer(m, 2, t.FLOAT, !1, 0, 0), t.bindBuffer(t.ELEMENT_ARRAY_BUFFER, c);
+    const T = new pt(0, 0, 0, 0, 0, 1e3);
+    T.position = [0, 0, 5], j(T, i, r, X, N, this._shapeType, this._cameraZoom);
+    const A = t.getAttribLocation(u, "position"), D = t.getAttribLocation(u, "normal"), m = t.getAttribLocation(u, "uv");
+    t.enableVertexAttribArray(A), t.bindBuffer(t.ARRAY_BUFFER, a), t.vertexAttribPointer(A, 3, t.FLOAT, !1, 0, 0), t.enableVertexAttribArray(D), t.bindBuffer(t.ARRAY_BUFFER, h), t.vertexAttribPointer(D, 3, t.FLOAT, !1, 0, 0), t.enableVertexAttribArray(m), t.bindBuffer(t.ARRAY_BUFFER, p), t.vertexAttribPointer(m, 2, t.FLOAT, !1, 0, 0), t.bindBuffer(t.ELEMENT_ARRAY_BUFFER, c);
     const F = t.getUniformLocation(u, "projectionMatrix");
     t.uniformMatrix4fv(F, !1, T.projectionMatrix.elements);
-    const D = t.getUniformLocation(u, "u_plane_width");
-    t.uniform1f(D, N);
+    const C = t.getUniformLocation(u, "u_plane_width");
+    t.uniform1f(C, X);
     const z = t.getUniformLocation(u, "u_plane_height");
-    t.uniform1f(z, Y);
+    t.uniform1f(z, N);
     const M = t.getUniformLocation(u, "u_colors_count");
-    t.uniform1i(M, j);
+    t.uniform1i(M, $);
     const P = [
       "projectionMatrix",
       "modelViewMatrix",
@@ -1421,15 +1442,16 @@ class bt {
       "u_shape_type",
       "u_silhouette_fade",
       "u_cylinder_fade",
-      "u_ribbon_fade"
+      "u_ribbon_fade",
+      "u_flat_shading"
     ], E = {
-      attributes: { position: A, normal: C, uv: m },
+      attributes: { position: A, normal: D, uv: m },
       uniforms: {}
     };
     P.forEach((S) => {
       E.uniforms[S] = t.getUniformLocation(u, S);
     });
-    for (let S = 0; S < j; S++)
+    for (let S = 0; S < $; S++)
       E.uniforms[`u_colors[${S}].is_active`] = t.getUniformLocation(u, `u_colors[${S}].is_active`), E.uniforms[`u_colors[${S}].color`] = t.getUniformLocation(u, `u_colors[${S}].color`), E.uniforms[`u_colors[${S}].influence`] = t.getUniformLocation(u, `u_colors[${S}].influence`);
     return this._initialized = !0, this._uniformsDirty = !0, this._colorsChanged = !0, this._textureDirty = !0, t.enable(t.BLEND), t.blendFunc(t.SRC_ALPHA, t.ONE_MINUS_SRC_ALPHA), t.enable(t.DEPTH_TEST), {
       gl: t,
@@ -1439,7 +1461,7 @@ class bt {
         normal: h,
         uv: p,
         index: c,
-        wireframeIndex: f
+        wireframeIndex: d
       },
       locations: E,
       camera: T,
@@ -1454,13 +1476,13 @@ class bt {
     if (!t)
       return null;
     let y = this._textureSeed;
-    const x = this._textureSeed;
-    function o() {
+    const v = this._textureSeed;
+    function s() {
       const m = Math.sin(y++) * 1e4;
       return m - Math.floor(m);
     }
     const l = (m) => {
-      y = x + m;
+      y = v + m;
     }, _ = this._colors.filter((m) => m.enabled).map((m) => m.color);
     if (_.length === 0)
       return null;
@@ -1473,48 +1495,48 @@ class bt {
         b: F & 255
       };
     }
-    function c(m, F, D) {
-      return "#" + ((1 << 24) + (Math.round(m) << 16) + (Math.round(F) << 8) + Math.round(D)).toString(16).slice(1).padStart(6, "0");
+    function c(m, F, C) {
+      return "#" + ((1 << 24) + (Math.round(m) << 16) + (Math.round(F) << 8) + Math.round(C)).toString(16).slice(1).padStart(6, "0");
     }
-    const f = () => {
-      const m = _[Math.floor(o() * _.length)], F = _[Math.floor(o() * _.length)], D = o() * this._textureColorBlending, z = p(m), M = p(F), P = z.r + (M.r - z.r) * D, E = z.g + (M.g - z.g) * D, S = z.b + (M.b - z.b) * D;
+    const d = () => {
+      const m = _[Math.floor(s() * _.length)], F = _[Math.floor(s() * _.length)], C = s() * this._textureColorBlending, z = p(m), M = p(F), P = z.r + (M.r - z.r) * C, E = z.g + (M.g - z.g) * C, S = z.b + (M.b - z.b) * C;
       return c(P, E, S);
     }, R = this._proceduralBackgroundColor || "#000000";
     t.fillStyle = R, t.fillRect(0, 0, 1024, 1024);
     const g = t.createLinearGradient(0, 0, 0, 1024);
-    g.addColorStop(0, f()), g.addColorStop(1, f()), t.fillStyle = g, t.fillRect(0, 0, 1024, 1024);
+    g.addColorStop(0, d()), g.addColorStop(1, d()), t.fillStyle = g, t.fillRect(0, 0, 1024, 1024);
     for (let m = 0; m < this._textureShapeTriangles; m++) {
-      const F = f(), D = o() * 1024, z = o() * 1024, M = 100 + o() * 300, P = (o() - 0.5) * M, E = (o() - 0.5) * M, S = (o() - 0.5) * M, U = (o() - 0.5) * M;
+      const F = d(), C = s() * 1024, z = s() * 1024, M = 100 + s() * 300, P = (s() - 0.5) * M, E = (s() - 0.5) * M, S = (s() - 0.5) * M, U = (s() - 0.5) * M;
       for (const B of a)
-        for (const W of h) {
+        for (const O of h) {
           t.fillStyle = F, t.beginPath();
-          const I = D + B * 1024, O = z + W * 1024;
-          t.moveTo(I, O), t.lineTo(I + P, O + E), t.lineTo(I + S, O + U), t.fill();
+          const I = C + B * 1024, Y = z + O * 1024;
+          t.moveTo(I, Y), t.lineTo(I + P, Y + E), t.lineTo(I + S, Y + U), t.fill();
         }
     }
     for (let m = 0; m < this._textureShapeCircles; m++) {
-      const F = f(), D = 10 + o() * 50, z = o() * 1024, M = o() * 1024, P = 50 + o() * 150;
+      const F = d(), C = 10 + s() * 50, z = s() * 1024, M = s() * 1024, P = 50 + s() * 150;
       for (const E of a)
         for (const S of h)
-          t.strokeStyle = F, t.lineWidth = D, t.beginPath(), t.arc(z + E * 1024, M + S * 1024, P, 0, Math.PI * 2), t.stroke();
+          t.strokeStyle = F, t.lineWidth = C, t.beginPath(), t.arc(z + E * 1024, M + S * 1024, P, 0, Math.PI * 2), t.stroke();
     }
     for (let m = 0; m < this._textureShapeBars; m++) {
-      const F = f(), D = o() * 1024, z = o() * 1024, M = o() * Math.PI;
+      const F = d(), C = s() * 1024, z = s() * 1024, M = s() * Math.PI;
       for (const P of a)
         for (const E of h)
-          t.fillStyle = F, t.save(), t.translate(D + P * 1024, z + E * 1024), t.rotate(M), t.fillRect(-150, -25, 300, 50), t.restore();
+          t.fillStyle = F, t.save(), t.translate(C + P * 1024, z + E * 1024), t.rotate(M), t.fillRect(-150, -25, 300, 50), t.restore();
     }
     t.lineWidth = 15, t.lineCap = "round";
     for (let m = 0; m < this._textureShapeSquiggles; m++) {
-      const F = f(), D = o() * 1024, z = o() * 1024, M = [];
+      const F = d(), C = s() * 1024, z = s() * 1024, M = [];
       let P = 0, E = 0;
       for (let S = 0; S < 4; S++) {
-        const U = P + (o() - 0.5) * 300, B = E + (o() - 0.5) * 300;
+        const U = P + (s() - 0.5) * 300, B = E + (s() - 0.5) * 300;
         M.push({
-          cx1: P + (o() - 0.5) * 300,
-          cy1: E + (o() - 0.5) * 300,
-          cx2: P + (o() - 0.5) * 300,
-          cy2: E + (o() - 0.5) * 300,
+          cx1: P + (s() - 0.5) * 300,
+          cy1: E + (s() - 0.5) * 300,
+          cx2: P + (s() - 0.5) * 300,
+          cy2: E + (s() - 0.5) * 300,
           ex: U,
           ey: B
         }), P = U, E = B;
@@ -1522,41 +1544,41 @@ class bt {
       for (const S of a)
         for (const U of h) {
           t.strokeStyle = F, t.beginPath();
-          const B = D + S * 1024, W = z + U * 1024;
-          t.moveTo(B, W);
+          const B = C + S * 1024, O = z + U * 1024;
+          t.moveTo(B, O);
           for (const I of M)
             t.bezierCurveTo(
               B + I.cx1,
-              W + I.cy1,
+              O + I.cy1,
               B + I.cx2,
-              W + I.cy2,
+              O + I.cy2,
               B + I.ex,
-              W + I.ey
+              O + I.ey
             );
           t.stroke();
         }
     }
     l(5e4), this._maskedCanvas || (this._maskedCanvas = document.createElement("canvas"), this._maskedCanvas.width = 1024, this._maskedCanvas.height = 1024, this._maskedCtx = this._maskedCanvas.getContext("2d"));
-    const v = this._maskedCanvas, w = this._maskedCtx;
+    const x = this._maskedCanvas, w = this._maskedCtx;
     if (!w)
       return null;
     this._transparentTextureVoid ? w.clearRect(0, 0, 1024, 1024) : (w.fillStyle = R, w.fillRect(0, 0, 1024, 1024));
     let u = 0;
     const T = [];
     for (; u < 1024; )
-      if (o() < this._textureVoidLikelihood) {
-        const F = this._textureVoidWidthMin + o() * (this._textureVoidWidthMax - this._textureVoidWidthMin);
+      if (s() < this._textureVoidLikelihood) {
+        const F = this._textureVoidWidthMin + s() * (this._textureVoidWidthMax - this._textureVoidWidthMin);
         T.push({ type: "void", x: u, width: F }), u += F;
       } else {
-        const F = 50 + o() * 200;
+        const F = 50 + s() * 200;
         T.push({ type: "matter", x: u, width: F }), u += F;
       }
     for (const m of T)
       if (m.type === "matter") {
-        const F = m.x, D = Math.min(m.x + m.width, 1024);
+        const F = m.x, C = Math.min(m.x + m.width, 1024);
         let z = F;
-        for (; z < D; ) {
-          const M = (2 + o() * 20) / this._textureBandDensity, P = Math.floor(o() * 1024);
+        for (; z < C; ) {
+          const M = (2 + s() * 20) / this._textureBandDensity, P = Math.floor(s() * 1024);
           w.drawImage(
             r,
             P,
@@ -1571,11 +1593,11 @@ class bt {
         }
       }
     const A = e.createTexture();
-    e.bindTexture(e.TEXTURE_2D, A), e.texImage2D(e.TEXTURE_2D, 0, e.RGBA, e.RGBA, e.UNSIGNED_BYTE, v), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_WRAP_S, e.REPEAT), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_WRAP_T, e.REPEAT), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_MIN_FILTER, e.LINEAR_MIPMAP_LINEAR), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_MAG_FILTER, e.LINEAR), e.generateMipmap(e.TEXTURE_2D);
-    const C = e.getExtension("EXT_texture_filter_anisotropic") || e.getExtension("MOZ_EXT_texture_filter_anisotropic") || e.getExtension("WEBKIT_EXT_texture_filter_anisotropic");
-    if (C) {
-      const m = e.getParameter(C.MAX_TEXTURE_MAX_ANISOTROPY_EXT);
-      e.texParameterf(e.TEXTURE_2D, C.TEXTURE_MAX_ANISOTROPY_EXT, Math.min(16, m));
+    e.bindTexture(e.TEXTURE_2D, A), e.texImage2D(e.TEXTURE_2D, 0, e.RGBA, e.RGBA, e.UNSIGNED_BYTE, x), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_WRAP_S, e.REPEAT), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_WRAP_T, e.REPEAT), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_MIN_FILTER, e.LINEAR_MIPMAP_LINEAR), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_MAG_FILTER, e.LINEAR), e.generateMipmap(e.TEXTURE_2D);
+    const D = e.getExtension("EXT_texture_filter_anisotropic") || e.getExtension("MOZ_EXT_texture_filter_anisotropic") || e.getExtension("WEBKIT_EXT_texture_filter_anisotropic");
+    if (D) {
+      const m = e.getParameter(D.MAX_TEXTURE_MAX_ANISOTROPY_EXT);
+      e.texParameterf(e.TEXTURE_2D, D.TEXTURE_MAX_ANISOTROPY_EXT, Math.min(16, m));
     }
     return A;
   }
@@ -1597,6 +1619,12 @@ class bt {
   set ribbonFade(e) {
     this._ribbonFade !== e && (this._ribbonFade = e, this._uniformsDirty = !0);
   }
+  get flatShading() {
+    return this._flatShading;
+  }
+  set flatShading(e) {
+    this._flatShading !== e && (this._flatShading = e, this._uniformsDirty = !0);
+  }
   get domainWarpEnabled() {
     return this._domainWarpEnabled;
   }
@@ -1817,15 +1845,17 @@ class bt {
     if (!this.glState)
       return;
     const e = this.glState.gl, i = this._ref.clientWidth, r = this._ref.clientHeight;
-    G(this.glState.camera, i, r, N, Y, this._shapeType, this._cameraZoom);
+    j(this.glState.camera, i, r, X, N, this._shapeType, this._cameraZoom);
     const t = this.glState.locations.uniforms.projectionMatrix;
     e.useProgram(this.glState.program), t && e.uniformMatrix4fv(t, !1, this.glState.camera.projectionMatrix.elements), this._uniformsDirty = !0;
   }
 }
-const _e = (s) => {
-  s.id = pt, s.href = "https://neat.firecms.co", s.target = "_blank", s.style.position = "absolute", s.style.display = "block", s.style.bottom = "0", s.style.right = "0", s.style.padding = "10px", s.style.color = "#dcdcdc", s.style.opacity = "0.8", s.style.fontFamily = "sans-serif", s.style.fontSize = "16px", s.style.fontWeight = "bold", s.style.textDecoration = "none", s.style.zIndex = "10000", s.style.pointerEvents = "auto", s.setAttribute("data-n", "1"), s.innerHTML = "NEAT";
-}, gt = (s) => {
-  const e = s.parentElement;
+const _e = (n) => {
+  n.id = gt, n.href = "https://neat.firecms.co", n.target = "_blank", n.style.position = "absolute", n.style.display = "block", n.style.bottom = "0", n.style.right = "0", n.style.padding = "10px", n.style.color = "#dcdcdc", n.style.opacity = "0.8", n.style.fontFamily = "sans-serif", n.style.fontSize = "16px", n.style.fontWeight = "bold", n.style.textDecoration = "none", n.style.zIndex = "10000", n.style.pointerEvents = "auto", n.setAttribute("data-n", "1"), n.innerHTML = "NEAT";
+}, yt = (n) => {
+  let e = n.parentElement;
+  for (; e && getComputedStyle(e).display === "contents"; )
+    e = e.parentElement;
   if (e && getComputedStyle(e).position === "static" && (e.style.position = "relative"), e) {
     const r = e.querySelector("a[data-n]");
     if (r)
@@ -1834,28 +1864,28 @@ const _e = (s) => {
   const i = document.createElement("a");
   return _e(i), e?.appendChild(i), i;
 };
-function yt() {
-  const s = new Date(), e = s.getMinutes(), i = s.getSeconds();
+function vt() {
+  const n = new Date(), e = n.getMinutes(), i = n.getSeconds();
   return e * 60 + i;
 }
-function xt(s = 6) {
+function xt(n = 6) {
   const e = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
   let i = "";
-  for (let r = 0; r < s; r++) {
+  for (let r = 0; r < n; r++) {
     const t = Math.floor(Math.random() * e.length);
     i += e.charAt(t);
   }
   return i;
 }
-function ce(s, e) {
+function ce(n, e) {
   const i = document.createElement("a");
-  i.download = e, i.href = s, document.body.appendChild(i), i.click(), document.body.removeChild(i);
+  i.download = e, i.href = n, document.body.appendChild(i), i.click(), document.body.removeChild(i);
 }
-function vt() {
+function bt() {
   if (document.getElementById("neat-seo-schema"))
     return;
-  const s = document.createElement("script");
-  s.id = "neat-seo-schema", s.type = "application/ld+json", s.text = JSON.stringify({
+  const n = document.createElement("script");
+  n.id = "neat-seo-schema", n.type = "application/ld+json", n.text = JSON.stringify({
     "@context": "https://schema.org",
     "@type": "WebSite",
     name: "NEAT Gradient",
@@ -1866,7 +1896,7 @@ function vt() {
       url: "https://firecms.co"
     },
     description: "Beautiful, fast, heavily customizable, WebGL based gradients."
-  }), document.head.appendChild(s);
+  }), document.head.appendChild(n);
   const e = document.createElement("div");
   e.style.position = "absolute", e.style.width = "1px", e.style.height = "1px", e.style.padding = "0", e.style.margin = "-1px", e.style.overflow = "hidden", e.style.clip = "rect(0, 0, 0, 0)", e.style.whiteSpace = "nowrap", e.style.borderWidth = "0";
   try {
@@ -1879,6 +1909,6 @@ function vt() {
   document.body.appendChild(e);
 }
 export {
-  bt as NeatGradient
+  wt as NeatGradient
 };
 //# sourceMappingURL=index.es.js.map