feat: add Helper component, declarative alternative to useHelper

[isaac-mason]

Why

Provide a declarative alternative to the useHelper hook

What

Added a component <Helper /> that lets you add helpers declaratively

Example using <Helper />:

const Scene: React.FC<StoryProps> = ({ showHelper }) => {
  return (
    <Sphere>
      <meshBasicMaterial />

      <Helper type={BoxHelper} args={['royalblue']} />
      <Helper type={VertexNormalsHelper} args={[1, 0xff0000]} />
    </Sphere>
  )
}

Example using useHelper:

const Scene: React.FC<StoryProps> = ({ showHelper }) => {
  const mesh = React.useRef()
  useHelper(mesh, BoxHelper, 'royalblue')
  useHelper(mesh, VertexNormalsHelper, 1, 0xff0000)

  return (
    <Sphere ref={mesh}>
      <meshBasicMaterial />
    </Sphere>
  )
}

Checklist

• Documentation updated (example)
• Storybook entry added (example)
• Ready to be merged

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
drei	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Aug 9, 2023 1:54pm

[codesandbox-ci]

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit de82e2e:

Sandbox	Source
funny-chaplygin-95jnjt	Configuration
Ground reflections and video textures	Configuration
arc-x-pmndrs-colors	Configuration

[github-actions]

🎉 This PR is included in version 9.101.0 🎉

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot 📦🚀