Add a separator between each element.

npm install --save react-with-separator

const WithSeparator = require('react-with-separator') const React = require('react') const { render } = require('react-dom') const Footer = ({ username }) => ( <WithSeparator separator=' | '> (!username && ( <a href='/login'>Login</a> )) (username && ( <a href='/logout'>Logout</a> )) <a href='/help'>Help</a> </WithSeparator> ) render(<Footer username='linusu' />)

Will render something like this:

 Logout | Help 

• required
• type: ReactElement | string

The element or string to insert between each child element.

• optional
• type: boolean

Whether to insert a leading separator or not.

• optional
• type: boolean

Whether to insert a trailing separator or not.

• optional
• type: React.ReactNode

The children to insert separators between