# OBSOLETE: Use FloatingToolbar instead.
# However, We may decide to change back to a static toolbar in the footer,
# so don't delete me yet.


# React = require 'react'
#
# module.exports =
# ContenteditableToolbar = React.createClass
#   render: ->
#     style =
#       display: @state.show and 'initial' or 'none'
#     <div className="compose-toolbar-wrap" onBlur={@onBlur}>
#       <button className="btn btn-icon btn-formatting"
#         onClick={=> @setState { show: !@state.show }}
#       ><i className="fa fa-font"></i></button>
#       <div ref="toolbar" className="compose-toolbar" style={style}>
#         <button className="btn btn-bold" onClick={@onClick} data-command-name="bold"><strong>B</strong></button>
#         <button className="btn btn-italic" onClick={@onClick} data-command-name="italic"><em>I</em></button>
#         <button className="btn btn-underline" onClick={@onClick} data-command-name="underline"><span style={'textDecoration': 'underline'}>U</span></button>
#       </div>
#     </div>
#
#   getInitialState: ->
#     show: false
#
#   componentDidUpdate: (lastProps, lastState) ->
#     if !lastState.show and @state.show
#       @refs.toolbar.getDOMNode().focus()
#
#   onClick: (event) ->
#     cmd = event.currentTarget.getAttribute 'data-command-name'
#     document.execCommand(cmd, false, null)
#     true
#
#   onBlur: (event) ->
#     target = event.nativeEvent.relatedTarget
#     if target? and target.getAttribute 'data-command-name'
#       return
#     @setState
#       show: false