From 676cd0994d4c0ed37a131f72314fb6c7795e896b Mon Sep 17 00:00:00 2001
From: divyap <divyapahuja31@gmail.com>
Date: Wed, 18 Mar 2026 12:12:43 +0530
Subject: [PATCH] feat: add R3F cube scene

---
 r3f/src/App.jsx | 40 ++++++++++++++++++++++++++++++++++++++++
 1 file changed, 40 insertions(+)
 create mode 100644 r3f/src/App.jsx

diff --git a/r3f/src/App.jsx b/r3f/src/App.jsx
new file mode 100644
index 0000000..74f7213
--- /dev/null
+++ b/r3f/src/App.jsx
@@ -0,0 +1,40 @@
+import { Canvas, useFrame } from '@react-three/fiber'
+import { OrbitControls } from '@react-three/drei'
+import { useRef, useState } from 'react'
+
+function Box({ position }) {
+  const ref = useRef()
+  const [hovered, setHovered] = useState(false)
+  const [clicked, setClicked] = useState(false)
+
+  useFrame(() => {
+    ref.current.rotation.x += 0.01
+    ref.current.rotation.y += 0.01
+  })
+
+  return (
+    <mesh
+      ref={ref}
+      position={position}
+      scale={clicked ? 1.5 : 1}
+      onClick={() => setClicked(!clicked)}
+      onPointerOver={() => setHovered(true)}
+      onPointerOut={() => setHovered(false)}
+    >
+      <boxGeometry args={[1, 1, 1]} />
+      <meshStandardMaterial color={hovered ? 'hotpink' : 'orange'} />
+    </mesh>
+  )
+}
+
+export default function App() {
+  return (
+    <Canvas style={{ background: '#f0f0f0' }}>
+      <ambientLight intensity={Math.PI / 2} />
+      <pointLight position={[-10, -10, -10]} intensity={Math.PI} />
+      <Box position={[-1.2, 0, 0]} />
+      <Box position={[1.2, 0, 0]} />
+      <OrbitControls />
+    </Canvas>
+  )
+} 
\ No newline at end of file