refactor(props): moved props config to config dir

src/components/Box/index.js

@@ -1,8 +1,7 @@
 import styled from 'vue-styled-components'
 import pickBy from 'lodash-es/pickBy'
 import { background, border, color, borderRadius, flexbox, grid, layout, position, shadow, space, typography, compose } from 'styled-system'
-import allProps from './props'
-import styledConfig from './config'
+import { baseProps, propsConfig } from '../../lib/config/props'
 
 const baseEllipsis = {
   overflow: 'hidden',
@@ -49,7 +48,7 @@ const system = compose(
   shadow,
   typography,
   flexbox,
-  styledConfig,
+  propsConfig,
   truncate,
   clamp
 )
@@ -72,7 +71,7 @@ function cleanProps (props) {
  * TODO: Will need to revisit this for Image component.
  */
 const Box = styled('div', {
-  ...allProps
+  ...baseProps
 })`
   ${props => {
     const sanitizedProps = cleanProps(props)

src/lib/config/props/index.js

@@ -0,0 +1,2 @@
+export { default as baseProps } from './props'
+export { default as propsConfig } from './props.config'

src/components/Box/props.js → src/lib/config/props/props.js

@@ -1,39 +1,4 @@
-export const baseBoxProps = {
-  color: String,
-  w: [Number, String, Array],
-  minW: [String, Array],
-  maxW: [String, Array],
-  h: [Number, String, Array],
-  minH: [String, Array],
-  maxH: [String, Array],
-  d: [String, Array],
-  lineClamp: [String, Number, Array],
-  truncate: [Boolean, Number],
-  px: [Number, String, Array],
-  py: [Number, String, Array],
-  m: [Number, String, Array],
-  mt: [Number, String, Array],
-  mr: [Number, String, Array],
-  ml: [Number, String, Array],
-  mb: [Number, String, Array],
-  mx: [Number, String, Array],
-  my: [Number, String, Array],
-  rounded: [String, Array],
-  roundedTop: [String, Array],
-  roundedBottom: [String, Array],
-  roundedLeft: [String, Array],
-  roundedRight: [String, Array],
-  roundedTopRight: [String, Array],
-  roundedTopLeft: [String, Array],
-  roundedBottomRight: [String, Array],
-  roundedBottomLeft: [String, Array],
-  shadow: [Number, String, Array],
-  backgroundColor: String,
-  pos: [String, Array],
-  borderWidth: [String, Array]
-}
-
-const allProps = {
+const baseProps = {
   color: String,
   bg: String,
   w: [Number, String, Array],
@@ -123,4 +88,4 @@ const allProps = {
   willChange: [String, Array]
 }
 
-export default allProps
+export default baseProps