24ark / react-native-step-indicator

A simple react-native implementation of step indicator widget compatible with the ViewPager and ListView.
Apache License 2.0
1.43k stars 312 forks source link

Typescript usage error #55

Closed dengue8830 closed 5 years ago

dengue8830 commented 5 years ago

Problem

I'm trying to use steps in the simplest way and typescript complains but when i run the app it works fine

import StepIndicator from 'react-native-step-indicator';

render() {
  return (<StepIndicator currentPosition={0} labels={steps} />); // error shown here
}

Error

[ts]
JSX element type 'StepIndicator' is not a constructor function for JSX elements.
  Types of property 'state' are incompatible.
    Type 'null' is not assignable to type 'Readonly<{}>'. [2605]

package.json

dependencies

"react": "16.6.1",
"react-native": "0.57.5",
"react-native-step-indicator": "0.0.9",

dev dependencies

"@types/node": "^10.12.9",
"@types/react": "16.7.6",
"@types/react-native": "0.57.11",
"typescript": "3.1.6"

Other info

vscode: v1.29.1 os: linux hint: when i use const x = new StepIndicator({ labels: pasos, currentPosition: 0 }); it doesn't show errors and i can see the props suggestions

bntzio commented 5 years ago

+1

Drakoun commented 5 years ago

https://github.com/24ark/react-native-step-indicator/blob/a8b5aa41d56d5c4795a8edccc694959ed1c4ab90/index.d.ts#L253 Changing null to {} solve it. Source : https://stackoverflow.com/a/45026683 Pull request https://github.com/24ark/react-native-step-indicator/pull/36

24ark commented 5 years ago

version 0.0.10 fixes this issue