r3f-interaction
CommunityTurn 3D scenes into interactive experiences.
AuthorEnzeD
Version1.0.0
Installs0
System Documentation
What problem does it solve?
Enables developers to implement robust user interaction in React Three Fiber scenes by standardizing pointer events, controls, and gesture handling.
Core Features & Use Cases
- Pointer events: onClick, onPointerOver, onPointerOut, onPointerDown, onPointerMove, onPointerUp, onPointerCancel, onWheel, and selection gestures to drive interactive content.
- Camera and controls integration: OrbitControls, CameraControls, TrackballControls, and PointerLockControls to navigate and manipulate the scene.
- Selection, dragging, and feedback: implement object selection, hover cues, and drag interactions with visual feedback and constraints.
- Real-world scenario: build an editable 3D scene where users select objects, move them with gizmos, and inspect details.
Quick Start
Interact with a rotating cube by enabling pointer events and orbit controls in a Canvas.
Dependency Matrix
Required Modules
None requiredComponents
Standard package💻 Claude Code Installation
Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.
Please help me install this Skill: Name: r3f-interaction Download link: https://github.com/EnzeD/r3f-skills/archive/main.zip#r3f-interaction Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
Agent Skills Search Helper
Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.