Custom MaterialDesign inspired login button used in one app

LoginButton.js

@Styles({
	root: {
		flexDirection: 'row',
		alignItems: 'center',
		justifyContent: 'center',
		borderRadius: 2,
		height: 48,
	},
	enabled: {
		backgroundColor: colors.grey600,
	},
	disabled: {
		backgroundColor: shades.dark.dividers,
	},
	text: {
		...typo.button,
		textAlign: 'center',
		lineHeight: 20,
	},
})
class LoginButton extends PureComponent {
	render() {
		const {styles} = this;
		const {
			disabled,
			text,
			onPress,
			onLongPress,
			onAccessibilityTap,
			onMagicTap,
			style,
		} = this.props;

		return (
			<RectRipple
				pointerEvents='box-only'
				accessibilityComponentType='button'
				accessibilityTraits={disabled ? 'disabled' : 'button'}
				accessibilityLabel={text}
				{...(disabled ? {} : {onPress, onLongPress, onAccessibilityTap, onMagicTap})}
				dark
				style={[
					style,
					styles.root,
					disabled ? styles.disabled : styles.enabled
				]}>
				<MaterialText
					suppressHighlighting
					numberOfLines={1}
					light
					style={styles.text}>
					{text}
				</MaterialText>
			</RectRipple>
		);
	}
}