# All files / components/WidgetBox Body.js

100% Statements 10/10
100% Branches 0/0
100% Functions 1/1
100% Lines 10/10

    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
    47

    1x

    1x

    1x

    1x

    1x

    1x
    1x

    1x

    1x

    1x

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

    const StyledBodyContainer = styled.div`
      display: flex;
      flex: 1 1 auto; /* same as flex: 1 1 auto; */
      position: relative; /* need this to position inner content */
      overflow-y: auto;
    `;
    StyledBodyContainer.displayName = 'StyledBodyContainer';

    const StyledBodyContainerContent = styled.div`
      display: flex;
      flex: 1 1 auto; /* same as flex: 1 1 auto; */
      flex-direction: column;
    `;
    StyledBodyContainerContent.displayName = 'StyledBodyContainerContent';

    const WidgetBoxBody = (props) => {
      const {
        children, className,
      } = props;
      return (
        <StyledBodyContainer className={className}>
          <StyledBodyContainerContent>
            {children}
          </StyledBodyContainerContent>
        </StyledBodyContainer>
      );
    };

    WidgetBoxBody.propTypes = {
      children: PropTypes.node,
      className: PropTypes.string,
    };

    WidgetBoxBody.defaultProps = {
      className: 'WidgetBoxBody-Container',
    };

    WidgetBoxBody.displayName = 'WidgetBoxBody';

    export default WidgetBoxBody;