@sreedev/my3dui 0.1.5 → 0.1.7

package/dist/index.cjs

@@ -650,7 +650,7 @@ function Grid3D({
     cellSize,
     cellThickness: 0.5,
     cellColor,
-    sectionSize: (0, import_react9.useMemo)(() => cellSize * 10, [cellSize]),
+    sectionSize: cellSize * 10,
     sectionThickness: 1,
     sectionColor: cellColor,
     fadeDistance,
@@ -1587,32 +1587,72 @@ function Modal3D({
 }
 
 // src/components/ui/menu3d.tsx
-var import_react19 = __toESM(require("react"), 1);
+var React18 = __toESM(require("react"), 1);
 var DropdownMenuPrimitive = __toESM(require("@radix-ui/react-dropdown-menu"), 1);
 var import_jsx_runtime21 = require("react/jsx-runtime");
-var Menu3DContext = import_react19.default.createContext({});
-function Menu3D({ children, trigger, align = "end" }) {
+function Menu3D({
+  trigger,
+  align = "end",
+  items,
+  children
+}) {
+  if (process.env.NODE_ENV !== "production") {
+    if (items && children) {
+      console.warn(
+        "Menu3D: Use either `items` or `children`, not both."
+      );
+    }
+  }
   return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(DropdownMenuPrimitive.Root, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(DropdownMenuPrimitive.Trigger, { asChild: true, children: trigger }),
     /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
       DropdownMenuPrimitive.Content,
       {
         align,
+        sideOffset: 6,
         className: cn(
-          "z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
-          "bg-white/90 dark:bg-slate-900/90 backdrop-blur-xl border-white/20 shadow-xl"
+          "z-50 min-w-[180px] overflow-hidden rounded-xl border p-1",
+          "bg-white/90 dark:bg-slate-900/90 backdrop-blur-xl",
+          "border-white/20 shadow-xl",
+          "animate-in fade-in zoom-in-95",
+          "data-[side=bottom]:slide-in-from-top-2",
+          "data-[side=top]:slide-in-from-bottom-2",
+          "data-[side=left]:slide-in-from-right-2",
+          "data-[side=right]:slide-in-from-left-2"
         ),
-        children
+        children: items?.length ? items.map((item, i) => /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
+          DropdownMenuPrimitive.Item,
+          {
+            disabled: item.disabled,
+            onSelect: item.onClick,
+            className: cn(
+              "relative flex items-center gap-2",
+              "cursor-pointer select-none rounded-md px-3 py-2 text-sm",
+              "outline-none transition-colors",
+              "focus:bg-accent focus:text-accent-foreground",
+              "data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+              item.danger && "text-red-500"
+            ),
+            children: [
+              item.icon && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "text-muted-foreground", children: item.icon }),
+              /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { children: item.label })
+            ]
+          },
+          i
+        )) : children
       }
     ) })
   ] });
 }
-var Menu3DItem = import_react19.default.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+var Menu3DItem = React18.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
   DropdownMenuPrimitive.Item,
   {
     ref,
     className: cn(
-      "relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+      "relative flex cursor-pointer select-none items-center",
+      "rounded-md px-3 py-2 text-sm outline-none transition-colors",
+      "focus:bg-accent focus:text-accent-foreground",
+      "data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
       inset && "pl-8",
       className
     ),
@@ -1620,12 +1660,12 @@ var Menu3DItem = import_react19.default.forwardRef(({ className, inset, ...props
   }
 ));
 Menu3DItem.displayName = DropdownMenuPrimitive.Item.displayName;
-var Menu3DLabel = import_react19.default.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+var Menu3DLabel = React18.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
   DropdownMenuPrimitive.Label,
   {
     ref,
     className: cn(
-      "px-2 py-1.5 text-sm font-semibold",
+      "px-3 py-2 text-xs font-semibold uppercase tracking-wider text-muted-foreground",
       inset && "pl-8",
       className
     ),
@@ -1633,11 +1673,14 @@ var Menu3DLabel = import_react19.default.forwardRef(({ className, inset, ...prop
   }
 ));
 Menu3DLabel.displayName = DropdownMenuPrimitive.Label.displayName;
-var Menu3DSeparator = import_react19.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+var Menu3DSeparator = React18.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
   DropdownMenuPrimitive.Separator,
   {
     ref,
-    className: cn("-mx-1 my-1 h-px bg-muted", className),
+    className: cn(
+      "-mx-1 my-1 h-px bg-border",
+      className
+    ),
     ...props
   }
 ));
