Use native event handlers instead of React

React event handlers don’t work because of the shadow DOM

src/gutter-component.coffee

@@ -16,12 +16,12 @@ GutterComponent = React.createClass
   measuredWidth: null
 
   render: ->
-    {scrollHeight, scrollViewHeight, onMouseDown, backgroundColor, gutterBackgroundColor} = @props
+    {scrollHeight, scrollViewHeight, backgroundColor, gutterBackgroundColor} = @props
 
     if gutterBackgroundColor isnt 'rbga(0, 0, 0, 0)'
       backgroundColor = gutterBackgroundColor
 
-    div className: 'gutter', onClick: @onClick, onMouseDown: @onMouseDown,
+    div className: 'gutter',
       div className: 'line-numbers', ref: 'lineNumbers', style:
         height: Math.max(scrollHeight, scrollViewHeight)
         WebkitTransform: @getTransform()
@@ -45,6 +45,10 @@ GutterComponent = React.createClass
     @appendDummyLineNumber()
     @updateLineNumbers() if @props.performedInitialMeasurement
 
+    node = @getDOMNode()
+    node.addEventListener 'click', @onClick
+    node.addEventListener 'mousedown', @onMouseDown
+
   # Only update the gutter if the visible row range has changed or if a
   # non-zero-delta change to the screen lines has occurred within the current
   # visible row range.

src/scrollbar-component.coffee

@@ -23,7 +23,7 @@ ScrollbarComponent = React.createClass
         style.right = verticalScrollbarWidth if scrollableInOppositeDirection
         style.height = horizontalScrollbarHeight
 
-    div {className, style, @onScroll},
+    div {className, style},
       switch orientation
         when 'vertical'
           div className: 'scrollbar-content', style: {height: scrollHeight}
@@ -36,6 +36,8 @@ ScrollbarComponent = React.createClass
     unless orientation is 'vertical' or orientation is 'horizontal'
       throw new Error("Must specify an orientation property of 'vertical' or 'horizontal'")
 
+    @getDOMNode().addEventListener 'scroll', @onScroll
+
   shouldComponentUpdate: (newProps) ->
     return true if newProps.visible isnt @props.visible