Skip to content

Commit 6267ed5

Browse files
[RaisedButton] Add a buttonStyle property
I think that we should aim for having a customizability point for every inner element. Closes #5182.
1 parent a4fe542 commit 6267ed5

2 files changed

Lines changed: 9 additions & 3 deletions

File tree

src/RaisedButton/RaisedButton.js

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -120,6 +120,10 @@ class RaisedButton extends Component {
120120
* (use `disabledBackgroundColor` for this).
121121
*/
122122
backgroundColor: PropTypes.string,
123+
/**
124+
* Override the inline-styles of the button element.
125+
*/
126+
buttonStyle: PropTypes.object,
123127
/**
124128
* The content of the button.
125129
* If a label is provided via the `label` prop, the text within the label
@@ -327,6 +331,7 @@ class RaisedButton extends Component {
327331
render() {
328332
const {
329333
backgroundColor, // eslint-disable-line no-unused-vars
334+
buttonStyle,
330335
children,
331336
className,
332337
disabled,
@@ -341,6 +346,7 @@ class RaisedButton extends Component {
341346
primary, // eslint-disable-line no-unused-vars
342347
rippleStyle,
343348
secondary, // eslint-disable-line no-unused-vars
349+
style,
344350
...other,
345351
} = this.props;
346352

@@ -386,15 +392,15 @@ class RaisedButton extends Component {
386392
return (
387393
<Paper
388394
className={className}
389-
style={Object.assign(styles.root, this.props.style)}
395+
style={Object.assign(styles.root, style)}
390396
zDepth={this.state.zDepth}
391397
>
392398
<EnhancedButton
393399
{...other}
394400
{...buttonEventHandlers}
395401
ref="container"
396402
disabled={disabled}
397-
style={styles.button}
403+
style={Object.assign(styles.button, buttonStyle)}
398404
focusRippleColor={mergedRippleStyles.color}
399405
touchRippleColor={mergedRippleStyles.color}
400406
focusRippleOpacity={mergedRippleStyles.opacity}

src/RaisedButton/RaisedButton.spec.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -147,7 +147,7 @@ describe('<RaisedButton />', () => {
147147
});
148148
});
149149

150-
describe('props: icon', () => {
150+
describe('prop: icon', () => {
151151
it('should keep the style set on the icon', () => {
152152
const wrapper = shallowWithContext(
153153
<RaisedButton icon={<ActionAndroid style={{foo: 'bar'}} />} />

0 commit comments

Comments
 (0)