Type issues with Expo 45 to 46 on react-native-svg

Expo SDK
1
  1. SDK Version: 45 to 46
  2. Platforms(Android/iOS/web/all): n/a just build

Not sure if anyone else had experienced this but after upgrading from Expo 45 to Expo 46 I got some type errors on the dynamically generated SVGs (i.e. not those from SVGR)

Chart.tsx:60:14 - error TS2322: Type '{ children: number; x: number; y: number; textAnchor: "end"; fill: string; fontSize: string; }' is not assignable to type 'IntrinsicAttributes & IntrinsicClassAttributes<Component<TextProps, any, any>> & Readonly<TextProps>'.
  Property 'children' does not exist on type 'IntrinsicAttributes & IntrinsicClassAttributes<Component<TextProps, any, any>> & Readonly<TextProps>'.

60             <Text x={x0 - 10} y={y + 5} textAnchor="end" fill="#000" fontSize="14">
                ~~~~

Chart.tsx:79:12 - error TS2322: Type '{ children: Element[]; key: number; }' is not assignable to type 'IntrinsicAttributes & IntrinsicClassAttributes<Component<GProps, any, any>> & Readonly<GProps>'.
  Property 'children' does not exist on type 'IntrinsicAttributes & IntrinsicClassAttributes<Component<GProps, any, any>> & Readonly<GProps>'.

79           <G key={index}>
              ~

Its sort of weird it no longer has children but I did do some quick trace on the types and I don’t see them either.

I confirmed that there’s only one @types/react-native and @types/react as well in yarn.lock


"@types/react-native@*", "@types/react-native@~0.69.1":
  version "0.69.5"
  resolved "https://registry.yarnpkg.com/@types/react-native/-/react-native-0.69.5.tgz#7709fdbff031a5ecf1956705e6c4a07cdfe6867c"
  integrity sha512-mSUCuGUsW2kJlZiu4GmdYVDKZX/52iyC9rm6dxAmflJj1b7kSO/CMSDy5WbcfS8QerxTqbYGTrIwHD0GnXHzbQ==
  dependencies:
    "@types/react" "*"

"@types/react@*", "@types/react@~18.0.0":
  version "18.0.17"
  resolved "https://registry.yarnpkg.com/@types/react/-/react-18.0.17.tgz#4583d9c322d67efe4b39a935d223edcc7050ccf4"
  integrity sha512-38ETy4tL+rn4uQQi7mB81G7V1g0u2ryquNmsVIOKUAEIDK+3CUjZ6rSRpdvS99dNBnkLFL83qfmtLacGOTIhwQ==
  dependencies:
    "@types/prop-types" "*"
    "@types/scheduler" "*"
    csstype "^3.0.2"

And one react-native-svg as well

react-native-svg@12.3.0:
  version "12.3.0"
  resolved "https://registry.yarnpkg.com/react-native-svg/-/react-native-svg-12.3.0.tgz#40f657c5d1ee366df23f3ec8dae76fd276b86248"
  integrity sha512-ESG1g1j7/WLD7X3XRFTQHVv0r6DpbHNNcdusngAODIxG88wpTWUZkhcM3A2HJTb+BbXTFDamHv7FwtRKWQ/ALg==
  dependencies:
    css-select "^4.2.1"
    css-tree "^1.0.0-alpha.39"
2

Hi @trajano

I know very little about TypeScript :-/

In case it helps at all, here’s what Matt Pocock’s error translator thinks of the errors

3

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.