From e811bb2f1246539a807561f1becbe8a0b2f4d761 Mon Sep 17 00:00:00 2001 From: Olivier Tassinari Date: Sat, 17 Sep 2016 17:01:38 +0200 Subject: [PATCH] [Snackbar] Add a contentStyle property Closes #3190. --- src/Snackbar/Snackbar.js | 14 ++++++++++---- src/Snackbar/Snackbar.spec.js | 17 ++++++++++++++++- src/Snackbar/SnackbarBody.js | 9 +++++++-- 3 files changed, 33 insertions(+), 7 deletions(-) diff --git a/src/Snackbar/Snackbar.js b/src/Snackbar/Snackbar.js index e19c67ca50b290..529f39da9c44bd 100644 --- a/src/Snackbar/Snackbar.js +++ b/src/Snackbar/Snackbar.js @@ -58,6 +58,10 @@ class Snackbar extends Component { * The css class name of the root element. */ className: PropTypes.string, + /** + * Override the inline-styles of the content element. + */ + contentStyle: PropTypes.object, /** * The message to be displayed. * @@ -196,11 +200,12 @@ class Snackbar extends Component { render() { const { autoHideDuration, // eslint-disable-line no-unused-vars + contentStyle, + bodyStyle, message: messageProp, // eslint-disable-line no-unused-vars onRequestClose, // eslint-disable-line no-unused-vars onActionTouchTap, style, - bodyStyle, ...other, } = this.props; @@ -217,11 +222,12 @@ class Snackbar extends Component {
diff --git a/src/Snackbar/Snackbar.spec.js b/src/Snackbar/Snackbar.spec.js index 4d3c2c4c26a32c..875d5d2d46e244 100644 --- a/src/Snackbar/Snackbar.spec.js +++ b/src/Snackbar/Snackbar.spec.js @@ -3,13 +3,14 @@ import React from 'react'; import {shallow} from 'enzyme'; import {assert} from 'chai'; import Snackbar from './Snackbar'; +import SnackbarBody from './SnackbarBody'; import getMuiTheme from '../styles/getMuiTheme'; describe('', () => { const muiTheme = getMuiTheme(); const shallowWithContext = (node) => shallow(node, {context: {muiTheme}}); - describe('props: open', () => { + describe('prop: open', () => { it('should be hidden when open is false', () => { const wrapper = shallowWithContext( @@ -74,4 +75,18 @@ describe('', () => { done(); }, 500); }); + + describe('prop: contentStyle', () => { + it('should apply the style on the right element', () => { + const contentStyle = {}; + const wrapper = shallowWithContext( + + ); + + assert.strictEqual( + wrapper.find(SnackbarBody).props().contentStyle, + contentStyle + ); + }); + }); }); diff --git a/src/Snackbar/SnackbarBody.js b/src/Snackbar/SnackbarBody.js index 592d87c02daed7..2ca137f311acad 100644 --- a/src/Snackbar/SnackbarBody.js +++ b/src/Snackbar/SnackbarBody.js @@ -64,9 +64,10 @@ function getStyles(props, context) { export const SnackbarBody = (props, context) => { const { - open, // eslint-disable-line no-unused-vars action, + contentStyle, message, + open, // eslint-disable-line no-unused-vars onActionTouchTap, style, ...other, @@ -85,7 +86,7 @@ export const SnackbarBody = (props, context) => { return (
-
+
{message} {actionButton}
@@ -98,6 +99,10 @@ SnackbarBody.propTypes = { * The label for the action on the snackbar. */ action: PropTypes.node, + /** + * Override the inline-styles of the content element. + */ + contentStyle: PropTypes.object, /** * The message to be displayed. *