React 18+ Providers error when FC is using children
Closed this issue · 6 comments
package | version |
---|---|
typescript |
4.9.4 |
react |
18.2.0 |
@looker/components |
4.0.4 |
I am getting a typescript error when using the <ComponentsProvider>
:
Type '{ children: Element }' has no properties in common with type 'IntrinsicAttributes & ComponentsProviderProps'
Fix:
I personally ran into this problem when upgrading to react 18. FC
properties no longer expect children
, so custom properties need to be more explicit:
export interface ComponentsProviderProps extends ThemeProviderProps, ExtendComponentsTheme, UseI18nProps {
// ...
}
// Should extend an additional React.PropsWithChildren<{}> type:
export interface ComponentsProviderProps extends ThemeProviderProps, ExtendComponentsTheme, UseI18nProps, React.PropsWithChidlren<{}> {
// ...
}
I can make a PR for this if that helps.
I made a PR #2976
Hopefully this change doesn't break anything - it shouldn't but I had troubles with development.
- It looks like the project follows the workspaces pattern, but there isn't a root
package.json
for linking the packages together. It's not clear how to install the dependencies for any one package. - Where is
@looker/babel-*
stuff and how do I resolve it when Inpm install
fromcomponents/packages/components-providers
?
Thanks ya'll.
This is being tracked internally with ticket 255844186
@taystack we are actively working on a change to address this in our internal code base. Once complete we'll release a fix. Thanks.
@taystack this issue is resolved in v4.1.1
.
@guyellis, @mdodgelooker I've verified this works on React18 without any typescript issues. 🌮 thanks for this!