Open mririgoyen opened 6 months ago
I haven't really used this package to make another package, but I don't see how that should break things. I guess you could try to check what TypographyProps
is first, I'm pretty sure you could also install react-polymorphed
in the user-side to check whether we get the same thing:
import { TypographyProps } from "your-package";
import { PolyForwardComponent } from "react-polymorphed";
// test A
declare const props: TypographyProps;
// test if typography props still has the correct 'align' type
props.align = '';
// test B
declare const Test: PolyForwardComponent<'span', TypographyProps>;
// check if it works when used directly
<Test align='left' />
Simplest case is both test A
and test B
failing, if so then most likely rollup is messing up your own types somehow, if both test A
and test B
succeed then something might have went wrong with rollup figuring out polymorphic components?? If test A
succeeds and test B
fails then there's something very wrong with this package.
I haven't really used this package to make another package, but I don't see how that should break things. I guess you could try to check what
TypographyProps
is first, I'm pretty sure you could also installreact-polymorphed
in the user-side to check whether we get the same thing:import { TypographyProps } from "your-package"; import { PolyForwardComponent } from "react-polymorphed"; // test A declare const props: TypographyProps; // test if typography props still has the correct 'align' type props.align = ''; // test B declare const Test: PolyForwardComponent<'span', TypographyProps>; // check if it works when used directly <Test align='left' />
Simplest case is both
test A
andtest B
failing, if so then most likely rollup is messing up your own types somehow, if bothtest A
andtest B
succeed then something might have went wrong with rollup figuring out polymorphic components?? Iftest A
succeeds andtest B
fails then there's something very wrong with this package.
Thanks for the response. I'm going to set up and test each of these cases. I will report back with my findings.
Both tests pass. I suppose I will start debugging Rollup now.
I'm using your package to create polymorphic components that forward refs. Using the following pattern, everything works as intended within the local component library.
As I said, when used locally, such as in my Storybook examples, TypeScript sees and enforces the types.
However, after building the package with Rollup and importing it into another repository, all the types get genericized. This only happens on components wrapped with this polymorph utility.
Following the types, I see a logical chain to my eventual prop types that are correct.
I've traced other components that are not polymorphic and they all follow the same exact pattern, except the first step is a direct call to the React
forwardRefExcoticComponent
. These all type correctly.My question is, am I doing something incorrect at some step that could potentially cause this? Losing type safety on polymorphic components isn't good, so I need to figure out how to resolve this.