Calendar.defaultProps

Calendar.defaultProps.js

Calendar.defaultProps = {
  Wrapper: styled.div`
    display: flex;
    flex-direction: row;
  `,
  Column: styled.div`
    display: flex;
    flex-direction: column;
    margin: 0.5rem;
  `,
  Box: styled.div`
    display: flex;
    flex-direction: row;
  `,
  Item: styled.div`
    width: 100%;
  `,
  headers: ["Monday", "Tuesday", "Wednesday", "Thursday", "Friday"],
  children: ({ Wrapper, Column, Box, Item, headers }) => (
    <Wrapper>
      {headers.map((header, index) => (
        <Column>
          {header}
          <Box>
            <Item>Item</Item>
            <Item>Item</Item>
            <Item>Item</Item>
          </Box>

          <Box>
            <Item>Item</Item>
            <Item>Item</Item>
            <Item>Item</Item>
          </Box>
        </Column>
      ))}
    </Wrapper>
  )
};