material-ui

I'm stuck on exporting material-ui styles with redux connector. Here is my code: import React, { Component } from 'react'; import { connect } from 'react-redux'; import Drawer from 'material-ui/Drawer'; import { withStyles } from 'material-ui/styles'; import PropTypes from 'prop-types'; const mapStateToProps = state => ({}); const reduxConnector = connect(mapStateToProps, null); const styles = theme => { console.log(theme); return ({ paper: { top: '80px', boxShadow: theme.shadows[9] }, }); }; class Cart extends Component { render() { const { classes } = this.props; return ( <Drawer open docked

I'm struggling to add <Link/> component to my material-ui AppBar This is my navigation class: class Navigation extends Component { constructor(props) { super(props) } render() { var styles = { appBar: { flexWrap: 'wrap' }, tabs: { width: '100%' } } return ( <AppBar showMenuIconButton={false} style={styles.appBar}> <Tabs style={styles.tabs}> <Tab label='Most popular ideas'/> <Tab label='Latest ideas' /> <Tab label='My ideas' /> </Tabs> </AppBar> ) } } Which looks okay: Tabs are clickable, have fluid animations, that's cool. But how do I wire them up together with react-router and its' <Link/>

I wrote some code: function renderGreeting(Elem: React.Component<any, any>) { return <span>Hello, <Elem />!</span>; } I'm getting an error: JSX element type Elem does not have any construct or call signatures What does it mean? This is a confusion between constructors and instances . Remember that when you write a component in React: class Greeter extends React.Component<any, any> { render() { return <div>Hello, {this.props.whoToGreet}</div>; } } You use it this way: return <Greeter whoToGreet='world' />; You don't use it this way: let Greet = new Greeter(); return <Greet whoToGreet='world' />

I build a prototype using chips material-UI. When I click the Test IPA the textbox should show immediately below the text Test IPA. In the prototype, it shows immediately below but whereas when I include with other functionalities, it's showing at the bottom. I debugged the CSS, its due to position absolute for each scenario it's showing different values and its coming from material UI. Can you tell me how to fix it with respect to other components? Providing my code snippet, sandbox and bug screenshot below. Problem with other components https://codesandbox.io/s/qqqk23x3q Working properly