[BUG]: components don't have type definitions

[jendrikw]

Description

The modular components (scatter, calendars, etc.) don't have type definitions, making them unusable in v4.

Steps to reproduce

I develop a website that is bundled with vite. In v3, I use plotly like this:

import * as calendars from "plotly.js/lib/calendars";
import * as Plotly from "plotly.js/lib/core";
import * as heatmap from "plotly.js/lib/heatmap";
import * as scatter from "plotly.js/lib/scatter";
import * as scatter3d from "plotly.js/lib/scatter3d";
import * as surface from "plotly.js/lib/surface";
Plotly.setPlotConfig({logging: 1, notifyOnLogging: 1});
Plotly.register([scatter, heatmap, surface, scatter3d, calendars]);

After upgrading to v4 and removing @types/plotly.js, I get type errors:

src/renderer/tabular/DccPlot.tsx:8:28 - error TS7016: Could not find a declaration file for module 'plotly.js/lib/calendars'. '/home/wenke02/src/dccviewer-js/node_modules/plotly.js/lib/calendars.js' implicitly has an 'any' type.
  If the 'plotly.js' package actually exposes this module, try adding a new declaration (.d.ts) file containing `declare module 'plotly.js/lib/calendars';`

8 import * as calendars from "plotly.js/lib/calendars";
                             ~~~~~~~~~~~~~~~~~~~~~~~~~

src/renderer/tabular/DccPlot.tsx:9:25 - error TS7016: Could not find a declaration file for module 'plotly.js/lib/core'. '/home/wenke02/src/dccviewer-js/node_modules/plotly.js/lib/core.js' implicitly has an 'any' type.
  If the 'plotly.js' package actually exposes this module, try adding a new declaration (.d.ts) file containing `declare module 'plotly.js/lib/core';`

9 import * as Plotly from "plotly.js/lib/core";
                          ~~~~~~~~~~~~~~~~~~~~

src/renderer/tabular/DccPlot.tsx:10:26 - error TS7016: Could not find a declaration file for module 'plotly.js/lib/heatmap'. '/home/wenke02/src/dccviewer-js/node_modules/plotly.js/lib/heatmap.js' implicitly has an 'any' type.
  If the 'plotly.js' package actually exposes this module, try adding a new declaration (.d.ts) file containing `declare module 'plotly.js/lib/heatmap';`

10 import * as heatmap from "plotly.js/lib/heatmap";
                            ~~~~~~~~~~~~~~~~~~~~~~~

src/renderer/tabular/DccPlot.tsx:11:26 - error TS7016: Could not find a declaration file for module 'plotly.js/lib/scatter'. '/home/wenke02/src/dccviewer-js/node_modules/plotly.js/lib/scatter.js' implicitly has an 'any' type.
  If the 'plotly.js' package actually exposes this module, try adding a new declaration (.d.ts) file containing `declare module 'plotly.js/lib/scatter';`

11 import * as scatter from "plotly.js/lib/scatter";
                            ~~~~~~~~~~~~~~~~~~~~~~~

src/renderer/tabular/DccPlot.tsx:12:28 - error TS7016: Could not find a declaration file for module 'plotly.js/lib/scatter3d'. '/home/wenke02/src/dccviewer-js/node_modules/plotly.js/lib/scatter3d.js' implicitly has an 'any' type.
  If the 'plotly.js' package actually exposes this module, try adding a new declaration (.d.ts) file containing `declare module 'plotly.js/lib/scatter3d';`

12 import * as scatter3d from "plotly.js/lib/scatter3d";
                              ~~~~~~~~~~~~~~~~~~~~~~~~~

src/renderer/tabular/DccPlot.tsx:13:26 - error TS7016: Could not find a declaration file for module 'plotly.js/lib/surface'. '/home/wenke02/src/dccviewer-js/node_modules/plotly.js/lib/surface.js' implicitly has an 'any' type.
  If the 'plotly.js' package actually exposes this module, try adding a new declaration (.d.ts) file containing `declare module 'plotly.js/lib/surface';`

13 import * as surface from "plotly.js/lib/surface";
                            ~~~~~~~~~~~~~~~~~~~~~~~

Notes

I looked through my node_modules/plotly.js, and I don't see any type definitions for these modules. Please add them.

[robertclaus]

Likely just an issue with the type generator for this specific way of importing the library we can address.

@camdecoster In the meantime is there a recommended way to import these components that we tested with typing?