From ca53e73eeb2bc20dd9859fe1faabac5b4fb35504 Mon Sep 17 00:00:00 2001
From: Javi Jimenez Villar <javi.jimenez.villar@gmail.com>
Date: Wed, 29 Jul 2015 10:30:07 +0700
Subject: [PATCH] list

---
 components/list/index.cjsx | 12 ++++++++----
 components/list/style.styl | 11 +++++------
 2 files changed, 13 insertions(+), 10 deletions(-)

diff --git a/components/list/index.cjsx b/components/list/index.cjsx
index 70badf9b..0566f07e 100644
--- a/components/list/index.cjsx
+++ b/components/list/index.cjsx
@@ -1,4 +1,4 @@
-require './style'
+localCSS = require './style'
 
 module.exports = React.createClass
 
@@ -11,9 +11,10 @@ module.exports = React.createClass
     type        : React.PropTypes.string
 
   getDefaultProps: ->
-    attributes  : ""
+    attributes  : ''
+    className   : ''
     dataSource  : []
-    type        : "default"
+    type        : 'default'
 
   # -- Events
   onClick: (event, item) ->
@@ -21,7 +22,10 @@ module.exports = React.createClass
 
   # -- Render
   render: ->
-    <ul data-component-list={@props.type}>
+    className  = "#{localCSS.root} #{@props.className}"
+    className += " #{@props.type}"  if @props.type
+
+    <ul data-react-toolbox='list' className={className}>
     {
       for item, index in @props.dataSource
         <li key={index} onClick={@onClick.bind null, item}>
diff --git a/components/list/style.styl b/components/list/style.styl
index 715d9ae7..f879d94a 100644
--- a/components/list/style.styl
+++ b/components/list/style.styl
@@ -1,6 +1,6 @@
-@import "../constants.styl"
+@import '../constants'
 
-[data-component-list]
+:local(.root)
   list-style                      : none
   &, a
     color                         : TEXT
@@ -8,9 +8,8 @@
     overflow                      : hidden
     background-color              : WHITE
     box-shadow                    : ZDEPTH_SHADOW_1
-    transition-property             box-shadow
-    transition-duration             ANIMATION_DURATION
-    transition-timing-function      ANIMATION_EASE
-    // -- Classes
+    transition-property           : box-shadow
+    transition-duration           : ANIMATION_DURATION
+    transition-timing-function    : ANIMATION_EASE
     &:hover
       box-shadow                  : ZDEPTH_SHADOW_2