import React from 'react';
import styled from 'styled-components';
import { Flex } from '../../Flex';
import { Label } from './Label';
import { Value } from './Text';

const ItemComponent = (props: any) => (
  <Flex as="li" px="gridGap" py="s" {...props} />
);
const StyledItem = styled(ItemComponent)({});

export const Item = Object.assign(StyledItem, {
  Label,
  Value,
});
