test-component.js

import React from 'react'
import PropTypes from 'prop-types'
import { createComponent } from 'react-fela'

const __DateContainer = () => ({
	'text-align': 'center',
	width: '70px',
	'line-height': '18px',
	'& ._month': {
		'font-size': '12px',
		'font-weight': 'bold',
		color: '#4CD9AA'
	},
	'& ._date': {
		'font-size': '18px',
		'font-weight': 'bold',
		color: '#333333'
	},
	'& ._day': {
		'font-size': '12px',
		'font-weight': '500',
		color: '#333333'
	}
})

const DateContainer = props => {
	return (
		<div>
			<div className="_month">
				{props.month}
			</div>
			<div className="_date">
				{props.date}
			</div>
			<div className="_day">
				{props.day}
			</div>
		</div>
	)
}
DateContainer.propTypes = {
	month: PropTypes.string,
	date: PropTypes.string,
	day: PropTypes.string
}

const StyledDateContainer = createComponent(__DateContainer, DateContainer)

export const Wrapper = () => {
	return (
		<div>
			<StyledDateContainer
				{...{
					month: 'JAN',
					date: '29',
					day: 'Tue'
				}}
			/>
		</div>
	)
}