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 eo = Object.defineProperty;
var to = (e, n, t) => n in e ? eo(e, n, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[n] = t;
var oe = (e, n, t) => to(e, typeof n != "symbol" ? n + "" : n, t);
import { createRef as no, forwardRef as ve, useCallback as re, useRef as $, useMemo as A, useEffect as L, useLayoutEffect as oo, createContext as Pe, useContext as de, useState as z, startTransition as Yt, Fragment as Gt, useImperativeHandle as Re } from "react";
import { create as dt, useStore as ro } from "zustand";
import { subscribeWithSelector as io } from "zustand/middleware";
import { jsx as k, Fragment as Ee, jsxs as G } from "react/jsx-runtime";
import { useThree as pt, useFrame as ze, extend as so } from "@react-three/fiber";
import { createRoot as ao } from "react-dom/client";
import { Vector3 as V, Vector2 as we, createCanvasElement as lo, OrthographicCamera as co, MeshBasicMaterial as mt, Scene as uo, PlaneGeometry as fo, Mesh as lt, CanvasTexture as Cn, Color as Z, ShaderMaterial as Ke, Ray as po, Plane as mo, Uniform as B, BackSide as $t, DoubleSide as ht, FrontSide as ct, WebGLRenderTarget as An, HalfFloatType as ho, LinearFilter as It, Box3 as En, DepthTexture as vo, UnsignedByteType as go, RGBAFormat as Sn, SRGBColorSpace as Pn, InstancedBufferAttribute as Rn, AdditiveBlending as Ln, Matrix4 as Ht, InstancedMesh as Ft, Line as Wn, NearestFilter as xo, UniformsUtils as Se, ShaderLib as jt, MultiplyOperation as yo, TangentSpaceNormalMap as bo, Layers as _o, LineBasicMaterial as wo, MeshStandardMaterial as ue, MeshLambertMaterial as Mo, ConeGeometry as On, CylinderGeometry as ko, Sphere as To } from "three";
import { createEndpoint as Nt, transfer as Co, proxy as Ao } from "comlink";
import { n as Eo, s as So, P as Ve, a as Xt, b as qe, c as Po, d as he, m as Dn, e as Ro, f as Lo, g as Wo, T as Oo, L as ee, r as Do, h as Io, i as Fo, j as Bo, k as Uo, l as be, q as ie, o as zo, p as Go, u as Le, t as $o } from "./chunk-DBaq_0xI.js";
import { x as qs, C as Ks, w as Ys, v as Xs } from "./chunk-DBaq_0xI.js";
import "curve-interpolator";
import "three/src/math/MathUtils.js";
import "proj4";
import In from "rbush";
import { Text as Qt } from "@react-three/drei";
import { i as Zt, c as Fn, t as Jt, g as Ho, C as jo, T as Vt, W as No, a as Vo } from "./chunk-CI9gP1Ue.js";
import { e as Zs, b as Js, d as ea, w as ta } from "./chunk-CI9gP1Ue.js";
import qo from "react-use-measure";
import { range as Ko, group as en } from "d3-array";
import { axisLeft as tn } from "d3-axis";
import { pointer as Yo, select as Bt } from "d3-selection";
import { path as Ye } from "d3-path";
import { scaleLinear as We } from "d3-scale";
import { drag as Xo } from "d3-drag";
import { format as Qo } from "d3-format";
import { nanoid as ut } from "nanoid";
import { piecewise as Zo, interpolateHcl as Jo } from "d3-interpolate";
import { c as er, a as tr } from "./chunk-BX-cez1_.js";
import { b as oa, d as ra } from "./chunk-BX-cez1_.js";
const fe = dt(
  io((e, n) => ({
    visible: !0,
    update: {
      required: !1,
      ref: null,
      setRef: (t) => e((i) => ({ update: { ...i.update, ref: t } }))
    },
    layers: {},
    annotations: {},
    instances: [],
    clear: () => e({
      layers: {},
      annotations: {},
      instances: []
    }),
    setInstances: (t) => e({ instances: t }),
    layerExist: (t) => !!n().layers[t],
    toggleVisibility: () => {
      e((t) => ({
        visible: !t.visible,
        update: { ...t.update, required: !0 }
      }));
    },
    createLayer: (t) => {
      const i = t.id;
      return e((o) => {
        const r = o.layers;
        if (r[i])
          throw Error("Layer already exist!");
        return { layers: { ...r, [i]: t } };
      }), () => {
        e((o) => {
          const r = { ...o.layers };
          return delete r[i], {
            layers: r,
            update: { ...o.update, required: !0 }
          };
        });
      };
    },
    updateLayer: (t, i) => {
      e((o) => {
        const r = o.layers;
        if (!r[t])
          throw Error("Layer does not exist!");
        return {
          layers: { ...r, [t]: { ...r[t], ...i } },
          update: { ...o.update, required: !0 }
        };
      });
    },
    addLayerAnnotations: (t, i, o) => {
      e((r) => {
        o.forEach((s) => {
          s.scope = i;
        });
        const a = r.annotations, l = a[t] ? a[t].filter((s) => s.scope !== i) : [];
        return {
          annotations: {
            ...a,
            [t]: [...l, ...o]
          },
          update: { ...r.update, required: !0 }
        };
      });
    },
    removeLayerAnnotations: (t, i) => {
      e((o) => {
        const r = o.annotations, a = r[t] ? r[t].filter((l) => l.scope !== i) : [];
        return {
          annotations: {
            ...r,
            [t]: a
          },
          update: { ...o.update, required: !0 }
        };
      });
    }
  }))
), nr = () => {
  fe.setState((e) => {
    if (!e.visible)
      return {
        instances: [],
        update: { ...e.update, required: !1, ref: null }
      };
    const n = e.layers, t = new Map(e.instances.map((a) => [a.id, a])), i = [], o = [0, 0];
    Object.keys(n).forEach((a) => {
      var h;
      const l = n[a];
      l.visible && ((h = e.annotations[a]) == null || h.forEach((s) => {
        const p = `${a}_${s.scope}_${s.id}`;
        let f;
        const _ = t.get(p);
        _ ? (f = _, 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: p,
          ref: l.labelComponent ? no() : 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 r = Math.abs(o[1] - o[0]);
    return i.forEach((a) => {
      a.priority = r > 0 ? (a.priority - o[0]) / r : 0;
    }), {
      instances: i,
      update: { ...e.update, required: !1, ref: null }
    };
  });
};
fe.subscribe(
  (e) => e.update.required,
  (e) => {
    if (e) {
      const n = fe.getState().update;
      n.ref && clearTimeout(n.ref);
      const t = setTimeout(() => nr(), 500);
      n.setRef(t);
    }
  }
);
const Ge = (e, n) => {
  const t = fe((o) => o.addLayerAnnotations), i = fe((o) => o.removeLayerAnnotations);
  return {
    addAnnotations: (o) => (t(e, n, o), () => i(e, n))
  };
}, or = {
  pointerEvents: "none",
  width: "100%",
  height: "100%"
}, rr = {
  position: "absolute",
  top: 0,
  left: 0,
  visibility: "hidden",
  userSelect: "none",
  cursor: "pointer",
  pointerEvents: "visible"
}, ir = ve(({ id: e, state: n, layer: t, annotation: i }, o) => {
  const r = re(() => {
    t.onClick && t.onClick({ instanceId: e, ...i });
  }, [i, e, t]), a = re(() => {
    n.labelHovered = !0;
  }, [n]), l = re(() => {
    n.labelHovered = !1;
  }, [n]);
  return /* @__PURE__ */ k(
    "div",
    {
      ref: o,
      style: rr,
      onClick: r,
      onPointerEnter: a,
      onPointerLeave: l,
      children: t.labelComponent && /* @__PURE__ */ k(
        t.labelComponent,
        {
          instanceId: e,
          ...i
        }
      )
    }
  );
}), sr = () => {
  const e = ro(fe, (n) => n.instances);
  return /* @__PURE__ */ k("div", { style: or, children: e.map(
    (n) => /* @__PURE__ */ k(
      ir,
      {
        ref: n.ref,
        id: n.id,
        state: n.state,
        layer: n.layer,
        annotation: n.annotation
      },
      n.id
    )
  ) });
}, tt = new V(), ar = [
  /* 0 */
  0,
  /* 1 */
  Ve,
  /* 2 */
  Xt,
  /* 3 */
  qe - Ve,
  /* 4 */
  qe,
  /* 5 */
  -qe + Ve,
  /* 6 */
  -Xt,
  /* 7 */
  -Ve
], lr = [
  [2, 6],
  [7, 3],
  [0, 4],
  [1, 5]
], cr = (e, n, t, i) => {
  tt.set(
    n[0] + t[0] * 100,
    n[1] + t[1] * 100,
    n[2] + t[2] * 100
  ), tt.project(i);
  const o = Eo(
    So([tt.x, tt.y], [e[0], e[1]])
  );
  let r = Math.atan2(o[1], o[0]);
  return r < 0 && (r = qe + r), Math.floor((r + Po) / Ve) % 4;
}, ur = (e, n, t, i) => {
  const o = Math.floor((e[0] * 0.5 + 0.5) * n), r = Math.floor((e[1] * 0.5 + 0.5) * t), a = i[r * n + o];
  return a > -1 && a < e[2];
}, nn = [-0.99, 0.99], on = [-0.99, 0.99], Ut = 1, rn = Ut * 2, sn = 3, fr = 5, dr = new V(), Be = new V();
let an = 0, kt, Tt, Ct, At, Et;
const ln = new In(), cn = new In();
function un(e, n, t) {
  const i = e.state.scaleFactor, o = lr[e.state.quadrant], r = ar[o[n]], a = e.state.labelWidht || 0, l = e.state.labelHeight || 0, h = a * i, s = l * i, p = Ro([h, s], r), f = [Math.cos(r), -Math.sin(r)], _ = e.layer.labelOffset * i, x = [
    (e.state.screenPosition[0] * 0.5 + 0.5) * t.x + f[0] * _,
    (-e.state.screenPosition[1] * 0.5 + 0.5) * t.y + f[1] * _
  ];
  e.state.anchorPosition = x, e.state.scaledOffset = [
    (a - h) / 2,
    (l - s) / 2
  ], e.state.labelPosition = [
    x[0] - h / 2 + p[0],
    x[1] - s / 2 + p[1]
  ];
}
function fn(e, n, t, i) {
  e.state.visible && (e.state.positionSlot !== n || e.state.prevQuadrant && e.state.prevQuadrant !== e.state.quadrant) && t && (e.state.inTransition = !0, e.state.transitionTime = 0, e.state.prevLabelPosition = t, i && (e.state.prevAnchorPosition = i));
}
function pr(e, n, t, i) {
  const o = t.elapsedTime - an, a = n.fov * qe / 180;
  n.getWorldDirection(dr);
  let l = 0;
  const h = [];
  return e.forEach((s, p) => {
    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 * sn
    )) : s.state.health < 1 && (s.state.health = Math.min(
      1,
      Math.max(0, s.state.health + o * sn)
    )), s.state.inTransition && (s.state.transitionTime += o * fr, s.state.transitionTime >= 1 && (s.state.inTransition = !1, s.state.transitionTime = 0, s.state.prevAnchorPosition = void 0, s.state.prevLabelPosition = void 0)), Be.set(...s.annotation.position);
    const f = Be.distanceTo(n.position), _ = Math.max(
      0.25,
      Math.min(
        1,
        1 / (2 * Math.tan(a / 2) * f) * s.layer.distanceFactor
      )
    );
    Be.project(n);
    const x = [Be.x, Be.y, Be.z], v = x[2] >= 0 && x[2] <= 1 && x[0] >= nn[0] && x[0] <= nn[1] && x[1] >= on[0] && x[1] <= on[1] && (!s.layer.minDistance || f >= s.layer.minDistance) && (!s.layer.maxDistance || f <= s.layer.maxDistance);
    if (s.state.screenPosition = x, s.state.distance = f, s.state.scaleFactor = _, s.state.inViewSpace = v, s.state.cooldown && s.state.visible === !1)
      s.state.cooldown = Math.max(0, s.state.cooldown - o), s.rank = 0;
    else {
      const d = he(
        (x[0] ** 2 + x[1] ** 2) / 2,
        0,
        1
      ), g = Math.min(f, 1e3);
      s.rank = 1e3, s.rank += s.priority * 1e3 - (d * 100 + g), s.state.visible ? s.rank += 100 : s.rank -= 100, v && l < i ? (l++, s.state.prevQuadrant = s.state.quadrant, s.state.quadrant = s.annotation.direction ? cr(
        x,
        s.annotation.position,
        s.annotation.direction,
        n
      ) : 0) : (s.state.quadrant = 0, s.state.visible = !1, p >= 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 ? h.push(s) : s.state._visibility !== "hidden" && (s.state.visible = !1, s.state._visibility = "hidden", s.state._needsUpdate = !0);
  }), an = t.elapsedTime, h.sort((s, p) => p.rank - s.rank), h;
}
async function mr(e, n, t, i) {
  e.forEach((o) => {
    const r = ur(
      o.position,
      t,
      i,
      n
    );
    !o.instance.state.occluded && r && (o.instance.state.kill = !0), o.instance.state.occluded = r;
  });
}
function hr(e, n) {
  ln.clear(), cn.clear(), e.forEach((t) => {
    var l;
    const i = t.state.labelPosition ? [...t.state.labelPosition] : null, o = t.state.anchorPosition ? [...t.state.anchorPosition] : null, r = t.state.positionSlot || 0, a = (l = t.ref) == null ? void 0 : l.current;
    if (a && (t.state.labelWidht = a.clientWidth, t.state.labelHeight = a.clientHeight), t.state.kill || t.state.occluded)
      un(t, r, n), fn(
        t,
        r,
        i,
        o
      );
    else if (t.state.cooldown)
      t.state.visible = !1;
    else {
      let h = !1;
      const s = r === 0 ? [0, 1] : [1, 0], p = t.state.labelWidht, f = t.state.labelHeight, _ = p * t.state.scaleFactor, x = f * t.state.scaleFactor;
      for (let v = 0; v < s.length; v++) {
        un(t, s[v], n);
        const d = {
          minX: t.state.labelPosition[0] - Ut,
          minY: t.state.labelPosition[1] - Ut,
          maxX: t.state.labelPosition[0] + _ + rn,
          maxY: t.state.labelPosition[1] + x + rn
        }, g = t.state.scaleFactor >= 0.5 ? ln : cn;
        if (!g.collides(d)) {
          g.insert(d), h = !0, fn(
            t,
            s[v],
            i,
            o
          ), t.state.positionSlot = s[v];
          break;
        }
      }
      h ? t.state.visible = !0 : (t.state.kill = !0, t.state.cooldown = 2.5);
    }
    t.state.visible ? (t.state.zIndex = t.state.labelHovered ? 1e6 : t.state.kill ? 0 : Math.round(1 / t.state.distance * 1e5), t.state.opacity = Math.max(0.75, t.state.scaleFactor) * t.state.health, t.state.inTransition && t.state.prevLabelPosition ? [At, Et] = Dn(
      t.state.prevLabelPosition,
      t.state.labelPosition,
      t.state.transitionTime
    ) : [At, Et] = t.state.labelPosition, t.state.labelX = At - t.state.scaledOffset[0], t.state.labelY = Et - t.state.scaledOffset[1], a && (kt = `translate(${t.state.labelX}px,${t.state.labelY}px) scale(${t.state.scaleFactor})`, kt !== t.state._transform && (t.state._transform = kt, t.state._needsUpdate = !0), Tt = `${t.state.opacity}`, Tt !== t.state._opacity && (t.state._opacity = Tt, t.state._needsUpdate = !0), Ct = `${t.state.zIndex}`, Ct !== t.state._zIndex && (t.state._zIndex = Ct, t.state._needsUpdate = !0), t.state._visibility !== "visible" && (t.state._visibility = "visible", t.state._needsUpdate = !0))) : t.state._visibility !== "hidden" && (t.state._visibility = "hidden", t.state._needsUpdate = !0);
  });
}
function dn(e) {
  e.filter((n) => n.state._needsUpdate).forEach((n) => {
    var i;
    const t = (i = n.ref) == null ? void 0 : i.current;
    t && (n.state._transform && (t.style.transform = n.state._transform), n.state._opacity && (t.style.opacity = n.state._opacity), n.state._zIndex && (t.style.zIndex = n.state._zIndex), n.state._visibility && (t.style.visibility = n.state._visibility));
  });
}
const pn = 512, mn = 512, St = new V(), le = new we();
let nt, Pt, ot, Rt;
const es = ({ maxVisible: e = 100, children: n }) => {
  const { gl: t } = pt(), i = fe((h) => h.instances), o = $(!1), r = fe((h) => h.clear), a = A(() => {
    const h = lo().getContext("2d");
    if (!h) return null;
    const s = new co(-1, 1, 1, -1, 0, 1), p = new mt({ transparent: !0 }), f = new uo(), _ = new fo(2, 2), x = new lt(_, p);
    return f.add(x), {
      postCamera: s,
      postScene: f,
      postMaterial: p,
      size: new we(),
      texture: null,
      ctx: h
    };
  }, []), l = A(() => {
    const h = t.domElement.parentElement;
    let s = null;
    if (!h) throw Error("Unable to create root!");
    return s = document.createElement("div"), s.setAttribute("id", "annotations"), s.setAttribute("style", "position:absolute;top:0;left:0;z-index: 1;pointer-events:none;padding:0;width:100%;height:100%;user-select:none"), h.appendChild(s), ao(s);
  }, [t]);
  return L(() => (l.render(/* @__PURE__ */ k(sr, {})), () => {
    l.unmount(), r();
  }), [l, r]), ze(({ gl: h, camera: s, scene: p, clock: f, pointer: _ }) => {
    var x;
    if (h.getSize(le), h.clear(), h.render(p, s), a) {
      const { postCamera: v, postScene: d, ctx: g, postMaterial: m } = a;
      if (g.clearRect(0, 0, le.x, le.y), !i.length) return;
      const b = pr(
        i,
        s,
        f,
        e
      );
      if (!b.length) {
        dn(i);
        return;
      }
      hr(
        b,
        le
      ), o.current || requestAnimationFrame(() => {
        o.current = !0;
        const u = b.map((M) => {
          const w = M.layer.anchorOcclusionRadius, C = Lo([
            s.position.x - M.annotation.position[0],
            s.position.y - M.annotation.position[1],
            s.position.z - M.annotation.position[2]
          ]);
          return St.set(
            M.annotation.position[0] + C[0] * w,
            M.annotation.position[1] + C[1] * w,
            M.annotation.position[2] + C[2] * w
          ), St.project(s), { instance: M, position: St.toArray() };
        });
        Wo(
          h,
          p,
          s,
          pn,
          mn
        ).then((M) => {
          if (M)
            return mr(
              u,
              M,
              pn,
              mn
            );
        }).finally(() => {
          o.current = !1;
        });
      }), dn(i), (a.texture === null || a.texture.image.width !== le.x || a.texture.image.height !== le.y) && (g.canvas.width = le.x, g.canvas.height = le.y, (x = a.texture) == null || x.dispose(), a.texture = new Cn(g.canvas), m.map = a.texture);
      const y = [
        (_.x * 0.5 + 0.5) * le.x,
        (-_.y * 0.5 + 0.5) * le.y
      ];
      b.filter((u) => !u.state.occluded && !u.state.capped).sort((u, M) => M.state.distance - u.state.distance).forEach((u) => {
        nt = (u.state.screenPosition[0] * 0.5 + 0.5) * le.x, ot = (-u.state.screenPosition[1] * 0.5 + 0.5) * le.y;
        let M = u.layer.anchorSize * u.state.scaleFactor, w = !1;
        if (Math.abs(y[0] - nt) <= M && Math.abs(y[1] - ot) <= M && (u.state.visible ? w = !0 : u.state.boost = !0), (u.state.labelHovered || w) && (M *= 1.5), u.layer.labelOffset > 0 && u.state.visible) {
          u.state.inTransition && u.state.prevAnchorPosition ? [Pt, Rt] = Dn(
            u.state.prevAnchorPosition,
            u.state.anchorPosition,
            u.state.transitionTime
          ) : [Pt, Rt] = u.state.anchorPosition;
          let C = Math.max(
            0.1,
            u.layer.connectorWidth * u.state.scaleFactor
          );
          (u.state.labelHovered || w) && (C *= 2), g.globalAlpha = u.state.opacity || 0, g.beginPath(), g.moveTo(nt, ot), g.lineTo(Pt, Rt), g.strokeStyle = u.layer.connectorColor, g.lineWidth = C, g.stroke();
        }
        g.beginPath(), g.arc(nt, ot, M, 0, Oo), g.globalAlpha = u.state.visible ? 1 : 0.5, g.fillStyle = u.layer.anchorColor, g.fill(), g.globalAlpha = u.state.opacity || 0, g.strokeStyle = "black", g.lineWidth = 0.75, g.stroke();
      }), a.texture.needsUpdate = !0, h.render(d, v);
    }
  }, 1), /* @__PURE__ */ k(Ee, { children: n });
}, vr = ({ id: e, name: n }) => /* @__PURE__ */ k(
  "div",
  {
    id: `annotation_${e}`,
    style: {
      minWidth: "150px",
      background: "#33333390",
      color: "white",
      textAlign: "center",
      overflow: "hidden",
      borderRadius: "4px",
      padding: "1px 6px",
      fontFamily: "sans-serif",
      fontSize: "12pt"
    },
    children: /* @__PURE__ */ k("div", { style: { whiteSpace: "nowrap" }, children: n })
  },
  e
), ts = ({
  id: e,
  name: n,
  priority: t = 0,
  visible: i = !0,
  distanceFactor: o = 100,
  minDistance: r = 10,
  maxDistance: a = 5e3,
  anchorOcclusionRadius: l = 15,
  anchorSize: h = 0.25,
  anchorColor: s = "white",
  connectorWidth: p = 1,
  connectorColor: f = s || "white",
  labelOffset: _ = 100,
  labelComponent: x = vr,
  onClick: v,
  children: d
}) => {
  const g = fe((u) => u.createLayer), m = fe((u) => u.updateLayer), c = fe((u) => u.layerExist), b = $(null), y = A(() => ({
    id: e,
    name: n,
    priority: t,
    visible: i,
    distanceFactor: o,
    minDistance: r,
    maxDistance: a,
    labelOffset: _,
    anchorOcclusionRadius: l,
    anchorSize: h,
    anchorColor: s,
    connectorWidth: p,
    connectorColor: f,
    labelComponent: x,
    onClick: v
  }), [
    e,
    n,
    t,
    i,
    l,
    h,
    s,
    p,
    f,
    r,
    a,
    _,
    o,
    x,
    v
  ]);
  return oo(() => {
    c(y.id) ? m(y.id, y) : b.current = g(y);
  }, [
    g,
    m,
    c,
    y
  ]), L(() => () => {
    b.current && b.current();
  }, []), /* @__PURE__ */ k("group", { children: d });
}, rt = new V(), ns = ({ radius: e = 3, opacity: n = 0.1, color: t, fixedX: i, fixedY: o, fixedZ: r, renderOrder: a = 1e3 }) => {
  const { controls: l } = pt(), h = $(null);
  return L(() => {
    function s() {
      const p = l;
      p && h.current ? (p.getTarget(rt), h.current.position.set(i || rt.x, o || rt.y, r || rt.z), h.current.visible = !0) : h.current && (h.current.visible = !1);
    }
    return l && l.addEventListener("update", s), s(), () => {
      l && l.removeEventListener("update", s);
    };
  }, [l, i, o, r]), /* @__PURE__ */ k("group", { ref: h, visible: !1, renderOrder: a, children: /* @__PURE__ */ G("mesh", { children: [
    /* @__PURE__ */ k("sphereGeometry", { args: [e] }),
    /* @__PURE__ */ k("meshBasicMaterial", { color: t, transparent: !0, opacity: n, depthTest: !1, depthWrite: !1 })
  ] }) });
}, Bn = Pe({ current: 1 / 0 }), os = ({ min: e = 0, max: n, onDemand: t = !1, children: i }) => {
  const o = de(Bn), r = $(null), [a, l] = z(!t);
  return ze(() => {
    if (o && r.current) {
      const h = o.current >= e && o.current < n;
      t && h && !a ? Yt(() => l(!0)) : t && !h && a ? Yt(() => l(!1)) : r.current.visible !== h && (r.current.visible = h);
    }
  }), /* @__PURE__ */ k("group", { ref: r, visible: !1, children: a && i });
}, gr = (e, n, t, i, o) => {
  const r = t[0] * 0.5, a = t[1] * 0.5, [l, h] = o, s = e * t[0], p = n * t[1], f = (s - (r + l)) * i[0], _ = (p - (a + h)) * i[1];
  return [f, _];
}, pe = new V(), xr = ({
  scale: e,
  start: n,
  size: t,
  units: i,
  originOffset: o,
  axesOffset: r,
  axesTickSize: a,
  plane: l,
  color: h,
  side: s,
  trimAxesLabels: p = !1,
  renderOrder: f = 2
}) => {
  const [_, x] = z({ x: 0, y: 0, flipped: !1 });
  ze(({ camera: m }) => {
    m.getWorldDirection(pe);
    const c = {
      x: 0,
      y: 0,
      flipped: !1
    };
    l === "xz" ? (c.flipped = pe.y > 0, c.flipped ? (c.x = pe.z < 0 ? Math.PI : 0, c.y = pe.x < 0 ? Math.PI : 0) : (c.x = pe.z > 0 ? Math.PI : 0, c.y = pe.x > 0 ? Math.PI : 0)) : l === "xy" ? (c.flipped = pe.z > 0, c.x = 0, c.y = pe.x > 0 ? Math.PI : 0) : l === "zy" && (c.flipped = pe.x > 0, c.x = 0, c.y = pe.z < 0 ? Math.PI : 0), (_.x !== c.x || _.y !== c.y || _.flipped !== c.flipped) && x(c);
  });
  const v = A(() => i / 7.5, [i]), d = A(() => new Z(h || "#fff"), [h]), g = A(() => {
    const m = [
      t[0] * 0.5,
      t[1] * 0.5
    ], c = [
      m[0] + o[0],
      m[1] + o[1]
    ], b = [
      c[0] + he(r[0], -m[0], m[0]),
      c[1] + he(r[1], -m[1], m[1])
    ], y = [
      Math.floor((c[0] - c[0] % i) / i),
      Math.floor((c[1] - c[1] % i) / i)
    ], u = [
      -m[0] + c[0] % i,
      -m[1] + c[1] % i
    ], M = [
      Math.min(1e3, Math.floor((t[0] - c[0] % i) / i) + 1),
      Math.min(1e3, Math.floor((t[1] - c[1] % i) / i) + 1)
    ], w = [], C = [], P = a * i + v * 0.6, R = [
      he(r[1] + o[1], -m[1], +m[1]),
      he(r[0] + o[0], -m[0], +m[0])
    ];
    for (let T = p ? 1 : 0; T < M[0] - (p ? 1 : 0); T++) {
      const E = [
        u[0] + T * i,
        R[0] + P
      ], O = Math.round(10 * (n[0] + (T - y[0]) * i * e[0])) / 10;
      Math.abs(b[0] - (E[0] + m[0])) > i / 4 && w.push({
        pos: E,
        value: O,
        index: `x${T}`
      });
    }
    for (let T = p ? 1 : 0; T < M[1] - (p ? 1 : 0); T++) {
      const E = [
        R[1] - P,
        u[1] + T * i
      ], O = Math.round(10 * (n[1] + (T - y[1]) * i * e[1])) / 10;
      Math.abs(b[1] - (E[1] + m[1])) > i / 4 && C.push({
        pos: E,
        value: O,
        index: `y${T}`
      });
    }
    return { xAxis: w, yAxis: C };
  }, [
    t,
    i,
    o,
    r,
    a,
    v,
    e,
    n,
    p
  ]);
  return /* @__PURE__ */ G(
    "group",
    {
      renderOrder: f,
      position: [0, 0, (_.flipped ? -1 : 1) * (i / 1e3)],
      visible: s === "both" || s === "front" && !_.flipped || s === "back" && _.flipped,
      children: [
        g.xAxis.map((m) => /* @__PURE__ */ k(
          Qt,
          {
            characters: "123456789,.0",
            position: [...m.pos, 0],
            fontSize: v,
            textAlign: "center",
            anchorX: "center",
            anchorY: "middle",
            "rotation-z": _.x,
            "rotation-y": _.flipped ? Math.PI : 0,
            color: d,
            "material-depthWrite": !1,
            children: m.value
          },
          m.index
        )),
        g.yAxis.map((m) => /* @__PURE__ */ k(
          Qt,
          {
            characters: "123456789,.0",
            position: [...m.pos, 0],
            fontSize: v,
            textAlign: "center",
            anchorX: "center",
            anchorY: "middle",
            "rotation-z": _.y + Math.PI / 2,
            "rotation-x": _.flipped ? Math.PI : 0,
            color: d,
            "material-depthWrite": !1,
            children: m.value
          },
          m.index
        ))
      ]
    }
  );
};
var yr = `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;

  
  
}`, br = `#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 _r = new Ke(), hn = new V(), vn = new po(), wr = [
  [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]
], Ue = ({
  plane: e,
  size: n,
  position: t = [0, 0, 0],
  gridOrigin: i,
  gridScale: o = [1, 1],
  cellSize: r = 10,
  subDivisions: a = 0,
  background: l = 1056816,
  backgroundOpacity: h = 1,
  opacity: s = 1,
  gridColorMajor: p = "#89a",
  gridColorMinor: f = "#789",
  gridLineWidth: _ = 0.05,
  showAxes: x = !0,
  showAxesLabels: v = !0,
  trimAxesLabels: d = !1,
  axesOffset: g = void 0,
  axesColor: m = "#fff",
  axesLineWidth: c = _ || 0.05,
  axesTickSize: b = 0.1,
  originValue: y = [0, 0],
  radial: u = !1,
  dynamicSegments: M = !1,
  showRulers: w = !1,
  rulerColor: C = "#c59797",
  rulerLineWidth: P = 1,
  rulerOpacity: R = 0.5,
  planeOffset: T = 0,
  dynamicCellSize: E = !1,
  cellSizeDistanceFactors: O = wr,
  side: D = "both",
  onRulerUpdate: j = null,
  texture: S,
  textureMix: F = 1,
  enableProjection: W = !1,
  projectionDistance: N = 1e3,
  projectionColor: X = "#456",
  projectionResolution: J = 1024,
  projectionRefreshRate: xe = 100,
  name: q,
  userData: yt,
  renderOrder: Oe,
  visible: U,
  castShadow: bt,
  receiveShadow: $e,
  layers: te
}) => {
  const [Q, De] = z({ originOffset: [0, 0], axesOffset: [0, 0] }), [He, Xe] = z(1), se = A(() => new mo(), []), ye = A(() => new V(), []), Te = $(null), _t = $(null), wt = $(null), H = $({
    uSize: new B(new we(0, 0)),
    uBackground: new B(new Z(1056816)),
    uBackgroundOpacity: new B(1),
    uOpacity: new B(1),
    uCellSize: new B(10),
    uSubDivisions: new B(0),
    uOriginOffset: new B(new we(0, 0)),
    uDistanceFactor: new B(0),
    uGridColorMajor: new B(new Z("#abc")),
    uGridColorMinor: new B(new Z("#789")),
    uGridLineWidth: new B(0.05),
    uAxesOffset: new B(new we(0, 0)),
    uAxesColor: new B(new Z("#fff")),
    uAxesLineWidth: new B(1),
    uAxesTickSize: new B(0.1),
    uCursorPosition: new B(new we()),
    uRulerColor: new B(new Z("#fff")),
    uRulerLineWidth: new B(1),
    uRulerOpacity: new B(0.5),
    uProjectionTexture: new B(void 0),
    uProjectionColor: new B(new Z("#456")),
    uTexture: new B(void 0),
    uTextureMix: new B(1)
  }), { controls: Ie, camera: Qe, gl: Fe, scene: Ze } = pt(), Xn = A(() => [
    (e === "zy" ? T : 0) + t[0],
    (e === "xz" ? T : 0) + t[1],
    (e === "xy" ? T : 0) + t[2]
  ], [e, T, t]), Mt = A(() => e === "xz" ? [o[0], -o[1]] : e === "zy" ? [-o[0], o[1]] : [...o], [o, e]), Qn = A(() => D === "back" ? $t : D === "both" ? ht : ct, [D]);
  L(() => {
    const K = Te.current;
    if (K) {
      K.getWorldPosition(ye);
      const I = { originOffset: [0, 0], axesOffset: [0, 0] };
      i ? e === "xz" ? (I.originOffset[0] = i[0] - ye.x, I.originOffset[1] = -(i[1] - ye.z)) : e === "xy" ? (I.originOffset[0] = i[0] - ye.x, I.originOffset[1] = i[1] - ye.y) : e === "zy" && (I.originOffset[0] = -(i[0] - ye.z), I.originOffset[1] = i[1] - ye.y) : (I.originOffset[0] = 0, I.originOffset[1] = 0), g ? e === "xz" ? (I.axesOffset[0] = g[0] * o[0] - I.originOffset[0], I.axesOffset[1] = -g[1] * o[1] - I.originOffset[1]) : e === "xy" ? (I.axesOffset[0] = g[0] * o[0] - I.originOffset[0], I.axesOffset[1] = g[1] * o[1] - I.originOffset[1]) : e === "zy" && (I.axesOffset[0] = -g[0] * o[0] - I.originOffset[0], I.axesOffset[1] = g[1] * o[1] - I.originOffset[1]) : (I.axesOffset[0] = 0, I.axesOffset[1] = 0), e === "xz" ? se.normal.set(0, 1, 0) : e === "xy" ? se.normal.set(0, 0, 1) : e === "zy" && se.normal.set(1, 0, 0), se.constant = ye.length(), De((ce) => ce.axesOffset[0] !== I.axesOffset[0] || ce.axesOffset[1] !== I.axesOffset[1] || ce.originOffset[0] !== I.originOffset[0] || ce.originOffset[1] !== I.originOffset[1] ? I : ce);
    }
  }, [e, i, g, o, se, ye]), L(() => {
    H.current.uBackground.value = new Z(l ?? 7368816), H.current.uBackgroundOpacity.value = h, H.current.uSize.value.set(...n), H.current.uOpacity.value = Number.isFinite(s) ? he(s, 0, 1) : 1, H.current.uCellSize.value = r * He, H.current.uSubDivisions.value = a, H.current.uGridColorMajor.value.set(p), H.current.uGridColorMinor.value.set(f), H.current.uGridLineWidth.value = _, H.current.uAxesLineWidth.value = c, H.current.uAxesColor.value.set(m), H.current.uAxesTickSize.value = b, H.current.uAxesOffset.value.set(...Q.axesOffset), H.current.uOriginOffset.value.set(...Q.originOffset), H.current.uRulerLineWidth.value = P, H.current.uRulerColor.value.set(C), H.current.uRulerOpacity.value = R, H.current.uTexture.value = S, H.current.uTextureMix.value = F, H.current.uProjectionColor.value.set(X);
  }, [
    n,
    r,
    He,
    a,
    l,
    h,
    s,
    p,
    f,
    m,
    c,
    b,
    _,
    C,
    P,
    R,
    Q,
    S,
    F,
    X
  ]), L(() => {
    function K() {
      if (Te.current && Qe) {
        Qe.getWorldDirection(hn), vn.set(Qe.position, hn);
        const I = vn.distanceToPlane(se);
        if (I) {
          const ce = Math.min(I, 1e3 * r) / r;
          let _e = O.findIndex((et) => et[0] >= ce);
          _e === -1 ? _e = O.length - 1 : _e--, _e = Math.max(0, _e);
          const Je = O[_e][1];
          Xe((et) => et !== Je ? Je : et);
        }
      }
    }
    return Te.current && Ie && E ? (Ie.addEventListener("update", K), K()) : Xe(1), () => {
      Ie == null || Ie.removeEventListener("update", K);
    };
  }, [Ie, Qe, se, E, r, O, n]), L(() => {
    _t.current && (_t.current.needsUpdate = !0);
  }, [u, x, M, w]), L(() => {
    let K = null, I = null;
    return W && (K = new An(J, J, {
      minFilter: It,
      magFilter: It,
      type: ho
    }), H.current.uProjectionTexture.value = K.texture, I = setInterval(() => {
      if (K && Te.current && wt.current) {
        const _e = wt.current, Je = Fe.getRenderTarget();
        Fe.setRenderTarget(K), Ze.overrideMaterial = _r, Te.current.visible = !1, Fe.clear(), Fe.render(Ze, _e), Ze.overrideMaterial = null, Fe.setRenderTarget(Je), Te.current.visible = !0;
      }
    }, xe)), () => {
      I && clearInterval(I), K == null || K.dispose();
    };
  }, [W, Fe, Ze, n, N, J, xe]);
  const Zn = re((K) => {
    var I, ce;
    H.current.uCursorPosition.value.set(((I = K.uv) == null ? void 0 : I.x) || 0, ((ce = K.uv) == null ? void 0 : ce.y) || 0), j && K.uv && j(gr(K.uv.x, K.uv.y, n, Mt, Q.originOffset));
  }, [n, Mt, Q.originOffset, j]), Jn = re(() => {
    H.current.uCursorPosition.value.set(0, 0), j && j(null);
  }, [j]);
  return /* @__PURE__ */ G(
    "group",
    {
      ref: Te,
      name: q,
      userData: yt,
      visible: U,
      "rotation-x": e === "xz" ? -Math.PI / 2 : 0,
      "rotation-y": e === "zy" ? Math.PI / 2 : 0,
      position: Xn,
      renderOrder: Oe,
      children: [
        /* @__PURE__ */ G(
          "mesh",
          {
            "position-z": -1e-3 * r,
            onPointerMove: w ? Zn : void 0,
            onPointerLeave: w ? Jn : void 0,
            renderOrder: 1,
            castShadow: bt,
            receiveShadow: $e,
            layers: te,
            children: [
              /* @__PURE__ */ k(
                "planeGeometry",
                {
                  args: n
                }
              ),
              /* @__PURE__ */ k(
                "shaderMaterial",
                {
                  ref: _t,
                  uniforms: H.current,
                  defines: {
                    RADIAL: u,
                    DYNAMICSEGMENTS: M,
                    AXES: !!x,
                    RULERS: !!w,
                    SATURATE: !0
                  },
                  vertexShader: br,
                  fragmentShader: yr,
                  side: Qn,
                  depthWrite: !0,
                  depthTest: !0,
                  forceSinglePass: !0,
                  transparent: !0
                }
              ),
              x && v && /* @__PURE__ */ k(
                xr,
                {
                  originOffset: Q.originOffset,
                  axesOffset: Q.axesOffset,
                  trimAxesLabels: d,
                  scale: Mt,
                  size: n,
                  start: y,
                  units: r * He,
                  axesTickSize: b,
                  plane: e,
                  color: m,
                  side: D,
                  renderOrder: Oe !== void 0 && Number.isFinite(Oe) ? Oe + 1 : void 0
                }
              )
            ]
          }
        ),
        W && /* @__PURE__ */ k(
          "orthographicCamera",
          {
            ref: wt,
            args: D === "back" ? [n[0] / 2, n[0] / -2, n[1] / 2, n[1] / -2, 1, N] : [n[0] / -2, n[0] / 2, n[1] / 2, n[1] / -2, 1, N],
            "rotation-y": D === "back" ? 0 : Math.PI
          }
        )
      ]
    }
  );
}, vt = Pe(null), rs = (e) => {
  const n = de(vt), [t, i] = z({
    origin: [0, 0],
    originValue: [0, 0],
    gridScale: [1, 1]
  });
  return L(() => {
    const o = n.getWorldPosition();
    let r, a, l;
    e.plane === "xz" ? (r = [o[0], o[2]], l = [1, -1], a = e.relativeValues ? [0, 0] : [n.originUtm[0], n.originUtm[1]]) : e.plane === "xy" ? (r = [o[0], o[1]], l = [1, 1], a = e.relativeValues ? [0, 0] : [n.originUtm[0], 0]) : (r = [o[2], o[1]], l = [-1, 1], a = e.relativeValues ? [0, 0] : [n.originUtm[1], 0]), i({ origin: r, originValue: a, gridScale: l });
  }, [n, e.plane, e.relativeValues]), /* @__PURE__ */ k(Ue, { ...e, gridOrigin: t.origin, originValue: t.originValue, gridScale: t.gridScale });
}, Ce = new En();
function Un(e, n) {
  e.updateWorldMatrix(!1, !1);
  const t = e.geometry;
  t !== void 0 && (e.boundingBox !== void 0 ? (e.boundingBox === null && e.computeBoundingBox(), Ce.copy(e.boundingBox)) : (t.boundingBox === null && t.computeBoundingBox(), Ce.copy(t.boundingBox)), isNaN(Ce.min.x) || isNaN(Ce.min.y) || isNaN(Ce.min.z) || (Ce.applyMatrix4(e.matrixWorld), n.union(Ce)));
  const i = e.children;
  for (let o = 0, r = i.length; o < r; o++)
    Un(i[o], n);
  return n;
}
const je = new V(), Ne = new V(), Y = new En(), Mr = (e) => {
  const n = $(null), t = $({ center: [0, 0, 0], size: [0, 0, 0] }), {
    padding: i = [0, 0, 0],
    snapTo: o,
    updateRate: r = 1e3,
    enabled: a = !0,
    onChange: l
  } = e, h = A(() => {
    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 L(() => {
    let s = null;
    return l && a && (s = setInterval(() => {
      l && n.current && n.current.children.length && (Y.makeEmpty(), Un(n.current, Y), o ? (Y.min.set(
        Math.floor((Y.min.x - h.x0) / o) * o,
        Math.floor((Y.min.y - h.y0) / o) * o,
        Math.floor((Y.min.z - h.z0) / o) * o
      ), Y.max.set(
        Math.ceil((Y.max.x + h.x1) / o) * o,
        Math.ceil((Y.max.y + h.y1) / o) * o,
        Math.ceil((Y.max.z + h.z1) / o) * o
      )) : (Y.min.set(
        Y.min.x - h.x0,
        Y.min.y - h.y0,
        Y.min.z - h.z0
      ), Y.max.set(
        Y.max.x + h.x1,
        Y.max.y + h.y1,
        Y.max.z + h.z1
      )), Y.getCenter(je), Y.getSize(Ne), (je.x !== t.current.center[0] || je.y !== t.current.center[1] || je.z !== t.current.center[2] || Ne.x !== t.current.size[0] || Ne.y !== t.current.size[1] || Ne.z !== t.current.size[2]) && (t.current.center = je.toArray(), t.current.size = Ne.toArray(), l(t.current)));
    }, r)), () => {
      s && clearInterval(s);
    };
  }, [h, o, r, a, l]), /* @__PURE__ */ k("group", { ...e, ref: n });
}, gn = new V(), is = ({
  name: e,
  visible: n,
  castShadow: t,
  receiveShadow: i,
  layers: o,
  renderOrder: r,
  userData: a,
  size: l = [0, 0, 0],
  cellSize: h = 10,
  gridScale: s = [1, 1, 1],
  gridOrigin: p = [0, 0, 0],
  originValue: f = [0, 0, 0],
  subDivisions: _ = 5,
  position: x = [0, 0, 0],
  gridLineWidth: v = 0.02,
  background: d = 1056816,
  backgroundOpacity: g = 1,
  opacity: m = 1,
  gridColorMajor: c = "#89a",
  gridColorMinor: b = "#789",
  axesColor: y = "#fff",
  axesLineWidth: u = v || 0.05,
  axesTickSize: M = 0.1,
  enableProjection: w,
  projectionColor: C,
  projectionResolution: P = 2048,
  projectionRefreshRate: R,
  showRulers: T = !1,
  autoSize: E = !1,
  autoSizePadding: O = 0,
  autoSizeUpdateRate: D = 1e3,
  children: j
}) => {
  const [S, F] = z(x), [W, N] = z(l), X = $(null), [J, xe] = z(S);
  return L(() => {
    E || (F((q) => q[0] !== x[0] || q[1] !== x[1] || q[2] !== x[2] ? x : q), N((q) => q[0] !== l[0] || q[1] !== l[1] || q[2] !== l[2] ? l : q));
  }, [l, x, E]), L(() => {
    X.current && (X.current.getWorldPosition(gn), xe(gn.toArray()));
  }, [S]), /* @__PURE__ */ G(
    "group",
    {
      ref: X,
      name: e,
      userData: a,
      visible: n,
      renderOrder: r,
      children: [
        /* @__PURE__ */ k(
          Ue,
          {
            plane: "xz",
            originValue: [f[0], f[2]],
            cellSize: h,
            size: [W[0], W[2]],
            position: [S[0], S[1] - W[1] * 0.5, S[2]],
            gridScale: [s[0], s[2]],
            gridOrigin: [p[0], p[2]],
            subDivisions: _,
            gridLineWidth: v,
            background: d,
            backgroundOpacity: g,
            gridColorMajor: c,
            gridColorMinor: b,
            opacity: m,
            axesColor: y,
            axesLineWidth: u,
            axesTickSize: M,
            trimAxesLabels: !0,
            side: "both",
            enableProjection: w,
            projectionResolution: P,
            projectionColor: C,
            projectionDistance: W[1],
            projectionRefreshRate: R,
            showRulers: T,
            castShadow: t,
            receiveShadow: i,
            layers: o
          }
        ),
        /* @__PURE__ */ k(
          Ue,
          {
            plane: "xy",
            originValue: [f[0], f[1]],
            cellSize: h,
            size: [W[0], W[1]],
            position: [S[0], S[1], S[2] - W[2] * 0.5],
            gridScale: [s[0], s[1]],
            axesOffset: [(-J[0] - S[0]) / s[0], W[1] * 0.5 * s[1]],
            gridOrigin: [p[0], p[1]],
            subDivisions: _,
            gridLineWidth: v,
            background: d,
            backgroundOpacity: g,
            gridColorMajor: c,
            gridColorMinor: b,
            opacity: m,
            axesColor: y,
            axesLineWidth: u,
            axesTickSize: M,
            trimAxesLabels: !0,
            side: "front",
            enableProjection: w,
            projectionResolution: P,
            projectionColor: C,
            projectionDistance: W[2],
            projectionRefreshRate: R,
            showRulers: T,
            castShadow: t,
            receiveShadow: i,
            layers: o
          }
        ),
        /* @__PURE__ */ k(
          Ue,
          {
            plane: "zy",
            originValue: [f[2], f[1]],
            cellSize: h,
            size: [W[2], W[1]],
            position: [S[0] - W[0] * 0.5, S[1], S[2]],
            gridScale: [s[2], s[1]],
            axesOffset: [(-J[2] - S[2]) / s[2], W[1] * 0.5 * s[1]],
            gridOrigin: [p[2], p[1]],
            subDivisions: _,
            gridLineWidth: v,
            background: d,
            backgroundOpacity: g,
            gridColorMajor: c,
            gridColorMinor: b,
            opacity: m,
            axesColor: y,
            axesLineWidth: u,
            axesTickSize: M,
            trimAxesLabels: !0,
            side: "front",
            enableProjection: w,
            projectionResolution: P,
            projectionColor: C,
            projectionDistance: W[0],
            projectionRefreshRate: R,
            showRulers: T,
            castShadow: t,
            receiveShadow: i,
            layers: o
          }
        ),
        /* @__PURE__ */ k(
          Ue,
          {
            plane: "xy",
            originValue: [f[0], f[1]],
            cellSize: h,
            size: [W[0], W[1]],
            position: [S[0], S[1], S[2] + W[2] * 0.5],
            gridScale: [s[0], s[1]],
            axesOffset: [(-J[0] - S[0]) / s[0], W[1] * 0.5 * s[1]],
            gridOrigin: [p[0], p[1]],
            subDivisions: _,
            gridLineWidth: v,
            background: d,
            backgroundOpacity: g,
            gridColorMajor: c,
            gridColorMinor: b,
            opacity: m,
            axesColor: y,
            axesLineWidth: u,
            axesTickSize: M,
            trimAxesLabels: !0,
            side: "back",
            enableProjection: w,
            projectionResolution: P,
            projectionColor: C,
            projectionDistance: W[2],
            projectionRefreshRate: R,
            showRulers: T,
            castShadow: t,
            receiveShadow: i,
            layers: o
          }
        ),
        /* @__PURE__ */ k(
          Ue,
          {
            plane: "zy",
            originValue: [f[2], f[1]],
            cellSize: h,
            size: [W[2], W[1]],
            position: [S[0] + W[0] * 0.