How to use the material-ui.withStyles function in material-ui

To help you get started, we’ve selected a few material-ui examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github neo-one-suite / neo-one / packages / neo-one-simulation-ico / template / src / tour / Tour.js View on Github external
classes: Object,
|};
type Props = {|
  ...ExternalProps,
  ...InternalProps,
|};
function Tour({
  className,
  // eslint-disable-next-line
  classes,
}: Props): React.Element<*> {
  return <div>;
}

const enhance: HOC&lt;*, *&gt; = compose(
  withStyles(styles),
  pure,
);

export default (enhance(Tour): React.ComponentType);
</div>
github neo-one-suite / neo-one / packages / neo-one-simulation-ico / template / src / ico / ICO.js View on Github external
classes: Object,
|};
type Props = {|
  ...ExternalProps,
  ...InternalProps,
|};
function ICO({
  className,
  // eslint-disable-next-line
  classes,
}: Props): React.Element&lt;*&gt; {
  return <div>;
}

const enhance: HOC&lt;*, *&gt; = compose(
  withStyles(styles),
  pure,
);

export default (enhance(ICO): React.ComponentType);
</div>
github shanmugharajk / react-point-of-sale / src / utils / index.js View on Github external
const { classes, className, ...other } = props;
    return (
      
    );
  }
  StyledComponent.propTypes = {
    // eslint-disable-next-line react/forbid-prop-types
    classes: PropTypes.object.isRequired,
    // eslint-disable-next-line react/require-default-props
    className: PropTypes.string
  };
  const styles =
    typeof style === "function"
      ? theme =&gt; ({ root: style(theme) })
      : { root: style };
  return withStyles(styles, options)(StyledComponent);
};
github mui-org / material-ui-pickers / docs / src / Demo / Examples / CustomElements.jsx View on Github external
background: theme.palette.primary.main,
    color: theme.palette.common.white,
  },
  firstHighlight: {
    extend: 'highlight',
    borderTopLeftRadius: '50%',
    borderBottomLeftRadius: '50%',
  },
  endHighlight: {
    extend: 'highlight',
    borderTopRightRadius: '50%',
    borderBottomRightRadius: '50%',
  },
});

export default withStyles(styles)(CustomElements);
github mui-org / material-ui-pickers / lib / src / _shared / ModalDialog.jsx View on Github external
children: PropTypes.node.isRequired,
  onAccept: PropTypes.func.isRequired,
  onDismiss: PropTypes.func.isRequired,
  classes: PropTypes.object.isRequired,
  dialogContentClassName: PropTypes.string,
  okLabel: PropTypes.string,
  cancelLabel: PropTypes.string,
};

ModalDialog.defaultProps = {
  dialogContentClassName: '',
  okLabel: 'OK',
  cancelLabel: 'Cancel',
};

export default withStyles(styles, { name: 'MuiPickersModal' })(ModalDialog);
github kangarang / tcr-ui / src / views / containers / Transactions / CommitVote.js View on Github external
)
  }
}
const FlexContainer = styled.div`
  display: flex;
`
const IconWrapper = styled.div`
  display: flex;
  height: 80px;
  width: 80px;
  margin: 10px;
`

export default withStyles(styles)(CommitVote)
github nick121212 / fx-schema-form / packages / fx-schema-form-material / src / sf / widgets / autocomplete.tsx View on Github external
<input>
                        search
                    
                }
                value={calcProps.value}
                inputComponent={SelectWrapped}
                inputProps={calcProps}
            /&gt;
        );
    }
}

export default {
    [widgetKey]: withStyles(styles)(Widget as any) as any
};
github linzeqipku / SnowGraph / web / src / components / CodeModal.js View on Github external
return (
            <span>
                <button color="{this.props.contrast">
                    {this.props.label}
                </button>
                <dialog open="{this.state.open}">
                    <pre>                </pre></dialog>
            </span>
        );
    }
}

export default withStyles(styles)(CodeModal);
github oliveirasWell / react-firebase-step-by-step / src / components / App / TopBar.js View on Github external
const mapStateToProps = state => {
    return {userAuth: state.userAuth}
};

const mapDispatchToProps = dispatch => {
    return {
        logout: () => dispatch(logout()),
    }
};

TopBar.propTypes = {
    classes: PropTypes.object.isRequired,
};

export default compose(
    withStyles(styles),
    withRouter,
    connect(mapStateToProps, mapDispatchToProps)
)(TopBar);
github alibaba / beidou / examples / material-ui-admin / client / src / views / Typography / Typography.jsx View on Github external
<div>
            <div>Small Tag</div>
            <h2>
              Header with small subtitle
              <br>
              <small>Use "Small" tag for the headers</small>
            </h2>
          </div>
        
      }
    /&gt;
  );
}

export default withStyles(style)(TypographyPage);

material-ui

React Components that Implement Google's Material Design.

MIT
Latest version published 6 years ago

Package Health Score

61 / 100
Full package analysis

Popular material-ui functions