     item.action?()
 
   render: ->
-    menuClass = if @state.showingMenu then 'menu-showing' else 'menu-hidden'
+    menuClass = "#{cfmMenuClass} #{if @state.showingMenu then 'menu-showing' else 'menu-hidden'}"
     select = (item) =>
       ( => @select(item))
     (div {className: 'menu'},
       if @props.items?.length > 0
         (div {},
-          (div {className: 'menu-anchor', onClick: => @select(null)},
+          (div {className: "#{cfmMenuClass} menu-anchor", onClick: => @select(null)},
             (svg {version: '1.1', width: 16, height: 16, viewBox: '0 0 16 16', enableBackground: 'new 0 0 16 16'},
               (g {},
                 (rect {y: 2, width: 16, height: 2})

        name
      )

DropDown = React.createClass

  displayName: 'Dropdown'


  componentWillMount: ->
    if window.addEventListener
      window.addEventListener 'mousedown', @checkClose, true
      window.addEventListener 'touchstart', @checkClose, true

  componentWillUnmount: ->
    if window.removeEventListener
      window.removeEventListener 'mousedown', @checkClose, true
      window.removeEventListener 'touchstart', @checkClose, true

  checkClose: (evt) ->
    # if the click is on the menu, let the menu handle it
    elt = evt.target
    while elt?
      return if typeof elt.className is "string" and elt.className.indexOf(cfmMenuClass) >= 0
      elt = elt.parentNode
    # otherwise, close the menu
    @setState {showingMenu: false, subMenu: false}

  setSubMenu: (subMenu) ->
    @setState subMenu: subMenu
