import React, { PropTypes } from 'react'
import hoistStatics from 'hoist-non-react-statics'

function getDisplayName (comp) {
  return comp.displayName || comp.name || 'Component'
}

export default function stylable (name) {
  return function wrapWithComponent (WrappedComponent) {
    const stylableDisplayName = `Stylable(${getDisplayName(WrappedComponent)})`

    class Stylable extends React.Component {
      static displayName = stylableDisplayName
      static WrappedComponent = WrappedComponent
      static contextTypes = {
        styleSheet: PropTypes.object.isRequired,
        styleSheetContext: PropTypes.string
      }
      static childContextTypes = {
        styleSheetContext: PropTypes.string.isRequired
      }

      constructor (props, ctx) {
        super(props, ctx)
        this.styleSheet = ctx.styleSheet
        if (ctx.styleSheetContext === undefined) {
          this.path = name
        } else {
          this.path = ctx.styleSheetContext + ' ' + name
        }
      }

      getChildContext () {
        return {
          styleSheetContext: this.path
        }
      }

      render () {
        const props = this.styleSheet.getProps(this.path, this.props)
        return React.createElement(WrappedComponent, props)
      }
    }

    return hoistStatics(Stylable, WrappedComponent)
  }
}

@@ -86,16 +86,232 @@
 atics'%0A%0A
+import %7B Signal %7D from './mini-signals'%0A%0Aclass Path %7B%0A  constructor (name, parent) %7B%0A    this.name = name%0A    this.path = parent === undefined ? name : parent.path + ' ' + name%0A    this.changed = new Signal()%0A  %7D%0A%7D%0A%0A
 function
@@ -802,39 +802,36 @@
       styleSheet
-Context
+Path
 : PropTypes.stri
@@ -826,22 +826,22 @@
 opTypes.
-string
+object
 %0A      %7D
@@ -894,23 +894,20 @@
 yleSheet
-Context
+Path
 : PropTy
@@ -914,14 +914,14 @@
 pes.
-string
+object
 .isR
@@ -1049,161 +1049,54 @@
     
-if (ctx.styleSheetContext === undefined) %7B%0A          this.path = name%0A        %7D else %7B%0A          this.path = ctx.styleSheetContext + ' ' + name%0A        %7D
+this.path = new Path(name, ctx.styleSheetPath)
 %0A   
@@ -1165,23 +1165,20 @@
 yleSheet
-Context
+Path
 : this.p
@@ -1274,16 +1274,21 @@
 his.path
+.path
 , this.p

use path object