RyanCavanaugh
commented
2 months ago It's not the size; using a very very large props type as the base doesn't reproduce the problem
type BaseProps = Record<`${'a' | 'b' | 'c' | 'd'}${'a' | 'b' | 'c' | 'd'}${'a' | 'b' | 'c' | 'd'}${'a' | 'b' | 'c' | 'd'}${'a' | 'b' | 'c' | 'd'}`, string>;
const Link = <T extends React.ElementType>(
props: WithComponentOverride<BaseProps, T>
) => {
const Component = props.component; // ok
return <Component {...props} />;
};Need to figure out what's weird about TanstackLinkProps but it's a tangled web
🔎 Search Terms
TypeScript Error only on big type only when assigned to a variable
🕗 Version & Regression Information
typescript v5.4.5
⏯ Playground Link
https://stackblitz.com/edit/vitejs-vite-mcran5?file=src%2FLink.tsx
💻 Code
copy paste from https://stackoverflow.com/questions/78252365/typescript-error-only-on-big-type-only-when-assigned-to-a-variable
🙁 Actual behavior
even after many years of writing typescript you sometimes get unexpected results:
assume generic type function
WithComponentOverridewhose purpose is accepting component props and another generic parameter which tells which ComponentType the component is:and usage:
now other components can use
MyComponentand decide which Host element the root of the component would be in typesafe way:works perfectly.
now let's try to apply this generic type to a much more complicated type, taken from the component from
@tanstack/react-routerwe get
TS2339error even though we shouldn't get one.we can even see
{ component: T; }right there in the type:what is even stranger is that when accessing the type directly(and not via assigned variable) works as expected:
WHAT'S GOING ON? I genuinely think that is a typescript bug here, but I can't tell for sure.
for the curious, here is the full typescript error:
the only difference between
TanstackLinkPropsandMyComponentPropsis the size of the type.WithComponentOverrideshould act the same on both of them.Dont belive me? heres a demo
🙂 Expected behavior
.
Additional information about the issue
No response