                    :component-did-mount (fn [this] (.resizable (js/$ (r/dom-node this))
                                                                (clj->js {:grid    25
                                                                          :handles "n, e, s, w, ne, se, sw, nw"})))}))
+
+(defn -autoscrollable-div
+  "Will scroll to bottom on any update."
+  [_attrs & _body]
+  (letfn [(scroll [this]
+            (set! (.-scrollTop (r/dom-node this))
+                  (.-scrollHeight (r/dom-node this))))]
+    (r/create-class {:reagent-render       (fn [attrs & body]
+                                             (into [:div attrs] body))
+                     :component-did-mount  scroll
+                     :component-did-update scroll})))
 
 (defn -overlay
   [& body]

                   [:initial-model :persist? :visible? :toggle-visibility-shortcut :signal-events :action-events]))

;;;;;;;;;;;;;;;;;;;;;;;; View
(def -menu-button-style {:font-size     "inherit"
                         :font-family   "inherit"
                         :font-weight   "bold"
                         :color         "white"
                         :cursor        "pointer"
                         :margin        "5px 3px"
                         :padding       4
                         :border-radius "3px"
                         :border        0
                         :background    "none"})


(defn -menu
  [persist? toggle-visibility-shortcut dispatch]
  [:div {:style {:text-align "center"}}
   [-menu-button {} "Clear" #(dispatch ::on-clear) "Clears debugger history"]
   [-menu-button {} "Vacuum" #(dispatch ::on-vacuum) "Removes disabled actions and signals with no actions from history"]
   [-menu-button {} "Reset" #(dispatch ::on-reset) "Removes all actions and signals resetting the model to initial state"]
