wix / react-native-ui-lib

UI Components Library for React Native

Home Page:https://wix.github.io/react-native-ui-lib/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

NumberInput doesn't support TextField props

adamzolyak opened this issue · comments

Description

For some reason, I can't add TextField props to NumberInput.

Example

Type '{ initialNumber: number; onChangeNumber: (value: NumberInputData) => void; placeholder: string; enableErrors: true; validate: string[]; validationMessage: string[]; showCharCounter: true; maxLength: number; }' is not assignable to type 'IntrinsicAttributes & _NumberInputProps & RefAttributes<TextFieldProps>'.
  Property 'placeholder' does not exist on type 'IntrinsicAttributes & _NumberInputProps & RefAttributes<TextFieldProps>'.ts(2322)

The docs indicate NumberInput should support TextField props.

I also see TextFieldProps defined in the type for NumberInput

const NumberInput: React.ForwardRefExoticComponent<_NumberInputProps & React.RefAttributes<TextFieldProps>>

So not sure why it's not working.

Perhaps related to #2515 RE #2515 (comment)?

Related to

  • Components
  • Demo
  • Docs
  • Typings

Steps to reproduce

Steps to reproduce the behavior:

  1. Add a NumberInput
  2. Try adding a placeholder prop
  3. Obseve the error (see above)

Expected behavior

  1. Add a NumberInput
  2. Try adding a placeholder prop without error
  3. Add additional TextFieldProps props

Actual behavior

See steps to reproduce.

More Info

Code snippet

 <NumberInput
          initialNumber={weightValue}
          onChangeNumber={(value) => {
                //TODO:
          }}
          placeholder={'weight value in LBS'}
/>

Environment

  • React Native version: 18.2.0
  • React Native UI Lib version: 7.16.0
  • VS Code Version: 1.85.1 (Universal)

Affected platforms

  • Android
  • iOS
  • Web

Hi @adamzolyak,

That was a bug in the docs (now fixed), NumberInput does not actually extend TextField but has a textFieldProps prop where you can send most of the relevant props (the ones you cannot send directly to NumberInput itself).