feat: add types to keyboard controls

[RodrigoHamuy]

Why

• KeyboardControlsEntry wasn't exported, so it wasn't easy to define this outside the component.
• useKeyboardControls() always returned any because TS couldn't resolve the function, which is not fun for TS devs.

What

• Added KeyboardControls story: /?path=/story/controls-keyboardcontrols--keyboard-controls-st
• KeyboardControlsEntry is now exported and is optionally generic.
• useKeyboardControls() now returns the correct types for each case, because the function overloading declarations have been added.
• useKeyboardControls() now supports generics, so you can pass which keys you are expected to use.

For example, consider you have a Controls enum, you can now pass that as a generic and get the correct types for all case scenarios:

enum Controls {
  forward = 'forward',
  left = 'left',
  right = 'right',
  back = 'back',
}
const [sub, get] = useKeyboardControls<Controls>()
const left = useKeyboardControls<Controls>(st => st.left);
console.log(`left: ${left}`);
useFrame(() => console.log(`back: ${get().back}`))
useEffect(() => sub(st => console.log(`forward: ${st.forward}`)), [])

get().up // will throw TS error

Checklist

• Documentation updated
• Storybook entry added
• Ready to be merged

[vercel]

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

Name	Status	Preview	Updated
drei	✅ Ready (Inspect)	Visit Preview	Oct 29, 2022 at 3:26PM (UTC)

[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 517b874:

Sandbox	Source
little-silence-kzv0wt	Configuration
Ground reflections and video textures	Configuration
arc-x-pmndrs-colors	Configuration

[drcmda]

thanks! :)

[github-actions]

🎉 This PR is included in version 9.39.0 🎉

The release is available on:

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

Your semantic-release bot 📦🚀

[RodrigoHamuy]

Wow, that was quick @drcmda , thanks!! Really sorry but spotted one more TS issue where it was returning any (the selector), but it should be fixed in this PR #1118