@vitessce/spatial-accelerated 3.9.1 → 3.9.3

package/dist/index.js

@@ -1,5 +1,5 @@
 import * as React from "react";
-import React__default, { useReducer, useRef, useEffect, useLayoutEffect, useDebugValue, useState, useMemo, useContext, createContext, forwardRef, createElement, Suspense } from "react";
+import React__default, { useReducer, useRef, useEffect, useLayoutEffect, useDebugValue, useState, useMemo, useContext, forwardRef, createContext, createElement, PureComponent, Suspense } from "react";
 import * as ReactDOM from "react-dom";
 /**
  * @license
@@ -834,17 +834,17 @@ class Matrix3 {
   getNormalMatrix(matrix4) {
     return this.setFromMatrix4(matrix4).invert().transpose();
   }
-  transposeIntoArray(r) {
+  transposeIntoArray(r2) {
     const m = this.elements;
-    r[0] = m[0];
-    r[1] = m[3];
-    r[2] = m[6];
-    r[3] = m[1];
-    r[4] = m[4];
-    r[5] = m[7];
-    r[6] = m[2];
-    r[7] = m[5];
-    r[8] = m[8];
+    r2[0] = m[0];
+    r2[1] = m[3];
+    r2[2] = m[6];
+    r2[3] = m[1];
+    r2[4] = m[4];
+    r2[5] = m[7];
+    r2[6] = m[2];
+    r2[7] = m[5];
+    r2[8] = m[8];
     return this;
   }
   setUvTransform(tx, ty, sx, sy, rotation, cx, cy) {
@@ -2121,25 +2121,25 @@ class Quaternion {
     return this;
   }
   setFromUnitVectors(vFrom, vTo) {
-    let r = vFrom.dot(vTo) + 1;
-    if (r < Number.EPSILON) {
-      r = 0;
+    let r2 = vFrom.dot(vTo) + 1;
+    if (r2 < Number.EPSILON) {
+      r2 = 0;
       if (Math.abs(vFrom.x) > Math.abs(vFrom.z)) {
         this._x = -vFrom.y;
         this._y = vFrom.x;
         this._z = 0;
-        this._w = r;
+        this._w = r2;
       } else {
         this._x = 0;
         this._y = -vFrom.z;
         this._z = vFrom.y;
-        this._w = r;
+        this._w = r2;
       }
     } else {
       this._x = vFrom.y * vTo.z - vFrom.z * vTo.y;
       this._y = vFrom.z * vTo.x - vFrom.x * vTo.z;
       this._z = vFrom.x * vTo.y - vFrom.y * vTo.x;
-      this._w = r;
+      this._w = r2;
     }
     return this.normalize();
   }
@@ -2755,8 +2755,8 @@ class Box3 {
     }
     return this;
   }
-  setFromCenterAndSize(center, size) {
-    const halfSize = _vector$a.copy(size).multiplyScalar(0.5);
+  setFromCenterAndSize(center, size2) {
+    const halfSize = _vector$a.copy(size2).multiplyScalar(0.5);
     this.min.copy(center).sub(halfSize);
     this.max.copy(center).add(halfSize);
     return this;
@@ -3006,11 +3006,11 @@ const _testAxis = /* @__PURE__ */ new Vector3();
 function satForAxes(axes, v0, v1, v2, extents) {
   for (let i2 = 0, j = axes.length - 3; i2 <= j; i2 += 3) {
     _testAxis.fromArray(axes, i2);
-    const r = extents.x * Math.abs(_testAxis.x) + extents.y * Math.abs(_testAxis.y) + extents.z * Math.abs(_testAxis.z);
+    const r2 = extents.x * Math.abs(_testAxis.x) + extents.y * Math.abs(_testAxis.y) + extents.z * Math.abs(_testAxis.z);
     const p0 = v0.dot(_testAxis);
     const p1 = v1.dot(_testAxis);
     const p2 = v2.dot(_testAxis);
-    if (Math.max(-Math.max(p0, p1, p2), Math.min(p0, p1, p2)) > r) {
+    if (Math.max(-Math.max(p0, p1, p2), Math.min(p0, p1, p2)) > r2) {
       return false;
     }
   }
@@ -5529,16 +5529,16 @@ function hue2rgb(p, q, t) {
   return p;
 }
 class Color {
-  constructor(r, g, b) {
+  constructor(r2, g, b) {
     this.isColor = true;
     this.r = 1;
     this.g = 1;
     this.b = 1;
-    return this.set(r, g, b);
+    return this.set(r2, g, b);
   }
-  set(r, g, b) {
+  set(r2, g, b) {
     if (g === void 0 && b === void 0) {
-      const value = r;
+      const value = r2;
       if (value && value.isColor) {
         this.copy(value);
       } else if (typeof value === "number") {
@@ -5547,7 +5547,7 @@ class Color {
         this.setStyle(value);
       }
     } else {
-      this.setRGB(r, g, b);
+      this.setRGB(r2, g, b);
     }
     return this;
   }
@@ -5565,8 +5565,8 @@ class Color {
     ColorManagement.toWorkingColorSpace(this, colorSpace);
     return this;
   }
-  setRGB(r, g, b, colorSpace = ColorManagement.workingColorSpace) {
-    this.r = r;
+  setRGB(r2, g, b, colorSpace = ColorManagement.workingColorSpace) {
+    this.r = r2;
     this.g = g;
     this.b = b;
     ColorManagement.toWorkingColorSpace(this, colorSpace);
@@ -5639,15 +5639,15 @@ class Color {
       }
     } else if (m = /^\#([A-Fa-f\d]+)$/.exec(style2)) {
       const hex = m[1];
-      const size = hex.length;
-      if (size === 3) {
+      const size2 = hex.length;
+      if (size2 === 3) {
         return this.setRGB(
           parseInt(hex.charAt(0), 16) / 15,
           parseInt(hex.charAt(1), 16) / 15,
           parseInt(hex.charAt(2), 16) / 15,
           colorSpace
         );
-      } else if (size === 6) {
+      } else if (size2 === 6) {
         return this.setHex(parseInt(hex, 16), colorSpace);
       } else {
         console.warn("THREE.Color: Invalid hex color " + style2);
@@ -5704,9 +5704,9 @@ class Color {
   }
   getHSL(target, colorSpace = ColorManagement.workingColorSpace) {
     ColorManagement.fromWorkingColorSpace(_color.copy(this), colorSpace);
-    const r = _color.r, g = _color.g, b = _color.b;
-    const max = Math.max(r, g, b);
-    const min = Math.min(r, g, b);
+    const r2 = _color.r, g = _color.g, b = _color.b;
+    const max = Math.max(r2, g, b);
+    const min = Math.min(r2, g, b);
     let hue, saturation;
     const lightness = (min + max) / 2;
     if (min === max) {
@@ -5716,14 +5716,14 @@ class Color {
       const delta = max - min;
       saturation = lightness <= 0.5 ? delta / (max + min) : delta / (2 - max - min);
       switch (max) {
-        case r:
+        case r2:
           hue = (g - b) / delta + (g < b ? 6 : 0);
           break;
         case g:
-          hue = (b - r) / delta + 2;
+          hue = (b - r2) / delta + 2;
           break;
         case b:
-          hue = (r - g) / delta + 4;
+          hue = (r2 - g) / delta + 4;
           break;
       }
       hue /= 6;
@@ -5742,11 +5742,11 @@ class Color {
   }
   getStyle(colorSpace = SRGBColorSpace) {
     ColorManagement.fromWorkingColorSpace(_color.copy(this), colorSpace);
-    const r = _color.r, g = _color.g, b = _color.b;
+    const r2 = _color.r, g = _color.g, b = _color.b;
     if (colorSpace !== SRGBColorSpace) {
-      return `color(${colorSpace} ${r.toFixed(3)} ${g.toFixed(3)} ${b.toFixed(3)})`;
+      return `color(${colorSpace} ${r2.toFixed(3)} ${g.toFixed(3)} ${b.toFixed(3)})`;
     }
-    return `rgb(${Math.round(r * 255)},${Math.round(g * 255)},${Math.round(b * 255)})`;
+    return `rgb(${Math.round(r2 * 255)},${Math.round(g * 255)},${Math.round(b * 255)})`;
   }
   offsetHSL(h, s, l) {
     this.getHSL(_hslA);
@@ -5820,11 +5820,11 @@ class Color {
     return this;
   }
   applyMatrix3(m) {
-    const r = this.r, g = this.g, b = this.b;
+    const r2 = this.r, g = this.g, b = this.b;
     const e = m.elements;
-    this.r = e[0] * r + e[3] * g + e[6] * b;
-    this.g = e[1] * r + e[4] * g + e[7] * b;
-    this.b = e[2] * r + e[5] * g + e[8] * b;
+    this.r = e[0] * r2 + e[3] * g + e[6] * b;
+    this.g = e[1] * r2 + e[4] * g + e[7] * b;
+    this.b = e[2] * r2 + e[5] * g + e[8] * b;
     return this;
   }
   equals(c) {
@@ -6581,10 +6581,10 @@ class BufferGeometry extends EventDispatcher {
       vC.sub(vA);
       uvB.sub(uvA);
       uvC.sub(uvA);
-      const r = 1 / (uvB.x * uvC.y - uvC.x * uvB.y);
-      if (!isFinite(r)) return;
-      sdir.copy(vB).multiplyScalar(uvC.y).addScaledVector(vC, -uvB.y).multiplyScalar(r);
-      tdir.copy(vC).multiplyScalar(uvB.x).addScaledVector(vB, -uvC.x).multiplyScalar(r);
+      const r2 = 1 / (uvB.x * uvC.y - uvC.x * uvB.y);
+      if (!isFinite(r2)) return;
+      sdir.copy(vB).multiplyScalar(uvC.y).addScaledVector(vC, -uvB.y).multiplyScalar(r2);
+      tdir.copy(vC).multiplyScalar(uvB.x).addScaledVector(vB, -uvC.x).multiplyScalar(r2);
       tan1[a].add(sdir);
       tan1[b].add(sdir);
       tan1[c].add(sdir);
@@ -7659,10 +7659,10 @@ class CubeTexture extends Texture {
   }
 }
 class WebGLCubeRenderTarget extends WebGLRenderTarget {
-  constructor(size = 1, options = {}) {
-    super(size, size, options);
+  constructor(size2 = 1, options = {}) {
+    super(size2, size2, options);
     this.isWebGLCubeRenderTarget = true;
-    const image = { width: size, height: size, depth: 1 };
+    const image = { width: size2, height: size2, depth: 1 };
     const images = [image, image, image, image, image, image];
     if (options.encoding !== void 0) {
       warnOnce("THREE.WebGLCubeRenderTarget: option.encoding has been replaced by option.colorSpace.");
@@ -9183,11 +9183,11 @@ function WebGLBindingStates(gl, extensions, attributes, capabilities) {
       }
     }
   }
-  function vertexAttribPointer(index, size, type, normalized, stride, offset2, integer) {
+  function vertexAttribPointer(index, size2, type, normalized, stride, offset2, integer) {
     if (integer === true) {
-      gl.vertexAttribIPointer(index, size, type, stride, offset2);
+      gl.vertexAttribIPointer(index, size2, type, stride, offset2);
     } else {
-      gl.vertexAttribPointer(index, size, type, normalized, stride, offset2);
+      gl.vertexAttribPointer(index, size2, type, normalized, stride, offset2);
     }
   }
   function setupVertexAttributes(object, material, program, geometry) {
@@ -9208,7 +9208,7 @@ function WebGLBindingStates(gl, extensions, attributes, capabilities) {
         }
         if (geometryAttribute !== void 0) {
           const normalized = geometryAttribute.normalized;
-          const size = geometryAttribute.itemSize;
+          const size2 = geometryAttribute.itemSize;
           const attribute = attributes.get(geometryAttribute);
           if (attribute === void 0) continue;
           const buffer = attribute.buffer;
@@ -9235,11 +9235,11 @@ function WebGLBindingStates(gl, extensions, attributes, capabilities) {
             for (let i2 = 0; i2 < programAttribute.locationSize; i2++) {
               vertexAttribPointer(
                 programAttribute.location + i2,
-                size / programAttribute.locationSize,
+                size2 / programAttribute.locationSize,
                 type,
                 normalized,
                 stride * bytesPerElement,
-                (offset2 + size / programAttribute.locationSize * i2) * bytesPerElement,
+                (offset2 + size2 / programAttribute.locationSize * i2) * bytesPerElement,
                 integer
               );
             }
@@ -9260,11 +9260,11 @@ function WebGLBindingStates(gl, extensions, attributes, capabilities) {
             for (let i2 = 0; i2 < programAttribute.locationSize; i2++) {
               vertexAttribPointer(
                 programAttribute.location + i2,
-                size / programAttribute.locationSize,
+                size2 / programAttribute.locationSize,
                 type,
                 normalized,
-                size * bytesPerElement,
-                size / programAttribute.locationSize * i2 * bytesPerElement,
+                size2 * bytesPerElement,
+                size2 / programAttribute.locationSize * i2 * bytesPerElement,
                 integer
               );
             }
@@ -9872,8 +9872,8 @@ class PMREMGenerator {
         cubeCamera.up.set(0, upSign[i2], 0);
         cubeCamera.lookAt(0, 0, forwardSign[i2]);
       }
-      const size = this._cubeSize;
-      _setViewport(cubeUVRenderTarget, col * size, i2 > 2 ? size : 0, size, size);
+      const size2 = this._cubeSize;
+      _setViewport(cubeUVRenderTarget, col * size2, i2 > 2 ? size2 : 0, size2, size2);
       renderer.setRenderTarget(cubeUVRenderTarget);
       if (useSolidColor) {
         renderer.render(backgroundBox, cubeCamera);
@@ -9903,8 +9903,8 @@ class PMREMGenerator {
     const mesh = new Mesh(this._lodPlanes[0], material);
     const uniforms = material.uniforms;
     uniforms["envMap"].value = texture;
-    const size = this._cubeSize;
-    _setViewport(cubeUVRenderTarget, 0, 0, 3 * size, 2 * size);
+    const size2 = this._cubeSize;
+    _setViewport(cubeUVRenderTarget, 0, 0, 3 * size2, 2 * size2);
     renderer.setRenderTarget(cubeUVRenderTarget);
     renderer.render(mesh, _flatCamera);
   }
@@ -10819,19 +10819,19 @@ function flatten(array, nBlocks, blockSize) {
   const firstElem = array[0];
   if (firstElem <= 0 || firstElem > 0) return array;
   const n = nBlocks * blockSize;
-  let r = arrayCacheF32[n];
-  if (r === void 0) {
-    r = new Float32Array(n);
-    arrayCacheF32[n] = r;
+  let r2 = arrayCacheF32[n];
+  if (r2 === void 0) {
+    r2 = new Float32Array(n);
+    arrayCacheF32[n] = r2;
   }
   if (nBlocks !== 0) {
-    firstElem.toArray(r, 0);
+    firstElem.toArray(r2, 0);
     for (let i2 = 1, offset2 = 0; i2 !== nBlocks; ++i2) {
       offset2 += blockSize;
-      array[i2].toArray(r, offset2);
+      array[i2].toArray(r2, offset2);
     }
   }
-  return r;
+  return r2;
 }
 function arraysEqual(a, b) {
   if (a.length !== b.length) return false;
@@ -10846,15 +10846,15 @@ function copyArray(a, b) {
   }
 }
 function allocTexUnits(textures, n) {
-  let r = arrayCacheI32[n];
-  if (r === void 0) {
-    r = new Int32Array(n);
-    arrayCacheI32[n] = r;
+  let r2 = arrayCacheI32[n];
+  if (r2 === void 0) {
+    r2 = new Int32Array(n);
+    arrayCacheI32[n] = r2;
   }
   for (let i2 = 0; i2 !== n; ++i2) {
-    r[i2] = textures.allocateTextureUnit();
+    r2[i2] = textures.allocateTextureUnit();
   }
-  return r;
+  return r2;
 }
 function setValueV1f(gl, v) {
   const cache = this.cache;
@@ -11448,12 +11448,12 @@ class WebGLUniforms {
     }
   }
   static seqWithValue(seq, values2) {
-    const r = [];
+    const r2 = [];
     for (let i2 = 0, n = seq.length; i2 !== n; ++i2) {
       const u = seq[i2];
-      if (u.id in values2) r.push(u);
+      if (u.id in values2) r2.push(u);
     }
-    return r;
+    return r2;
   }
 }
 function WebGLShader(gl, type, string) {
@@ -12857,7 +12857,7 @@ function WebGLLights(extensions, capabilities) {
   const matrix4 = new Matrix4();
   const matrix42 = new Matrix4();
   function setup(lights, useLegacyLights) {
-    let r = 0, g = 0, b = 0;
+    let r2 = 0, g = 0, b = 0;
     for (let i2 = 0; i2 < 9; i2++) state.probe[i2].set(0, 0, 0);
     let directionalLength = 0;
     let pointLength = 0;
@@ -12878,7 +12878,7 @@ function WebGLLights(extensions, capabilities) {
       const distance = light2.distance;
       const shadowMap = light2.shadow && light2.shadow.map ? light2.shadow.map.texture : null;
       if (light2.isAmbientLight) {
-        r += color2.r * intensity * scaleFactor;
+        r2 += color2.r * intensity * scaleFactor;
         g += color2.g * intensity * scaleFactor;
         b += color2.b * intensity * scaleFactor;
       } else if (light2.isLightProbe) {
@@ -12982,7 +12982,7 @@ function WebGLLights(extensions, capabilities) {
         }
       }
     }
-    state.ambient[0] = r;
+    state.ambient[0] = r2;
     state.ambient[1] = g;
     state.ambient[2] = b;
     const hash2 = state.hash;
@@ -13406,15 +13406,15 @@ function WebGLState(gl, extensions, capabilities) {
       setLocked: function(lock) {
         locked = lock;
       },
-      setClear: function(r, g, b, a, premultipliedAlpha) {
+      setClear: function(r2, g, b, a, premultipliedAlpha) {
         if (premultipliedAlpha === true) {
-          r *= a;
+          r2 *= a;
           g *= a;
           b *= a;
         }
-        color2.set(r, g, b, a);
+        color2.set(r2, g, b, a);
         if (currentColorClear.equals(color2) === false) {
-          gl.clearColor(r, g, b, a);
+          gl.clearColor(r2, g, b, a);
           currentColorClear.copy(color2);
         }
       },
@@ -16272,10 +16272,10 @@ function WebGLUniformsGroups(gl, info, capabilities, state) {
     const bindingPointIndex = allocateBindingPointIndex();
     uniformsGroup.__bindingPointIndex = bindingPointIndex;
     const buffer = gl.createBuffer();
-    const size = uniformsGroup.__size;
+    const size2 = uniformsGroup.__size;
     const usage = uniformsGroup.usage;
     gl.bindBuffer(gl.UNIFORM_BUFFER, buffer);
-    gl.bufferData(gl.UNIFORM_BUFFER, size, usage);
+    gl.bufferData(gl.UNIFORM_BUFFER, size2, usage);
     gl.bindBuffer(gl.UNIFORM_BUFFER, null);
     gl.bindBufferBase(gl.UNIFORM_BUFFER, bindingPointIndex, buffer);
     return buffer;
@@ -16750,17 +16750,17 @@ class WebGLRenderer {
           const isUnsignedType = targetType === UnsignedByteType || targetType === UnsignedIntType || targetType === UnsignedShortType || targetType === UnsignedInt248Type || targetType === UnsignedShort4444Type || targetType === UnsignedShort5551Type;
           const clearColor = background.getClearColor();
           const a = background.getClearAlpha();
-          const r = clearColor.r;
+          const r2 = clearColor.r;
           const g = clearColor.g;
           const b = clearColor.b;
           if (isUnsignedType) {
-            uintClearColor[0] = r;
+            uintClearColor[0] = r2;
             uintClearColor[1] = g;
             uintClearColor[2] = b;
             uintClearColor[3] = a;
             _gl.clearBufferuiv(_gl.COLOR, 0, uintClearColor);
           } else {
-            intClearColor[0] = r;
+            intClearColor[0] = r2;
             intClearColor[1] = g;
             intClearColor[2] = b;
             intClearColor[3] = a;
@@ -18514,16 +18514,16 @@ class Skeleton {
     return new Skeleton(this.bones, this.boneInverses);
   }
   computeBoneTexture() {
-    let size = Math.sqrt(this.bones.length * 4);
-    size = ceilPowerOfTwo(size);
-    size = Math.max(size, 4);
-    const boneMatrices = new Float32Array(size * size * 4);
+    let size2 = Math.sqrt(this.bones.length * 4);
+    size2 = ceilPowerOfTwo(size2);
+    size2 = Math.max(size2, 4);
+    const boneMatrices = new Float32Array(size2 * size2 * 4);
     boneMatrices.set(this.boneMatrices);
-    const boneTexture = new DataTexture(boneMatrices, size, size, RGBAFormat, FloatType);
+    const boneTexture = new DataTexture(boneMatrices, size2, size2, RGBAFormat, FloatType);
     boneTexture.needsUpdate = true;
     this.boneMatrices = boneMatrices;
     this.boneTexture = boneTexture;
-    this.boneTextureSize = size;
+    this.boneTextureSize = size2;
     return this;
   }
   getBoneByName(name) {
@@ -20545,7 +20545,7 @@ class PolyhedronGeometry extends BufferGeometry {
 class DodecahedronGeometry extends PolyhedronGeometry {
   constructor(radius = 1, detail = 0) {
     const t = (1 + Math.sqrt(5)) / 2;
-    const r = 1 / t;
+    const r2 = 1 / t;
     const vertices = [
       // (±1, ±1, ±1)
       -1,
@@ -20574,43 +20574,43 @@ class DodecahedronGeometry extends PolyhedronGeometry {
       1,
       // (0, ±1/φ, ±φ)
       0,
-      -r,
+      -r2,
       -t,
       0,
-      -r,
+      -r2,
       t,
       0,
-      r,
+      r2,
       -t,
       0,
-      r,
+      r2,
       t,
       // (±1/φ, ±φ, 0)
-      -r,
+      -r2,
       -t,
       0,
-      -r,
+      -r2,
       t,
       0,
-      r,
+      r2,
       -t,
       0,
-      r,
+      r2,
       t,
       0,
       // (±φ, 0, ±1/φ)
       -t,
       0,
-      -r,
+      -r2,
       t,
       0,
-      -r,
+      -r2,
       -t,
       0,
-      r,
+      r2,
       t,
       0,
-      r
+      r2
     ];
     const indices = [
       3,
@@ -21168,8 +21168,8 @@ function isValidDiagonal(a, b) {
   (area(a.prev, a, b.prev) || area(a, b.prev, b)) || // does not create opposite-facing sectors
   equals(a, b) && area(a.prev, a, a.next) > 0 && area(b.prev, b, b.next) > 0);
 }
-function area(p, q, r) {
-  return (q.y - p.y) * (r.x - q.x) - (q.x - p.x) * (r.y - q.y);
+function area(p, q, r2) {
+  return (q.y - p.y) * (r2.x - q.x) - (q.x - p.x) * (r2.y - q.y);
 }
 function equals(p1, p2) {
   return p1.x === p2.x && p1.y === p2.y;
@@ -21186,8 +21186,8 @@ function intersects(p1, q1, p2, q2) {
   if (o4 === 0 && onSegment(p2, q1, q2)) return true;
   return false;
 }
-function onSegment(p, q, r) {
-  return q.x <= Math.max(p.x, r.x) && q.x >= Math.min(p.x, r.x) && q.y <= Math.max(p.y, r.y) && q.y >= Math.min(p.y, r.y);
+function onSegment(p, q, r2) {
+  return q.x <= Math.max(p.x, r2.x) && q.x >= Math.min(p.x, r2.x) && q.y <= Math.max(p.y, r2.y) && q.y >= Math.min(p.y, r2.y);
 }
 function sign(num) {
   return num > 0 ? 1 : num < 0 ? -1 : 0;
@@ -21375,9 +21375,9 @@ class ExtrudeGeometry extends BufferGeometry {
         const ahole = holes[h];
         vertices = vertices.concat(ahole);
       }
-      function scalePt2(pt, vec, size) {
+      function scalePt2(pt, vec, size2) {
         if (!vec) console.error("THREE.ExtrudeGeometry: vec does not exist");
-        return pt.clone().addScaledVector(vec, size);
+        return pt.clone().addScaledVector(vec, size2);
       }
       const vlen = vertices.length, flen = faces.length;
       function getBevelVec(inPt, inPrev, inNext) {
@@ -26039,7 +26039,7 @@ class Clock {
     this.running = false;
   }
   start() {
-    this.startTime = now();
+    this.startTime = now$1();
     this.oldTime = this.startTime;
     this.elapsedTime = 0;
     this.running = true;
@@ -26060,7 +26060,7 @@ class Clock {
       return 0;
     }
     if (this.running) {
-      const newTime = now();
+      const newTime = now$1();
       diff = (newTime - this.oldTime) / 1e3;
       this.oldTime = newTime;
       this.elapsedTime += diff;
@@ -26068,7 +26068,7 @@ class Clock {
     return diff;
   }
 }
-function now() {
+function now$1() {
   return (typeof performance === "undefined" ? Date : performance).now();
 }
 const _position$1 = /* @__PURE__ */ new Vector3();
@@ -28120,8 +28120,8 @@ class Box2 {
     }
     return this;
   }
-  setFromCenterAndSize(center, size) {
-    const halfSize = _vector$4.copy(size).multiplyScalar(0.5);
+  setFromCenterAndSize(center, size2) {
+    const halfSize = _vector$4.copy(size2).multiplyScalar(0.5);
     this.min.copy(center).sub(halfSize);
     this.max.copy(center).add(halfSize);
     return this;
@@ -28437,14 +28437,14 @@ const _vector$1 = /* @__PURE__ */ new Vector3();
 const _color1 = /* @__PURE__ */ new Color();
 const _color2 = /* @__PURE__ */ new Color();
 class HemisphereLightHelper extends Object3D {
-  constructor(light2, size, color2) {
+  constructor(light2, size2, color2) {
     super();
     this.light = light2;
     this.matrix = light2.matrixWorld;
     this.matrixAutoUpdate = false;
     this.color = color2;
     this.type = "HemisphereLightHelper";
-    const geometry = new OctahedronGeometry(size);
+    const geometry = new OctahedronGeometry(size2);
     geometry.rotateY(Math.PI * 0.5);
     this.material = new MeshBasicMaterial({ wireframe: true, fog: false, toneMapped: false });
     if (this.color === void 0) this.material.vertexColors = true;
@@ -28477,12 +28477,12 @@ class HemisphereLightHelper extends Object3D {
   }
 }
 class GridHelper extends LineSegments {
-  constructor(size = 10, divisions = 10, color1 = 4473924, color2 = 8947848) {
+  constructor(size2 = 10, divisions = 10, color1 = 4473924, color2 = 8947848) {
     color1 = new Color(color1);
     color2 = new Color(color2);
     const center = divisions / 2;
-    const step = size / divisions;
-    const halfSize = size / 2;
+    const step = size2 / divisions;
+    const halfSize = size2 / 2;
     const vertices = [], colors = [];
     for (let i2 = 0, j = 0, k = -halfSize; i2 <= divisions; i2++, k += step) {
       vertices.push(-halfSize, 0, k, halfSize, 0, k);
@@ -28529,16 +28529,16 @@ class PolarGridHelper extends LineSegments {
     }
     for (let i2 = 0; i2 < rings; i2++) {
       const color3 = i2 & 1 ? color1 : color2;
-      const r = radius - radius / rings * i2;
+      const r2 = radius - radius / rings * i2;
       for (let j = 0; j < divisions; j++) {
         let v = j / divisions * (Math.PI * 2);
-        let x = Math.sin(v) * r;
-        let z = Math.cos(v) * r;
+        let x = Math.sin(v) * r2;
+        let z = Math.cos(v) * r2;
         vertices.push(x, 0, z);
         colors.push(color3.r, color3.g, color3.b);
         v = (j + 1) / divisions * (Math.PI * 2);
-        x = Math.sin(v) * r;
-        z = Math.cos(v) * r;
+        x = Math.sin(v) * r2;
+        z = Math.cos(v) * r2;
         vertices.push(x, 0, z);
         colors.push(color3.r, color3.g, color3.b);
       }
@@ -28559,30 +28559,30 @@ const _v1 = /* @__PURE__ */ new Vector3();
 const _v2 = /* @__PURE__ */ new Vector3();
 const _v3 = /* @__PURE__ */ new Vector3();
 class DirectionalLightHelper extends Object3D {
-  constructor(light2, size, color2) {
+  constructor(light2, size2, color2) {
     super();
     this.light = light2;
     this.matrix = light2.matrixWorld;
     this.matrixAutoUpdate = false;
     this.color = color2;
     this.type = "DirectionalLightHelper";
-    if (size === void 0) size = 1;
+    if (size2 === void 0) size2 = 1;
     let geometry = new BufferGeometry();
     geometry.setAttribute("position", new Float32BufferAttribute([
-      -size,
-      size,
+      -size2,
+      size2,
       0,
-      size,
-      size,
+      size2,
+      size2,
       0,
-      size,
-      -size,
+      size2,
+      -size2,
       0,
-      -size,
-      -size,
+      -size2,
+      -size2,
       0,
-      -size,
-      size,
+      -size2,
+      size2,
       0
     ], 3));
     const material = new LineBasicMaterial({ fog: false, toneMapped: false });
@@ -28873,7 +28873,7 @@ class Box3Helper extends LineSegments {
   }
 }
 class PlaneHelper extends Line {
-  constructor(plane, size = 1, hex = 16776960) {
+  constructor(plane, size2 = 1, hex = 16776960) {
     const color2 = hex;
     const positions = [1, -1, 0, -1, 1, 0, -1, -1, 0, 1, 1, 0, -1, 1, 0, -1, -1, 0, 1, -1, 0, 1, 1, 0];
     const geometry = new BufferGeometry();
@@ -28882,7 +28882,7 @@ class PlaneHelper extends Line {
     super(geometry, new LineBasicMaterial({ color: color2, toneMapped: false }));
     this.type = "PlaneHelper";
     this.plane = plane;
-    this.size = size;
+    this.size = size2;
     const positions2 = [1, 1, 0, -1, 1, 0, -1, -1, 0, 1, 1, 0, -1, -1, 0, 1, -1, 0];
     const geometry2 = new BufferGeometry();
     geometry2.setAttribute("position", new Float32BufferAttribute(positions2, 3));
@@ -28962,26 +28962,26 @@ class ArrowHelper extends Object3D {
   }
 }
 class AxesHelper extends LineSegments {
-  constructor(size = 1) {
+  constructor(size2 = 1) {
     const vertices = [
       0,
       0,
       0,
-      size,
+      size2,
       0,
       0,
       0,
       0,
       0,
       0,
-      size,
+      size2,
       0,
       0,
       0,
       0,
       0,
       0,
-      size
+      size2
     ];
     const colors = [
       1,
@@ -30355,7 +30355,7 @@ function requireReactReconciler_development() {
         }
         return null;
       }
-      function getWrappedName(outerType, innerType, wrapperName) {
+      function getWrappedName2(outerType, innerType, wrapperName) {
         var displayName = outerType.displayName;
         if (displayName) {
           return displayName;
@@ -30404,7 +30404,7 @@ function requireReactReconciler_development() {
               var provider = type;
               return getContextName(provider._context) + ".Provider";
             case REACT_FORWARD_REF_TYPE:
-              return getWrappedName(type, type.render, "ForwardRef");
+              return getWrappedName2(type, type.render, "ForwardRef");
             case REACT_MEMO_TYPE:
               var outerName = type.displayName || null;
               if (outerName !== null) {
@@ -30811,7 +30811,7 @@ function requireReactReconciler_development() {
       var shouldSetTextContent = $$$hostConfig.shouldSetTextContent;
       var createTextInstance = $$$hostConfig.createTextInstance;
       var scheduleTimeout = $$$hostConfig.scheduleTimeout;
-      var cancelTimeout = $$$hostConfig.cancelTimeout;
+      var cancelTimeout2 = $$$hostConfig.cancelTimeout;
       var noTimeout = $$$hostConfig.noTimeout;
       $$$hostConfig.now;
       var isPrimaryRenderer = $$$hostConfig.isPrimaryRenderer;
@@ -32088,7 +32088,7 @@ function requireReactReconciler_development() {
       var cancelCallback = Scheduler.unstable_cancelCallback;
       var shouldYield = Scheduler.unstable_shouldYield;
       var requestPaint = Scheduler.unstable_requestPaint;
-      var now$1 = Scheduler.unstable_now;
+      var now$12 = Scheduler.unstable_now;
       var ImmediatePriority = Scheduler.unstable_ImmediatePriority;
       var UserBlockingPriority = Scheduler.unstable_UserBlockingPriority;
       var NormalPriority = Scheduler.unstable_NormalPriority;
@@ -35425,7 +35425,7 @@ function requireReactReconciler_development() {
         /* */
         1
       );
-      var Insertion = (
+      var Insertion3 = (
         /*  */
         2
       );
@@ -36127,10 +36127,10 @@ function requireReactReconciler_development() {
         return updateEffectImpl(Passive, Passive$1, create2, deps);
       }
       function mountInsertionEffect(create2, deps) {
-        return mountEffectImpl(Update, Insertion, create2, deps);
+        return mountEffectImpl(Update, Insertion3, create2, deps);
       }
       function updateInsertionEffect(create2, deps) {
-        return updateEffectImpl(Update, Insertion, create2, deps);
+        return updateEffectImpl(Update, Insertion3, create2, deps);
       }
       function mountLayoutEffect(create2, deps) {
         var fiberFlags = Update;
@@ -38273,7 +38273,7 @@ function requireReactReconciler_development() {
                     row = row.sibling;
                   }
                 }
-                if (renderState.tail !== null && now$1() > getRenderTargetTime()) {
+                if (renderState.tail !== null && now$12() > getRenderTargetTime()) {
                   workInProgress2.flags |= DidCapture;
                   didSuspendAlready = true;
                   cutOffTailIfNeeded(renderState, false);
@@ -38302,7 +38302,7 @@ function requireReactReconciler_development() {
                   // The time it took to render last row is greater than the remaining
                   // time we have to render. So rendering one more row would likely
                   // exceed it.
-                  now$1() * 2 - renderState.renderingStartTime > getRenderTargetTime() && renderLanes2 !== OffscreenLane
+                  now$12() * 2 - renderState.renderingStartTime > getRenderTargetTime() && renderLanes2 !== OffscreenLane
                 ) {
                   workInProgress2.flags |= DidCapture;
                   didSuspendAlready = true;
@@ -38327,7 +38327,7 @@ function requireReactReconciler_development() {
               var next2 = renderState.tail;
               renderState.rendering = next2;
               renderState.tail = next2.sibling;
-              renderState.renderingStartTime = now$1();
+              renderState.renderingStartTime = now$12();
               next2.sibling = null;
               var suspenseContext = suspenseStackCursor.current;
               if (didSuspendAlready) {
@@ -40592,7 +40592,7 @@ function requireReactReconciler_development() {
                   var hookName = void 0;
                   if ((effect.tag & Layout) !== NoFlags) {
                     hookName = "useLayoutEffect";
-                  } else if ((effect.tag & Insertion) !== NoFlags) {
+                  } else if ((effect.tag & Insertion3) !== NoFlags) {
                     hookName = "useInsertionEffect";
                   } else {
                     hookName = "useEffect";
@@ -40985,7 +40985,7 @@ function requireReactReconciler_development() {
                 do {
                   var _effect = effect, destroy2 = _effect.destroy, tag = _effect.tag;
                   if (destroy2 !== void 0) {
-                    if ((tag & Insertion) !== NoFlags$1) {
+                    if ((tag & Insertion3) !== NoFlags$1) {
                       safelyCallDestroy(current2, nearestMountedAncestor, destroy2);
                     } else if ((tag & Layout) !== NoFlags$1) {
                       {
@@ -41333,8 +41333,8 @@ function requireReactReconciler_development() {
             case ForwardRef:
             case MemoComponent:
             case SimpleMemoComponent: {
-              commitHookEffectListUnmount(Insertion | HasEffect, finishedWork, finishedWork.return);
-              commitHookEffectListMount(Insertion | HasEffect, finishedWork);
+              commitHookEffectListUnmount(Insertion3 | HasEffect, finishedWork, finishedWork.return);
+              commitHookEffectListMount(Insertion3 | HasEffect, finishedWork);
               if (finishedWork.mode & ProfileMode) {
                 try {
                   startLayoutEffectTimer();
@@ -41384,8 +41384,8 @@ function requireReactReconciler_development() {
           case ForwardRef:
           case MemoComponent:
           case SimpleMemoComponent: {
-            commitHookEffectListUnmount(Insertion | HasEffect, finishedWork, finishedWork.return);
-            commitHookEffectListMount(Insertion | HasEffect, finishedWork);
+            commitHookEffectListUnmount(Insertion3 | HasEffect, finishedWork, finishedWork.return);
+            commitHookEffectListMount(Insertion3 | HasEffect, finishedWork);
             if (finishedWork.mode & ProfileMode) {
               try {
                 startLayoutEffectTimer();
@@ -42532,7 +42532,7 @@ function requireReactReconciler_development() {
       var workInProgressRootRenderTargetTime = Infinity;
       var RENDER_TIMEOUT_MS = 500;
       function resetRenderTimer() {
-        workInProgressRootRenderTargetTime = now$1() + RENDER_TIMEOUT_MS;
+        workInProgressRootRenderTargetTime = now$12() + RENDER_TIMEOUT_MS;
       }
       function getRenderTargetTime() {
         return workInProgressRootRenderTargetTime;
@@ -42556,12 +42556,12 @@ function requireReactReconciler_development() {
       }
       function requestEventTime() {
         if ((executionContext & (RenderContext | CommitContext)) !== NoContext) {
-          return now$1();
+          return now$12();
         }
         if (currentEventTime !== NoTimestamp) {
           return currentEventTime;
         }
-        currentEventTime = now$1();
+        currentEventTime = now$12();
         return currentEventTime;
       }
       function requestUpdateLane(fiber) {
@@ -42795,7 +42795,7 @@ function requireReactReconciler_development() {
             var fatalError = workInProgressRootFatalError;
             prepareFreshStack(root2, NoLanes);
             markRootSuspended$1(root2, lanes);
-            ensureRootIsScheduled(root2, now$1());
+            ensureRootIsScheduled(root2, now$12());
             throw fatalError;
           }
           if (exitStatus === RootDidNotComplete) {
@@ -42816,7 +42816,7 @@ function requireReactReconciler_development() {
                 var _fatalError = workInProgressRootFatalError;
                 prepareFreshStack(root2, NoLanes);
                 markRootSuspended$1(root2, lanes);
-                ensureRootIsScheduled(root2, now$1());
+                ensureRootIsScheduled(root2, now$12());
                 throw _fatalError;
               }
             }
@@ -42825,7 +42825,7 @@ function requireReactReconciler_development() {
             finishConcurrentRender(root2, exitStatus, lanes);
           }
         }
-        ensureRootIsScheduled(root2, now$1());
+        ensureRootIsScheduled(root2, now$12());
         if (root2.callbackNode === originalCallbackNode) {
           return performConcurrentWorkOnRoot.bind(null, root2);
         }
@@ -42874,7 +42874,7 @@ function requireReactReconciler_development() {
             markRootSuspended$1(root2, lanes);
             if (includesOnlyRetries(lanes) && // do not delay if we're inside an act() scope
             !shouldForceFlushFallbacksInDEV()) {
-              var msUntilTimeout = globalMostRecentFallbackTime + FALLBACK_THROTTLE_MS - now$1();
+              var msUntilTimeout = globalMostRecentFallbackTime + FALLBACK_THROTTLE_MS - now$12();
               if (msUntilTimeout > 10) {
                 var nextLanes = getNextLanes(root2, NoLanes);
                 if (nextLanes !== NoLanes) {
@@ -42901,7 +42901,7 @@ function requireReactReconciler_development() {
             if (!shouldForceFlushFallbacksInDEV()) {
               var mostRecentEventTime = getMostRecentEventTime(root2, lanes);
               var eventTimeMs = mostRecentEventTime;
-              var timeElapsedMs = now$1() - eventTimeMs;
+              var timeElapsedMs = now$12() - eventTimeMs;
               var _msUntilTimeout = jnd(timeElapsedMs) - timeElapsedMs;
               if (_msUntilTimeout > 10) {
                 root2.timeoutHandle = scheduleTimeout(commitRoot.bind(null, root2, workInProgressRootRecoverableErrors), _msUntilTimeout);
@@ -42978,7 +42978,7 @@ function requireReactReconciler_development() {
         flushPassiveEffects();
         var lanes = getNextLanes(root2, NoLanes);
         if (!includesSomeLane(lanes, SyncLane)) {
-          ensureRootIsScheduled(root2, now$1());
+          ensureRootIsScheduled(root2, now$12());
           return null;
         }
         var exitStatus = renderRootSync(root2, lanes);
@@ -42993,7 +42993,7 @@ function requireReactReconciler_development() {
           var fatalError = workInProgressRootFatalError;
           prepareFreshStack(root2, NoLanes);
           markRootSuspended$1(root2, lanes);
-          ensureRootIsScheduled(root2, now$1());
+          ensureRootIsScheduled(root2, now$12());
           throw fatalError;
         }
         if (exitStatus === RootDidNotComplete) {
@@ -43003,13 +43003,13 @@ function requireReactReconciler_development() {
         root2.finishedWork = finishedWork;
         root2.finishedLanes = lanes;
         commitRoot(root2, workInProgressRootRecoverableErrors);
-        ensureRootIsScheduled(root2, now$1());
+        ensureRootIsScheduled(root2, now$12());
         return null;
       }
       function flushRoot(root2, lanes) {
         if (lanes !== NoLanes) {
           markRootEntangled(root2, mergeLanes(lanes, SyncLane));
-          ensureRootIsScheduled(root2, now$1());
+          ensureRootIsScheduled(root2, now$12());
           if ((executionContext & (RenderContext | CommitContext)) === NoContext) {
             resetRenderTimer();
             flushSyncCallbacks();
@@ -43118,7 +43118,7 @@ function requireReactReconciler_development() {
         var timeoutHandle = root2.timeoutHandle;
         if (timeoutHandle !== noTimeout) {
           root2.timeoutHandle = noTimeout;
-          cancelTimeout(timeoutHandle);
+          cancelTimeout2(timeoutHandle);
         }
         if (workInProgress !== null) {
           var interruptedWork = workInProgress.return;
@@ -43199,7 +43199,7 @@ function requireReactReconciler_development() {
         ReactCurrentDispatcher$2.current = prevDispatcher;
       }
       function markCommitTimeOfFallback() {
-        globalMostRecentFallbackTime = now$1();
+        globalMostRecentFallbackTime = now$12();
       }
       function markSkippedUpdateLanes(lane) {
         workInProgressRootSkippedLanes = mergeLanes(lane, workInProgressRootSkippedLanes);
@@ -43525,7 +43525,7 @@ function requireReactReconciler_development() {
         {
           onCommitRoot$1();
         }
-        ensureRootIsScheduled(root2, now$1());
+        ensureRootIsScheduled(root2, now$12());
         if (recoverableErrors !== null) {
           var onRecoverableError = root2.onRecoverableError;
           for (var i2 = 0; i2 < recoverableErrors.length; i2++) {
@@ -43706,7 +43706,7 @@ function requireReactReconciler_development() {
         markRootPinged(root2, pingedLanes);
         warnIfSuspenseResolutionNotWrappedWithActDEV(root2);
         if (workInProgressRoot === root2 && isSubsetOfLanes(workInProgressRootRenderLanes, pingedLanes)) {
-          if (workInProgressRootExitStatus === RootSuspendedWithDelay || workInProgressRootExitStatus === RootSuspended && includesOnlyRetries(workInProgressRootRenderLanes) && now$1() - globalMostRecentFallbackTime < FALLBACK_THROTTLE_MS) {
+          if (workInProgressRootExitStatus === RootSuspendedWithDelay || workInProgressRootExitStatus === RootSuspended && includesOnlyRetries(workInProgressRootRenderLanes) && now$12() - globalMostRecentFallbackTime < FALLBACK_THROTTLE_MS) {
             prepareFreshStack(root2, NoLanes);
           } else {
             workInProgressRootPingedLanes = mergeLanes(workInProgressRootPingedLanes, pingedLanes);
@@ -45798,15 +45798,15 @@ function invalidateInstance(instance) {
 function updateInstance(instance) {
   instance.onUpdate == null ? void 0 : instance.onUpdate(instance);
 }
-function updateCamera(camera, size) {
+function updateCamera(camera, size2) {
   if (!camera.manual) {
     if (isOrthographicCamera(camera)) {
-      camera.left = size.width / -2;
-      camera.right = size.width / 2;
-      camera.top = size.height / 2;
-      camera.bottom = size.height / -2;
+      camera.left = size2.width / -2;
+      camera.right = size2.width / 2;
+      camera.top = size2.height / 2;
+      camera.bottom = size2.height / -2;
     } else {
-      camera.aspect = size.width / size.height;
+      camera.aspect = size2.width / size2.height;
     }
     camera.updateProjectionMatrix();
     camera.updateMatrixWorld();
@@ -46134,13 +46134,13 @@ const createStore = (invalidate2, advance2) => {
     const position2 = new Vector3();
     const defaultTarget = new Vector3();
     const tempTarget = new Vector3();
-    function getCurrentViewport(camera = get().camera, target = defaultTarget, size = get().size) {
+    function getCurrentViewport(camera = get().camera, target = defaultTarget, size2 = get().size) {
       const {
         width: width2,
         height: height2,
         top,
         left
-      } = size;
+      } = size2;
       const aspect2 = width2 / height2;
       if (target instanceof Vector3) tempTarget.copy(target);
       else tempTarget.set(...target);
@@ -46243,7 +46243,7 @@ const createStore = (invalidate2, advance2) => {
       })),
       setSize: (width2, height2, updateStyle, top, left) => {
         const camera = get().camera;
-        const size = {
+        const size2 = {
           width: width2,
           height: height2,
           top: top || 0,
@@ -46251,10 +46251,10 @@ const createStore = (invalidate2, advance2) => {
           updateStyle
         };
         set((state2) => ({
-          size,
+          size: size2,
           viewport: {
             ...state2.viewport,
-            ...getCurrentViewport(camera, defaultTarget, size)
+            ...getCurrentViewport(camera, defaultTarget, size2)
           }
         }));
       },
@@ -46320,19 +46320,19 @@ const createStore = (invalidate2, advance2) => {
   rootState.subscribe(() => {
     const {
       camera,
-      size,
+      size: size2,
       viewport,
       gl,
       set
     } = rootState.getState();
-    if (size.width !== oldSize.width || size.height !== oldSize.height || viewport.dpr !== oldDpr) {
+    if (size2.width !== oldSize.width || size2.height !== oldSize.height || viewport.dpr !== oldDpr) {
       var _size$updateStyle;
-      oldSize = size;
+      oldSize = size2;
       oldDpr = viewport.dpr;
-      updateCamera(camera, size);
+      updateCamera(camera, size2);
       gl.setPixelRatio(viewport.dpr);
-      const updateStyle = (_size$updateStyle = size.updateStyle) != null ? _size$updateStyle : typeof HTMLCanvasElement !== "undefined" && gl.domElement instanceof HTMLCanvasElement;
-      gl.setSize(size.width, size.height, updateStyle);
+      const updateStyle = (_size$updateStyle = size2.updateStyle) != null ? _size$updateStyle : typeof HTMLCanvasElement !== "undefined" && gl.domElement instanceof HTMLCanvasElement;
+      gl.setSize(size2.width, size2.height, updateStyle);
     }
     if (camera !== oldCamera) {
       oldCamera = camera;
@@ -46685,9 +46685,9 @@ function createRoot(canvas) {
       if (events && !state.events.handlers) state.set({
         events: events(store)
       });
-      const size = computeInitialSize(canvas, propsSize);
-      if (!is.equ(size, state.size, shallowLoose)) {
-        state.setSize(size.width, size.height, size.updateStyle, size.top, size.left);
+      const size2 = computeInitialSize(canvas, propsSize);
+      if (!is.equ(size2, state.size, shallowLoose)) {
+        state.setSize(size2.width, size2.height, size2.updateStyle, size2.top, size2.left);
       }
       if (dpr && state.viewport.dpr !== calculateDpr(dpr)) state.setDpr(dpr);
       if (state.frameloop !== frameloop) state.setFrameloop(frameloop);
@@ -46770,14 +46770,14 @@ reconciler.injectIntoDevTools({
   rendererPackageName: "@react-three/fiber",
   version: React.version
 });
-function _extends$1() {
-  return _extends$1 = Object.assign ? Object.assign.bind() : function(n) {
+function _extends$3() {
+  return _extends$3 = Object.assign ? Object.assign.bind() : function(n) {
     for (var e = 1; e < arguments.length; e++) {
       var t = arguments[e];
-      for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
+      for (var r2 in t) ({}).hasOwnProperty.call(t, r2) && (n[r2] = t[r2]);
     }
     return n;
-  }, _extends$1.apply(null, arguments);
+  }, _extends$3.apply(null, arguments);
 }
 var debounce_1;
 var hasRequiredDebounce;
@@ -46885,7 +46885,7 @@ function useMeasure(_temp) {
         x,
         y
       } = state.current.element.getBoundingClientRect();
-      const size = {
+      const size2 = {
         left,
         top,
         width: width2,
@@ -46896,11 +46896,11 @@ function useMeasure(_temp) {
         y
       };
       if (state.current.element instanceof HTMLElement && offsetSize) {
-        size.height = state.current.element.offsetHeight;
-        size.width = state.current.element.offsetWidth;
+        size2.height = state.current.element.offsetHeight;
+        size2.width = state.current.element.offsetWidth;
       }
-      Object.freeze(size);
-      if (mounted.current && !areBoundsEqual(state.current.lastBounds, size)) set(state.current.lastBounds = size);
+      Object.freeze(size2);
+      if (mounted.current && !areBoundsEqual(state.current.lastBounds, size2)) set(state.current.lastBounds = size2);
     };
     return [callback, resizeDebounce ? createDebounce(callback, resizeDebounce) : callback, scrollDebounce ? createDebounce(callback, scrollDebounce) : callback];
   }, [set, offsetSize, scrollDebounce, resizeDebounce]);
@@ -47258,7 +47258,7 @@ const CanvasImpl = /* @__PURE__ */ React.forwardRef(function Canvas({
     if (canvas) return () => unmountComponentAtNode(canvas);
   }, []);
   const pointerEvents = eventSource ? "none" : "auto";
-  return /* @__PURE__ */ React.createElement("div", _extends$1({
+  return /* @__PURE__ */ React.createElement("div", _extends$3({
     ref: divRef,
     style: {
       position: "relative",
@@ -47282,7 +47282,7 @@ const CanvasImpl = /* @__PURE__ */ React.forwardRef(function Canvas({
   }, fallback)));
 });
 const Canvas2 = /* @__PURE__ */ React.forwardRef(function CanvasWrapper(props, ref) {
-  return /* @__PURE__ */ React.createElement(FiberProvider, null, /* @__PURE__ */ React.createElement(CanvasImpl, _extends$1({}, props, {
+  return /* @__PURE__ */ React.createElement(FiberProvider, null, /* @__PURE__ */ React.createElement(CanvasImpl, _extends$3({}, props, {
     ref
   })));
 });
@@ -48165,7 +48165,7 @@ const OrbitControls2 = /* @__PURE__ */ React.forwardRef(({
       });
     }
   }, [makeDefault, controls]);
-  return /* @__PURE__ */ React.createElement("primitive", _extends$1({
+  return /* @__PURE__ */ React.createElement("primitive", _extends$3({
     ref,
     object: controls,
     enableDamping
@@ -49626,9 +49626,9 @@ function parse(value, root2, parent, rule, rules, rulesets, pseudo, points, decl
 function ruleset(value, root2, parent, index, offset2, rules, points, type, props, children, length2) {
   var post = offset2 - 1;
   var rule = offset2 === 0 ? rules : [""];
-  var size = sizeof(rule);
+  var size2 = sizeof(rule);
   for (var i2 = 0, j = 0, k = 0; i2 < index; ++i2)
-    for (var x = 0, y = substr(value, post + 1, post = abs(j = points[i2])), z = value; x < size; ++x)
+    for (var x = 0, y = substr(value, post + 1, post = abs(j = points[i2])), z = value; x < size2; ++x)
       if (z = trim(j > 0 ? rule[x] + " " + y : replace(y, /&\f/g, rule[x])))
         props[k++] = z;
   return node(value, root2, parent, offset2 === 0 ? RULESET : type, props, children, length2);
@@ -49681,9 +49681,9 @@ function rulesheet(callback) {
 }
 function memoize$1(fn) {
   var cache = /* @__PURE__ */ Object.create(null);
-  return function(arg) {
-    if (cache[arg] === void 0) cache[arg] = fn(arg);
-    return cache[arg];
+  return function(arg2) {
+    if (cache[arg2] === void 0) cache[arg2] = fn(arg2);
+    return cache[arg2];
   };
 }
 var identifierWithPointTracking = function identifierWithPointTracking2(begin, points, index) {
@@ -50021,6 +50021,16 @@ var createCache = function createCache2(options) {
   cache.sheet.hydrate(nodesToHydrate);
   return cache;
 };
+function _extends$2() {
+  return _extends$2 = Object.assign ? Object.assign.bind() : function(n) {
+    for (var e = 1; e < arguments.length; e++) {
+      var t = arguments[e];
+      for (var r2 in t) ({}).hasOwnProperty.call(t, r2) && (n[r2] = t[r2]);
+    }
+    return n;
+  }, _extends$2.apply(null, arguments);
+}
+var isBrowser$1 = true;
 function getRegisteredStyles(registered, registeredStyles, classNames) {
   var rawClassName = "";
   classNames.split(" ").forEach(function(className) {
@@ -50032,7 +50042,7 @@ function getRegisteredStyles(registered, registeredStyles, classNames) {
   });
   return rawClassName;
 }
-var registerStyles = function registerStyles2(cache, serialized, isStringTag) {
+var registerStyles = function registerStyles2(cache, serialized, isStringTag2) {
   var className = cache.key + "-" + serialized.name;
   if (
     // we only need to add the styles to the registered cache if the
@@ -50040,13 +50050,17 @@ var registerStyles = function registerStyles2(cache, serialized, isStringTag) {
     // the tree but if it's a string tag, we know it won't
     // so we don't have to add it to registered cache.
     // this improves memory usage since we can avoid storing the whole style string
-    cache.registered[className] === void 0
+    (isStringTag2 === false || // we need to always store it if we're in compat mode and
+    // in node since emotion-server relies on whether a style is in
+    // the registered cache to know whether a style is global or not
+    // also, note that this check will be dead code eliminated in the browser
+    isBrowser$1 === false) && cache.registered[className] === void 0
   ) {
     cache.registered[className] = serialized.styles;
   }
 };
-var insertStyles = function insertStyles2(cache, serialized, isStringTag) {
-  registerStyles(cache, serialized);
+var insertStyles = function insertStyles2(cache, serialized, isStringTag2) {
+  registerStyles(cache, serialized, isStringTag2);
   var className = cache.key + "-" + serialized.name;
   if (cache.inserted[serialized.name] === void 0) {
     var current = serialized;
@@ -50206,6 +50220,15 @@ function handleInterpolation(mergedProps, registered, interpolation) {
       }
       return createStringFromObject(mergedProps, registered, interpolation);
     }
+    case "function": {
+      if (mergedProps !== void 0) {
+        var previousCursor = cursor;
+        var result = interpolation(mergedProps);
+        cursor = previousCursor;
+        return handleInterpolation(mergedProps, registered, result);
+      }
+      break;
+    }
   }
   var asString = interpolation;
   if (registered == null) {
@@ -50292,6 +50315,11 @@ function serializeStyles(args, registered, mergedProps) {
     next: cursor
   };
 }
+var syncFallback = function syncFallback2(create2) {
+  return create2();
+};
+var useInsertionEffect = React["useInsertionEffect"] ? React["useInsertionEffect"] : false;
+var useInsertionEffectAlwaysWithSyncFallback = useInsertionEffect || syncFallback;
 var EmotionCacheContext = /* @__PURE__ */ React.createContext(
   // we're doing this to avoid preconstruct's dead code elimination in this one case
   // because this module is primarily intended for the browser and node
@@ -50307,6 +50335,12 @@ EmotionCacheContext.Provider;
 var __unsafe_useEmotionCache = function useEmotionCache() {
   return useContext(EmotionCacheContext);
 };
+var withEmotionCache = function withEmotionCache2(func) {
+  return /* @__PURE__ */ forwardRef(function(props, ref) {
+    var cache = useContext(EmotionCacheContext);
+    return func(props, cache, ref);
+  });
+};
 var ThemeContext = /* @__PURE__ */ React.createContext({});
 const objectFromEntries = !Object.fromEntries ? (entries) => {
   if (!entries || !entries[Symbol.iterator]) {
@@ -50335,24 +50369,24 @@ const classnames = (args) => {
   let i2 = 0;
   let cls = "";
   for (; i2 < len; i2++) {
-    const arg = args[i2];
-    if (arg == null)
+    const arg2 = args[i2];
+    if (arg2 == null)
       continue;
     let toAdd;
-    switch (typeof arg) {
+    switch (typeof arg2) {
       case "boolean":
         break;
       case "object": {
-        if (Array.isArray(arg)) {
-          toAdd = classnames(arg);
+        if (Array.isArray(arg2)) {
+          toAdd = classnames(arg2);
         } else {
-          assert(!typeGuard(arg, false));
-          if (arg.styles !== void 0 && arg.name !== void 0) {
+          assert(!typeGuard(arg2, false));
+          if (arg2.styles !== void 0 && arg2.name !== void 0) {
             console.error("You have passed styles created with `css` from `@emotion/react` package to the `cx`.\n`cx` is meant to compose class names (strings) so you should convert those styles to a class name by passing them to the `css` received from <ClassNames/> component.");
           }
           toAdd = "";
-          for (const k in arg) {
-            if (arg[k] && k) {
+          for (const k in arg2) {
+            if (arg2[k] && k) {
               toAdd && (toAdd += " ");
               toAdd += k;
             }
@@ -50361,7 +50395,7 @@ const classnames = (args) => {
         break;
       }
       default: {
-        toAdd = arg;
+        toAdd = arg2;
       }
     }
     if (toAdd) {
@@ -50382,8 +50416,8 @@ function useGuaranteedMemo(fn, deps) {
   }
   return ref.current.v;
 }
-function matchCSSObject(arg) {
-  return arg instanceof Object && !("styles" in arg) && !("length" in arg) && !("__emotion_styles" in arg);
+function matchCSSObject(arg2) {
+  return arg2 instanceof Object && !("styles" in arg2) && !("length" in arg2) && !("__emotion_styles" in arg2);
 }
 const { createCssAndCx } = /* @__PURE__ */ (() => {
   function merge2(registered, css, className) {
@@ -50398,14 +50432,14 @@ const { createCssAndCx } = /* @__PURE__ */ (() => {
     const { cache } = params;
     const css = (...args) => {
       const serialized = serializeStyles(args, cache.registered);
-      insertStyles(cache, serialized);
+      insertStyles(cache, serialized, false);
       const className = `${cache.key}-${serialized.name}`;
       scope: {
-        const arg = args[0];
-        if (!matchCSSObject(arg)) {
+        const arg2 = args[0];
+        if (!matchCSSObject(arg2)) {
           break scope;
         }
-        increaseSpecificityToTakePrecedenceOverMediaQueries.saveClassNameCSSObjectMapping(cache, className, arg);
+        increaseSpecificityToTakePrecedenceOverMediaQueries.saveClassNameCSSObjectMapping(cache, className, arg2);
       }
       return className;
     };
@@ -50556,7 +50590,7 @@ function createMakeStyles(params) {
   const { useTheme: useTheme2, cache: cacheProvidedAtInception } = params;
   const { useCache } = createUseCache({ cacheProvidedAtInception });
   const { useCssAndCx } = createUseCssAndCx({ useCache });
-  function makeStyles(params2) {
+  function makeStyles2(params2) {
     const { name: nameOrWrappedName, uniqId = `${counter$1++}` } = params2 !== null && params2 !== void 0 ? params2 : {};
     const name = typeof nameOrWrappedName !== "object" ? nameOrWrappedName : Object.keys(nameOrWrappedName)[0];
     return function(cssObjectByRuleNameOrGetCssObjectByRuleName) {
@@ -50632,7 +50666,7 @@ function createMakeStyles(params) {
     const { css, cx } = useCssAndCx();
     return { theme, css, cx };
   }
-  return { makeStyles, useStyles: useStyles2 };
+  return { makeStyles: makeStyles2, useStyles: useStyles2 };
 }
 const reactContext = createContext(void 0);
 const { createUseCache } = /* @__PURE__ */ (() => {
@@ -50667,7 +50701,7 @@ function capitalize$1(str) {
 }
 function createWithStyles(params) {
   const { useTheme: useTheme2, cache } = params;
-  const { makeStyles } = createMakeStyles({ useTheme: useTheme2, cache });
+  const { makeStyles: makeStyles2 } = createMakeStyles({ useTheme: useTheme2, cache });
   function withStyles(Component, cssObjectByRuleNameOrGetCssObjectByRuleName, params2) {
     const Component_ = typeof Component === "string" ? (() => {
       const tag = Component;
@@ -50712,7 +50746,7 @@ function createWithStyles(params) {
       name2 = name2.replace(/[^a-zA-Z0-9-_]/g, "_");
       return name2;
     })();
-    const useStyles2 = makeStyles({ ...params2, name })(typeof cssObjectByRuleNameOrGetCssObjectByRuleName === "function" ? (theme, props, classes) => incorporateMediaQueries(cssObjectByRuleNameOrGetCssObjectByRuleName(theme, props, classes)) : incorporateMediaQueries(cssObjectByRuleNameOrGetCssObjectByRuleName));
+    const useStyles2 = makeStyles2({ ...params2, name })(typeof cssObjectByRuleNameOrGetCssObjectByRuleName === "function" ? (theme, props, classes) => incorporateMediaQueries(cssObjectByRuleNameOrGetCssObjectByRuleName(theme, props, classes)) : incorporateMediaQueries(cssObjectByRuleNameOrGetCssObjectByRuleName));
     function getHasNonRootClasses(classes) {
       for (const name2 in classes) {
         if (name2 === "root") {
@@ -51018,6 +51052,274 @@ const { tss: tss$1 } = createTss({
 });
 tss$1.create({});
 const THEME_ID = "$$material";
+var reactPropsRegex = /^((children|dangerouslySetInnerHTML|key|ref|autoFocus|defaultValue|defaultChecked|innerHTML|suppressContentEditableWarning|suppressHydrationWarning|valueLink|abbr|accept|acceptCharset|accessKey|action|allow|allowUserMedia|allowPaymentRequest|allowFullScreen|allowTransparency|alt|async|autoComplete|autoPlay|capture|cellPadding|cellSpacing|challenge|charSet|checked|cite|classID|className|cols|colSpan|content|contentEditable|contextMenu|controls|controlsList|coords|crossOrigin|data|dateTime|decoding|default|defer|dir|disabled|disablePictureInPicture|disableRemotePlayback|download|draggable|encType|enterKeyHint|fetchpriority|fetchPriority|form|formAction|formEncType|formMethod|formNoValidate|formTarget|frameBorder|headers|height|hidden|high|href|hrefLang|htmlFor|httpEquiv|id|inputMode|integrity|is|keyParams|keyType|kind|label|lang|list|loading|loop|low|marginHeight|marginWidth|max|maxLength|media|mediaGroup|method|min|minLength|multiple|muted|name|nonce|noValidate|open|optimum|pattern|placeholder|playsInline|poster|preload|profile|radioGroup|readOnly|referrerPolicy|rel|required|reversed|role|rows|rowSpan|sandbox|scope|scoped|scrolling|seamless|selected|shape|size|sizes|slot|span|spellCheck|src|srcDoc|srcLang|srcSet|start|step|style|summary|tabIndex|target|title|translate|type|useMap|value|width|wmode|wrap|about|datatype|inlist|prefix|property|resource|typeof|vocab|autoCapitalize|autoCorrect|autoSave|color|incremental|fallback|inert|itemProp|itemScope|itemType|itemID|itemRef|on|option|results|security|unselectable|accentHeight|accumulate|additive|alignmentBaseline|allowReorder|alphabetic|amplitude|arabicForm|ascent|attributeName|attributeType|autoReverse|azimuth|baseFrequency|baselineShift|baseProfile|bbox|begin|bias|by|calcMode|capHeight|clip|clipPathUnits|clipPath|clipRule|colorInterpolation|colorInterpolationFilters|colorProfile|colorRendering|contentScriptType|contentStyleType|cursor|cx|cy|d|decelerate|descent|diffuseConstant|direction|display|divisor|dominantBaseline|dur|dx|dy|edgeMode|elevation|enableBackground|end|exponent|externalResourcesRequired|fill|fillOpacity|fillRule|filter|filterRes|filterUnits|floodColor|floodOpacity|focusable|fontFamily|fontSize|fontSizeAdjust|fontStretch|fontStyle|fontVariant|fontWeight|format|from|fr|fx|fy|g1|g2|glyphName|glyphOrientationHorizontal|glyphOrientationVertical|glyphRef|gradientTransform|gradientUnits|hanging|horizAdvX|horizOriginX|ideographic|imageRendering|in|in2|intercept|k|k1|k2|k3|k4|kernelMatrix|kernelUnitLength|kerning|keyPoints|keySplines|keyTimes|lengthAdjust|letterSpacing|lightingColor|limitingConeAngle|local|markerEnd|markerMid|markerStart|markerHeight|markerUnits|markerWidth|mask|maskContentUnits|maskUnits|mathematical|mode|numOctaves|offset|opacity|operator|order|orient|orientation|origin|overflow|overlinePosition|overlineThickness|panose1|paintOrder|pathLength|patternContentUnits|patternTransform|patternUnits|pointerEvents|points|pointsAtX|pointsAtY|pointsAtZ|preserveAlpha|preserveAspectRatio|primitiveUnits|r|radius|refX|refY|renderingIntent|repeatCount|repeatDur|requiredExtensions|requiredFeatures|restart|result|rotate|rx|ry|scale|seed|shapeRendering|slope|spacing|specularConstant|specularExponent|speed|spreadMethod|startOffset|stdDeviation|stemh|stemv|stitchTiles|stopColor|stopOpacity|strikethroughPosition|strikethroughThickness|string|stroke|strokeDasharray|strokeDashoffset|strokeLinecap|strokeLinejoin|strokeMiterlimit|strokeOpacity|strokeWidth|surfaceScale|systemLanguage|tableValues|targetX|targetY|textAnchor|textDecoration|textRendering|textLength|to|transform|u1|u2|underlinePosition|underlineThickness|unicode|unicodeBidi|unicodeRange|unitsPerEm|vAlphabetic|vHanging|vIdeographic|vMathematical|values|vectorEffect|version|vertAdvY|vertOriginX|vertOriginY|viewBox|viewTarget|visibility|widths|wordSpacing|writingMode|x|xHeight|x1|x2|xChannelSelector|xlinkActuate|xlinkArcrole|xlinkHref|xlinkRole|xlinkShow|xlinkTitle|xlinkType|xmlBase|xmlns|xmlnsXlink|xmlLang|xmlSpace|y|y1|y2|yChannelSelector|z|zoomAndPan|for|class|autofocus)|(([Dd][Aa][Tt][Aa]|[Aa][Rr][Ii][Aa]|x)-.*))$/;
+var isPropValid = /* @__PURE__ */ memoize$1(
+  function(prop) {
+    return reactPropsRegex.test(prop) || prop.charCodeAt(0) === 111 && prop.charCodeAt(1) === 110 && prop.charCodeAt(2) < 91;
+  }
+  /* Z+1 */
+);
+var testOmitPropsOnStringTag = isPropValid;
+var testOmitPropsOnComponent = function testOmitPropsOnComponent2(key) {
+  return key !== "theme";
+};
+var getDefaultShouldForwardProp = function getDefaultShouldForwardProp2(tag) {
+  return typeof tag === "string" && // 96 is one less than the char code
+  // for "a" so this is checking that
+  // it's a lowercase character
+  tag.charCodeAt(0) > 96 ? testOmitPropsOnStringTag : testOmitPropsOnComponent;
+};
+var composeShouldForwardProps = function composeShouldForwardProps2(tag, options, isReal) {
+  var shouldForwardProp2;
+  if (options) {
+    var optionsShouldForwardProp = options.shouldForwardProp;
+    shouldForwardProp2 = tag.__emotion_forwardProp && optionsShouldForwardProp ? function(propName) {
+      return tag.__emotion_forwardProp(propName) && optionsShouldForwardProp(propName);
+    } : optionsShouldForwardProp;
+  }
+  if (typeof shouldForwardProp2 !== "function" && isReal) {
+    shouldForwardProp2 = tag.__emotion_forwardProp;
+  }
+  return shouldForwardProp2;
+};
+var Insertion = function Insertion2(_ref) {
+  var cache = _ref.cache, serialized = _ref.serialized, isStringTag2 = _ref.isStringTag;
+  registerStyles(cache, serialized, isStringTag2);
+  useInsertionEffectAlwaysWithSyncFallback(function() {
+    return insertStyles(cache, serialized, isStringTag2);
+  });
+  return null;
+};
+var createStyled$1 = function createStyled(tag, options) {
+  var isReal = tag.__emotion_real === tag;
+  var baseTag = isReal && tag.__emotion_base || tag;
+  var identifierName;
+  var targetClassName;
+  if (options !== void 0) {
+    identifierName = options.label;
+    targetClassName = options.target;
+  }
+  var shouldForwardProp2 = composeShouldForwardProps(tag, options, isReal);
+  var defaultShouldForwardProp = shouldForwardProp2 || getDefaultShouldForwardProp(baseTag);
+  var shouldUseAs = !defaultShouldForwardProp("as");
+  return function() {
+    var args = arguments;
+    var styles = isReal && tag.__emotion_styles !== void 0 ? tag.__emotion_styles.slice(0) : [];
+    if (identifierName !== void 0) {
+      styles.push("label:" + identifierName + ";");
+    }
+    if (args[0] == null || args[0].raw === void 0) {
+      styles.push.apply(styles, args);
+    } else {
+      var templateStringsArr = args[0];
+      styles.push(templateStringsArr[0]);
+      var len = args.length;
+      var i2 = 1;
+      for (; i2 < len; i2++) {
+        styles.push(args[i2], templateStringsArr[i2]);
+      }
+    }
+    var Styled = withEmotionCache(function(props, cache, ref) {
+      var FinalTag = shouldUseAs && props.as || baseTag;
+      var className = "";
+      var classInterpolations = [];
+      var mergedProps = props;
+      if (props.theme == null) {
+        mergedProps = {};
+        for (var key in props) {
+          mergedProps[key] = props[key];
+        }
+        mergedProps.theme = React.useContext(ThemeContext);
+      }
+      if (typeof props.className === "string") {
+        className = getRegisteredStyles(cache.registered, classInterpolations, props.className);
+      } else if (props.className != null) {
+        className = props.className + " ";
+      }
+      var serialized = serializeStyles(styles.concat(classInterpolations), cache.registered, mergedProps);
+      className += cache.key + "-" + serialized.name;
+      if (targetClassName !== void 0) {
+        className += " " + targetClassName;
+      }
+      var finalShouldForwardProp = shouldUseAs && shouldForwardProp2 === void 0 ? getDefaultShouldForwardProp(FinalTag) : defaultShouldForwardProp;
+      var newProps = {};
+      for (var _key in props) {
+        if (shouldUseAs && _key === "as") continue;
+        if (finalShouldForwardProp(_key)) {
+          newProps[_key] = props[_key];
+        }
+      }
+      newProps.className = className;
+      if (ref) {
+        newProps.ref = ref;
+      }
+      return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Insertion, {
+        cache,
+        serialized,
+        isStringTag: typeof FinalTag === "string"
+      }), /* @__PURE__ */ React.createElement(FinalTag, newProps));
+    });
+    Styled.displayName = identifierName !== void 0 ? identifierName : "Styled(" + (typeof baseTag === "string" ? baseTag : baseTag.displayName || baseTag.name || "Component") + ")";
+    Styled.defaultProps = tag.defaultProps;
+    Styled.__emotion_real = Styled;
+    Styled.__emotion_base = baseTag;
+    Styled.__emotion_styles = styles;
+    Styled.__emotion_forwardProp = shouldForwardProp2;
+    Object.defineProperty(Styled, "toString", {
+      value: function value() {
+        return "." + targetClassName;
+      }
+    });
+    Styled.withComponent = function(nextTag, nextOptions) {
+      var newStyled2 = createStyled(nextTag, _extends$2({}, options, nextOptions, {
+        shouldForwardProp: composeShouldForwardProps(Styled, nextOptions, true)
+      }));
+      return newStyled2.apply(void 0, styles);
+    };
+    return Styled;
+  };
+};
+var tags = [
+  "a",
+  "abbr",
+  "address",
+  "area",
+  "article",
+  "aside",
+  "audio",
+  "b",
+  "base",
+  "bdi",
+  "bdo",
+  "big",
+  "blockquote",
+  "body",
+  "br",
+  "button",
+  "canvas",
+  "caption",
+  "cite",
+  "code",
+  "col",
+  "colgroup",
+  "data",
+  "datalist",
+  "dd",
+  "del",
+  "details",
+  "dfn",
+  "dialog",
+  "div",
+  "dl",
+  "dt",
+  "em",
+  "embed",
+  "fieldset",
+  "figcaption",
+  "figure",
+  "footer",
+  "form",
+  "h1",
+  "h2",
+  "h3",
+  "h4",
+  "h5",
+  "h6",
+  "head",
+  "header",
+  "hgroup",
+  "hr",
+  "html",
+  "i",
+  "iframe",
+  "img",
+  "input",
+  "ins",
+  "kbd",
+  "keygen",
+  "label",
+  "legend",
+  "li",
+  "link",
+  "main",
+  "map",
+  "mark",
+  "marquee",
+  "menu",
+  "menuitem",
+  "meta",
+  "meter",
+  "nav",
+  "noscript",
+  "object",
+  "ol",
+  "optgroup",
+  "option",
+  "output",
+  "p",
+  "param",
+  "picture",
+  "pre",
+  "progress",
+  "q",
+  "rp",
+  "rt",
+  "ruby",
+  "s",
+  "samp",
+  "script",
+  "section",
+  "select",
+  "small",
+  "source",
+  "span",
+  "strong",
+  "style",
+  "sub",
+  "summary",
+  "sup",
+  "table",
+  "tbody",
+  "td",
+  "textarea",
+  "tfoot",
+  "th",
+  "thead",
+  "time",
+  "title",
+  "tr",
+  "track",
+  "u",
+  "ul",
+  "var",
+  "video",
+  "wbr",
+  // SVG
+  "circle",
+  "clipPath",
+  "defs",
+  "ellipse",
+  "foreignObject",
+  "g",
+  "image",
+  "line",
+  "linearGradient",
+  "mask",
+  "path",
+  "pattern",
+  "polygon",
+  "polyline",
+  "radialGradient",
+  "rect",
+  "stop",
+  "svg",
+  "text",
+  "tspan"
+];
+var newStyled = createStyled$1.bind(null);
+tags.forEach(function(tagName) {
+  newStyled[tagName] = newStyled(tagName);
+});
 var jsxRuntime = { exports: {} };
 var reactJsxRuntime_development = {};
 var hasRequiredReactJsxRuntime_development;
@@ -51114,7 +51416,7 @@ function requireReactJsxRuntime_development() {
         }
         return false;
       }
-      function getWrappedName(outerType, innerType, wrapperName) {
+      function getWrappedName2(outerType, innerType, wrapperName) {
         var displayName = outerType.displayName;
         if (displayName) {
           return displayName;
@@ -51163,7 +51465,7 @@ function requireReactJsxRuntime_development() {
               var provider = type;
               return getContextName(provider._context) + ".Provider";
             case REACT_FORWARD_REF_TYPE:
-              return getWrappedName(type, type.render, "ForwardRef");
+              return getWrappedName2(type, type.render, "ForwardRef");
             case REACT_MEMO_TYPE:
               var outerName = type.displayName || null;
               if (outerName !== null) {
@@ -51915,6 +52217,30 @@ function requireJsxRuntime() {
   return jsxRuntime.exports;
 }
 var jsxRuntimeExports = requireJsxRuntime();
+function styled$1(tag, options) {
+  const stylesFactory = newStyled(tag, options);
+  {
+    return (...styles) => {
+      const component = typeof tag === "string" ? `"${tag}"` : "component";
+      if (styles.length === 0) {
+        console.error([`MUI: Seems like you called \`styled(${component})()\` without a \`style\` argument.`, 'You must provide a `styles` argument: `styled("div")(styleYouForgotToPass)`.'].join("\n"));
+      } else if (styles.some((style2) => style2 === void 0)) {
+        console.error(`MUI: the styled(${component})(...args) API requires all its args to be defined.`);
+      }
+      return stylesFactory(...styles);
+    };
+  }
+}
+function internal_mutateStyles(tag, processor) {
+  if (Array.isArray(tag.__emotion_styles)) {
+    tag.__emotion_styles = processor(tag.__emotion_styles);
+  }
+}
+const wrapper = [];
+function internal_serializeStyles(styles) {
+  wrapper[0] = styles;
+  return serializeStyles(wrapper);
+}
 var reactIs = { exports: {} };
 var reactIs_development = {};
 var hasRequiredReactIs_development;
@@ -52367,11 +52693,11 @@ function style$1(options) {
 }
 function memoize(fn) {
   const cache = {};
-  return (arg) => {
-    if (cache[arg] === void 0) {
-      cache[arg] = fn(arg);
+  return (arg2) => {
+    if (cache[arg2] === void 0) {
+      cache[arg2] = fn(arg2);
     }
-    return cache[arg];
+    return cache[arg2];
   };
 }
 const properties = {
@@ -53040,8 +53366,8 @@ function objectsHaveSameKeys(...objects) {
   const union = new Set(allKeys);
   return objects.every((object) => union.size === Object.keys(object).length);
 }
-function callIfFn(maybeFn, arg) {
-  return typeof maybeFn === "function" ? maybeFn(arg) : maybeFn;
+function callIfFn(maybeFn, arg2) {
+  return typeof maybeFn === "function" ? maybeFn(arg2) : maybeFn;
 }
 function unstable_createStyleFunctionSx() {
   function getThemeValue(prop, val, theme, config) {
@@ -53205,17 +53531,66 @@ function createTheme$1(options = {}, ...args) {
   };
   return muiTheme;
 }
-function isObjectEmpty(obj) {
+function isObjectEmpty$1(obj) {
   return Object.keys(obj).length === 0;
 }
 function useTheme$2(defaultTheme2 = null) {
   const contextTheme = React.useContext(ThemeContext);
-  return !contextTheme || isObjectEmpty(contextTheme) ? defaultTheme2 : contextTheme;
+  return !contextTheme || isObjectEmpty$1(contextTheme) ? defaultTheme2 : contextTheme;
 }
-const systemDefaultTheme = createTheme$1();
-function useTheme$1(defaultTheme2 = systemDefaultTheme) {
+const systemDefaultTheme$1 = createTheme$1();
+function useTheme$1(defaultTheme2 = systemDefaultTheme$1) {
   return useTheme$2(defaultTheme2);
 }
+const splitProps = (props) => {
+  const result = {
+    systemProps: {},
+    otherProps: {}
+  };
+  const config = props?.theme?.unstable_sxConfig ?? defaultSxConfig;
+  Object.keys(props).forEach((prop) => {
+    if (config[prop]) {
+      result.systemProps[prop] = props[prop];
+    } else {
+      result.otherProps[prop] = props[prop];
+    }
+  });
+  return result;
+};
+function extendSxProp$1(props) {
+  const {
+    sx: inSx,
+    ...other
+  } = props;
+  const {
+    systemProps,
+    otherProps
+  } = splitProps(other);
+  let finalSx;
+  if (Array.isArray(inSx)) {
+    finalSx = [systemProps, ...inSx];
+  } else if (typeof inSx === "function") {
+    finalSx = (...args) => {
+      const result = inSx(...args);
+      if (!isPlainObject(result)) {
+        return systemProps;
+      }
+      return {
+        ...systemProps,
+        ...result
+      };
+    };
+  } else {
+    finalSx = {
+      ...systemProps,
+      ...inSx
+    };
+  }
+  return {
+    ...otherProps,
+    sx: finalSx
+  };
+}
 const defaultGenerator = (componentName) => componentName;
 const createClassNameGenerator = () => {
   let generate = defaultGenerator;
@@ -53232,6 +53607,19 @@ const createClassNameGenerator = () => {
   };
 };
 const ClassNameGenerator = createClassNameGenerator();
+function r(e) {
+  var t, f, n = "";
+  if ("string" == typeof e || "number" == typeof e) n += e;
+  else if ("object" == typeof e) if (Array.isArray(e)) {
+    var o = e.length;
+    for (t = 0; t < o; t++) e[t] && (f = r(e[t])) && (n && (n += " "), n += f);
+  } else for (f in e) e[f] && (n && (n += " "), n += f);
+  return n;
+}
+function clsx() {
+  for (var e, t, f = 0, n = "", o = arguments.length; f < o; f++) (e = arguments[f]) && (t = r(e)) && (n && (n += " "), n += t);
+  return n;
+}
 const globalStateClasses = {
   active: "active",
   checked: "checked",
@@ -53250,6 +53638,321 @@ function generateUtilityClass(componentName, slot, globalStatePrefix = "Mui") {
   const globalStateClass = globalStateClasses[slot];
   return globalStateClass ? `${globalStatePrefix}-${globalStateClass}` : `${ClassNameGenerator.generate(componentName)}-${slot}`;
 }
+function generateUtilityClasses(componentName, slots, globalStatePrefix = "Mui") {
+  const result = {};
+  slots.forEach((slot) => {
+    result[slot] = generateUtilityClass(componentName, slot, globalStatePrefix);
+  });
+  return result;
+}
+function getFunctionComponentName(Component, fallback = "") {
+  return Component.displayName || Component.name || fallback;
+}
+function getWrappedName(outerType, innerType, wrapperName) {
+  const functionName = getFunctionComponentName(innerType);
+  return outerType.displayName || (functionName !== "" ? `${wrapperName}(${functionName})` : wrapperName);
+}
+function getDisplayName(Component) {
+  if (Component == null) {
+    return void 0;
+  }
+  if (typeof Component === "string") {
+    return Component;
+  }
+  if (typeof Component === "function") {
+    return getFunctionComponentName(Component, "Component");
+  }
+  if (typeof Component === "object") {
+    switch (Component.$$typeof) {
+      case reactIsExports.ForwardRef:
+        return getWrappedName(Component, Component.render, "ForwardRef");
+      case reactIsExports.Memo:
+        return getWrappedName(Component, Component.type, "memo");
+      default:
+        return void 0;
+    }
+  }
+  return void 0;
+}
+function preprocessStyles(input) {
+  const {
+    variants,
+    ...style2
+  } = input;
+  const result = {
+    variants,
+    style: internal_serializeStyles(style2),
+    isProcessed: true
+  };
+  if (result.style === style2) {
+    return result;
+  }
+  if (variants) {
+    variants.forEach((variant) => {
+      if (typeof variant.style !== "function") {
+        variant.style = internal_serializeStyles(variant.style);
+      }
+    });
+  }
+  return result;
+}
+const systemDefaultTheme = createTheme$1();
+function shouldForwardProp(prop) {
+  return prop !== "ownerState" && prop !== "theme" && prop !== "sx" && prop !== "as";
+}
+function defaultOverridesResolver(slot) {
+  if (!slot) {
+    return null;
+  }
+  return (_props, styles) => styles[slot];
+}
+function attachTheme(props, themeId, defaultTheme2) {
+  props.theme = isObjectEmpty(props.theme) ? defaultTheme2 : props.theme[themeId] || props.theme;
+}
+function processStyle(props, style2) {
+  const resolvedStyle = typeof style2 === "function" ? style2(props) : style2;
+  if (Array.isArray(resolvedStyle)) {
+    return resolvedStyle.flatMap((subStyle) => processStyle(props, subStyle));
+  }
+  if (Array.isArray(resolvedStyle?.variants)) {
+    let rootStyle;
+    if (resolvedStyle.isProcessed) {
+      rootStyle = resolvedStyle.style;
+    } else {
+      const {
+        variants,
+        ...otherStyles
+      } = resolvedStyle;
+      rootStyle = otherStyles;
+    }
+    return processStyleVariants(props, resolvedStyle.variants, [rootStyle]);
+  }
+  if (resolvedStyle?.isProcessed) {
+    return resolvedStyle.style;
+  }
+  return resolvedStyle;
+}
+function processStyleVariants(props, variants, results = []) {
+  let mergedState;
+  variantLoop: for (let i2 = 0; i2 < variants.length; i2 += 1) {
+    const variant = variants[i2];
+    if (typeof variant.props === "function") {
+      mergedState ??= {
+        ...props,
+        ...props.ownerState,
+        ownerState: props.ownerState
+      };
+      if (!variant.props(mergedState)) {
+        continue;
+      }
+    } else {
+      for (const key in variant.props) {
+        if (props[key] !== variant.props[key] && props.ownerState?.[key] !== variant.props[key]) {
+          continue variantLoop;
+        }
+      }
+    }
+    if (typeof variant.style === "function") {
+      mergedState ??= {
+        ...props,
+        ...props.ownerState,
+        ownerState: props.ownerState
+      };
+      results.push(variant.style(mergedState));
+    } else {
+      results.push(variant.style);
+    }
+  }
+  return results;
+}
+function createStyled2(input = {}) {
+  const {
+    themeId,
+    defaultTheme: defaultTheme2 = systemDefaultTheme,
+    rootShouldForwardProp: rootShouldForwardProp2 = shouldForwardProp,
+    slotShouldForwardProp: slotShouldForwardProp2 = shouldForwardProp
+  } = input;
+  function styleAttachTheme(props) {
+    attachTheme(props, themeId, defaultTheme2);
+  }
+  const styled2 = (tag, inputOptions = {}) => {
+    internal_mutateStyles(tag, (styles) => styles.filter((style2) => style2 !== styleFunctionSx));
+    const {
+      name: componentName,
+      slot: componentSlot,
+      skipVariantsResolver: inputSkipVariantsResolver,
+      skipSx: inputSkipSx,
+      // TODO v6: remove `lowercaseFirstLetter()` in the next major release
+      // For more details: https://github.com/mui/material-ui/pull/37908
+      overridesResolver = defaultOverridesResolver(lowercaseFirstLetter(componentSlot)),
+      ...options
+    } = inputOptions;
+    const skipVariantsResolver = inputSkipVariantsResolver !== void 0 ? inputSkipVariantsResolver : (
+      // TODO v6: remove `Root` in the next major release
+      // For more details: https://github.com/mui/material-ui/pull/37908
+      componentSlot && componentSlot !== "Root" && componentSlot !== "root" || false
+    );
+    const skipSx = inputSkipSx || false;
+    let shouldForwardPropOption = shouldForwardProp;
+    if (componentSlot === "Root" || componentSlot === "root") {
+      shouldForwardPropOption = rootShouldForwardProp2;
+    } else if (componentSlot) {
+      shouldForwardPropOption = slotShouldForwardProp2;
+    } else if (isStringTag(tag)) {
+      shouldForwardPropOption = void 0;
+    }
+    const defaultStyledResolver = styled$1(tag, {
+      shouldForwardProp: shouldForwardPropOption,
+      label: generateStyledLabel(componentName, componentSlot),
+      ...options
+    });
+    const transformStyle = (style2) => {
+      if (typeof style2 === "function" && style2.__emotion_real !== style2) {
+        return function styleFunctionProcessor(props) {
+          return processStyle(props, style2);
+        };
+      }
+      if (isPlainObject(style2)) {
+        const serialized = preprocessStyles(style2);
+        if (!serialized.variants) {
+          return serialized.style;
+        }
+        return function styleObjectProcessor(props) {
+          return processStyle(props, serialized);
+        };
+      }
+      return style2;
+    };
+    const muiStyledResolver = (...expressionsInput) => {
+      const expressionsHead = [];
+      const expressionsBody = expressionsInput.map(transformStyle);
+      const expressionsTail = [];
+      expressionsHead.push(styleAttachTheme);
+      if (componentName && overridesResolver) {
+        expressionsTail.push(function styleThemeOverrides(props) {
+          const theme = props.theme;
+          const styleOverrides = theme.components?.[componentName]?.styleOverrides;
+          if (!styleOverrides) {
+            return null;
+          }
+          const resolvedStyleOverrides = {};
+          for (const slotKey in styleOverrides) {
+            resolvedStyleOverrides[slotKey] = processStyle(props, styleOverrides[slotKey]);
+          }
+          return overridesResolver(props, resolvedStyleOverrides);
+        });
+      }
+      if (componentName && !skipVariantsResolver) {
+        expressionsTail.push(function styleThemeVariants(props) {
+          const theme = props.theme;
+          const themeVariants = theme?.components?.[componentName]?.variants;
+          if (!themeVariants) {
+            return null;
+          }
+          return processStyleVariants(props, themeVariants);
+        });
+      }
+      if (!skipSx) {
+        expressionsTail.push(styleFunctionSx);
+      }
+      if (Array.isArray(expressionsBody[0])) {
+        const inputStrings = expressionsBody.shift();
+        const placeholdersHead = new Array(expressionsHead.length).fill("");
+        const placeholdersTail = new Array(expressionsTail.length).fill("");
+        let outputStrings;
+        {
+          outputStrings = [...placeholdersHead, ...inputStrings, ...placeholdersTail];
+          outputStrings.raw = [...placeholdersHead, ...inputStrings.raw, ...placeholdersTail];
+        }
+        expressionsHead.unshift(outputStrings);
+      }
+      const expressions = [...expressionsHead, ...expressionsBody, ...expressionsTail];
+      const Component = defaultStyledResolver(...expressions);
+      if (tag.muiName) {
+        Component.muiName = tag.muiName;
+      }
+      {
+        Component.displayName = generateDisplayName(componentName, componentSlot, tag);
+      }
+      return Component;
+    };
+    if (defaultStyledResolver.withConfig) {
+      muiStyledResolver.withConfig = defaultStyledResolver.withConfig;
+    }
+    return muiStyledResolver;
+  };
+  return styled2;
+}
+function generateDisplayName(componentName, componentSlot, tag) {
+  if (componentName) {
+    return `${componentName}${capitalize(componentSlot || "")}`;
+  }
+  return `Styled(${getDisplayName(tag)})`;
+}
+function generateStyledLabel(componentName, componentSlot) {
+  let label;
+  {
+    if (componentName) {
+      label = `${componentName}-${lowercaseFirstLetter(componentSlot || "Root")}`;
+    }
+  }
+  return label;
+}
+function isObjectEmpty(object) {
+  for (const _ in object) {
+    return false;
+  }
+  return true;
+}
+function isStringTag(tag) {
+  return typeof tag === "string" && // 96 is one less than the char code
+  // for "a" so this is checking that
+  // it's a lowercase character
+  tag.charCodeAt(0) > 96;
+}
+function lowercaseFirstLetter(string) {
+  if (!string) {
+    return string;
+  }
+  return string.charAt(0).toLowerCase() + string.slice(1);
+}
+function resolveProps(defaultProps, props) {
+  const output = {
+    ...props
+  };
+  for (const key in defaultProps) {
+    if (Object.prototype.hasOwnProperty.call(defaultProps, key)) {
+      const propName = key;
+      if (propName === "components" || propName === "slots") {
+        output[propName] = {
+          ...defaultProps[propName],
+          ...output[propName]
+        };
+      } else if (propName === "componentsProps" || propName === "slotProps") {
+        const defaultSlotProps = defaultProps[propName];
+        const slotProps = props[propName];
+        if (!slotProps) {
+          output[propName] = defaultSlotProps || {};
+        } else if (!defaultSlotProps) {
+          output[propName] = slotProps;
+        } else {
+          output[propName] = {
+            ...slotProps
+          };
+          for (const slotKey in defaultSlotProps) {
+            if (Object.prototype.hasOwnProperty.call(defaultSlotProps, slotKey)) {
+              const slotPropName = slotKey;
+              output[propName][slotPropName] = resolveProps(defaultSlotProps[slotPropName], slotProps[slotPropName]);
+            }
+          }
+        }
+      } else if (output[propName] === void 0) {
+        output[propName] = defaultProps[propName];
+      }
+    }
+  }
+  return output;
+}
 const useEnhancedEffect$1 = typeof window !== "undefined" ? React.useLayoutEffect : React.useEffect;
 function clamp(val, min = Number.MIN_SAFE_INTEGER, max = Number.MAX_SAFE_INTEGER) {
   return Math.max(min, Math.min(val, max));
@@ -53470,6 +54173,69 @@ function exactProp(propTypes2) {
     }
   };
 }
+const PropsContext = /* @__PURE__ */ React.createContext(void 0);
+({
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * @ignore
+   */
+  children: PropTypes.node,
+  /**
+   * @ignore
+   */
+  value: PropTypes.object
+});
+function getThemeProps(params) {
+  const {
+    theme,
+    name,
+    props
+  } = params;
+  if (!theme || !theme.components || !theme.components[name]) {
+    return props;
+  }
+  const config = theme.components[name];
+  if (config.defaultProps) {
+    return resolveProps(config.defaultProps, props);
+  }
+  if (!config.styleOverrides && !config.variants) {
+    return resolveProps(config, props);
+  }
+  return props;
+}
+function useDefaultProps$1({
+  props,
+  name
+}) {
+  const ctx = React.useContext(PropsContext);
+  return getThemeProps({
+    props,
+    name,
+    theme: {
+      components: ctx
+    }
+  });
+}
+const arg = {
+  theme: void 0
+};
+function unstable_memoTheme(styleFn) {
+  let lastValue;
+  let lastTheme;
+  return function styleMemoized(props) {
+    let value = lastValue;
+    if (value === void 0 || props.theme !== lastTheme) {
+      arg.theme = props.theme;
+      value = preprocessStyles(styleFn(arg));
+      lastValue = value;
+      lastTheme = props.theme;
+    }
+    return value;
+  };
+}
 function createGetCssVar$1(prefix2 = "") {
   function appendVar(...vars) {
     if (!vars.length) {
@@ -53735,6 +54501,26 @@ function createGetColorSchemeSelector(selector) {
     return "&";
   };
 }
+function composeClasses(slots, getUtilityClass, classes = void 0) {
+  const output = {};
+  for (const slotName in slots) {
+    const slot = slots[slotName];
+    let buffer = "";
+    let start = true;
+    for (let i2 = 0; i2 < slot.length; i2 += 1) {
+      const value = slot[i2];
+      if (value) {
+        buffer += (start === true ? "" : " ") + getUtilityClass(value);
+        start = false;
+        if (classes && classes[value]) {
+          buffer += " " + classes[value];
+        }
+      }
+    }
+    output[slotName] = buffer;
+  }
+  return output;
+}
 const common = {
   black: "#000",
   white: "#fff"
@@ -54161,17 +54947,17 @@ function createTypography(palette, typography) {
     }
   }
   const coef = fontSize / 14;
-  const pxToRem = pxToRem2 || ((size) => `${size / htmlFontSize * coef}rem`);
-  const buildVariant = (fontWeight, size, lineHeight, letterSpacing, casing) => ({
+  const pxToRem = pxToRem2 || ((size2) => `${size2 / htmlFontSize * coef}rem`);
+  const buildVariant = (fontWeight, size2, lineHeight, letterSpacing, casing) => ({
     fontFamily,
     fontWeight,
-    fontSize: pxToRem(size),
+    fontSize: pxToRem(size2),
     // Unitless following https://meyerweb.com/eric/thoughts/2006/02/08/unitless-line-heights/
     lineHeight,
     // The letter spacing was designed for the Roboto font-family. Using the same letter-spacing
     // across font-families can cause issues with the kerning.
     ...fontFamily === defaultFontFamily ? {
-      letterSpacing: `${round(letterSpacing / size)}em`
+      letterSpacing: `${round(letterSpacing / size2)}em`
     } : {},
     ...casing,
     ...allVariants
@@ -54961,7 +55747,16 @@ function useTheme() {
   }
   return theme[THEME_ID] || theme;
 }
-createMakeAndWithStyles({
+function slotShouldForwardProp(prop) {
+  return prop !== "ownerState" && prop !== "theme" && prop !== "sx" && prop !== "as";
+}
+const rootShouldForwardProp = (prop) => slotShouldForwardProp(prop) && prop !== "classes";
+const styled = createStyled2({
+  themeId: THEME_ID,
+  defaultTheme,
+  rootShouldForwardProp
+});
+const { makeStyles } = createMakeAndWithStyles({
   useTheme
 });
 const { tss } = createTss({
@@ -54972,6 +55767,27 @@ const { tss } = createTss({
   "usePlugin": useMuiThemeStyleOverridesPlugin
 });
 const useStyles = tss.create({});
+function internal_createExtendSxProp() {
+  return extendSxProp$1;
+}
+const memoTheme = unstable_memoTheme;
+({
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * @ignore
+   */
+  children: PropTypes.node,
+  /**
+   * @ignore
+   */
+  value: PropTypes.object.isRequired
+});
+function useDefaultProps(params) {
+  return useDefaultProps$1(params);
+}
 function setRef$1(ref, value) {
   if (typeof ref === "function") {
     ref(value);
@@ -55027,6 +55843,23 @@ function useForkRef$1(...refs) {
     };
   }, refs);
 }
+function hasCorrectMainProperty(obj) {
+  return typeof obj.main === "string";
+}
+function checkSimplePaletteColorValues(obj, additionalPropertiesToCheck = []) {
+  if (!hasCorrectMainProperty(obj)) {
+    return false;
+  }
+  for (const value of additionalPropertiesToCheck) {
+    if (!obj.hasOwnProperty(value) || typeof obj[value] !== "string") {
+      return false;
+    }
+  }
+  return true;
+}
+function createSimplePaletteValueFilter(additionalPropertiesToCheck = []) {
+  return ([, value]) => value && checkSimplePaletteColorValues(value, additionalPropertiesToCheck);
+}
 function HTMLElementType(props, propName, componentName, location, propFullName) {
   const propValue = props[propName];
   const safePropName = propFullName || propName;
@@ -55109,6 +55942,263 @@ Portal.propTypes = {
 {
   Portal["propTypes"] = exactProp(Portal.propTypes);
 }
+function getTypographyUtilityClass(slot) {
+  return generateUtilityClass("MuiTypography", slot);
+}
+generateUtilityClasses("MuiTypography", ["root", "h1", "h2", "h3", "h4", "h5", "h6", "subtitle1", "subtitle2", "body1", "body2", "inherit", "button", "caption", "overline", "alignLeft", "alignRight", "alignCenter", "alignJustify", "noWrap", "gutterBottom", "paragraph"]);
+const v6Colors = {
+  primary: true,
+  secondary: true,
+  error: true,
+  info: true,
+  success: true,
+  warning: true,
+  textPrimary: true,
+  textSecondary: true,
+  textDisabled: true
+};
+const extendSxProp = internal_createExtendSxProp();
+const useUtilityClasses = (ownerState) => {
+  const {
+    align,
+    gutterBottom,
+    noWrap,
+    paragraph,
+    variant,
+    classes
+  } = ownerState;
+  const slots = {
+    root: ["root", variant, ownerState.align !== "inherit" && `align${capitalize(align)}`, gutterBottom && "gutterBottom", noWrap && "noWrap", paragraph && "paragraph"]
+  };
+  return composeClasses(slots, getTypographyUtilityClass, classes);
+};
+const TypographyRoot = styled("span", {
+  name: "MuiTypography",
+  slot: "Root",
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    return [styles.root, ownerState.variant && styles[ownerState.variant], ownerState.align !== "inherit" && styles[`align${capitalize(ownerState.align)}`], ownerState.noWrap && styles.noWrap, ownerState.gutterBottom && styles.gutterBottom, ownerState.paragraph && styles.paragraph];
+  }
+})(memoTheme(({
+  theme
+}) => ({
+  margin: 0,
+  variants: [{
+    props: {
+      variant: "inherit"
+    },
+    style: {
+      // Some elements, like <button> on Chrome have default font that doesn't inherit, reset this.
+      font: "inherit",
+      lineHeight: "inherit",
+      letterSpacing: "inherit"
+    }
+  }, ...Object.entries(theme.typography).filter(([variant, value]) => variant !== "inherit" && value && typeof value === "object").map(([variant, value]) => ({
+    props: {
+      variant
+    },
+    style: value
+  })), ...Object.entries(theme.palette).filter(createSimplePaletteValueFilter()).map(([color2]) => ({
+    props: {
+      color: color2
+    },
+    style: {
+      color: (theme.vars || theme).palette[color2].main
+    }
+  })), ...Object.entries(theme.palette?.text || {}).filter(([, value]) => typeof value === "string").map(([color2]) => ({
+    props: {
+      color: `text${capitalize(color2)}`
+    },
+    style: {
+      color: (theme.vars || theme).palette.text[color2]
+    }
+  })), {
+    props: ({
+      ownerState
+    }) => ownerState.align !== "inherit",
+    style: {
+      textAlign: "var(--Typography-textAlign)"
+    }
+  }, {
+    props: ({
+      ownerState
+    }) => ownerState.noWrap,
+    style: {
+      overflow: "hidden",
+      textOverflow: "ellipsis",
+      whiteSpace: "nowrap"
+    }
+  }, {
+    props: ({
+      ownerState
+    }) => ownerState.gutterBottom,
+    style: {
+      marginBottom: "0.35em"
+    }
+  }, {
+    props: ({
+      ownerState
+    }) => ownerState.paragraph,
+    style: {
+      marginBottom: 16
+    }
+  }]
+})));
+const defaultVariantMapping = {
+  h1: "h1",
+  h2: "h2",
+  h3: "h3",
+  h4: "h4",
+  h5: "h5",
+  h6: "h6",
+  subtitle1: "h6",
+  subtitle2: "h6",
+  body1: "p",
+  body2: "p",
+  inherit: "p"
+};
+const Typography = /* @__PURE__ */ React.forwardRef(function Typography2(inProps, ref) {
+  const {
+    color: color2,
+    ...themeProps
+  } = useDefaultProps({
+    props: inProps,
+    name: "MuiTypography"
+  });
+  const isSxColor = !v6Colors[color2];
+  const props = extendSxProp({
+    ...themeProps,
+    ...isSxColor && {
+      color: color2
+    }
+  });
+  const {
+    align = "inherit",
+    className,
+    component,
+    gutterBottom = false,
+    noWrap = false,
+    paragraph = false,
+    variant = "body1",
+    variantMapping = defaultVariantMapping,
+    ...other
+  } = props;
+  const ownerState = {
+    ...props,
+    align,
+    color: color2,
+    className,
+    component,
+    gutterBottom,
+    noWrap,
+    paragraph,
+    variant,
+    variantMapping
+  };
+  const Component = component || (paragraph ? "p" : variantMapping[variant] || defaultVariantMapping[variant]) || "span";
+  const classes = useUtilityClasses(ownerState);
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(TypographyRoot, {
+    as: Component,
+    ref,
+    className: clsx(classes.root, className),
+    ...other,
+    ownerState,
+    style: {
+      ...align !== "inherit" && {
+        "--Typography-textAlign": align
+      },
+      ...other.style
+    }
+  });
+});
+Typography.propTypes = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * Set the text-align on the component.
+   * @default 'inherit'
+   */
+  align: PropTypes.oneOf(["center", "inherit", "justify", "left", "right"]),
+  /**
+   * The content of the component.
+   */
+  children: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * The color of the component.
+   * It supports both default and custom theme colors, which can be added as shown in the
+   * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).
+   */
+  color: PropTypes.oneOfType([PropTypes.oneOf(["primary", "secondary", "success", "error", "info", "warning", "textPrimary", "textSecondary", "textDisabled"]), PropTypes.string]),
+  /**
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
+   */
+  component: PropTypes.elementType,
+  /**
+   * If `true`, the text will have a bottom margin.
+   * @default false
+   */
+  gutterBottom: PropTypes.bool,
+  /**
+   * If `true`, the text will not wrap, but instead will truncate with a text overflow ellipsis.
+   *
+   * Note that text overflow can only happen with block or inline-block level elements
+   * (the element needs to have a width in order to overflow).
+   * @default false
+   */
+  noWrap: PropTypes.bool,
+  /**
+   * If `true`, the element will be a paragraph element.
+   * @default false
+   * @deprecated Use the `component` prop instead. This prop will be removed in a future major release. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
+   */
+  paragraph: PropTypes.bool,
+  /**
+   * @ignore
+   */
+  style: PropTypes.object,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+  /**
+   * Applies the theme typography styles.
+   * @default 'body1'
+   */
+  variant: PropTypes.oneOfType([PropTypes.oneOf(["body1", "body2", "button", "caption", "h1", "h2", "h3", "h4", "h5", "h6", "inherit", "overline", "subtitle1", "subtitle2"]), PropTypes.string]),
+  /**
+   * The component maps the variant prop to a range of different HTML element types.
+   * For instance, subtitle1 to `<h6>`.
+   * If you wish to change that mapping, you can provide your own.
+   * Alternatively, you can use the `component` prop.
+   * @default {
+   *   h1: 'h1',
+   *   h2: 'h2',
+   *   h3: 'h3',
+   *   h4: 'h4',
+   *   h5: 'h5',
+   *   h6: 'h6',
+   *   subtitle1: 'h6',
+   *   subtitle2: 'h6',
+   *   body1: 'p',
+   *   body2: 'p',
+   *   inherit: 'p',
+   * }
+   */
+  variantMapping: PropTypes.object
+};
 /**!
  * @fileOverview Kickass library to create and place poppers near their reference elements.
  * @version 1.16.1
@@ -55347,7 +56437,7 @@ var defineProperty = function(obj, key, value) {
   }
   return obj;
 };
-var _extends = Object.assign || function(target) {
+var _extends$1 = Object.assign || function(target) {
   for (var i2 = 1; i2 < arguments.length; i2++) {
     var source = arguments[i2];
     for (var key in source) {
@@ -55359,7 +56449,7 @@ var _extends = Object.assign || function(target) {
   return target;
 };
 function getClientRect(offsets) {
-  return _extends({}, offsets, {
+  return _extends$1({}, offsets, {
     right: offsets.left + offsets.width,
     bottom: offsets.top + offsets.height
   });
@@ -55543,7 +56633,7 @@ function computeAutoPlacement(placement, refRect, popper, reference, boundariesE
     }
   };
   var sortedAreas = Object.keys(rects).map(function(key) {
-    return _extends({
+    return _extends$1({
       key
     }, rects[key], {
       area: getArea(rects[key])
@@ -55851,9 +56941,9 @@ function computeStyle(data, options) {
   var attributes = {
     "x-placement": data.placement
   };
-  data.attributes = _extends({}, attributes, data.attributes);
-  data.styles = _extends({}, styles, data.styles);
-  data.arrowStyles = _extends({}, data.offsets.arrow, data.arrowStyles);
+  data.attributes = _extends$1({}, attributes, data.attributes);
+  data.styles = _extends$1({}, styles, data.styles);
+  data.arrowStyles = _extends$1({}, data.offsets.arrow, data.arrowStyles);
   return data;
 }
 function isModifierRequired(modifiers2, requestingName, requestedName) {
@@ -55988,7 +57078,7 @@ function flip(data, options) {
         variation = getOppositeVariation(variation);
       }
       data.placement = placement + (variation ? "-" + variation : "");
-      data.offsets.popper = _extends({}, data.offsets.popper, getPopperOffsets(data.instance.popper, data.offsets.reference, data.placement));
+      data.offsets.popper = _extends$1({}, data.offsets.popper, getPopperOffsets(data.instance.popper, data.offsets.reference, data.placement));
       data = runModifiers(data.instance.modifiers, data, "flip");
     }
   });
@@ -56031,13 +57121,13 @@ function toValue(str, measurement, popperOffsets, referenceOffsets) {
     var rect = getClientRect(element);
     return rect[measurement] / 100 * value;
   } else if (unit === "vh" || unit === "vw") {
-    var size = void 0;
+    var size2 = void 0;
     if (unit === "vh") {
-      size = Math.max(document.documentElement.clientHeight, window.innerHeight || 0);
+      size2 = Math.max(document.documentElement.clientHeight, window.innerHeight || 0);
     } else {
-      size = Math.max(document.documentElement.clientWidth, window.innerWidth || 0);
+      size2 = Math.max(document.documentElement.clientWidth, window.innerWidth || 0);
     }
-    return size / 100 * value;
+    return size2 / 100 * value;
   } else {
     return value;
   }
@@ -56147,7 +57237,7 @@ function preventOverflow(data, options) {
   };
   order.forEach(function(placement) {
     var side = ["left", "top"].indexOf(placement) !== -1 ? "primary" : "secondary";
-    popper = _extends({}, popper, check[side](placement));
+    popper = _extends$1({}, popper, check[side](placement));
   });
   data.offsets.popper = popper;
   return data;
@@ -56165,7 +57255,7 @@ function shift(data) {
       start: defineProperty({}, side, reference[side]),
       end: defineProperty({}, side, reference[side] + reference[measurement] - popper[measurement])
     };
-    data.offsets.popper = _extends({}, popper, shiftOffsets[shiftvariation]);
+    data.offsets.popper = _extends$1({}, popper, shiftOffsets[shiftvariation]);
   }
   return data;
 }
@@ -56568,7 +57658,7 @@ var Popper = function() {
       return requestAnimationFrame(_this.update);
     };
     this.update = debounce(this.update.bind(this));
-    this.options = _extends({}, Popper2.Defaults, options);
+    this.options = _extends$1({}, Popper2.Defaults, options);
     this.state = {
       isDestroyed: false,
       isCreated: false,
@@ -56577,11 +57667,11 @@ var Popper = function() {
     this.reference = reference && reference.jquery ? reference[0] : reference;
     this.popper = popper && popper.jquery ? popper[0] : popper;
     this.options.modifiers = {};
-    Object.keys(_extends({}, Popper2.Defaults.modifiers, options.modifiers)).forEach(function(name) {
-      _this.options.modifiers[name] = _extends({}, Popper2.Defaults.modifiers[name] || {}, options.modifiers ? options.modifiers[name] : {});
+    Object.keys(_extends$1({}, Popper2.Defaults.modifiers, options.modifiers)).forEach(function(name) {
+      _this.options.modifiers[name] = _extends$1({}, Popper2.Defaults.modifiers[name] || {}, options.modifiers ? options.modifiers[name] : {});
     });
     this.modifiers = Object.keys(this.options.modifiers).map(function(name) {
-      return _extends({
+      return _extends$1({
         name
       }, _this.options.modifiers[name]);
     }).sort(function(a, b) {
@@ -56647,21 +57737,20 @@ Popper.Utils = (typeof window !== "undefined" ? window : global).PopperUtils;
 Popper.placements = placements;
 Popper.Defaults = Defaults;
 function createChainedFunction(...funcs) {
-  return funcs.reduce((acc, func) => {
-    if (func == null) {
-      return acc;
-    }
-    {
-      if (typeof func !== "function") {
-        console.error("Material-UI: Invalid Argument Type, must only provide functions, undefined, or null.");
-      }
+  return funcs.reduce(
+    (acc, func) => {
+      if (func == null) {
+        return acc;
+      }
+      return function chainedFunction(...args) {
+        acc.apply(this, args);
+        func.apply(this, args);
+      };
+    },
+    // eslint-disable-next-line @typescript-eslint/no-empty-function
+    () => {
     }
-    return function chainedFunction(...args) {
-      acc.apply(this, args);
-      func.apply(this, args);
-    };
-  }, () => {
-  });
+  );
 }
 function setRef(ref, value) {
   if (typeof ref === "function") {
@@ -56700,7 +57789,7 @@ function flipPlacement(placement, theme) {
   }
 }
 function getAnchorEl(anchorEl) {
-  return typeof anchorEl === "function" ? anchorEl() : anchorEl;
+  return typeof anchorEl === "function" ? anchorEl(document.body) : anchorEl;
 }
 const useEnhancedEffect = typeof window !== "undefined" ? React.useLayoutEffect : React.useEffect;
 const defaultPopperOptions = {};
@@ -56730,25 +57819,18 @@ React.forwardRef((props, ref) => {
     }
     if (popperRef.current) {
       popperRef.current.destroy();
-      handlePopperRefRef.current(null);
+      if (handlePopperRefRef.current) {
+        setRef(handlePopperRefRef.current, null);
+      }
     }
     const handlePopperUpdate = (data) => {
       setPlacement(data.placement);
     };
-    const resolvedAnchorEl = getAnchorEl(anchorEl);
-    {
-      if (resolvedAnchorEl && resolvedAnchorEl.nodeType === 1) {
-        const box = resolvedAnchorEl.getBoundingClientRect();
-        if (box.top === 0 && box.left === 0 && box.right === 0 && box.bottom === 0) {
-          console.warn([
-            "Material-UI: The `anchorEl` prop provided to the component is invalid.",
-            "The anchor element should be part of the document layout.",
-            "Make sure the element is present in the document or that it's not display none."
-          ].join("\n"));
-        }
-      }
+    const anchorElement = getAnchorEl(anchorEl);
+    if (!anchorElement) {
+      return;
     }
-    const popper = new Popper(getAnchorEl(anchorEl), tooltipRef.current, {
+    const popper = new Popper(anchorElement, tooltipRef.current, {
       placement: rtlPlacement,
       ...popperOptions,
       modifiers: {
@@ -56766,7 +57848,9 @@ React.forwardRef((props, ref) => {
       onCreate: createChainedFunction(handlePopperUpdate, popperOptions.onCreate),
       onUpdate: createChainedFunction(handlePopperUpdate, popperOptions.onUpdate)
     });
-    handlePopperRefRef.current(popper);
+    if (handlePopperRefRef.current) {
+      setRef(handlePopperRefRef.current, popper);
+    }
   }, [anchorEl, disablePortal, modifiers2, open, rtlPlacement, popperOptions]);
   const handleRef = React.useCallback((node2) => {
     setRef(ownRef, node2);
@@ -56780,7 +57864,9 @@ React.forwardRef((props, ref) => {
       return;
     }
     popperRef.current.destroy();
-    handlePopperRefRef.current(null);
+    if (handlePopperRefRef.current) {
+      setRef(handlePopperRefRef.current, null);
+    }
   };
   const handleExited = () => {
     setExited(true);
@@ -56811,10 +57897,704 @@ React.forwardRef((props, ref) => {
     // Fix Popper.js display issue
     top: 0,
     left: 0,
-    display: !open && keepMounted && !transition ? "none" : null,
+    display: !open && keepMounted && !transition ? "none" : void 0,
     ...style2
   }, children: typeof children === "function" ? children(childProps) : children }) });
 });
+function _extends() {
+  _extends = Object.assign ? Object.assign.bind() : function(target) {
+    for (var i2 = 1; i2 < arguments.length; i2++) {
+      var source = arguments[i2];
+      for (var key in source) {
+        if (Object.prototype.hasOwnProperty.call(source, key)) {
+          target[key] = source[key];
+        }
+      }
+    }
+    return target;
+  };
+  return _extends.apply(this, arguments);
+}
+function _assertThisInitialized(self2) {
+  if (self2 === void 0) {
+    throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
+  }
+  return self2;
+}
+function _setPrototypeOf(o, p) {
+  _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf2(o2, p2) {
+    o2.__proto__ = p2;
+    return o2;
+  };
+  return _setPrototypeOf(o, p);
+}
+function _inheritsLoose(subClass, superClass) {
+  subClass.prototype = Object.create(superClass.prototype);
+  subClass.prototype.constructor = subClass;
+  _setPrototypeOf(subClass, superClass);
+}
+var safeIsNaN = Number.isNaN || function ponyfill(value) {
+  return typeof value === "number" && value !== value;
+};
+function isEqual$1(first, second) {
+  if (first === second) {
+    return true;
+  }
+  if (safeIsNaN(first) && safeIsNaN(second)) {
+    return true;
+  }
+  return false;
+}
+function areInputsEqual(newInputs, lastInputs) {
+  if (newInputs.length !== lastInputs.length) {
+    return false;
+  }
+  for (var i2 = 0; i2 < newInputs.length; i2++) {
+    if (!isEqual$1(newInputs[i2], lastInputs[i2])) {
+      return false;
+    }
+  }
+  return true;
+}
+function memoizeOne(resultFn, isEqual2) {
+  if (isEqual2 === void 0) {
+    isEqual2 = areInputsEqual;
+  }
+  var lastThis;
+  var lastArgs = [];
+  var lastResult;
+  var calledOnce = false;
+  function memoized() {
+    var newArgs = [];
+    for (var _i = 0; _i < arguments.length; _i++) {
+      newArgs[_i] = arguments[_i];
+    }
+    if (calledOnce && lastThis === this && isEqual2(newArgs, lastArgs)) {
+      return lastResult;
+    }
+    lastResult = resultFn.apply(this, newArgs);
+    calledOnce = true;
+    lastThis = this;
+    lastArgs = newArgs;
+    return lastResult;
+  }
+  return memoized;
+}
+var hasNativePerformanceNow = typeof performance === "object" && typeof performance.now === "function";
+var now = hasNativePerformanceNow ? function() {
+  return performance.now();
+} : function() {
+  return Date.now();
+};
+function cancelTimeout(timeoutID) {
+  cancelAnimationFrame(timeoutID.id);
+}
+function requestTimeout(callback, delay) {
+  var start = now();
+  function tick() {
+    if (now() - start >= delay) {
+      callback.call(null);
+    } else {
+      timeoutID.id = requestAnimationFrame(tick);
+    }
+  }
+  var timeoutID = {
+    id: requestAnimationFrame(tick)
+  };
+  return timeoutID;
+}
+var size = -1;
+function getScrollbarSize(recalculate) {
+  if (recalculate === void 0) {
+    recalculate = false;
+  }
+  if (size === -1 || recalculate) {
+    var div = document.createElement("div");
+    var style2 = div.style;
+    style2.width = "50px";
+    style2.height = "50px";
+    style2.overflow = "scroll";
+    document.body.appendChild(div);
+    size = div.offsetWidth - div.clientWidth;
+    document.body.removeChild(div);
+  }
+  return size;
+}
+var cachedRTLResult = null;
+function getRTLOffsetType(recalculate) {
+  if (recalculate === void 0) {
+    recalculate = false;
+  }
+  if (cachedRTLResult === null || recalculate) {
+    var outerDiv = document.createElement("div");
+    var outerStyle = outerDiv.style;
+    outerStyle.width = "50px";
+    outerStyle.height = "50px";
+    outerStyle.overflow = "scroll";
+    outerStyle.direction = "rtl";
+    var innerDiv = document.createElement("div");
+    var innerStyle = innerDiv.style;
+    innerStyle.width = "100px";
+    innerStyle.height = "100px";
+    outerDiv.appendChild(innerDiv);
+    document.body.appendChild(outerDiv);
+    if (outerDiv.scrollLeft > 0) {
+      cachedRTLResult = "positive-descending";
+    } else {
+      outerDiv.scrollLeft = 1;
+      if (outerDiv.scrollLeft === 0) {
+        cachedRTLResult = "negative";
+      } else {
+        cachedRTLResult = "positive-ascending";
+      }
+    }
+    document.body.removeChild(outerDiv);
+    return cachedRTLResult;
+  }
+  return cachedRTLResult;
+}
+var IS_SCROLLING_DEBOUNCE_INTERVAL$1 = 150;
+var defaultItemKey$1 = function defaultItemKey3(index, data) {
+  return index;
+};
+var devWarningsDirection = null;
+var devWarningsTagName$1 = null;
+{
+  if (typeof window !== "undefined" && typeof window.WeakSet !== "undefined") {
+    devWarningsDirection = /* @__PURE__ */ new WeakSet();
+    devWarningsTagName$1 = /* @__PURE__ */ new WeakSet();
+  }
+}
+function createListComponent(_ref) {
+  var _class;
+  var getItemOffset3 = _ref.getItemOffset, getEstimatedTotalSize4 = _ref.getEstimatedTotalSize, getItemSize3 = _ref.getItemSize, getOffsetForIndexAndAlignment5 = _ref.getOffsetForIndexAndAlignment, getStartIndexForOffset3 = _ref.getStartIndexForOffset, getStopIndexForStartIndex3 = _ref.getStopIndexForStartIndex, initInstanceProps5 = _ref.initInstanceProps, shouldResetStyleCacheOnItemSizeChange = _ref.shouldResetStyleCacheOnItemSizeChange, validateProps5 = _ref.validateProps;
+  return _class = /* @__PURE__ */ function(_PureComponent) {
+    _inheritsLoose(List, _PureComponent);
+    function List(props) {
+      var _this;
+      _this = _PureComponent.call(this, props) || this;
+      _this._instanceProps = initInstanceProps5(_this.props, _assertThisInitialized(_this));
+      _this._outerRef = void 0;
+      _this._resetIsScrollingTimeoutId = null;
+      _this.state = {
+        instance: _assertThisInitialized(_this),
+        isScrolling: false,
+        scrollDirection: "forward",
+        scrollOffset: typeof _this.props.initialScrollOffset === "number" ? _this.props.initialScrollOffset : 0,
+        scrollUpdateWasRequested: false
+      };
+      _this._callOnItemsRendered = void 0;
+      _this._callOnItemsRendered = memoizeOne(function(overscanStartIndex, overscanStopIndex, visibleStartIndex, visibleStopIndex) {
+        return _this.props.onItemsRendered({
+          overscanStartIndex,
+          overscanStopIndex,
+          visibleStartIndex,
+          visibleStopIndex
+        });
+      });
+      _this._callOnScroll = void 0;
+      _this._callOnScroll = memoizeOne(function(scrollDirection, scrollOffset, scrollUpdateWasRequested) {
+        return _this.props.onScroll({
+          scrollDirection,
+          scrollOffset,
+          scrollUpdateWasRequested
+        });
+      });
+      _this._getItemStyle = void 0;
+      _this._getItemStyle = function(index) {
+        var _this$props = _this.props, direction = _this$props.direction, itemSize = _this$props.itemSize, layout = _this$props.layout;
+        var itemStyleCache = _this._getItemStyleCache(shouldResetStyleCacheOnItemSizeChange && itemSize, shouldResetStyleCacheOnItemSizeChange && layout, shouldResetStyleCacheOnItemSizeChange && direction);
+        var style2;
+        if (itemStyleCache.hasOwnProperty(index)) {
+          style2 = itemStyleCache[index];
+        } else {
+          var _offset2 = getItemOffset3(_this.props, index, _this._instanceProps);
+          var size2 = getItemSize3(_this.props, index, _this._instanceProps);
+          var isHorizontal = direction === "horizontal" || layout === "horizontal";
+          var isRtl = direction === "rtl";
+          var offsetHorizontal = isHorizontal ? _offset2 : 0;
+          itemStyleCache[index] = style2 = {
+            position: "absolute",
+            left: isRtl ? void 0 : offsetHorizontal,
+            right: isRtl ? offsetHorizontal : void 0,
+            top: !isHorizontal ? _offset2 : 0,
+            height: !isHorizontal ? size2 : "100%",
+            width: isHorizontal ? size2 : "100%"
+          };
+        }
+        return style2;
+      };
+      _this._getItemStyleCache = void 0;
+      _this._getItemStyleCache = memoizeOne(function(_, __, ___) {
+        return {};
+      });
+      _this._onScrollHorizontal = function(event) {
+        var _event$currentTarget = event.currentTarget, clientWidth = _event$currentTarget.clientWidth, scrollLeft = _event$currentTarget.scrollLeft, scrollWidth = _event$currentTarget.scrollWidth;
+        _this.setState(function(prevState) {
+          if (prevState.scrollOffset === scrollLeft) {
+            return null;
+          }
+          var direction = _this.props.direction;
+          var scrollOffset = scrollLeft;
+          if (direction === "rtl") {
+            switch (getRTLOffsetType()) {
+              case "negative":
+                scrollOffset = -scrollLeft;
+                break;
+              case "positive-descending":
+                scrollOffset = scrollWidth - clientWidth - scrollLeft;
+                break;
+            }
+          }
+          scrollOffset = Math.max(0, Math.min(scrollOffset, scrollWidth - clientWidth));
+          return {
+            isScrolling: true,
+            scrollDirection: prevState.scrollOffset < scrollOffset ? "forward" : "backward",
+            scrollOffset,
+            scrollUpdateWasRequested: false
+          };
+        }, _this._resetIsScrollingDebounced);
+      };
+      _this._onScrollVertical = function(event) {
+        var _event$currentTarget2 = event.currentTarget, clientHeight = _event$currentTarget2.clientHeight, scrollHeight = _event$currentTarget2.scrollHeight, scrollTop = _event$currentTarget2.scrollTop;
+        _this.setState(function(prevState) {
+          if (prevState.scrollOffset === scrollTop) {
+            return null;
+          }
+          var scrollOffset = Math.max(0, Math.min(scrollTop, scrollHeight - clientHeight));
+          return {
+            isScrolling: true,
+            scrollDirection: prevState.scrollOffset < scrollOffset ? "forward" : "backward",
+            scrollOffset,
+            scrollUpdateWasRequested: false
+          };
+        }, _this._resetIsScrollingDebounced);
+      };
+      _this._outerRefSetter = function(ref) {
+        var outerRef = _this.props.outerRef;
+        _this._outerRef = ref;
+        if (typeof outerRef === "function") {
+          outerRef(ref);
+        } else if (outerRef != null && typeof outerRef === "object" && outerRef.hasOwnProperty("current")) {
+          outerRef.current = ref;
+        }
+      };
+      _this._resetIsScrollingDebounced = function() {
+        if (_this._resetIsScrollingTimeoutId !== null) {
+          cancelTimeout(_this._resetIsScrollingTimeoutId);
+        }
+        _this._resetIsScrollingTimeoutId = requestTimeout(_this._resetIsScrolling, IS_SCROLLING_DEBOUNCE_INTERVAL$1);
+      };
+      _this._resetIsScrolling = function() {
+        _this._resetIsScrollingTimeoutId = null;
+        _this.setState({
+          isScrolling: false
+        }, function() {
+          _this._getItemStyleCache(-1, null);
+        });
+      };
+      return _this;
+    }
+    List.getDerivedStateFromProps = function getDerivedStateFromProps(nextProps, prevState) {
+      validateSharedProps$1(nextProps, prevState);
+      validateProps5(nextProps);
+      return null;
+    };
+    var _proto = List.prototype;
+    _proto.scrollTo = function scrollTo(scrollOffset) {
+      scrollOffset = Math.max(0, scrollOffset);
+      this.setState(function(prevState) {
+        if (prevState.scrollOffset === scrollOffset) {
+          return null;
+        }
+        return {
+          scrollDirection: prevState.scrollOffset < scrollOffset ? "forward" : "backward",
+          scrollOffset,
+          scrollUpdateWasRequested: true
+        };
+      }, this._resetIsScrollingDebounced);
+    };
+    _proto.scrollToItem = function scrollToItem(index, align) {
+      if (align === void 0) {
+        align = "auto";
+      }
+      var _this$props2 = this.props, itemCount = _this$props2.itemCount, layout = _this$props2.layout;
+      var scrollOffset = this.state.scrollOffset;
+      index = Math.max(0, Math.min(index, itemCount - 1));
+      var scrollbarSize = 0;
+      if (this._outerRef) {
+        var outerRef = this._outerRef;
+        if (layout === "vertical") {
+          scrollbarSize = outerRef.scrollWidth > outerRef.clientWidth ? getScrollbarSize() : 0;
+        } else {
+          scrollbarSize = outerRef.scrollHeight > outerRef.clientHeight ? getScrollbarSize() : 0;
+        }
+      }
+      this.scrollTo(getOffsetForIndexAndAlignment5(this.props, index, align, scrollOffset, this._instanceProps, scrollbarSize));
+    };
+    _proto.componentDidMount = function componentDidMount() {
+      var _this$props3 = this.props, direction = _this$props3.direction, initialScrollOffset = _this$props3.initialScrollOffset, layout = _this$props3.layout;
+      if (typeof initialScrollOffset === "number" && this._outerRef != null) {
+        var outerRef = this._outerRef;
+        if (direction === "horizontal" || layout === "horizontal") {
+          outerRef.scrollLeft = initialScrollOffset;
+        } else {
+          outerRef.scrollTop = initialScrollOffset;
+        }
+      }
+      this._callPropsCallbacks();
+    };
+    _proto.componentDidUpdate = function componentDidUpdate() {
+      var _this$props4 = this.props, direction = _this$props4.direction, layout = _this$props4.layout;
+      var _this$state = this.state, scrollOffset = _this$state.scrollOffset, scrollUpdateWasRequested = _this$state.scrollUpdateWasRequested;
+      if (scrollUpdateWasRequested && this._outerRef != null) {
+        var outerRef = this._outerRef;
+        if (direction === "horizontal" || layout === "horizontal") {
+          if (direction === "rtl") {
+            switch (getRTLOffsetType()) {
+              case "negative":
+                outerRef.scrollLeft = -scrollOffset;
+                break;
+              case "positive-ascending":
+                outerRef.scrollLeft = scrollOffset;
+                break;
+              default:
+                var clientWidth = outerRef.clientWidth, scrollWidth = outerRef.scrollWidth;
+                outerRef.scrollLeft = scrollWidth - clientWidth - scrollOffset;
+                break;
+            }
+          } else {
+            outerRef.scrollLeft = scrollOffset;
+          }
+        } else {
+          outerRef.scrollTop = scrollOffset;
+        }
+      }
+      this._callPropsCallbacks();
+    };
+    _proto.componentWillUnmount = function componentWillUnmount() {
+      if (this._resetIsScrollingTimeoutId !== null) {
+        cancelTimeout(this._resetIsScrollingTimeoutId);
+      }
+    };
+    _proto.render = function render() {
+      var _this$props5 = this.props, children = _this$props5.children, className = _this$props5.className, direction = _this$props5.direction, height2 = _this$props5.height, innerRef = _this$props5.innerRef, innerElementType = _this$props5.innerElementType, innerTagName = _this$props5.innerTagName, itemCount = _this$props5.itemCount, itemData = _this$props5.itemData, _this$props5$itemKey = _this$props5.itemKey, itemKey = _this$props5$itemKey === void 0 ? defaultItemKey$1 : _this$props5$itemKey, layout = _this$props5.layout, outerElementType = _this$props5.outerElementType, outerTagName = _this$props5.outerTagName, style2 = _this$props5.style, useIsScrolling = _this$props5.useIsScrolling, width2 = _this$props5.width;
+      var isScrolling = this.state.isScrolling;
+      var isHorizontal = direction === "horizontal" || layout === "horizontal";
+      var onScroll = isHorizontal ? this._onScrollHorizontal : this._onScrollVertical;
+      var _this$_getRangeToRend = this._getRangeToRender(), startIndex = _this$_getRangeToRend[0], stopIndex = _this$_getRangeToRend[1];
+      var items = [];
+      if (itemCount > 0) {
+        for (var _index = startIndex; _index <= stopIndex; _index++) {
+          items.push(createElement(children, {
+            data: itemData,
+            key: itemKey(_index, itemData),
+            index: _index,
+            isScrolling: useIsScrolling ? isScrolling : void 0,
+            style: this._getItemStyle(_index)
+          }));
+        }
+      }
+      var estimatedTotalSize = getEstimatedTotalSize4(this.props, this._instanceProps);
+      return createElement(outerElementType || outerTagName || "div", {
+        className,
+        onScroll,
+        ref: this._outerRefSetter,
+        style: _extends({
+          position: "relative",
+          height: height2,
+          width: width2,
+          overflow: "auto",
+          WebkitOverflowScrolling: "touch",
+          willChange: "transform",
+          direction
+        }, style2)
+      }, createElement(innerElementType || innerTagName || "div", {
+        children: items,
+        ref: innerRef,
+        style: {
+          height: isHorizontal ? "100%" : estimatedTotalSize,
+          pointerEvents: isScrolling ? "none" : void 0,
+          width: isHorizontal ? estimatedTotalSize : "100%"
+        }
+      }));
+    };
+    _proto._callPropsCallbacks = function _callPropsCallbacks() {
+      if (typeof this.props.onItemsRendered === "function") {
+        var itemCount = this.props.itemCount;
+        if (itemCount > 0) {
+          var _this$_getRangeToRend2 = this._getRangeToRender(), _overscanStartIndex = _this$_getRangeToRend2[0], _overscanStopIndex = _this$_getRangeToRend2[1], _visibleStartIndex = _this$_getRangeToRend2[2], _visibleStopIndex = _this$_getRangeToRend2[3];
+          this._callOnItemsRendered(_overscanStartIndex, _overscanStopIndex, _visibleStartIndex, _visibleStopIndex);
+        }
+      }
+      if (typeof this.props.onScroll === "function") {
+        var _this$state2 = this.state, _scrollDirection = _this$state2.scrollDirection, _scrollOffset = _this$state2.scrollOffset, _scrollUpdateWasRequested = _this$state2.scrollUpdateWasRequested;
+        this._callOnScroll(_scrollDirection, _scrollOffset, _scrollUpdateWasRequested);
+      }
+    };
+    _proto._getRangeToRender = function _getRangeToRender() {
+      var _this$props6 = this.props, itemCount = _this$props6.itemCount, overscanCount = _this$props6.overscanCount;
+      var _this$state3 = this.state, isScrolling = _this$state3.isScrolling, scrollDirection = _this$state3.scrollDirection, scrollOffset = _this$state3.scrollOffset;
+      if (itemCount === 0) {
+        return [0, 0, 0, 0];
+      }
+      var startIndex = getStartIndexForOffset3(this.props, scrollOffset, this._instanceProps);
+      var stopIndex = getStopIndexForStartIndex3(this.props, startIndex, scrollOffset, this._instanceProps);
+      var overscanBackward = !isScrolling || scrollDirection === "backward" ? Math.max(1, overscanCount) : 1;
+      var overscanForward = !isScrolling || scrollDirection === "forward" ? Math.max(1, overscanCount) : 1;
+      return [Math.max(0, startIndex - overscanBackward), Math.max(0, Math.min(itemCount - 1, stopIndex + overscanForward)), startIndex, stopIndex];
+    };
+    return List;
+  }(PureComponent), _class.defaultProps = {
+    direction: "ltr",
+    itemData: void 0,
+    layout: "vertical",
+    overscanCount: 2,
+    useIsScrolling: false
+  }, _class;
+}
+var validateSharedProps$1 = function validateSharedProps3(_ref2, _ref3) {
+  var children = _ref2.children, direction = _ref2.direction, height2 = _ref2.height, layout = _ref2.layout, innerTagName = _ref2.innerTagName, outerTagName = _ref2.outerTagName, width2 = _ref2.width;
+  var instance = _ref3.instance;
+  {
+    if (innerTagName != null || outerTagName != null) {
+      if (devWarningsTagName$1 && !devWarningsTagName$1.has(instance)) {
+        devWarningsTagName$1.add(instance);
+        console.warn("The innerTagName and outerTagName props have been deprecated. Please use the innerElementType and outerElementType props instead.");
+      }
+    }
+    var isHorizontal = direction === "horizontal" || layout === "horizontal";
+    switch (direction) {
+      case "horizontal":
+      case "vertical":
+        if (devWarningsDirection && !devWarningsDirection.has(instance)) {
+          devWarningsDirection.add(instance);
+          console.warn('The direction prop should be either "ltr" (default) or "rtl". Please use the layout prop to specify "vertical" (default) or "horizontal" orientation.');
+        }
+        break;
+      case "ltr":
+      case "rtl":
+        break;
+      default:
+        throw Error('An invalid "direction" prop has been specified. Value should be either "ltr" or "rtl". ' + ('"' + direction + '" was specified.'));
+    }
+    switch (layout) {
+      case "horizontal":
+      case "vertical":
+        break;
+      default:
+        throw Error('An invalid "layout" prop has been specified. Value should be either "horizontal" or "vertical". ' + ('"' + layout + '" was specified.'));
+    }
+    if (children == null) {
+      throw Error('An invalid "children" prop has been specified. Value should be a React component. ' + ('"' + (children === null ? "null" : typeof children) + '" was specified.'));
+    }
+    if (isHorizontal && typeof width2 !== "number") {
+      throw Error('An invalid "width" prop has been specified. Horizontal lists must specify a number for width. ' + ('"' + (width2 === null ? "null" : typeof width2) + '" was specified.'));
+    } else if (!isHorizontal && typeof height2 !== "number") {
+      throw Error('An invalid "height" prop has been specified. Vertical lists must specify a number for height. ' + ('"' + (height2 === null ? "null" : typeof height2) + '" was specified.'));
+    }
+  }
+};
+var DEFAULT_ESTIMATED_ITEM_SIZE$1 = 50;
+var getItemMetadata$1 = function getItemMetadata3(props, index, instanceProps) {
+  var _ref = props, itemSize = _ref.itemSize;
+  var itemMetadataMap = instanceProps.itemMetadataMap, lastMeasuredIndex = instanceProps.lastMeasuredIndex;
+  if (index > lastMeasuredIndex) {
+    var offset2 = 0;
+    if (lastMeasuredIndex >= 0) {
+      var itemMetadata = itemMetadataMap[lastMeasuredIndex];
+      offset2 = itemMetadata.offset + itemMetadata.size;
+    }
+    for (var i2 = lastMeasuredIndex + 1; i2 <= index; i2++) {
+      var size2 = itemSize(i2);
+      itemMetadataMap[i2] = {
+        offset: offset2,
+        size: size2
+      };
+      offset2 += size2;
+    }
+    instanceProps.lastMeasuredIndex = index;
+  }
+  return itemMetadataMap[index];
+};
+var findNearestItem$1 = function findNearestItem3(props, instanceProps, offset2) {
+  var itemMetadataMap = instanceProps.itemMetadataMap, lastMeasuredIndex = instanceProps.lastMeasuredIndex;
+  var lastMeasuredItemOffset = lastMeasuredIndex > 0 ? itemMetadataMap[lastMeasuredIndex].offset : 0;
+  if (lastMeasuredItemOffset >= offset2) {
+    return findNearestItemBinarySearch$1(props, instanceProps, lastMeasuredIndex, 0, offset2);
+  } else {
+    return findNearestItemExponentialSearch$1(props, instanceProps, Math.max(0, lastMeasuredIndex), offset2);
+  }
+};
+var findNearestItemBinarySearch$1 = function findNearestItemBinarySearch3(props, instanceProps, high, low, offset2) {
+  while (low <= high) {
+    var middle = low + Math.floor((high - low) / 2);
+    var currentOffset = getItemMetadata$1(props, middle, instanceProps).offset;
+    if (currentOffset === offset2) {
+      return middle;
+    } else if (currentOffset < offset2) {
+      low = middle + 1;
+    } else if (currentOffset > offset2) {
+      high = middle - 1;
+    }
+  }
+  if (low > 0) {
+    return low - 1;
+  } else {
+    return 0;
+  }
+};
+var findNearestItemExponentialSearch$1 = function findNearestItemExponentialSearch3(props, instanceProps, index, offset2) {
+  var itemCount = props.itemCount;
+  var interval = 1;
+  while (index < itemCount && getItemMetadata$1(props, index, instanceProps).offset < offset2) {
+    index += interval;
+    interval *= 2;
+  }
+  return findNearestItemBinarySearch$1(props, instanceProps, Math.min(index, itemCount - 1), Math.floor(index / 2), offset2);
+};
+var getEstimatedTotalSize = function getEstimatedTotalSize2(_ref2, _ref3) {
+  var itemCount = _ref2.itemCount;
+  var itemMetadataMap = _ref3.itemMetadataMap, estimatedItemSize = _ref3.estimatedItemSize, lastMeasuredIndex = _ref3.lastMeasuredIndex;
+  var totalSizeOfMeasuredItems = 0;
+  if (lastMeasuredIndex >= itemCount) {
+    lastMeasuredIndex = itemCount - 1;
+  }
+  if (lastMeasuredIndex >= 0) {
+    var itemMetadata = itemMetadataMap[lastMeasuredIndex];
+    totalSizeOfMeasuredItems = itemMetadata.offset + itemMetadata.size;
+  }
+  var numUnmeasuredItems = itemCount - lastMeasuredIndex - 1;
+  var totalSizeOfUnmeasuredItems = numUnmeasuredItems * estimatedItemSize;
+  return totalSizeOfMeasuredItems + totalSizeOfUnmeasuredItems;
+};
+var VariableSizeList$1 = /* @__PURE__ */ createListComponent({
+  getItemOffset: function getItemOffset(props, index, instanceProps) {
+    return getItemMetadata$1(props, index, instanceProps).offset;
+  },
+  getItemSize: function getItemSize(props, index, instanceProps) {
+    return instanceProps.itemMetadataMap[index].size;
+  },
+  getEstimatedTotalSize,
+  getOffsetForIndexAndAlignment: function getOffsetForIndexAndAlignment3(props, index, align, scrollOffset, instanceProps, scrollbarSize) {
+    var direction = props.direction, height2 = props.height, layout = props.layout, width2 = props.width;
+    var isHorizontal = direction === "horizontal" || layout === "horizontal";
+    var size2 = isHorizontal ? width2 : height2;
+    var itemMetadata = getItemMetadata$1(props, index, instanceProps);
+    var estimatedTotalSize = getEstimatedTotalSize(props, instanceProps);
+    var maxOffset = Math.max(0, Math.min(estimatedTotalSize - size2, itemMetadata.offset));
+    var minOffset = Math.max(0, itemMetadata.offset - size2 + itemMetadata.size + scrollbarSize);
+    if (align === "smart") {
+      if (scrollOffset >= minOffset - size2 && scrollOffset <= maxOffset + size2) {
+        align = "auto";
+      } else {
+        align = "center";
+      }
+    }
+    switch (align) {
+      case "start":
+        return maxOffset;
+      case "end":
+        return minOffset;
+      case "center":
+        return Math.round(minOffset + (maxOffset - minOffset) / 2);
+      case "auto":
+      default:
+        if (scrollOffset >= minOffset && scrollOffset <= maxOffset) {
+          return scrollOffset;
+        } else if (scrollOffset < minOffset) {
+          return minOffset;
+        } else {
+          return maxOffset;
+        }
+    }
+  },
+  getStartIndexForOffset: function getStartIndexForOffset(props, offset2, instanceProps) {
+    return findNearestItem$1(props, instanceProps, offset2);
+  },
+  getStopIndexForStartIndex: function getStopIndexForStartIndex(props, startIndex, scrollOffset, instanceProps) {
+    var direction = props.direction, height2 = props.height, itemCount = props.itemCount, layout = props.layout, width2 = props.width;
+    var isHorizontal = direction === "horizontal" || layout === "horizontal";
+    var size2 = isHorizontal ? width2 : height2;
+    var itemMetadata = getItemMetadata$1(props, startIndex, instanceProps);
+    var maxOffset = scrollOffset + size2;
+    var offset2 = itemMetadata.offset + itemMetadata.size;
+    var stopIndex = startIndex;
+    while (stopIndex < itemCount - 1 && offset2 < maxOffset) {
+      stopIndex++;
+      offset2 += getItemMetadata$1(props, stopIndex, instanceProps).size;
+    }
+    return stopIndex;
+  },
+  initInstanceProps: function initInstanceProps2(props, instance) {
+    var _ref4 = props, estimatedItemSize = _ref4.estimatedItemSize;
+    var instanceProps = {
+      itemMetadataMap: {},
+      estimatedItemSize: estimatedItemSize || DEFAULT_ESTIMATED_ITEM_SIZE$1,
+      lastMeasuredIndex: -1
+    };
+    instance.resetAfterIndex = function(index, shouldForceUpdate) {
+      if (shouldForceUpdate === void 0) {
+        shouldForceUpdate = true;
+      }
+      instanceProps.lastMeasuredIndex = Math.min(instanceProps.lastMeasuredIndex, index - 1);
+      instance._getItemStyleCache(-1);
+      if (shouldForceUpdate) {
+        instance.forceUpdate();
+      }
+    };
+    return instanceProps;
+  },
+  shouldResetStyleCacheOnItemSizeChange: false,
+  validateProps: function validateProps2(_ref5) {
+    var itemSize = _ref5.itemSize;
+    {
+      if (typeof itemSize !== "function") {
+        throw Error('An invalid "itemSize" prop has been specified. Value should be a function. ' + ('"' + (itemSize === null ? "null" : typeof itemSize) + '" was specified.'));
+      }
+    }
+  }
+});
+const VariableSizeList = VariableSizeList$1;
+const LIST_ROW_HEIGHT = 48;
+makeStyles()(() => ({
+  searchInput: {
+    lineHeight: "initial",
+    height: "auto !important"
+  }
+}));
+const OuterElementContext = React__default.createContext({});
+const OuterElementType = React__default.forwardRef((props, ref) => {
+  const outerProps = React__default.useContext(OuterElementContext);
+  return jsxRuntimeExports.jsx("div", { ref, ...props, ...outerProps });
+});
+function ListRow(props) {
+  const { data, index, style: style2 } = props;
+  const dataSet = data[index];
+  const inlineStyle = {
+    ...style2,
+    top: style2.top + 8
+  };
+  const [props0, option, getItemLabel] = dataSet;
+  const { key, ...optionProps } = props0;
+  return jsxRuntimeExports.jsx(Typography, { component: "li", ...optionProps, noWrap: true, style: inlineStyle, children: getItemLabel(option) }, key);
+}
+function useResetCache(itemCount) {
+  const ref = useRef(null);
+  useEffect(() => {
+    if (ref.current != null) {
+      ref.current.resetAfterIndex(0, true);
+    }
+  }, [itemCount]);
+  return ref;
+}
+React__default.forwardRef((props, ref) => {
+  const { children, ...other } = props;
+  const items = children;
+  const itemCount = items.length;
+  const gridRef = useResetCache(itemCount);
+  return jsxRuntimeExports.jsx("div", { ref, children: jsxRuntimeExports.jsx(OuterElementContext.Provider, { value: other, children: jsxRuntimeExports.jsx(VariableSizeList, { height: Math.min(8, itemCount) * LIST_ROW_HEIGHT, itemSize: () => LIST_ROW_HEIGHT, width: "100%", innerElementType: "ul", outerElementType: OuterElementType, overscanCount: 5, ref: gridRef, itemCount, itemData: items, children: ListRow }) }) });
+});
 var freeGlobal = typeof global == "object" && global && global.Object === Object && global;
 var freeSelf = typeof self == "object" && self && self.Object === Object && self;
 var root = freeGlobal || freeSelf || Function("return this")();
@@ -57010,8 +58790,8 @@ function arrayLikeKeys(value, inherited) {
   return result;
 }
 function overArg(func, transform) {
-  return function(arg) {
-    return func(transform(arg));
+  return function(arg2) {
+    return func(transform(arg2));
   };
 }
 var nativeKeys = overArg(Object.keys, Object);
@@ -57167,9 +58947,9 @@ function mapCacheHas(key) {
   return getMapData(this, key).has(key);
 }
 function mapCacheSet(key, value) {
-  var data = getMapData(this, key), size = data.size;
+  var data = getMapData(this, key), size2 = data.size;
   data.set(key, value);
-  this.size += data.size == size ? 0 : 1;
+  this.size += data.size == size2 ? 0 : 1;
   return this;
 }
 function MapCache(entries) {
@@ -57711,14 +59491,14 @@ function _ptToZarr(ptx, pty, ptz, ptInfo) {
 function _requestBufferToRequestObjects(buffer, k) {
   const counts = /* @__PURE__ */ new Map();
   for (let i2 = 0; i2 < buffer.length; i2 += 4) {
-    const r = buffer[i2];
+    const r2 = buffer[i2];
     const g = buffer[i2 + 1];
     const b = buffer[i2 + 2];
     const a = buffer[i2 + 3];
-    if ((r | g | b | a) === 0) {
+    if ((r2 | g | b | a) === 0) {
       continue;
     }
-    const packed = (r << 24 | g << 16 | b << 8 | a) >>> 0;
+    const packed = (r2 << 24 | g << 16 | b << 8 | a) >>> 0;
     counts.set(packed, (counts.get(packed) || 0) + 1);
   }
   const requests = [...counts.entries()].sort((a, b) => b[1] - a[1]).slice(0, k).map(([packed]) => ({
@@ -58467,17 +60247,17 @@ class VolumeDataManager {
     const texPT = this.renderer.properties.get(this.ptTHREE).__webglTexture;
     gl.activeTexture(gl.TEXTURE0);
     gl.bindTexture(gl.TEXTURE_3D, texPT);
-    for (let r = 0; r < this.zarrStore.resolutions; r++) {
+    for (let r2 = 0; r2 < this.zarrStore.resolutions; r2++) {
       const anchor = [
-        this.PT.anchors[r][2] * channelMask[2],
-        this.PT.anchors[r][1] * channelMask[1],
-        this.PT.anchors[r][0] * channelMask[0]
+        this.PT.anchors[r2][2] * channelMask[2],
+        this.PT.anchors[r2][1] * channelMask[1],
+        this.PT.anchors[r2][0] * channelMask[0]
       ];
       log.debug("anchor", anchor);
-      const extents = this.zarrStore.brickLayout[r];
-      const size = extents[0] * extents[1] * extents[2];
+      const extents = this.zarrStore.brickLayout[r2];
+      const size2 = extents[0] * extents[1] * extents[2];
       log.debug("extents", extents);
-      log.debug("size", size);
+      log.debug("size", size2);
       gl.texSubImage3D(
         gl.TEXTURE_3D,
         0,
@@ -58489,7 +60269,7 @@ class VolumeDataManager {
         extents[2],
         gl.RED_INTEGER,
         gl.UNSIGNED_INT,
-        new Uint32Array(size)
+        new Uint32Array(size2)
       );
     }
     gl.bindTexture(gl.TEXTURE_3D, null);