feat(InlineList): Support additional styleProps

Style props for positioning, text styling, and sizing
are now support by the InlineList component

src/InlineList/README.mdx

@@ -14,6 +14,8 @@ import InlineList from './';
 
 Lay out children horizontally with optional spacing or separators.
 
+Supports styleProps `position`, `text`, and `size`.
+
 <Playground>
 	<InlineList spacing="s">
 		<Icon name="asset-image" />
@@ -22,10 +24,10 @@ Lay out children horizontally with optional spacing or separators.
 	</InlineList>
 
     <InlineList splitBy="comma">
-    	<span>Milk</span>
-    	<span>Flour</span>
-    	<span>Sugar</span>
-    	<span>Eggs</span>
+    	<>Milk</>
+    	<>Flour</>
+    	<>Sugar</>
+    	<>Eggs</>
     </InlineList>
 
     <InlineList splitBy="dot">

src/InlineList/index.js

@@ -4,6 +4,8 @@ import styled, {css} from 'styled-components';
 
 import {getSpacing} from '../utils';
 
+import {positionProps, sizeProps, textProps} from '../styleProps';
+
 const Item = styled.li`
 	display: ${p => p.display || 'inline-block'};
 	max-width: 100%;
@@ -15,6 +17,7 @@ Item.propTypes = {
 const getSpacingFromTheme = p => getSpacing(p.spacing, p.theme);
 
 const Wrapper = styled.ul`
+	${positionProps}
 	list-style: none;
 	margin: 0;
     padding: 0;
@@ -27,6 +30,9 @@ const Wrapper = styled.ul`
 			margin-bottom: -${getSpacingFromTheme};
 		`}
 
+	${sizeProps}
+	${textProps}
+
 	& > ${Item} {
 		vertical-align: ${p => p.align || 'top'};
 
@@ -72,6 +78,10 @@ const InlineList = ({as, itemAs, children, display, ...otherProps}) => {
 		</Wrapper>
 	);
 };
+InlineList.defaultProps = {
+	as: 'ul',
+	itemAs: 'li',
+};
 InlineList.propTypes = {
 	/**
 	 * Vertical alignment of list items