# All files / components/Table TableCell.js

14.29% Statements 1/7
100% Branches 0/0
0% Functions 0/5
14.29% Lines 1/7

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46

    5x

     import React from 'react';
    import PropTypes from 'prop-types';
    import styled from 'styled-components';

    const TD = styled.td`
      text-align: left;
      background: ${({ theme }) => theme.table.cellBG};
      border-right: 1px solid ${({ theme }) => theme.colors.border};
      margin: ${({ theme }) => theme.table.cellMargin};
      padding: ${({ theme }) => `${theme.padding.small} ${theme.padding.medium}`};
      white-space: nowrap;
      transition: 0.2s ease all;

      &:last-child {
        border-right: none;
      }
    `;

    export default class Cell extends React.Component {
      static propTypes = {
        /**
         * Contents of the table cell.
         */
        children: PropTypes.node,
        /**
         * Adds a class name to the element.
         */
        className: PropTypes.string,
        /**
         * Adds an id to the element.
         */
        id: PropTypes.string,
      };

      static defaultProps = {
        children: String.fromCharCode(160), // &nbsp;
        className: null,
        id: null,
      };

      render() {
        const { id, className, children } = this.props;
        return <TD id={id} className={className}>{children}</TD>;
      }
    }