message: clean up system-props
diff: import styled from 'react-emotion'
  -import * as system from 'styled-system'
  +import system from 'system-components'
  +import {default as defaultTheme} from './theme'
  -export {default as tag} from 'clean-tag'
  -export default from 'system-components/emotion'
  +export {system as default}
  export const COMMON = ['color', 'space']
  @@ -38,43 +38,26 @@ export const FLEX_CONTAINER = LAYOUT.concat(
  export const FLEX_ITEM = LAYOUT.concat('justifySelf', 'alignSelf')
  -export function getSystemProps(props) {
  - const unique = props.filter((p, i, a) => a.indexOf(p) === i)
  - return unique.map(prop => {
  - if (typeof system[prop] === 'function') {
  - return system[prop]
  - } else if (typeof prop === 'function') {
  - return prop
  - } else {
  - throw new Error(`Unknown system prop: "${prop}"`)
  - }
  - })
  -}
  -
  -export function composeSystemProps(props) {
  - const funcs = getSystemProps(props)
  - const composed = props => funcs.reduce((p, fn) => fn(p), props)
  - composed.propTypes = getPropTypes(funcs)
  - return composed
  -}
  +export function withSystemProps(Component, props = COMMON) {
  + const Wrapped = system({is: Component}, ...props)
  -export function getPropTypes(funcs) {
  - return funcs.reduce((types, func) => {
  - return Object.assign(types, func.propTypes)
  - }, {})
  -}
  + Object.assign(Wrapped.propTypes, Component.propTypes)
  -export function withSystemProps(Component, props) {
  - const funcs = getSystemProps(props)
  - const Wrapped = styled(Component)(...funcs)
  // Copy over non-system keys from components
  // eg. Tooltip.js => Tooltip.directions Tooltip.alignments
  for (const key of Object.keys(Component)) {
  + if (!Wrapped.hasOwnProperty(key)) {
  Wrapped[key] = Component[key]
  }
  - Wrapped.propTypes = {
  - ...getPropTypes(funcs),
  - ...Component.propTypes
  }
  - return Wrapped
  + return withDefaultTheme(Wrapped)
  +}
  +
  +export function withDefaultTheme(Component, theme = defaultTheme) {
  + if (Component.defaultProps) {
  + Component.defaultProps.theme = theme
  + } else {
  + Component.defaultProps = {theme}
  + }
  + return Component
  }
  