6.2.5 addon-link - LinkTo - New TypeScript Errors

[contrast-jeremiahp]

Describe the bug
Following the addon-link documentation captured here: https://www.npmjs.com/package/@storybook/addon-links

LinkTo in @storybook/addon-link@6.2.5 now results in a TypeScript error:

• JSX element type 'LinkTo' does not have any construct or call signatures.

This issue did not exist in @storybook/addon-link@6.1.21

To Reproduce
Steps to reproduce the behavior:

1. Install @storybook/addon-link@6.1.21 as a dependency in a TypeScript project
2. Write a simple TypeScript component such as
   
3. Notice NO TypeScript Errors
4. Upgrade dependency to @storybook/addon-link@6.2.25
5. See TypeScript error
   

Expected behavior
TypeScript errors do not occur in addon-links@6.2+

Workaround

• Add a ts-ignore comment
  

Additional Notes:

• Using 6.2.5, the code import usesnode_modules/@storybook/addon-links/react.d.ts
• Using 6.1.21, the code import uses node_modules/@storybook/addon-links/react.js

[ndelangen]

Does anything change if you were to import { LinkTo }?

We specify the types here:

storybook/addons/links/react.d.ts

Lines 1 to 2 in cc55b74

	export * from './dist/ts3.9/react';
	export { default as LinkTo } from './dist/ts3.9/react';

I'm not sure what we're doing wrong?

I think the types were any before, can you confirm?

If the types were there before, I have no trouble simply removing the react.d.ts file. If that solves this.

[JasonBusse]

Same issue here. I can get it to build and work using, import LinkTo from '@storybook/addon-links/dist/esm/react'; but eslint is not happy.

Previously, we had imported from @storybook/addon-links/dist/react

When changing to named import import LinkTo from '@storybook/addon-links/react'; we get:
react-dom.development.js:23965 Uncaught (in promise) Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

[RowanDZ]

LinkTo is in the package code and general typings exported as default,
but in the type definitions for ts3.9 exported as {LinkTo}

node_modules/@storybook/addon-links/react.d.ts

I'm using this for now..

[cyberixae]

As a workaround you could import both separately and combine them in a const.

import LTImp, { LinkTo as LTDec } from '@storybook/addon-links/react';

const LinkTo: typeof LTDec = LTImp as any

[shilman]

Egads!! I just released https://github.com/storybookjs/storybook/releases/tag/v6.5.0-alpha.38 containing PR #17434 that references this issue. Upgrade today to the @next NPM tag to try it out!

npx sb upgrade --prerelease

[shilman]

Good golly!! I just released https://github.com/storybookjs/storybook/releases/tag/v6.4.19 containing PR #17434 that references this issue. Upgrade today to the @latest NPM tag to try it out!

npx sb upgrade

[sneko]

Happening to me with SB v7 despite the PR. I commented the exclude array in tsconfig.json but nothing to do.

JSX element type 'LinkTo' does not have any construct or call signatures.

Any idea?

[ndelangen]

@sneko can you supply a reproduction for 7.0?

[DannyJoris]

@ndelangen I ran into this issue as well. I've created an issue for it here where I created a reproduction: #20580