videx-3d/dist/main.js

React 3D component library designed for sub surface visualizations in the browser

(function(){"use strict";try{if(typeof document<"u"){var e=document.createElement("style");e.appendChild(document.createTextNode("svg.well-map g.tracks g.track:hover{cursor:help}svg.well-map g.tracks g.track.interactive:hover{cursor:pointer;filter:brightness(1.1)}svg.well-map g.tracks g.track.interactive.selected:hover{cursor:pointer;filter:none}")),document.head.appendChild(e)}}catch(t){console.error("vite-plugin-css-injected-by-js",t)}})();
var xo = Object.defineProperty;
var yo = (t, n, e) => n in t ? xo(t, n, { enumerable: !0, configurable: !0, writable: !0, value: e }) : t[n] = e;
var se = (t, n, e) => yo(t, typeof n != "symbol" ? n + "" : n, e);
import { createRef as bo, useMemo as P, forwardRef as xe, useCallback as ae, useRef as j, useEffect as k, useLayoutEffect as _o, createContext as Ae, useContext as ie, useState as O, startTransition as tn, Fragment as Yt, useImperativeHandle as Ee } from "react";
import { create as vt, useStore as wo } from "zustand";
import { subscribeWithSelector as Ao } from "zustand/middleware";
import { jsx as A, Fragment as He, jsxs as B } from "react/jsx-runtime";
import { useThree as gt, useFrame as De, extend as Gn } from "@react-three/fiber";
import { createRoot as To } from "react-dom/client";
import * as X from "three";
import { Vector3 as V, Vector2 as pe, createCanvasElement as Mo, OrthographicCamera as Co, MeshBasicMaterial as xt, Scene as Po, PlaneGeometry as ko, Mesh as dt, CanvasTexture as Un, Color as Q, ShaderMaterial as Qe, Ray as So, Plane as Lo, Uniform as D, BackSide as Bn, DoubleSide as Me, FrontSide as pt, WebGLRenderTarget as Hn, HalfFloatType as zo, LinearFilter as Xe, Box3 as jn, DepthTexture as Eo, UnsignedByteType as Do, RGBAFormat as $n, SRGBColorSpace as Vn, InstancedBufferAttribute as Nn, Matrix4 as Kt, AdditiveBlending as Yn, InstancedMesh as jt, Line as Kn, NearestFilter as Ro, UniformsUtils as ze, ShaderLib as qt, MultiplyOperation as Io, TangentSpaceNormalMap as Wo, Layers as Oo, LineBasicMaterial as Fo, MeshStandardMaterial as de, MeshLambertMaterial as Go, CylinderGeometry as Uo, ConeGeometry as qn, Sphere as Bo, InstancedInterleavedBuffer as Ho, InstancedBufferGeometry as jo, BufferAttribute as nn, InterleavedBufferAttribute as rt } from "three";
import { createEndpoint as Xt, transfer as $o, proxy as Vo } from "comlink";
import "p-limit";
import "curve-interpolator";
import { n as No, s as Yo, P as Ke, a as on, b as qe, c as Ko, d as ge, m as Xn, e as qo, f as Xo, g as Qo, T as Zo, L as ne, r as Jo, h as ei, i as Qn, j as Zn, k as we, l as ti, o as ni, u as Re, p as rn, q as sn, t as oi, v as ii } from "./chunk-CkcLzcfd.js";
import { w as Da, C as Ra } from "./chunk-CkcLzcfd.js";
import "three/src/math/MathUtils.js";
import "proj4";
import Jn from "rbush";
import { Text as an, useTexture as ri } from "@react-three/drei";
import { i as ln, c as eo, t as cn, g as si, C as ai, T as Qt, W as li, a as ci, b as ui } from "./chunk-Bv7spTT9.js";
import { f as Wa, d as Oa, e as Fa, w as Ga } from "./chunk-Bv7spTT9.js";
import fi from "react-use-measure";
import { range as di, group as un } from "d3-array";
import { axisLeft as fn } from "d3-axis";
import { pointer as pi, select as $t } from "d3-selection";
import { path as Ze } from "d3-path";
import { scaleLinear as Ie } from "d3-scale";
import { drag as hi } from "d3-drag";
import { format as mi } from "d3-format";
import { nanoid as ht } from "nanoid";
import { piecewise as vi, interpolateHcl as gi } from "d3-interpolate";
import { c as xi, a as yi } from "./chunk-BX-cez1_.js";
import { b as Ba, d as Ha } from "./chunk-BX-cez1_.js";
import bi from "p-queue";
const he = vt(
  Ao((t, n) => ({
    visible: !0,
    update: {
      required: !1,
      ref: null,
      setRef: (e) => t((i) => ({ update: { ...i.update, ref: e } }))
    },
    layers: {},
    annotations: {},
    instances: [],
    clear: () => {
      t({
        layers: {},
        annotations: {},
        instances: []
      });
    },
    setInstances: (e) => t({ instances: e }),
    layerExist: (e) => !!n().layers[e],
    toggleVisibility: () => {
      t((e) => ({
        visible: !e.visible,
        update: { ...e.update, required: !0 }
      }));
    },
    createLayer: (e) => {
      const i = e.id;
      return t((o) => {
        const a = o.layers;
        if (a[i])
          throw Error("Layer already exist!");
        return { layers: { ...a, [i]: e } };
      }), () => {
        t((o) => {
          const a = { ...o.layers };
          return delete a[i], {
            layers: a,
            update: { ...o.update, required: !0 }
          };
        });
      };
    },
    updateLayer: (e, i) => {
      t((o) => {
        const a = o.layers;
        if (!a[e])
          throw Error("Layer does not exist!");
        return {
          layers: { ...a, [e]: { ...a[e], ...i } },
          update: { ...o.update, required: !0 }
        };
      });
    },
    addLayerAnnotations: (e, i, o) => {
      t((a) => {
        o.forEach((s) => {
          s.scope = i;
        });
        const r = a.annotations, l = r[e] ? r[e].filter((s) => s.scope !== i) : [];
        return {
          annotations: {
            ...r,
            [e]: [...l, ...o]
          },
          update: { ...a.update, required: !0 }
        };
      });
    },
    removeLayerAnnotations: (e, i) => {
      t((o) => {
        const a = o.annotations, r = a[e] ? a[e].filter((l) => l.scope !== i) : [];
        return {
          annotations: {
            ...a,
            [e]: r
          },
          update: { ...o.update, required: !0 }
        };
      });
    }
  }))
), _i = () => {
  he.setState((t) => {
    if (!t.visible)
      return {
        instances: [],
        update: { ...t.update, required: !1, ref: null }
      };
    const n = t.layers, e = new Map(t.instances.map((r) => [r.id, r])), i = [], o = [0, 0];
    Object.keys(n).forEach((r) => {
      var c;
      const l = n[r];
      l.visible && ((c = t.annotations[r]) == null || c.forEach((s) => {
        const u = `${r}_${s.scope}_${s.id}`;
        let f;
        const m = e.get(u);
        m ? (f = m, f.annotation.name = s.name, f.annotation.data = s.data, f.annotation.direction = s.direction, f.annotation.position = s.position, f.annotation.priority = s.priority) : f = {
          id: u,
          ref: l.labelComponent ? bo() : null,
          layer: l,
          annotation: s,
          priority: 0,
          rank: 0,
          state: {
            visible: !1,
            distance: 1 / 0,
            health: 0,
            labelWidht: 0,
            labelHeight: 0,
            screenPosition: [0, 0, 0],
            zIndex: 0
          }
        }, f.priority = (s.priority || 0) + (l.priority || 0), o[0] = Math.min(o[0], f.priority), o[1] = Math.max(o[1], f.priority), i.push(f);
      }));
    });
    const a = Math.abs(o[1] - o[0]);
    return i.forEach((r) => {
      r.priority = a > 0 ? (r.priority - o[0]) / a : 0;
    }), {
      instances: i,
      update: { ...t.update, required: !1, ref: null }
    };
  });
};
he.subscribe(
  (t) => t.update.required,
  (t) => {
    if (t) {
      const n = he.getState().update;
      n.ref && clearTimeout(n.ref);
      const e = setTimeout(
        () => _i(),
        500
      );
      n.setRef(e);
    }
  }
);
const je = (t, n) => {
  const e = he((a) => a.addLayerAnnotations), i = he((a) => a.removeLayerAnnotations);
  return P(() => ({
    addAnnotations: (a) => {
      if (a.length)
        return e(t, n, a), () => {
          i(t, n);
        };
    }
  }), [e, i, t, n]);
}, wi = {
  pointerEvents: "none",
  width: "100%",
  height: "100%"
}, Ai = {
  position: "absolute",
  top: 0,
  left: 0,
  visibility: "hidden",
  userSelect: "none",
  cursor: "pointer",
  pointerEvents: "visible"
}, Ti = xe(({ id: t, state: n, layer: e, annotation: i }, o) => {
  const a = ae(() => {
    e.onClick && e.onClick({ instanceId: t, ...i });
  }, [i, t, e]), r = ae(() => {
    n.labelHovered = !0;
  }, [n]), l = ae(() => {
    n.labelHovered = !1;
  }, [n]);
  return /* @__PURE__ */ A(
    "div",
    {
      ref: o,
      style: Ai,
      onClick: a,
      onPointerEnter: r,
      onPointerLeave: l,
      children: e.labelComponent && /* @__PURE__ */ A(
        e.labelComponent,
        {
          instanceId: t,
          ...i
        }
      )
    }
  );
}), Mi = () => {
  const t = wo(he, (n) => n.instances);
  return /* @__PURE__ */ A("div", { style: wi, children: t.map(
    (n) => /* @__PURE__ */ A(
      Ti,
      {
        ref: n.ref,
        id: n.id,
        state: n.state,
        layer: n.layer,
        annotation: n.annotation
      },
      n.id
    )
  ) });
}, st = new V(), Ci = [
  /* 0 */
  0,
  /* 1 */
  Ke,
  /* 2 */
  on,
  /* 3 */
  qe - Ke,
  /* 4 */
  qe,
  /* 5 */
  -qe + Ke,
  /* 6 */
  -on,
  /* 7 */
  -Ke
], Pi = [
  [2, 6],
  [7, 3],
  [0, 4],
  [1, 5]
], ki = (t, n, e, i) => {
  st.set(
    n[0] + e[0] * 100,
    n[1] + e[1] * 100,
    n[2] + e[2] * 100
  ), st.project(i);
  const o = No(
    Yo([st.x, st.y], [t[0], t[1]])
  );
  let a = Math.atan2(o[1], o[0]);
  return a < 0 && (a = qe + a), Math.floor((a + Ko) / Ke) % 4;
}, Si = (t, n, e, i) => {
  const o = Math.floor((t[0] * 0.5 + 0.5) * n), a = Math.floor((t[1] * 0.5 + 0.5) * e), r = i[a * n + o];
  return r > -1 && r < t[2];
}, dn = [-0.99, 0.99], pn = [-0.99, 0.99], Vt = 1, hn = Vt * 2, mn = 3, Li = 5, zi = new V(), Ue = new V();
let vn = 0, Pt, kt, St, Lt, zt;
const gn = new Jn(), xn = new Jn();
function yn(t, n, e) {
  const i = t.state.scaleFactor, o = Pi[t.state.quadrant], a = Ci[o[n]], r = t.state.labelWidht || 0, l = t.state.labelHeight || 0, c = r * i, s = l * i, u = qo([c, s], a), f = [Math.cos(a), -Math.sin(a)], m = t.layer.labelOffset * i, g = [
    (t.state.screenPosition[0] * 0.5 + 0.5) * e.x + f[0] * m,
    (-t.state.screenPosition[1] * 0.5 + 0.5) * e.y + f[1] * m
  ];
  t.state.anchorPosition = g, t.state.scaledOffset = [
    (r - c) / 2,
    (l - s) / 2
  ], t.state.labelPosition = [
    g[0] - c / 2 + u[0],
    g[1] - s / 2 + u[1]
  ];
}
function bn(t, n, e, i) {
  t.state.visible && (t.state.positionSlot !== n || t.state.prevQuadrant && t.state.prevQuadrant !== t.state.quadrant) && e && (t.state.inTransition = !0, t.state.transitionTime = 0, t.state.prevLabelPosition = e, i && (t.state.prevAnchorPosition = i));
}
function Ei(t, n, e, i) {
  const o = e.elapsedTime - vn, r = n.fov * qe / 180;
  n.getWorldDirection(zi);
  let l = 0;
  const c = [];
  return t.forEach((s, u) => {
    s.state.capped = !1, s.state._needsUpdate = !1, s.state.visible || (s.state.health = 0, s.state.prevAnchorPosition = void 0, s.state.prevLabelPosition = void 0), s.state.kill ? s.state.health === 0 ? (s.state.kill = !1, s.state.visible = !1) : s.state.health > 0 && (s.state.health = Math.max(
      0,
      s.state.health - o * mn
    )) : s.state.health < 1 && (s.state.health = Math.min(
      1,
      Math.max(0, s.state.health + o * mn)
    )), s.state.inTransition && (s.state.transitionTime += o * Li, s.state.transitionTime >= 1 && (s.state.inTransition = !1, s.state.transitionTime = 0, s.state.prevAnchorPosition = void 0, s.state.prevLabelPosition = void 0)), Ue.set(...s.annotation.position);
    const f = Ue.distanceTo(n.position), m = Math.max(
      0.25,
      Math.min(
        1,
        1 / (2 * Math.tan(r / 2) * f) * s.layer.distanceFactor
      )
    );
    Ue.project(n);
    const g = [Ue.x, Ue.y, Ue.z], x = g[2] >= 0 && g[2] <= 1 && g[0] >= dn[0] && g[0] <= dn[1] && g[1] >= pn[0] && g[1] <= pn[1] && (!s.layer.minDistance || f >= s.layer.minDistance) && (!s.layer.maxDistance || f <= s.layer.maxDistance);
    if (s.state.screenPosition = g, s.state.distance = f, s.state.scaleFactor = m, s.state.inViewSpace = x, s.state.cooldown && s.state.visible === !1)
      s.state.cooldown = Math.max(0, s.state.cooldown - o), s.rank = 0;
    else {
      const v = ge(
        (g[0] ** 2 + g[1] ** 2) / 2,
        0,
        1
      ), h = Math.min(f, 1e3);
      s.rank = 1e3, s.rank += s.priority * 1e3 - (v * 100 + h), s.state.visible ? s.rank += 100 : s.rank -= 100, x && l < i ? (l++, s.state.prevQuadrant = s.state.quadrant, s.state.quadrant = s.annotation.direction ? ki(
        g,
        s.annotation.position,
        s.annotation.direction,
        n
      ) : 0) : (s.state.quadrant = 0, s.state.visible = !1, u >= i && (s.state.capped = !0));
    }
    s.state.boost && (s.state.kill = !1, s.state.cooldown = 0, s.state.visible = !0, s.rank += 1e5, s.state.positionSlot = 0, s.state.boost = !1), s.state.inViewSpace && !s.state.capped ? c.push(s) : s.state._visibility !== "hidden" && (s.state.visible = !1, s.state._visibility = "hidden", s.state._needsUpdate = !0);
  }), vn = e.elapsedTime, c.sort((s, u) => u.rank - s.rank), c;
}
async function Di(t, n, e, i) {
  t.forEach((o) => {
    const a = Si(
      o.position,
      e,
      i,
      n
    );
    !o.instance.state.occluded && a && (o.instance.state.kill = !0), o.instance.state.occluded = a;
  });
}
function Ri(t, n) {
  gn.clear(), xn.clear(), t.forEach((e) => {
    var l;
    const i = e.state.labelPosition ? [...e.state.labelPosition] : null, o = e.state.anchorPosition ? [...e.state.anchorPosition] : null, a = e.state.positionSlot || 0, r = (l = e.ref) == null ? void 0 : l.current;
    if (r && (e.state.labelWidht = r.clientWidth, e.state.labelHeight = r.clientHeight), e.state.kill || e.state.occluded)
      yn(e, a, n), bn(
        e,
        a,
        i,
        o
      );
    else if (e.state.cooldown)
      e.state.visible = !1;
    else {
      let c = !1;
      const s = a === 0 ? [0, 1] : [1, 0], u = e.state.labelWidht, f = e.state.labelHeight, m = u * e.state.scaleFactor, g = f * e.state.scaleFactor;
      for (let x = 0; x < s.length; x++) {
        yn(e, s[x], n);
        const v = {
          minX: e.state.labelPosition[0] - Vt,
          minY: e.state.labelPosition[1] - Vt,
          maxX: e.state.labelPosition[0] + m + hn,
          maxY: e.state.labelPosition[1] + g + hn
        }, h = e.state.scaleFactor >= 0.5 ? gn : xn;
        if (!h.collides(v)) {
          h.insert(v), c = !0, bn(
            e,
            s[x],
            i,
            o
          ), e.state.positionSlot = s[x];
          break;
        }
      }
      c ? e.state.visible = !0 : (e.state.kill = !0, e.state.cooldown = 2.5);
    }
    e.state.visible ? (e.state.zIndex = e.state.labelHovered ? 1e6 : e.state.kill ? 0 : Math.round(1 / e.state.distance * 1e5), e.state.opacity = Math.max(0.75, e.state.scaleFactor) * e.state.health, e.state.inTransition && e.state.prevLabelPosition ? [Lt, zt] = Xn(
      e.state.prevLabelPosition,
      e.state.labelPosition,
      e.state.transitionTime
    ) : [Lt, zt] = e.state.labelPosition, e.state.labelX = Lt - e.state.scaledOffset[0], e.state.labelY = zt - e.state.scaledOffset[1], r && (Pt = `translate(${e.state.labelX}px,${e.state.labelY}px) scale(${e.state.scaleFactor})`, Pt !== e.state._transform && (e.state._transform = Pt, e.state._needsUpdate = !0), kt = `${e.state.opacity}`, kt !== e.state._opacity && (e.state._opacity = kt, e.state._needsUpdate = !0), St = `${e.state.zIndex}`, St !== e.state._zIndex && (e.state._zIndex = St, e.state._needsUpdate = !0), e.state._visibility !== "visible" && (e.state._visibility = "visible", e.state._needsUpdate = !0))) : e.state._visibility !== "hidden" && (e.state._visibility = "hidden", e.state._needsUpdate = !0);
  });
}
function _n(t) {
  t.filter((n) => n.state._needsUpdate).forEach((n) => {
    var i;
    const e = (i = n.ref) == null ? void 0 : i.current;
    e && (n.state._transform && (e.style.transform = n.state._transform), n.state._opacity && (e.style.opacity = n.state._opacity), n.state._zIndex && (e.style.zIndex = n.state._zIndex), n.state._visibility && (e.style.visibility = n.state._visibility));
  });
}
const wn = 512, An = 512, Et = new V(), ue = new pe();
let at, Dt, lt, Rt;
const Tn = "annotations_root", Ws = ({ maxVisible: t = 100, children: n }) => {
  const { gl: e } = gt(), i = he((c) => c.instances), o = j(!1), a = he((c) => c.clear), r = P(() => {
    const c = Mo().getContext("2d");
    if (!c) return null;
    const s = new Co(-1, 1, 1, -1, 0, 1), u = new xt({ transparent: !0 }), f = new Po(), m = new ko(2, 2), g = new dt(m, u);
    return f.add(g), {
      postCamera: s,
      postScene: f,
      postMaterial: u,
      size: new pe(),
      texture: null,
      ctx: c
    };
  }, []), l = P(() => {
    var u;
    const c = e.domElement.parentElement;
    if (!c) throw Error("Unable to create root!");
    (u = c.querySelector(`#${Tn}`)) == null || u.remove();
    const s = document.createElement("div");
    return s.setAttribute("id", Tn), s.setAttribute("style", "position:absolute;top:0;left:0;z-index: 1;pointer-events:none;padding:0;width:100%;height:100%;user-select:none"), c.appendChild(s), To(s);
  }, [e]);
  return k(() => (l.render(/* @__PURE__ */ A(Mi, {})), () => {
    l.unmount(), a();
  }), [l, a]), De(({ gl: c, camera: s, scene: u, clock: f, pointer: m }) => {
    var g;
    if (c.getSize(ue), c.clear(), c.render(u, s), r) {
      const { postCamera: x, postScene: v, ctx: h, postMaterial: y } = r;
      if (h.clearRect(0, 0, ue.x, ue.y), !i.length) return;
      const b = Ei(
        i,
        s,
        f,
        t
      );
      if (!b.length) {
        _n(i);
        return;
      }
      Ri(
        b,
        ue
      ), o.current || requestAnimationFrame(() => {
        o.current = !0;
        const p = b.map((w) => {
          const T = w.layer.anchorOcclusionRadius, M = Xo([
            s.position.x - w.annotation.position[0],
            s.position.y - w.annotation.position[1],
            s.position.z - w.annotation.position[2]
          ]);
          return Et.set(
            w.annotation.position[0] + M[0] * T,
            w.annotation.position[1] + M[1] * T,
            w.annotation.position[2] + M[2] * T
          ), Et.project(s), { instance: w, position: Et.toArray() };
        });
        Qo(
          c,
          u,
          s,
          wn,
          An
        ).then((w) => {
          if (w)
            return Di(
              p,
              w,
              wn,
              An
            );
        }).finally(() => {
          o.current = !1;
        });
      }), _n(i), (r.texture === null || r.texture.image.width !== ue.x || r.texture.image.height !== ue.y) && (h.canvas.width = ue.x, h.canvas.height = ue.y, (g = r.texture) == null || g.dispose(), r.texture = new Un(h.canvas), y.map = r.texture);
      const _ = [
        (m.x * 0.5 + 0.5) * ue.x,
        (-m.y * 0.5 + 0.5) * ue.y
      ];
      b.filter((p) => !p.state.occluded && !p.state.capped).sort((p, w) => w.state.distance - p.state.distance).forEach((p) => {
        at = (p.state.screenPosition[0] * 0.5 + 0.5) * ue.x, lt = (-p.state.screenPosition[1] * 0.5 + 0.5) * ue.y;
        let w = p.layer.anchorSize * p.state.scaleFactor, T = !1;
        if (Math.abs(_[0] - at) <= w && Math.abs(_[1] - lt) <= w && (p.state.visible ? T = !0 : p.state.boost = !0), (p.state.labelHovered || T) && (w *= 1.5), p.layer.labelOffset > 0 && p.state.visible) {
          p.state.inTransition && p.state.prevAnchorPosition ? [Dt, Rt] = Xn(
            p.state.prevAnchorPosition,
            p.state.anchorPosition,
            p.state.transitionTime
          ) : [Dt, Rt] = p.state.anchorPosition;
          let M = Math.max(
            0.1,
            p.layer.connectorWidth * p.state.scaleFactor
          );
          (p.state.labelHovered || T) && (M *= 2), h.globalAlpha = p.state.opacity || 0, h.beginPath(), h.moveTo(at, lt), h.lineTo(Dt, Rt), h.strokeStyle = p.layer.connectorColor, h.lineWidth = M, h.stroke();
        }
        h.beginPath(), h.arc(at, lt, w, 0, Zo), h.globalAlpha = p.state.visible ? 1 : 0.5, h.fillStyle = p.layer.anchorColor, h.fill(), h.globalAlpha = p.state.opacity || 0, h.strokeStyle = "black", h.lineWidth = 0.75, h.stroke();
      }), r.texture.needsUpdate = !0, c.render(v, x);
    }
  }, 1), /* @__PURE__ */ A(He, { children: n });
}, Ii = ({ id: t, name: n }) => /* @__PURE__ */ A(
  "div",
  {
    id: `annotation_${t}`,
    style: {
      minWidth: "150px",
      background: "#33333390",
      color: "white",
      textAlign: "center",
      overflow: "hidden",
      borderRadius: "4px",
      padding: "1px 6px",
      fontFamily: "sans-serif",
      fontSize: "12pt"
    },
    children: /* @__PURE__ */ A("div", { style: { whiteSpace: "nowrap" }, children: n })
  },
  t
), Os = ({
  id: t,
  name: n,
  priority: e = 0,
  visible: i = !0,
  distanceFactor: o = 100,
  minDistance: a = 10,
  maxDistance: r = 5e3,
  anchorOcclusionRadius: l = 15,
  anchorSize: c = 0.25,
  anchorColor: s = "white",
  connectorWidth: u = 1,
  connectorColor: f = s || "white",
  labelOffset: m = 100,
  labelComponent: g = Ii,
  onClick: x,
  children: v
}) => {
  const h = he((p) => p.createLayer), y = he((p) => p.updateLayer), d = he((p) => p.layerExist), b = j(null), _ = P(() => ({
    id: t,
    name: n,
    priority: e,
    visible: i,
    distanceFactor: o,
    minDistance: a,
    maxDistance: r,
    labelOffset: m,
    anchorOcclusionRadius: l,
    anchorSize: c,
    anchorColor: s,
    connectorWidth: u,
    connectorColor: f,
    labelComponent: g,
    onClick: x
  }), [
    t,
    n,
    e,
    i,
    l,
    c,
    s,
    u,
    f,
    a,
    r,
    m,
    o,
    g,
    x
  ]);
  return _o(() => {
    d(_.id) ? y(_.id, _) : b.current = h(_);
  }, [
    h,
    y,
    d,
    _
  ]), k(() => () => {
    b.current && b.current();
  }, []), /* @__PURE__ */ A("group", { children: v });
}, ct = new V(), Fs = ({ radius: t = 3, opacity: n = 0.1, color: e, fixedX: i, fixedY: o, fixedZ: a, renderOrder: r, depthTest: l = !1, depthWrite: c = !1, children: s }) => {
  const { controls: u } = gt(), f = j(null);
  return k(() => {
    function m() {
      const g = u;
      g && f.current ? (g.getTarget(ct), f.current.position.set(i || ct.x, o || ct.y, a || ct.z), f.current.visible = !0) : f.current && (f.current.visible = !1);
    }
    return u && u.addEventListener("update", m), m(), () => {
      u && u.removeEventListener("update", m);
    };
  }, [u, i, o, a]), /* @__PURE__ */ B("group", { ref: f, visible: !1, renderOrder: r, children: [
    !!s && s,
    !s && /* @__PURE__ */ B("mesh", { children: [
      /* @__PURE__ */ A("sphereGeometry", { args: [t] }),
      /* @__PURE__ */ A("meshBasicMaterial", { color: e, transparent: !0, opacity: n, depthTest: l, depthWrite: c })
    ] })
  ] });
}, to = Ae({ current: 1 / 0 }), Gs = ({ min: t = 0, max: n, onDemand: e = !1, children: i }) => {
  const o = ie(to), a = j(null), [r, l] = O(!e);
  return De(() => {
    if (o && a.current) {
      const c = o.current >= t && o.current < n;
      e && c && !r ? tn(() => l(!0)) : e && !c && r ? tn(() => l(!1)) : a.current.visible !== c && (a.current.visible = c);
    }
  }), /* @__PURE__ */ A("group", { ref: a, visible: !1, children: r && i });
}, Wi = (t, n, e, i, o) => {
  const a = e[0] * 0.5, r = e[1] * 0.5, [l, c] = o, s = t * e[0], u = n * e[1], f = (s - (a + l)) * i[0], m = (u - (r + c)) * i[1];
  return [f, m];
}, me = new V(), Oi = ({
  scale: t,
  start: n,
  size: e,
  units: i,
  originOffset: o,
  axesOffset: a,
  axesTickSize: r,
  plane: l,
  color: c,
  side: s,
  trimAxesLabels: u = !1,
  renderOrder: f
}) => {
  const [m, g] = O({ x: 0, y: 0, flipped: !1 });
  De(({ camera: y }) => {
    y.getWorldDirection(me);
    const d = {
      x: 0,
      y: 0,
      flipped: !1
    };
    l === "xz" ? (d.flipped = me.y > 0, d.flipped ? (d.x = me.z < 0 ? Math.PI : 0, d.y = me.x < 0 ? Math.PI : 0) : (d.x = me.z > 0 ? Math.PI : 0, d.y = me.x > 0 ? Math.PI : 0)) : l === "xy" ? (d.flipped = me.z > 0, d.x = 0, d.y = me.x > 0 ? Math.PI : 0) : l === "zy" && (d.flipped = me.x > 0, d.x = 0, d.y = me.z < 0 ? Math.PI : 0), (m.x !== d.x || m.y !== d.y || m.flipped !== d.flipped) && g(d);
  });
  const x = P(() => i / 7.5, [i]), v = P(() => new Q(c || "#fff"), [c]), h = P(() => {
    const y = [
      e[0] * 0.5,
      e[1] * 0.5
    ], d = [
      y[0] + o[0],
      y[1] + o[1]
    ], b = [
      d[0] + ge(a[0], -y[0], y[0]),
      d[1] + ge(a[1], -y[1], y[1])
    ], _ = [
      Math.floor((d[0] - d[0] % i) / i),
      Math.floor((d[1] - d[1] % i) / i)
    ], p = [
      -y[0] + d[0] % i,
      -y[1] + d[1] % i
    ], w = [
      Math.min(1e3, Math.floor((e[0] - d[0] % i) / i) + 1),
      Math.min(1e3, Math.floor((e[1] - d[1] % i) / i) + 1)
    ], T = [], M = [], z = r * i + x * 0.6, E = [
      ge(a[1] + o[1], -y[1], +y[1]),
      ge(a[0] + o[0], -y[0], +y[0])
    ];
    for (let C = u ? 1 : 0; C < w[0] - (u ? 1 : 0); C++) {
      const S = [
        p[0] + C * i,
        E[0] + z
      ], W = Math.round(10 * (n[0] + (C - _[0]) * i * t[0])) / 10;
      Math.abs(b[0] - (S[0] + y[0])) > i / 4 && T.push({
        pos: S,
        value: W,
        index: `x${C}`
      });
    }
    for (let C = u ? 1 : 0; C < w[1] - (u ? 1 : 0); C++) {
      const S = [
        E[1] - z,
        p[1] + C * i
      ], W = Math.round(10 * (n[1] + (C - _[1]) * i * t[1])) / 10;
      Math.abs(b[1] - (S[1] + y[1])) > i / 4 && M.push({
        pos: S,
        value: W,
        index: `y${C}`
      });
    }
    return { xAxis: T, yAxis: M };
  }, [
    e,
    i,
    o,
    a,
    r,
    x,
    t,
    n,
    u
  ]);
  return /* @__PURE__ */ B(
    "group",
    {
      renderOrder: f,
      position: [0, 0, (m.flipped ? -1 : 1) * (i / 1e3)],
      visible: s === "both" || s === "front" && !m.flipped || s === "back" && m.flipped,
      children: [
        h.xAxis.map((y) => /* @__PURE__ */ A(
          an,
          {
            renderOrder: f,
            characters: "123456789,.0",
            position: [...y.pos, 0],
            fontSize: x,
            textAlign: "center",
            anchorX: "center",
            anchorY: "middle",
            "rotation-z": m.x,
            "rotation-y": m.flipped ? Math.PI : 0,
            color: v,
            "material-depthWrite": !1,
            children: y.value
          },
          y.index
        )),
        h.yAxis.map((y) => /* @__PURE__ */ A(
          an,
          {
            renderOrder: f,
            characters: "123456789,.0",
            position: [...y.pos, 0],
            fontSize: x,
            textAlign: "center",
            anchorX: "center",
            anchorY: "middle",
            "rotation-z": m.y + Math.PI / 2,
            "rotation-x": m.flipped ? Math.PI : 0,
            color: v,
            "material-depthWrite": !1,
            children: y.value
          },
          y.index
        ))
      ]
    }
  );
};
var Fi = `precision highp float;

#include <common>
#include <logdepthbuf_pars_fragment>

uniform vec3 uBackground;
uniform float uBackgroundOpacity;
uniform vec2 uSize;
uniform float uCellSize;
uniform float uSubDivisions;
uniform float uOpacity;
uniform vec3 uGridColorMajor;
uniform vec3 uGridColorMinor;
uniform float uGridLineWidth;
uniform vec2 uAxesOffset;
uniform vec3 uAxesColor;
uniform float uAxesLineWidth;
uniform float uAxesTickSize;
uniform vec2 uOriginOffset;
uniform vec2 uCursorPosition;
uniform vec3 uRulerColor;
uniform float uRulerLineWidth;
uniform float uRulerOpacity;
uniform sampler2D uProjectionTexture;
uniform vec3 uProjectionColor;
uniform sampler2D uTexture;
uniform float uTextureMix;

varying vec2 vUv;

float pristineGrid(vec2 uv, vec2 lineWidth) {
  
  
  
  vec2 uvDeriv = fwidth(uv * 2.0);

  vec2 drawWidth = clamp(lineWidth, uvDeriv, vec2(0.5));
  vec2 lineAA = uvDeriv * 1.5;
  vec2 gridUV = 1.0 - abs(fract(uv) * 2.0 - 1.0);
  vec2 grid2 = smoothstep(drawWidth + lineAA, drawWidth - lineAA, gridUV);
  grid2 *= saturate(lineWidth / drawWidth);
  
  grid2 = mix(grid2, lineWidth, clamp(uvDeriv * 2.0 - 1.0, 0.0, 1.0));

  
  return max(grid2.x, grid2.y);
}

float pristineRadialGrid(vec2 _uv, vec2 _lineWidth, float _segments, float _cutoff) {
  float angle = atan(_uv.y, _uv.x) / PI2;
  
  float angleFrac = fract(angle);
  float ddAngle = fwidth(angle * 2.0);
  float ddAngleFrac = fwidth(angleFrac * 2.0);
  ddAngle = ddAngle - 0.00001 < ddAngleFrac ? ddAngle : ddAngleFrac;

  float dist = length(_uv);
  
  #ifdef DYNAMICSEGMENTS
    float logDist = log2(dist);
    float segments = pow(2.0, max(2.0, ceil(logDist) + 2.0));
  #else
    float segments = max(1.0, round(_segments));
  #endif

  vec2 lineWidth = vec2(_lineWidth.x * segments / (dist * PI2), _lineWidth.y);
  vec2 uv = vec2(angle * segments, dist);
  vec2 uvDeriv = vec2(ddAngle * segments, fwidth(dist * 2.0));

  vec2 drawWidth = clamp(lineWidth, uvDeriv, vec2(0.5));
  vec2 lineAA = uvDeriv * 1.5;
  vec2 gridUV = 1.0 - abs(fract(uv) * 2.0 - 1.0);
  vec2 grid2 = smoothstep(drawWidth + lineAA, drawWidth - lineAA, gridUV);

  #ifdef SATURATE
  grid2 *= saturate(lineWidth / drawWidth);
  #endif
  grid2 *= step(_cutoff, dist);
  
  return max(grid2.x, grid2.y);
}

float lines(vec2 uv, vec2 lineWidth) {
  vec2 uvDeriv = fwidth(uv * 2.0);

  vec2 drawWidth = clamp(lineWidth * uvDeriv, uvDeriv, vec2(0.5));
  vec2 lineAA = uvDeriv * 1.5;
  vec2 axisLine2 = smoothstep(drawWidth + lineAA, drawWidth - lineAA, abs(uv * 2.0));

  axisLine2 *= saturate(lineWidth / drawWidth);

  return max(axisLine2.x, axisLine2.y);
}

float ticklines(vec2 uv, vec2 offset, vec2 lineWidth, float tickSize) {
  vec2 uvDeriv = fwidth(uv * 2.0);

  vec2 drawWidth = clamp(lineWidth * uvDeriv, uvDeriv, vec2(0.5));
  vec2 lineAA = uvDeriv * 1.5;
  vec2 tickUV = 1.0 - abs(fract(uv) * 2.0 - 1.0);
  vec2 tickLine2 = smoothstep(drawWidth + lineAA, drawWidth - lineAA, tickUV);
  
  tickLine2 *= saturate(lineWidth / drawWidth);
  tickLine2 *= 1.0 - step( tickSize, abs( uv.yx - offset.yx));
  return max(tickLine2.x, tickLine2.y);
}

vec4 drawGrid(vec4 color, vec2 uv, vec3 lineColor, vec2 lineWidth) {
  float grid = pristineGrid(uv, lineWidth);
  color = mix(color, vec4(lineColor, uOpacity), grid);
  return color;
}

vec4 drawRadialGrid(vec4 color, vec2 uv, vec3 lineColor, vec2 lineWidth, float segments, float cutoff) {
  float grid = pristineRadialGrid(uv, lineWidth, segments, cutoff);
  color = mix(color, vec4(lineColor, uOpacity), grid);
  return color;
}

vec4 drawAxisLines(vec4 color, vec2 uv, vec2 originOffset, vec2 axesOffset, vec3 lineColor, vec2 lineWidth, float tickSize) {
  vec2 tickOffset = axesOffset;
  
  float axesLines = lines(uv - originOffset - axesOffset, lineWidth);
  vec2 tickLineWidth = lineWidth;
  float majorTicks = ticklines(uv - originOffset,  tickOffset, tickLineWidth, tickSize);
  float minorTicks = ticklines((uv - originOffset) * uSubDivisions,  tickOffset * uSubDivisions, tickLineWidth * uSubDivisions * 0.5, tickSize * uSubDivisions * 0.5);
  float lines = max(axesLines, max(minorTicks, majorTicks));
  color = mix(color, vec4(lineColor, uOpacity), lines);
  
  return color;
}

vec4 drawRulerLines(vec4 color, vec2 uv, vec3 lineColor, vec2 lineWidth, float opacity) {
  float rulerLines = lines(uv, lineWidth) * opacity;
  color = mix(color, vec4(lineColor, uOpacity), rulerLines);
  return color;
}

void main() {
  #include <logdepthbuf_fragment>
  
  vec2 originOffset = clamp(uOriginOffset, -uSize / 2.0, uSize / 2.0) / uCellSize; 
  vec2 axesOffset = uAxesOffset / uCellSize;

  vec2 uv = (vUv.xy - 0.5) * (uSize / uCellSize); 

  vec2 uvMaj = uv - originOffset;
  vec2 uvMin = uvMaj * uSubDivisions;

  vec4 color = vec4(uBackground, uBackgroundOpacity * uOpacity);
  vec2 projectionUv = vec2(1.0 - vUv.x, vUv.y);
  
  vec4 textureColor = texture2D(uTexture, vUv);
  color = mix(color, textureColor, textureColor.a * uTextureMix);

  float projection = texture2D(uProjectionTexture, projectionUv).a;
  color = mix(color, vec4(uProjectionColor, uOpacity), projection); 

  #ifdef RADIAL
    color = drawRadialGrid(color, uvMin, uGridColorMinor, vec2(uGridLineWidth * uSubDivisions * 0.75), 16.0 * uSubDivisions, 0.0);
    color = drawRadialGrid(color, uvMaj, uGridColorMajor, vec2(uGridLineWidth), 16.0, 0.0);
  #else
    color = drawGrid(color, uvMin, uGridColorMinor, vec2(uGridLineWidth * uSubDivisions * 0.75));
    color = drawGrid(color, uvMaj, uGridColorMajor, vec2(uGridLineWidth));
  #endif
  
  #ifdef RULERS
    if (uCursorPosition.x > 0.0 && uCursorPosition.y > 0.0) {
      color = drawRulerLines(color, vUv - uCursorPosition, uRulerColor, vec2(uRulerLineWidth), uRulerOpacity);
    }
  #endif

  #ifdef AXES
  color = drawAxisLines(color, uv, originOffset, axesOffset, uAxesColor, vec2(uAxesLineWidth), uAxesTickSize);
  #endif

  
  
  
  gl_FragColor = color;

  
  
}`, Gi = `#include <common>
#include <logdepthbuf_pars_vertex>

varying vec2 vUv;

void main() {

  vec4 mvPosition = vec4(position, 1.0);

  #ifdef USE_INSTANCING

  mvPosition = instanceMatrix * mvPosition;

  #endif

  mvPosition = modelViewMatrix * mvPosition;
  gl_Position = projectionMatrix * mvPosition;

  vUv = uv;

  #include <logdepthbuf_vertex>
}`;
const Ui = new Qe(), Mn = new V(), Cn = new So(), Bi = [
  [0, 0.1],
  [2.5, 0.25],
  [5, 0.5],
  [10, 1],
  [25, 2.5],
  [50, 5],
  [100, 10],
  [250, 25],
  [500, 50],
  [999, 100]
], Be = ({
  plane: t,
  size: n,
  position: e = [0, 0, 0],
  gridOrigin: i,
  gridScale: o = [1, 1],
  cellSize: a = 10,
  subDivisions: r = 0,
  background: l = 1056816,
  backgroundOpacity: c = 1,
  opacity: s = 1,
  gridColorMajor: u = "#89a",
  gridColorMinor: f = "#789",
  gridLineWidth: m = 0.05,
  showAxes: g = !0,
  showAxesLabels: x = !0,
  trimAxesLabels: v = !1,
  axesOffset: h = void 0,
  axesColor: y = "#fff",
  axesLineWidth: d = m || 0.05,
  axesTickSize: b = 0.1,
  originValue: _ = [0, 0],
  radial: p = !1,
  dynamicSegments: w = !1,
  showRulers: T = !1,
  rulerColor: M = "#c59797",
  rulerLineWidth: z = 1,
  rulerOpacity: E = 0.5,
  planeOffset: C = 0,
  dynamicCellSize: S = !1,
  cellSizeDistanceFactors: W = Bi,
  side: I = "both",
  onRulerUpdate: K = null,
  texture: L,
  textureMix: F = 1,
  enableProjection: R = !1,
  projectionDistance: $ = 1e3,
  projectionColor: N = "#456",
  projectionResolution: te = 1024,
  projectionRefreshRate: be = 100,
  name: q,
  userData: wt,
  renderOrder: We,
  visible: U,
  castShadow: At,
  receiveShadow: $e,
  layers: oe
}) => {
  const [ee, Oe] = O({ originOffset: [0, 0], axesOffset: [0, 0] }), [Ve, et] = O(1), ce = P(() => new Lo(), []), _e = P(() => new V(), []), ke = j(null), Tt = j(null), Mt = j(null), Y = j({
    uSize: new D(new pe(0, 0)),
    uBackground: new D(new Q(l || 1056816)),
    uBackgroundOpacity: new D(1),
    uOpacity: new D(s || 1),
    uCellSize: new D(a || 10),
    uSubDivisions: new D(r || 0),
    uOriginOffset: new D(new pe(0, 0)),
    uDistanceFactor: new D(0),
    uGridColorMajor: new D(new Q(u || "#abc")),
    uGridColorMinor: new D(new Q(f || "#789")),
    uGridLineWidth: new D(m || 0.05),
    uAxesOffset: new D(new pe(0, 0)),
    uAxesColor: new D(new Q(y || "#fff")),
    uAxesLineWidth: new D(d || 1),
    uAxesTickSize: new D(b || 0.1),
    uCursorPosition: new D(new pe()),
    uRulerColor: new D(new Q(M || "#fff")),
    uRulerLineWidth: new D(z || 1),
    uRulerOpacity: new D(E || 0.5),
    uProjectionTexture: new D(void 0),
    uProjectionColor: new D(new Q(N || "#456")),
    uTexture: new D(void 0),
    uTextureMix: new D(1)
  }), { controls: Fe, camera: tt, gl: Ge, scene: nt } = gt(), ho = P(() => [
    (t === "zy" ? C : 0) + e[0],
    (t === "xz" ? C : 0) + e[1],
    (t === "xy" ? C : 0) + e[2]
  ], [t, C, e]), Ct = P(() => t === "xz" ? [o[0], -o[1]] : t === "zy" ? [-o[0], o[1]] : [...o], [o, t]), mo = P(() => I === "back" ? Bn : I === "both" ? Me : pt, [I]);
  k(() => {
    const Z = ke.current;
    if (Z) {
      Z.getWorldPosition(_e);
      const G = { originOffset: [0, 0], axesOffset: [0, 0] };
      i ? t === "xz" ? (G.originOffset[0] = i[0] - _e.x, G.originOffset[1] = -(i[1] - _e.z)) : t === "xy" ? (G.originOffset[0] = i[0] - _e.x, G.originOffset[1] = i[1] - _e.y) : t === "zy" && (G.originOffset[0] = -(i[0] - _e.z), G.originOffset[1] = i[1] - _e.y) : (G.originOffset[0] = 0, G.originOffset[1] = 0), h ? t === "xz" ? (G.axesOffset[0] = h[0] * o[0] - G.originOffset[0], G.axesOffset[1] = -h[1] * o[1] - G.originOffset[1]) : t === "xy" ? (G.axesOffset[0] = h[0] * o[0] - G.originOffset[0], G.axesOffset[1] = h[1] * o[1] - G.originOffset[1]) : t === "zy" && (G.axesOffset[0] = -h[0] * o[0] - G.originOffset[0], G.axesOffset[1] = h[1] * o[1] - G.originOffset[1]) : (G.axesOffset[0] = 0, G.axesOffset[1] = 0), t === "xz" ? ce.normal.set(0, 1, 0) : t === "xy" ? ce.normal.set(0, 0, 1) : t === "zy" && ce.normal.set(1, 0, 0), ce.constant = _e.length(), Oe((fe) => fe.axesOffset[0] !== G.axesOffset[0] || fe.axesOffset[1] !== G.axesOffset[1] || fe.originOffset[0] !== G.originOffset[0] || fe.originOffset[1] !== G.originOffset[1] ? G : fe);
    }
  }, [t, i, h, o, ce, _e]), k(() => {
    Y.current.uBackground.value = new Q(l ?? 7368816), Y.current.uBackgroundOpacity.value = c, Y.current.uSize.value.set(...n), Y.current.uOpacity.value = Number.isFinite(s) ? ge(s, 0, 1) : 1, Y.current.uCellSize.value = a * Ve, Y.current.uSubDivisions.value = r, Y.current.uGridColorMajor.value.set(u), Y.current.uGridColorMinor.value.set(f), Y.current.uGridLineWidth.value = m, Y.current.uAxesLineWidth.value = d, Y.current.uAxesColor.value.set(y), Y.current.uAxesTickSize.value = b, Y.current.uAxesOffset.value.set(...ee.axesOffset), Y.current.uOriginOffset.value.set(...ee.originOffset), Y.current.uRulerLineWidth.value = z, Y.current.uRulerColor.value.set(M), Y.current.uRulerOpacity.value = E, Y.current.uTexture.value = L, Y.current.uTextureMix.value = F, Y.current.uProjectionColor.value.set(N);
  }, [
    n,
    a,
    Ve,
    r,
    l,
    c,
    s,
    u,
    f,
    y,
    d,
    b,
    m,
    M,
    z,
    E,
    ee,
    L,
    F,
    N
  ]), k(() => {
    function Z() {
      if (ke.current && tt) {
        tt.getWorldDirection(Mn), Cn.set(tt.position, Mn);
        const G = Cn.distanceToPlane(ce);
        if (G) {
          const fe = Math.min(G, 1e3 * a) / a;
          let Te = W.findIndex((it) => it[0] >= fe);
          Te === -1 ? Te = W.length - 1 : Te--, Te = Math.max(0, Te);
          const ot = W[Te][1];
          et((it) => it !== ot ? ot : it);
        }
      }
    }
    return ke.current && Fe && S ? (Fe.addEventListener("update", Z), Z()) : et(1), () => {
      Fe == null || Fe.removeEventListener("update", Z);
    };
  }, [Fe, tt, ce, S, a, W, n]), k(() => {
    Tt.current && (Tt.current.needsUpdate = !0);
  }, [p, g, w, T]), k(() => {
    let Z = null, G = null;
    return R && (Z = new Hn(te, te, {
      minFilter: Xe,
      magFilter: Xe,
      type: zo
    }), Y.current.uProjectionTexture.value = Z.texture, G = setInterval(() => {
      if (Z && ke.current && Mt.current) {
        const Te = Mt.current, ot = Ge.getRenderTarget();
        Ge.setRenderTarget(Z), nt.overrideMaterial = Ui, ke.current.visible = !1, Ge.clear(), Ge.render(nt, Te), nt.overrideMaterial = null, Ge.setRenderTarget(ot), ke.current.visible = !0;
      }
    }, be)), () => {
      G && clearInterval(G), Z == null || Z.dispose();
    };
  }, [R, Ge, nt, n, $, te, be]);
  const vo = ae((Z) => {
    var G, fe;
    Y.current.uCursorPosition.value.set(((G = Z.uv) == null ? void 0 : G.x) || 0, ((fe = Z.uv) == null ? void 0 : fe.y) || 0), K && Z.uv && K(Wi(Z.uv.x, Z.uv.y, n, Ct, ee.originOffset));
  }, [n, Ct, ee.originOffset, K]), go = ae(() => {
    Y.current.uCursorPosition.value.set(0, 0), K && K(null);
  }, [K]);
  return /* @__PURE__ */ B(
    "group",
    {
      ref: ke,
      name: q,
      userData: wt,
      visible: U,
      "rotation-x": t === "xz" ? -Math.PI / 2 : 0,
      "rotation-y": t === "zy" ? Math.PI / 2 : 0,
      position: ho,
      children: [
        /* @__PURE__ */ B(
          "mesh",
          {
            "position-z": -1e-3 * a,
            onPointerMove: T ? vo : void 0,
            onPointerLeave: T ? go : void 0,
            renderOrder: We,
            castShadow: At,
            receiveShadow: $e,
            layers: oe,
            children: [
              /* @__PURE__ */ A(
                "planeGeometry",
                {
                  args: n
                }
              ),
              /* @__PURE__ */ A(
                "shaderMaterial",
                {
                  ref: Tt,
                  uniforms: Y.current,
                  defines: {
                    RADIAL: p,
                    DYNAMICSEGMENTS: w,
                    AXES: !!g,
                    RULERS: !!T,
                    SATURATE: !0
                  },
                  vertexShader: Gi,
                  fragmentShader: Fi,
                  side: mo,
                  depthWrite: !0,
                  depthTest: !0,
                  forceSinglePass: !0,
                  transparent: !0
                }
              ),
              g && x && /* @__PURE__ */ A(
                Oi,
                {
                  originOffset: ee.originOffset,
                  axesOffset: ee.axesOffset,
                  trimAxesLabels: v,
                  scale: Ct,
                  size: n,
                  start: _,
                  units: a * Ve,
                  axesTickSize: b,
                  plane: t,
                  color: y,
                  side: I,
                  renderOrder: We !== void 0 && Number.isFinite(We) ? We + 1 : void 0
                }
              )
            ]
          }
        ),
        R && /* @__PURE__ */ A(
          "orthographicCamera",
          {
            ref: Mt,
            args: I === "back" ? [n[0] / 2, n[0] / -2, n[1] / 2, n[1] / -2, 1, $] : [n[0] / -2, n[0] / 2, n[1] / 2, n[1] / -2, 1, $],
            "rotation-y": I === "back" ? 0 : Math.PI
          }
        )
      ]
    }
  );
}, yt = Ae(null), Us = (t) => {
  const n = ie(yt), [e, i] = O({
    origin: [0, 0],
    originValue: [0, 0],
    gridScale: [1, 1]
  });
  return k(() => {
    const o = n.getWorldPosition();
    let a, r, l;
    t.plane === "xz" ? (a = [o[0], o[2]], l = [1, -1], r = t.relativeValues ? [0, 0] : [n.originUtm[0], n.originUtm[1]]) : t.plane === "xy" ? (a = [o[0], o[1]], l = [1, 1], r = t.relativeValues ? [0, 0] : [n.originUtm[0], 0]) : (a = [o[2], o[1]], l = [-1, 1], r = t.relativeValues ? [0, 0] : [n.originUtm[1], 0]), i({ origin: a, originValue: r, gridScale: l });
  }, [n, t.plane, t.relativeValues]), /* @__PURE__ */ A(Be, { ...t, gridOrigin: e.origin, originValue: e.originValue, gridScale: e.gridScale });
}, Se = new jn();
function no(t, n) {
  t.updateWorldMatrix(!1, !1);
  const e = t.geometry;
  e !== void 0 && (t.boundingBox !== void 0 ? (t.boundingBox === null && t.computeBoundingBox(), Se.copy(t.boundingBox)) : (e.boundingBox === null && e.computeBoundingBox(), Se.copy(e.boundingBox)), isNaN(Se.min.x) || isNaN(Se.min.y) || isNaN(Se.min.z) || (Se.applyMatrix4(t.matrixWorld), n.union(Se)));
  const i = t.children;
  for (let o = 0, a = i.length; o < a; o++)
    no(i[o], n);
  return n;
}
const Ne = new V(), Ye = new V(), J = new jn(), Hi = (t) => {
  const n = j(null), e = j({ center: [0, 0, 0], size: [0, 0, 0] }), {
    padding: i = [0, 0, 0],
    snapTo: o,
    updateRate: a = 1e3,
    enabled: r = !0,
    onChange: l
  } = t, c = P(() => {
    if (Number.isFinite(i)) {
      const s = i;
      return {
        x0: s,
        x1: s,
        y0: s,
        y1: s,
        z0: s,
        z1: s
      };
    } else if (Array.isArray(i)) {
      const s = i;
      return {
        x0: s[0],
        x1: s[0],
        y0: s[1],
        y1: s[1],
        z0: s[2],
        z1: s[2]
      };
    } else if (i !== void 0) {
      const s = i;
      return {
        x0: s.x0 || 0,
        x1: s.x1 || 0,
        y0: s.y0 || 0,
        y1: s.y1 || 0,
        z0: s.z0 || 0,
        z1: s.z1 || 0
      };
    }
    return {
      x0: 0,
      x1: 0,
      y0: 0,
      y1: 0,
      z0: 0,
      z1: 0
    };
  }, [i]);
  return k(() => {
    let s = null;
    return l && r && (s = setInterval(() => {
      l && n.current && n.current.children.length && (J.makeEmpty(), no(n.current, J), o ? (J.min.set(
        Math.floor((J.min.x - c.x0) / o) * o,
        Math.floor((J.min.y - c.y0) / o) * o,
        Math.floor((J.min.z - c.z0) / o) * o
      ), J.max.set(
        Math.ceil((J.max.x + c.x1) / o) * o,
        Math.ceil((J.max.y + c.y1) / o) * o,
        Math.ceil((J.max.z + c.z1) / o) * o
      )) : (J.min.set(
        J.min.x - c.x0,
        J.min.y - c.y0,
        J.min.z - c.z0
      ), J.max.set(
        J.max.x + c.x1,
        J.max.y + c.y1,
        J.max.z + c.z1
      )), J.getCenter(Ne), J.getSize(Ye), (Ne.x !== e.current.center[0] || Ne.y !== e.current.center[1] || Ne.z !== e.current.center[2] || Ye.x !== e.current.size[0] || Ye.y !== e.current.size[1] || Ye.z !== e.current.size[2]) && (e.current.center = Ne.toArray(), e.current.size = Ye.toArray(), l(e.current)));
    }, a)), () => {
      s && clearInterval(s);
    };
  }, [c, o, a, r, l]), /* @__PURE__ */ A("group", { ...t, ref: n });
}, Pn = new V(), Bs = ({
  name: t,
  visible: n,
  castShadow: e,
  receiveShadow: i,
  layers: o,
  renderOrder: a,
  userData: r,
  size: l = [0, 0, 0],
  cellSize: c = 10,
  gridScale: s = [1, 1, 1],
  gridOrigin: u = [0, 0, 0],
  originValue: f = [0, 0, 0],
  subDivisions: m = 5,
  position: g = [0, 0, 0],
  gridLineWidth: x = 0.02,
  background: v = 1056816,
  backgroundOpacity: h = 1,
  opacity: y = 1,
  gridColorMajor: d = "#89a",
  gridColorMinor: b = "#789",
  axesColor: _ = "#fff",
  axesLineWidth: p = x || 0.05,
  axesTickSize: w = 0.1,
  enableProjection: T,
  projectionColor: M,
  projectionResolution: z = 2048,
  projectionRefreshRate: E,
  showRulers: C = !1,
  autoSize: S = !1,
  autoSizePadding: W = 0,
  autoSizeUpdateRate: I = 1e3,
  children: K
}) => {
  const [L, F] = O(g), [R, $] = O(l), N = j(null), [te, be] = O(L);
  return k(() => {
    S || (F((q) => q[0] !== g[0] || q[1] !== g[1] || q[2] !== g[2] ? g : q), $((q) => q[0] !== l[0] || q[1] !== l[1] || q[2] !== l[2] ? l : q));
  }, [l, g, S]), k(() => {
    N.current && (N.current.getWorldPosition(Pn), be(Pn.toArray()));
  }, [L]), /* @__PURE__ */ B(
    "group",
    {
      ref: N,
      name: t,
      userData: r,
      visible: n,
      children: [
        /* @__PURE__ */ A(
          Be,
          {
            plane: "xz",
            originValue: [f[0], f[2]],
            cellSize: c,
            size: [R[0], R[2]],
            position: [L[0], L[1] - R[1] * 0.5, L[2]],
            gridScale: [s[0], s[2]],
            gridOrigin: [u[0], u[2]],
            subDivisions: m,
            gridLineWidth: x,
            background: v,
            backgroundOpacity: h,
            gridColorMajor: d,
            gridColorMinor: b,
            opacity: y,
            axesColor: _,
            axesLineWidth: p,
            axesTickSize: w,
            trimAxesLabels: !0,
            side: "both",
            enableProjection: T,
            projectionResolution: z,
            projectionColor: M,
            projectionDistance: R[1],
            projectionRefreshRate: E,
            showRulers: C,
            castShadow: e,
            receiveShadow: i,
            layers: o,
            renderOrder: a
          }
        ),
        /* @__PURE__ */ A(
          Be,
          {
            plane: "xy",
            originValue: [f[0], f[1]],
            cellSize: c,
            size: [R[0], R[1]],
            position: [L[0], L[1], L[2] - R[2] * 0.5],
            gridScale: [s[0], s[1]],
            axesOffset: [(-te[0] - L[0]) / s[0], R[1] * 0.5 * s[1]],
            gridOrigin: [u[0], u[1]],
            subDivisions: m,
            gridLineWidth: x,
            background: v,
            backgroundOpacity: h,
            gridColorMajor: d,
            gridColorMinor: b,
            opacity: y,
            axesColor: _,
            axesLineWidth: p,
            axesTickSize: w,
            trimAxesLabels: !0,
            side: "front",
            enableProjection: T,
            projectionResolution: z,
            projectionColor: M,
            projectionDistance: R[2],
            projectionRefreshRate: E,
            showRulers: C,
            castShadow: e,
            receiveShadow: i,
            layers: o,
            renderOrder: a
          }
        ),
        /* @__PURE__ */ A(
          Be,
          {
            plane: "zy",
            originValue: [f[2], f[1]],
            cellSize: c,
            size: [R[2], R[1]],
            position: [L[0] - R[0] * 0.5, L[1], L[2]],
            gridScale: [s[2], s[1]],
            axesOffset: [(-te[2] - L[2]) / s[2], R[1] * 0.5 * s[1]],
            gridOrigin: [u[2], u[1]],
            subDivisions: m,
            gridLineWidth: x,
            background: v,
            backgroundOpacity: h,
            gridColorMajor: d,
            gridColorMinor: b,
            opacity: y,
            axesColor: _,
            axesLineWidth: p,
            axesTickSize: w,
            trimAxesLabels: !0,
            side: "front",
            enableProjection: T,
            projectionResolution: z,
            projectionColor: M,
            projectionDistance: R[0],
            projectionRefreshRate: E,
            showRulers: C,
            castShadow: e,
            receiveShadow: i,
            layers: o,
            renderOrder: a
          }
        ),
        /* @__PURE__ */ A(
          Be,
          {
            plane: "xy",
            originValue: [f[0], f[1]],
            cellSize: c,
            size: [R[0], R[1]],
            position: [L[0], L[1], L[2] + R[2] * 0.5],
            gridScale: [s[0], s[1]],
            axesOffset: [(-te[0] - L[0]) / s[0], R[1] * 0.5 * s[1]],
            gridOrigin: [u[0], u[1]],
            subDivisions: m,
            gridLineWidth: x,
            background: v,
            backgroundOpacity: h,
            gridColorMajor: d,
            gridColorMinor: b,