@@ -1786,7 +1829,7 @@ function Select3D({
 }
 
 // src/components/ui/spinner3d.tsx
-var import_react20 = require("react");
+var import_react19 = require("react");
 var import_fiber2 = require("@react-three/fiber");
 var import_jsx_runtime26 = require("react/jsx-runtime");
 function Spinner3D({
@@ -1794,7 +1837,7 @@ function Spinner3D({
   color = "#22d3ee",
   speed = 1
 }) {
-  const ref = (0, import_react20.useRef)(null);
+  const ref = (0, import_react19.useRef)(null);
   const scale = size === "sm" ? 0.5 : size === "lg" ? 1.5 : 1;
   (0, import_fiber2.useFrame)((state, delta) => {
     if (ref.current) {
@@ -1862,7 +1905,7 @@ function Stepper3D({
 }
 
 // src/components/ui/navbar3d.tsx
-var import_react21 = require("react");
+var import_react20 = require("react");
 var import_drei6 = require("@react-three/drei");
 var import_jsx_runtime28 = require("react/jsx-runtime");
 function NavBar3D({ items, activeHref = "/" }) {
@@ -1879,7 +1922,7 @@ function NavBar3D({ items, activeHref = "/" }) {
   ] });
 }
 function NavBarItemMesh({ item, x, isActive }) {
-  const [hovered, setHover] = (0, import_react21.useState)(false);
+  const [hovered, setHover] = (0, import_react20.useState)(false);
   return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("group", { position: [x, 0, 0], children: [
     /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
       "mesh",
@@ -4731,7 +4774,7 @@ var InputOTPSeparator = React58.forwardRef(
 InputOTPSeparator.displayName = "InputOTPSeparator";
 
 // src/components/ui/barchart3d.tsx
-var import_react22 = require("react");
+var import_react21 = require("react");
 var import_fiber3 = require("@react-three/fiber");
 var import_drei8 = require("@react-three/drei");
 var import_jsx_runtime72 = require("react/jsx-runtime");
@@ -4742,7 +4785,7 @@ function BarChart3D({
   gap = 0.2,
   animated = true
 }) {
-  const maxValue = (0, import_react22.useMemo)(() => Math.max(...data.map((d) => d.value)), [data]);
+  const maxValue = (0, import_react21.useMemo)(() => Math.max(...data.map((d) => d.value)), [data]);
   return /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("group", { children: [
     /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("gridHelper", { args: [data.length * (barSize + gap) + 2, 10], position: [0, 0, 0] }),
     /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(import_drei8.Instances, { range: data.length, children: [
@@ -4777,8 +4820,8 @@ function BarChart3D({
   ] });
 }
 function BarInstance({ height, color, animated }) {
-  const ref = (0, import_react22.useRef)(null);
-  const [hovered, setHover] = (0, import_react22.useState)(false);
+  const ref = (0, import_react21.useRef)(null);
+  const [hovered, setHover] = (0, import_react21.useState)(false);
   (0, import_fiber3.useFrame)((state, delta) => {
     if (ref.current) {
       const targetHeight = height;
@@ -4806,7 +4849,7 @@ function BarInstance({ height, color, animated }) {
 }
 
 // src/components/ui/linechart3d.tsx
-var import_react23 = require("react");
+var import_react22 = require("react");
 var import_drei9 = require("@react-three/drei");
 var import_three3 = require("three");
 var import_jsx_runtime73 = (
@@ -4820,7 +4863,7 @@ function LineChart3D({
   lineWidth = 3,
   showPoints = true
 }) {
-  const points = (0, import_react23.useMemo)(() => {
+  const points = (0, import_react22.useMemo)(() => {
     if (data.length === 0) return [];
     const maxX = Math.max(...data.map((d) => d.x));
     const maxY = Math.max(...data.map((d) => d.y));
@@ -4832,7 +4875,7 @@ function LineChart3D({
       0
     ));
   }, [data]);
-  const curve = (0, import_react23.useMemo)(() => {
+  const curve = (0, import_react22.useMemo)(() => {
     if (points.length < 2 || !smooth) return null;
     return new import_three3.CatmullRomCurve3(points);
   }, [points, smooth]);
@@ -4858,7 +4901,7 @@ function LineChart3D({
 }
 
 // src/components/ui/piechart3d.tsx
-var import_react24 = __toESM(require("react"), 1);
+var import_react23 = __toESM(require("react"), 1);
 var import_three4 = require("three");
 var import_fiber4 = require("@react-three/fiber");
 var import_drei10 = require("@react-three/drei");
@@ -4870,7 +4913,7 @@ function PieChart3D({
   explode = true,
   donut = false
 }) {
-  const total = (0, import_react24.useMemo)(() => data.reduce((acc, cur) => acc + cur.value, 0), [data]);
+  const total = (0, import_react23.useMemo)(() => data.reduce((acc, cur) => acc + cur.value, 0), [data]);
   let startAngle = 0;
   return /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("group", { rotation: [-Math.PI / 2, 0, 0], children: [
     " ",
@@ -4893,7 +4936,7 @@ function PieChart3D({
   ] });
 }
 function PieSegment({ startAngle, endAngle, radius, color, depth, explode, innerRadius, label }) {
-  const shape = (0, import_react24.useMemo)(() => {
+  const shape = (0, import_react23.useMemo)(() => {
     const s = new import_three4.Shape();
     if (innerRadius > 0) {
       s.moveTo(Math.cos(startAngle) * radius, Math.sin(startAngle) * radius);
@@ -4908,8 +4951,8 @@ function PieSegment({ startAngle, endAngle, radius, color, depth, explode, inner
     }
     return s;
   }, [startAngle, endAngle, radius, innerRadius]);
-  const [hovered, setHover] = (0, import_react24.useState)(false);
-  const ref = import_react24.default.useRef(null);
+  const [hovered, setHover] = (0, import_react23.useState)(false);
+  const ref = import_react23.default.useRef(null);
   const midAngle = (startAngle + endAngle) / 2;
   const explodeDir = [Math.cos(midAngle), Math.sin(midAngle), 0];
   (0, import_fiber4.useFrame)((state, delta) => {
@@ -4944,7 +4987,7 @@ function PieSegment({ startAngle, endAngle, radius, color, depth, explode, inner
 }
 
 // src/components/ui/scatterplot3d.tsx
-var import_react25 = require("react");
+var import_react24 = require("react");
 var import_drei11 = require("@react-three/drei");
 var import_three5 = require("three");
 var import_fiber5 = require("@react-three/fiber");
@@ -4973,8 +5016,8 @@ function ScatterPlot3D({
   ] });
 }
 function ScatterPointInstance({ position, scale, color }) {
-  const ref = (0, import_react25.useRef)(null);
-  const [hovered, setHover] = (0, import_react25.useState)(false);
+  const ref = (0, import_react24.useRef)(null);
+  const [hovered, setHover] = (0, import_react24.useState)(false);
   (0, import_fiber5.useFrame)((state) => {
     if (ref.current) {
       const s = hovered ? scale * 1.5 : scale;
@@ -4996,12 +5039,12 @@ function ScatterPointInstance({ position, scale, color }) {
 }
 
 // src/components/ui/graph3d.tsx
-var import_react26 = require("react");
+var import_react25 = require("react");
 var import_drei12 = require("@react-three/drei");
 var import_three6 = require("three");
 var import_jsx_runtime76 = require("react/jsx-runtime");
 function Graph3D({ nodes, edges, physics = false }) {
-  const positionedNodes = (0, import_react26.useMemo)(() => {
+  const positionedNodes = (0, import_react25.useMemo)(() => {
     return nodes.map((node, i) => ({
       ...node,
       vec: new import_three6.Vector3(
@@ -5011,7 +5054,7 @@ function Graph3D({ nodes, edges, physics = false }) {
       )
     }));
   }, [nodes]);
-  const nodeMap = (0, import_react26.useMemo)(() => {
+  const nodeMap = (0, import_react25.useMemo)(() => {
     const map = /* @__PURE__ */ new Map();
     positionedNodes.forEach((n) => map.set(n.id, n.vec));
     return map;
@@ -5080,11 +5123,11 @@ function Map3D({
 }
 
 // src/components/ui/gallery3d.tsx
-var import_react28 = require("react");
+var import_react27 = require("react");
 var import_fiber6 = require("@react-three/fiber");
 
 // src/components/ui/imageplane.tsx
-var import_react27 = require("react");
+var import_react26 = require("react");
 var import_drei14 = require("@react-three/drei");
 var import_three7 = require("three");
 var import_jsx_runtime78 = require("react/jsx-runtime");
@@ -5097,7 +5140,7 @@ function ImagePlane({
   transparent = true,
   parallax = false
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(import_react27.Suspense, { fallback: /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)("mesh", { children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(import_react26.Suspense, { fallback: /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)("mesh", { children: [
     /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("planeGeometry", { args: [width, width] }),
     /* @__PURE__ */ (0, import_jsx_runtime78.jsx)("meshBasicMaterial", { wireframe: true, color: "gray" })
   ] }), children: /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
@@ -5139,7 +5182,7 @@ function Gallery3D({
   radius = 5,
   gap = 1.5
 }) {
-  const ref = (0, import_react28.useRef)(null);
+  const ref = (0, import_react27.useRef)(null);
   (0, import_fiber6.useFrame)((state, delta) => {
     if (ref.current && layout === "carousel") {
       ref.current.rotation.y += delta * 0.1;
@@ -5168,7 +5211,7 @@ function Gallery3D({
 }
 
 // src/components/ui/modelviewer.tsx
-var import_react29 = require("react");
+var import_react28 = require("react");
 var import_drei15 = require("@react-three/drei");
 var import_fiber7 = require("@react-three/fiber");
 var import_jsx_runtime80 = require("react/jsx-runtime");
@@ -5179,14 +5222,14 @@ function ModelViewer({
   environment = "studio",
   position = [0, 0, 0]
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("group", { position, children: /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)(import_react29.Suspense, { fallback: null, children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("group", { position, children: /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)(import_react28.Suspense, { fallback: null, children: [
     /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(Model, { src, scale, autoRotate }),
     /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(import_drei15.Environment, { preset: environment })
   ] }) });
 }
 function Model({ src, scale, autoRotate }) {
   const { scene } = (0, import_drei15.useGLTF)(src);
-  const ref = (0, import_react29.useRef)(null);
+  const ref = (0, import_react28.useRef)(null);
   (0, import_fiber7.useFrame)((state, delta) => {
     if (ref.current && autoRotate) {
       ref.current.rotation.y += delta * 0.5;
@@ -5196,7 +5239,7 @@ function Model({ src, scale, autoRotate }) {
 }
 
 // src/components/ui/videoplane.tsx
-var import_react30 = require("react");
+var import_react29 = require("react");
 var import_drei16 = require("@react-three/drei");
 var THREE = __toESM(require("three"), 1);
 var import_jsx_runtime81 = require("react/jsx-runtime");
@@ -5211,7 +5254,7 @@ function VideoPlane({
   side = "double"
 }) {
   return /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
-    import_react30.Suspense,
+    import_react29.Suspense,
     {
       fallback: /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("mesh", { children: [
         /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("planeGeometry", { args: [width, width * 0.56] }),
@@ -5270,7 +5313,7 @@ function VideoPlaneContent({
 }
 
 // src/components/ui/audiovisualizer.tsx
-var import_react31 = require("react");
+var import_react30 = require("react");
 var import_fiber8 = require("@react-three/fiber");
 var THREE2 = __toESM(require("three"), 1);
 var import_jsx_runtime82 = require("react/jsx-runtime");
@@ -5280,10 +5323,10 @@ function AudioVisualizer({
   barColor = "#22d3ee",
   width = 10
 }) {
-  const analyserRef = (0, import_react31.useRef)(null);
-  const meshRef = (0, import_react31.useRef)(null);
-  const [ready, setReady] = (0, import_react31.useState)(false);
-  (0, import_react31.useEffect)(() => {
+  const analyserRef = (0, import_react30.useRef)(null);
+  const meshRef = (0, import_react30.useRef)(null);
+  const [ready, setReady] = (0, import_react30.useState)(false);
+  (0, import_react30.useEffect)(() => {
     const listener = new THREE2.AudioListener();
     const sound = new THREE2.Audio(listener);
     const audioLoader = new THREE2.AudioLoader();
@@ -5325,7 +5368,7 @@ function AudioVisualizer({
 }
 
 // src/components/ui/particles.tsx
-var import_react32 = require("react");
+var import_react31 = require("react");
 var import_fiber9 = require("@react-three/fiber");
 var import_three8 = require("three");
 var import_jsx_runtime83 = require("react/jsx-runtime");
@@ -5335,8 +5378,8 @@ function Particles({
   color = "#a78bfa",
   speed = 0.1
 }) {
-  const points = (0, import_react32.useRef)(null);
-  const particlesPosition = (0, import_react32.useMemo)(() => {
+  const points = (0, import_react31.useRef)(null);
+  const particlesPosition = (0, import_react31.useMemo)(() => {
     const positions = new Float32Array(count2 * 3);
     for (let i = 0; i < count2; i++) {
       positions[i * 3] = (Math.random() - 0.5) * 10;
@@ -5375,7 +5418,7 @@ function Particles({
 }
 
 // src/components/ui/bloom.tsx
-var import_react33 = require("react");
+var import_react32 = require("react");
 var import_fiber10 = require("@react-three/fiber");
 
 // node_modules/three-stdlib/postprocessing/ShaderPass.js
@@ -6133,8 +6176,8 @@ var import_jsx_runtime84 = require("react/jsx-runtime");
 (0, import_fiber10.extend)({ EffectComposer, RenderPass, UnrealBloomPass });
 function Bloom({ intensity = 1, radius = 0.4, threshold = 0 }) {
   const { gl, scene, camera, size } = (0, import_fiber10.useThree)();
-  const composer = (0, import_react33.useRef)(null);
-  (0, import_react33.useEffect)(() => {
+  const composer = (0, import_react32.useRef)(null);
+  (0, import_react32.useEffect)(() => {
     if (composer.current) {
       composer.current.setSize(size.width, size.height);
     }
@@ -6209,7 +6252,7 @@ function ShadowSystem({ type = "soft", bias = -1e-4, mapSize = 1024 }) {
 }
 
 // src/components/ui/gloweffect.tsx
-var import_react34 = __toESM(require("react"), 1);
+var import_react33 = __toESM(require("react"), 1);
 var THREE3 = __toESM(require("three"), 1);
 var import_jsx_runtime88 = require("react/jsx-runtime");
 function GlowEffect({
@@ -6218,7 +6261,7 @@ function GlowEffect({
   intensity = 1,
   scale = 1.2
 }) {
-  const glowMaterial = import_react34.default.useMemo(() => {
+  const glowMaterial = import_react33.default.useMemo(() => {
     return new THREE3.MeshBasicMaterial({
       color,
       transparent: true,
@@ -6230,9 +6273,9 @@ function GlowEffect({
   }, [color, intensity]);
   return /* @__PURE__ */ (0, import_jsx_runtime88.jsxs)("group", { children: [
     children,
-    /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("group", { scale: [scale, scale, scale], children: import_react34.Children.map(children, (child) => {
-      if (import_react34.default.isValidElement(child)) {
-        return (0, import_react34.cloneElement)(child, {
+    /* @__PURE__ */ (0, import_jsx_runtime88.jsx)("group", { scale: [scale, scale, scale], children: import_react33.Children.map(children, (child) => {
+      if (import_react33.default.isValidElement(child)) {
+        return (0, import_react33.cloneElement)(child, {
           material: glowMaterial
         });
       }
@@ -6242,7 +6285,7 @@ function GlowEffect({
 }
 
 // src/components/ui/waveeffect.tsx
-var import_react35 = __toESM(require("react"), 1);
+var import_react34 = __toESM(require("react"), 1);
 var import_drei19 = require("@react-three/drei");
 var import_fiber11 = require("@react-three/fiber");
 var THREE4 = __toESM(require("three"), 1);
@@ -6271,14 +6314,14 @@ var WaveMaterial = (0, import_drei19.shaderMaterial)(
 );
 (0, import_fiber11.extend)({ WaveMaterial });
 function WaveEffect({ children, amplitude = 0.3, frequency = 2, speed = 1 }) {
-  const group = import_react35.default.useRef(null);
-  const material = (0, import_react35.useMemo)(() => new WaveMaterial(), []);
+  const group = import_react34.default.useRef(null);
+  const material = (0, import_react34.useMemo)(() => new WaveMaterial(), []);
   (0, import_fiber11.useFrame)((state, delta) => {
     if (material) {
       material.time += delta * speed;
     }
   });
-  import_react35.default.useEffect(() => {
+  import_react34.default.useEffect(() => {
     if (group.current) {
       group.current.traverse((obj) => {
         if (obj.isMesh) {
@@ -6291,7 +6334,7 @@ function WaveEffect({ children, amplitude = 0.3, frequency = 2, speed = 1 }) {
 }
 
 // src/components/ui/noisefield.tsx
-var import_react36 = require("react");
+var import_react35 = require("react");
 var import_drei20 = require("@react-three/drei");
 var import_fiber12 = require("@react-three/fiber");
 var THREE5 = __toESM(require("three"), 1);
@@ -6326,7 +6369,7 @@ var NoiseMaterial = (0, import_drei20.shaderMaterial)(
 );
 (0, import_fiber12.extend)({ NoiseMaterial });
 function NoiseField({ scale = 1, speed = 0.5, mode = "color" }) {
-  const material = (0, import_react36.useMemo)(() => new NoiseMaterial(), []);
+  const material = (0, import_react35.useMemo)(() => new NoiseMaterial(), []);
   (0, import_fiber12.useFrame)((state, delta) => {
     if (material) {
       material.time += delta * speed;