feat: new lighting

packages/website/src/components/HelpingSpotLight.tsx

@@ -1,3 +1,5 @@
+import { Box, Text } from "@radix-ui/themes";
+import { Html } from "@react-three/drei";
 import { memo, type ComponentProps } from "react";
 
 interface Props extends ComponentProps<"spotLight"> {
@@ -8,10 +10,20 @@ export const HelpingSpotLight = memo<Props>(({ debug, ...props }) => {
   return (
     <>
       {debug && (
-        <mesh position={props.position}>
-          <icosahedronGeometry args={[0.1, 2]} />
-          <meshBasicMaterial color={props.color} />
-        </mesh>
+        <group position={props.position}>
+          <mesh>
+            <icosahedronGeometry args={[0.1, 2]} />
+            <meshBasicMaterial color={props.color} />
+          </mesh>
+
+          <Html center>
+            <Box pb="9">
+              <Text wrap="nowrap">
+                {props.intensity} @ {JSON.stringify(props.userData)}
+              </Text>
+            </Box>
+          </Html>
+        </group>
       )}
 
       <spotLight {...props} />