message: dry up constants.js
diff: @@ -4,68 +4,6 @@ import theme from './theme'
  export const get = key => themeGet(key, getKey(theme, key))
  -export const COMMON = compose(
  - styles.color,
  - styles.space
  -)
  -
  -export const BORDER = compose(
  - styles.borders,
  - styles.borderColor,
  - styles.boxShadow,
  - styles.borderRadius
  -)
  -
  -export const TYPOGRAPHY = compose(
  - styles.fontFamily,
  - styles.fontSize,
  - styles.fontStyle,
  - styles.fontWeight,
  - styles.lineHeight,
  - styles.textAlign
  -)
  -
  -export const LAYOUT = compose(
  - styles.display,
  - styles.size,
  - styles.width,
  - styles.height,
  - styles.minWidth,
  - styles.minHeight,
  - styles.maxWidth,
  - styles.maxHeight,
  - styles.overflow,
  - styles.verticalAlign
  -)
  -
  -export const POSITION = compose(
  - styles.position,
  - styles.zIndex,
  - styles.top,
  - styles.right,
  - styles.bottom,
  - styles.left
  -)
  -
  -export const FLEX_CONTAINER = compose(
  - styles.flexBasis,
  - styles.flexDirection,
  - styles.flexWrap,
  - styles.alignContent,
  - styles.alignItems,
  - styles.justifyContent,
  - styles.justifyItems,
  - styles.order
  -)
  -
  -export const FLEX_ITEM = compose(
  - styles.flex,
  - styles.justifySelf,
  - styles.alignSelf
  -)
  -
  -// These lists are just used to generate docs
  -
  export const COMMON_LIST = ['color', 'space']
  export const BORDER_LIST = ['borders', 'borderColor', 'boxShadow', 'borderRadius']
  @@ -123,4 +61,16 @@ export const FLEX_ITEM_LIST = [
  'alignSelf'
  ]
  +export const COMMON = composeList(COMMON_LIST)
  +export const BORDER = composeList(BORDER_LIST)
  +export const TYPOGRAPHY = composeList(TYPOGRAPHY_LIST)
  +export const LAYOUT = composeList(LAYOUT_LIST)
  +export const POSITION = composeList(POSITION_LIST)
  +export const FLEX_CONTAINER = composeList(FLEX_CONTAINER_LIST)
  +export const FLEX_ITEM = composeList(FLEX_ITEM_LIST)
  +
  +function composeList(list) {
  + return compose(...list.map(name => styles[name]))
  +}
  +
  export const Base = ({is: Tag = 'div', theme, ...rest}) => <Tag {...rest} />
  