      {:face/color-fg [:color/id :color/rgb]}])
 
   Object
+  (componentDidUpdate [this prev-props prev-state]
+    (when (om/get-state this :needs-focus)
+      (let [node (dom/node this "editField")
+            len  (.. node -value -length)]
+        (.focus node)
+        (.setSelectionRange node len len))
+      (om/update-state! this assoc :needs-focus nil)))
+
   (render [this]
-    (let [{id           :face/id
-           name         :face/name
-           name-temp    :face/name-temp
-           bold         :face/bold
-           italic       :face/italic
-           color-bg     :face/color-bg
-           color-fg     :face/color-fg
-           underline    :face/underline
-           editor       :face/editor}   (om/props this)
+    (let [{id        :face/id
+           name      :face/name
+           name-temp :face/name-temp
+           bold      :face/bold
+           italic    :face/italic
+           color-bg  :face/color-bg
+           color-fg  :face/color-fg
+           underline :face/underline
+           editor    :face/editor}   (om/props this)
 
           colors-by-id (:colors/by-id (om/get-computed this))
           colors-list  (vals colors-by-id)


        ;; BOLD
        (dom/td nil
          (dom/input #js {:type "checkbox"
                          :onClick #(face-update this {:face/name name :face/bold (util/target-checked %)})}))
        ;; ITALIC
        (dom/td nil
          (dom/input #js {:type "checkbox"
                          :onClick #(face-update this {:face/name name :face/italic (util/target-checked %)})}))
        ;; UNDERLINE
        (dom/td nil
          (dom/input #js {:type "checkbox"
                          :onClick #(face-update this {:face/name name :face/underline (util/target-checked %)})}))

        (dom/td nil
          (apply dom/select #js {:onChange #(face-update this {:face/name   name

(defn face-update [comp props]
  (om/transact! comp `[(user-face/update ~props)]))

(defn face-edit-name [comp face-name new-name needs-focus]
  (om/transact! comp `[(user-face/update
                         {:face/name      ~face-name
                          :face/name-temp ~new-name})])
  (when needs-focus
    (om/update-state! comp assoc :needs-focus true)))

(defn face-add [comp]
  (let [{user-faces :user-faces/list} (om/props comp)
