Erro with Container component type

[Firas88Alkhatib]

Description

Error with "Container" component type, the children prop is omitted

Steps to reproduce

1.Create React functional component 2. returns Container component with Graphics component as children <Container> <Graphics /> </Container>

Additional info

• @inlet/react-pixi version: 6.8.0
• React version: 17.0.1
• ReactDOM version: 17.0.1
• PIXI version: 6.5.2

[james-arn]

I've experienced this too, you can turn off typescript using @ts-ignore and it somewhat works for some props like position, however height and width doesn't. I've had to revert to pixi.js.

[nanachi-code]

I dived into the type def and looks like the they are omitting the children props. Not sure if this is intentional.

type Container<T extends PIXI.DisplayObject, U = {}> = Partial<
    Omit<T, 'children' | P | ReadonlyKeys<T> | keyof U> &
    WithPointLike<P>
    > & U & InteractionEvents & { ref?: React.Ref<T> };

 type IContainer = Container<PIXI.Container>;

 export const Container: React.FC<_ReactPixi.IContainer>;

Edit: https://github.com/inlet/react-pixi/pull/338#discussion_r942023521 looks like it is a React18 problem and will be fixed in the next version

[saitonakamura]

@Firas88Alkhatib can you provide a repro (you can use this codesandbox as a template, but pay attention to the versions https://codesandbox.io/s/angry-wave-1ly78t?file=/src/App.tsx)? I'm struggling to understand the issue. As for the react 18 they did remove childern prop from FC and Component, but none of the topic starter version suggests it's react 18 issue

[nanachi-code]

mb I wasnt paying attention to op's react version but I was also facing the same problem when using react 17. I think its because the Container component doesnt have the children prop from the type def I found in the previous comment.

[saitonakamura]

@nanachi-code this is done intentionally so the pixi children class field (which is omitted) won't clash with react concept of children (which effectively replaces pixi one). If you have repro we can investigate, but otherwise I don't really understand what may cause it

[shryt]

I also faced the same issue, and it should be because I forgot to downgrade @types/react and @types/react-dom. It might solve to downgrade those to version 17 manually, or I recommend you to use typesync(https://github.com/jeffijoe/typesync), which automatically install missing TypeScript typings for dependencies.

[sebastian-budka-mir]

It was working fine on React 17. But after migration to 18 it stoped working due to children props removal in React.FC (as @saitonakamura mentioned).

[QuentinMenDev]

It seems that this error hasn't been corrected in v7.0.0. There was a change made in #338 that was correcting it but it didn't go through. As @sebastian-budka-mir stated and ryohey explained in the Draft, changing React.FC<_ReactPixi.IContainer> into React.FC<React.PropsWithChildren<_ReactPixi.IContainer>> do the trick.

[baseten]

Released in v7.0.1