reactjs


DefinitelyTyped: Add new props typing for existing component


Is there any way to declare new typing for new props within DefinitelyTyped? I updated material-ui with some new props in SelectField component, but typings in DefinitelyTyped are old. Can I extend in some way SelectField typing and add new props types? Now I have:
<SelectField
multiple={true}
hintText="Select type"
value={[...this.state.values]}
onChange={this.onChange}
selectionRenderer={this.selectionRenderer}
>
And I need to add multiple?: boolean and selectionRenderer: (values: any[]) => string types. I tried to declare module 'material-ui/SelectField' {} but it not works. Any ideas?
You should be able to use module augmentation:
declare module "material-ui" {
interface SelectFieldProps {
multiple?: boolean;
selectionRenderer: (values: any[]) => string;
}
}
As you can see, the syntax is a bit sifferent than what you've tried.
Edit
If SelectFieldProps is defined in the __MaterialUI namespace, then this should work:
declare module "material-ui" {
namepsace __MaterialUI {
interface SelectFieldProps {
multiple?: boolean;
selectionRenderer: (values: any[]) => string;
}
}
}
Ok, I found solution, #Nitzan answer it's ok, but need some improvements. When I checked out node_modules/#types/material-ui/index.d.ts I found that interface SelectFieldProps is defined in namespace __MaterialUI so I have to write like this:
declare namespace __MaterialUI {
interface SelectFieldProps {
multiple?: boolean;
selectionRenderer?: (values: any[]) => string;
}
}
It works in ./src/typings/selectfield.d.ts and doesn't work if I declare it in the same file where I use <SelectField /> (probably because of .d.ts extension)

Related Links

connectiondefinitions resolvenode vs resolve in ObjectType
Firebase multi element removed
Separated Apps - but shared react-js-core
Routes on React, TypeError: Cannot read property 'getCurrentLocation' of undefined(…)
how do I style an Alert element in react-native?
react+redux reducer handling with null
Removing and putting new contents in a component of React JS
Subclassing react components, HOC or classic OO?
Nested Match routes with React Router v4 and MatchWithFade
In React with Redux, when should I save data to back end
Can shouldComponentUpdate returning false clobber a previous update where shouldComponentUpdate returns true?
Passing className prop to Material-ui child/inner elements
Code splitting using webpack for example https://github.com/erikras/react-redux-universal-hot-example
Reactjs calender picker
React with sort and filter
Reactjs not rendering to HTML in Ubuntu 14

Categories

HOME
joomla
postgresql
macros
botframework
cors
openacc
wifi
pandoc
css-selectors
rtc
theory
watson-dialog
android-notifications
opendaylight
responsive
openscad
reportlab
jquery-easyui
custom-component
gomobile
pumping-lemma
waterfall
datanucleus
inspec
resx
r-factor
mobile-development
circle
traitsui
bootcamp
gitosis
lfe
weld
qtwebkit
openidm
visio-2010
dynamic-linking
node-java
htop
fckeditor
nls
addressbook
copy-constructor
distcc
virtualenvwrapper
cosign-api
patching
3d-rendering
angular-promise
transport
xml-simple
p4python
teamwork
screen-lock
accpac
strcpy
shunting-yard
fiware-health
selenium-grid2
switchpreference
atg-dynamo
mvcgrid
connections
internet-radio
flask-mongoengine
logo-lang
mahara
mencoder
myrrix
static-class
ia-32
mandelbrot
usersettings
dynamic-expresso
kademlia
backbone-views
dd4t
google-checkout
quit
invalidoperationexception
netbiscuits
sqlbuddy
idtabs
project-files
backlight
response-time
mass-emails
numerical-computing
calendarextender
qlibrary
software-update

Resources

Encrypt Message