Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

TransformControls - type issues in declaration #1026

Closed
OldManMeta opened this issue Aug 31, 2022 · 2 comments
Closed

TransformControls - type issues in declaration #1026

OldManMeta opened this issue Aug 31, 2022 · 2 comments
Labels
bug Something isn't working

Comments

@OldManMeta
Copy link

I'm seeing that TransformControls is not able to be refererrenced :

Error is 'TransformControls' refers to a value, but is being used as a type

https://codesandbox.io/s/crazy-faraday-dekluz?file=/src/App.tsx

  • three version: 0.143.0
  • @react-three/fiber version: 8.6.0.
  • @react-three/drei version: 9.25.2

Problem description:

Am unable to compile with these errors in VSCode

Relevant code:

Please see attached CSB

https://codesandbox.io/s/crazy-faraday-dekluz?file=/src/App.tsx

Suggested solution:

I've tried every option I can find on how to modify the import statement, change the types etc. Nothing appears to work for me.

@OldManMeta OldManMeta added the bug Something isn't working label Aug 31, 2022
@OldManMeta
Copy link
Author

Just as a follow up here - I found this post 👍
microsoft/TypeScript#28631

So I tried as it says, to add a dot notation on the object (TransformControls.TransformControls)

<TransformControls.TransformControls // detach name={EditorControlNames.transform} onMouseUp={(e: any) => onTranformChange(e)} // onmouse // object={null} ref={transformer} mode="translate" onObjectChange={(e) => onTransformMove(e)} />

it at least compiles, but it is then not initialised and I get the following error:

Uncaught TypeError: Cannot read properties of undefined (reading 'TransformControls')

@OldManMeta
Copy link
Author

ok - so have this working now.

I used the following:

`
import {TransformControls} from "@react-three/drei";
import { TransformControls as TransformControlsImpl, OrbitControls as OrbitControlsImpl } from 'three-stdlib'

`

Please be sure to enclose the TransformControls within {} or this will not work. Not sure why Typescript does not throw an error if you try to import directly from drei, but it doesnt.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

1 participant