How to use the emotion/react.div function in emotion

/* eslint react/no-array-index-key: 0 */

import {css} from 'emotion';
import styled from 'emotion/react';
import React from 'react';
import PropTypes from 'prop-types';
import {connect} from 'react-redux';
import {onlyUpdateForKeys} from 'recompose';
import {bindActionCreators} from 'redux';

import actions from '../actions/sideBar';


const ButtonGroup = styled.div`
    display: flex;
    flex-direction: column;

    margin: 20px 0 20px 0;
    & button {
        margin: 5px;
        height: 42px;
        width: 42px;
    }
`;

const MenuButton = styled.button`
    border: none;
    background-color: inherit;
    color: #98999F;

import styled from 'emotion/react'
import { Link } from 'react-router-dom'

export const Body = styled.div`
  text-align: center;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
`

export const Title = styled.h1`
  font-family: sans-serif;
  font-weight: 100;
  margin: 30px 30px 20px 30px;
`

const Github = styled.span`
  vertical-align: middle;
  padding: 6px 10px;
  border: 1px solid rgb(213, 213, 213);
  font-size: 14px;
  font-weight: 400;

import styled from 'emotion/react';

const Cell = styled.div`
  grid-column-start: ${props => props.col};
  grid-column-end: ${props => props.col + 1};
  grid-row-start: ${props => props.row};
  grid-row-end: ${props => props.row + 1};
  overflow: hidden;
`;

export default Cell;