feat: make typings for customInput generic #577
Merged
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Describe the issue/change
We are using react-number-format together with material-ui. In our case we want to use the custumInput "TextField" but pass the prop:
{ size: "small" }
.When we do this we get the error:
The problem here is, that
NumberFormatProps
are typed to always extendInputAttributes
. Where actually when we use a customInput there is no reason to passInputAttributes
. In that case we should be able to pass the props of the customInput.As far as I understand this is how the actual logic works.
Add CodeSandbox link to illustrate the issue (If applicable)
https://codesandbox.io/s/beautiful-tess-eb5r6?file=/src/App.tsx
Describe the changes proposed/implemented in this PR
I updated the typings of NumberFormatProps to be generic. Now instead of always extending from
InputAttributes
the Props-Type of the component passed as customInput are extracted and added to the typing. Typescript is actually smart enought to this automatically.I must say that I can not promise this does not introduce breaking changes for people that import and use the current typings. But in my opinion those generic typings are closer to how the component actually works.
Link Github issue if this PR solved an existing issue
#422
Example usage (If applicable)
See the updated typings/number_format.spec.tsx c9e0627#diff-9d8e8f0103177d8c0688a00a41889511f17c18bfa6150b4d4922aa40fc87825aR7