diff --git a/src/checkbox/CheckBox.js b/src/checkbox/CheckBox.js index 38c2e4e986..49008efd33 100644 --- a/src/checkbox/CheckBox.js +++ b/src/checkbox/CheckBox.js @@ -53,7 +53,11 @@ const CheckBox = props => { {...attributes} onLongPress={onLongPress} onPress={onPress} - style={[styles.container, containerStyle && containerStyle]} + style={[ + styles.container, + title && styles.containerHasTitle, + containerStyle && containerStyle, + ]} > { center && { justifyContent: 'center' }, ]} > - {!iconRight && + {!iconRight && ( } + /> + )} {React.isValidElement(title) ? title - : - {checked ? checkedTitle || title : title} - } + : title && ( + + {checked ? checkedTitle || title : title} + + )} - {iconRight && + {iconRight && ( } + /> + )} ); @@ -140,11 +148,13 @@ const styles = StyleSheet.create({ margin: 5, marginLeft: 10, marginRight: 10, - backgroundColor: '#fafafa', - borderColor: '#ededed', - borderWidth: 1, padding: 10, + }, + containerHasTitle: { + borderWidth: 1, borderRadius: 3, + backgroundColor: '#fafafa', + borderColor: '#ededed', }, text: { marginLeft: 10, diff --git a/src/checkbox/__tests__/__snapshots__/CheckBox.js.snap b/src/checkbox/__tests__/__snapshots__/CheckBox.js.snap index 46c7901028..0bea78018f 100644 --- a/src/checkbox/__tests__/__snapshots__/CheckBox.js.snap +++ b/src/checkbox/__tests__/__snapshots__/CheckBox.js.snap @@ -7,15 +7,12 @@ exports[`CheckBox Component should render with icon and checked 1`] = ` style={ Array [ Object { - "backgroundColor": "#fafafa", - "borderColor": "#ededed", - "borderRadius": 3, - "borderWidth": 1, "margin": 5, "marginLeft": 10, "marginRight": 10, "padding": 10, }, + undefined, Object { "backgroundColor": "red", }, @@ -40,20 +37,6 @@ exports[`CheckBox Component should render with icon and checked 1`] = ` name="square-o" size={24} /> - `; @@ -66,16 +49,13 @@ exports[`CheckBox Component should render with icon and iconRight 1`] = ` style={ Array [ Object { - "backgroundColor": "#fafafa", - "borderColor": "#ededed", - "borderRadius": 3, - "borderWidth": 1, "margin": 5, "marginLeft": 10, "marginRight": 10, "padding": 10, }, undefined, + undefined, ] } > @@ -93,20 +73,6 @@ exports[`CheckBox Component should render with icon and iconRight 1`] = ` ] } > - @@ -155,20 +118,6 @@ exports[`CheckBox Component should render without issues 1`] = ` name="square-o" size={24} /> - `;