camera-controls does not export its types

[Merwan Achibet]

Describe the bug

Unless I'm mistaken, it seems that the library only exports the CameraControls class from its index.ts file.

How to import all the other types?

For instance, I would like to configure the mouse buttons in Typescript, but the ACTION type is not exported so I cannot do things like:

import { ACTION } from "camera-controls";

To Reproduce

Write import { ACTION } from "camera-controls";

It does not work.

Code

No response

Live example

No response

Expected behavior

The various types should be exported.

Screenshots or Video

No response

Device

No response

OS

No response

Browser

No response

[Akihiro Oyamada]

@merwaaan

Sorry for the delay.
The camera-controls npm package comes bundled with several d.ts files.
This might be a workaround for you.
import { ACTION } from 'camera-controls/dist/types';

[Alexander Hörl]

@yomotsu I'm getting a Module not found: Error: Can't resolve 'camera-controls/dist/types' error when doing it that way.

[Akihiro Oyamada]

I think that should work though.
ACTION is exported from
https://cdn.jsdelivr.net/npm/camera-controls@2.8.3/dist/types.d.ts

[Alexander Hörl]

Yeah I thought so too, but I didn't get it too work. VSCode recognized but I couldn't build the bundle. Using create-react-app.

[Akihiro Oyamada]

Would you mind checking your build setting?
(Without any reproducible code, it is a bit raw to digest. My answers will be as precise as you describe the problem, unfortunately.

[Alexander Hörl]

Sure thing.

This is my tsconfig.json

{
  "compilerOptions": {
    "target": "es5",
    "lib": [
      "dom",
      "dom.iterable",
      "esnext"
    ],
    "allowJs": true,
    "skipLibCheck": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "strict": true,
    "forceConsistentCasingInFileNames": true,
    "noFallthroughCasesInSwitch": true,
    "module": "esnext",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noEmit": true,
    "jsx": "react-jsx"
  },
  "include": [
    "src"
  ]
}

and this is the file where I used it.

import { CameraControls } from "@react-three/drei";
import { ACTION } from "camera-controls/dist/types";

export const toggleCameraControlsUserInput = (
  cameraControls: CameraControls,
  enable: boolean,
) => {
  if (!enable) {
    cameraControls.mouseButtons.left = ACTION.NONE;
    cameraControls.mouseButtons.middle = ACTION.NONE;
    cameraControls.mouseButtons.right = ACTION.NONE;
    cameraControls.mouseButtons.wheel = ACTION.NONE;
    cameraControls.touches.one = ACTION.NONE;
    cameraControls.touches.two = ACTION.NONE;
    cameraControls.touches.three = ACTION.NONE;
  } else {
    cameraControls.mouseButtons.left = ACTION.ROTATE;
    cameraControls.mouseButtons.middle = ACTION.DOLLY;
    cameraControls.mouseButtons.right = ACTION.TRUCK;
    cameraControls.mouseButtons.wheel = ACTION.DOLLY;
    cameraControls.touches.one = ACTION.TOUCH_ROTATE;
    cameraControls.touches.two = ACTION.TOUCH_DOLLY_TRUCK;
    cameraControls.touches.three = ACTION.TOUCH_TRUCK;
  }
};

[Akihiro Oyamada]

camera-controls/dist/types.d.ts exports only the types. not a JS module.
That is intended behavior.

use the static value called CameraControls.ACTION