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}
/>
-
`;