With project references, some cross-package imports of inferred types are emitted with relative paths

[eps1lon]

Bug Report

Repro: https://github.com/eps1lon/ts-monorepo-type-import-paths

🔎 Search Terms

I was asked to open this as a new issue: #39117 (comment)

🕗 Version & Regression Information

• This is the behavior in every version I tried, and I reviewed the FAQ for entries about _________

⏯ Playground Link

Unable to do this in the playground

💻 Code

See https://github.com/eps1lon/ts-monorepo-type-import-paths

// ArrowLeft.tsx

import * as React from "react";
import { createSvgIcon } from "@material-ui/core/utils";

export default createSvgIcon(
  <path d="M15.41 16.59L10.83 12l4.58-4.59L14 6l-6 6 6 6 1.41-1.41z" />,
  "ArrowLeft"
);

// @material-ui/core/utils.d.ts

import * as React from "react";
import SvgIcon from "./SvgIcon";

export function createSvgIcon(
  path: React.ReactNode,
  displayName: string
): typeof SvgIcon;

// @material-ui/core/SvgIcon.d.ts

import * as React from "react";
import { StyledComponentProps } from "@material-ui/styles";

export interface SvgIconProps extends StyledComponentProps<"root"> {
  children?: React.ReactNode;
}

declare const SvgIcon: React.JSXElementConstructor<SvgIconProps>;
export default SvgIcon;

// @material-ui/styles/index.d.ts
export interface StyledComponentProps<ClassKey extends string> {
  classes?: Record<ClassKey, string>;
}

🙁 Actual behavior

Generated ArrowLeft.d.ts

import * as React from "react";
declare const _default: React.JSXElementConstructor<import("../../core/src/SvgIcon").SvgIconProps>;
export default _default;
//# sourceMappingURL=ArrowLeft.d.ts.map

🙂 Expected behavior

import * as React from "react";
declare const _default: React.JSXElementConstructor<import("@material-ui/core/SvgIcon").SvgIconProps>;
export default _default;
//# sourceMappingURL=ArrowLeft.d.ts.map

[gurunars]

As a temporary workaround you can add a placeholder export in ArrowLeft.tsx:

// ArrowLeft.tsx

import * as React from "react";
import { createSvgIcon } from "@material-ui/core/utils";

import SvgIcon from "@material-ui/core/SvgIcon";

export type Placeholder = SvgIcon;

export default createSvgIcon(
  <path d="M15.41 16.59L10.83 12l4.58-4.59L14 6l-6 6 6 6 1.41-1.41z" />,
  "ArrowLeft"
);

This seems to make the compiler pick the explicitly imported type rather than trying to determine the implicit one.