react native reagent text input focus prop from state

react-native-reagent-focusable-input.cljs

(require '[reagent.core :as r :refer [atom]
         '[reagent.impl.util :as ru]])
         
(def view (r/adapt-react-class (.-View js/React)))
(def input (r/adapt-react-class (.-TextInput js/React)))
         
(defn focusable-input [init-attrs]
  (r/create-class
    {:display-name "focusable-input"
     :component-will-receive-props
       (fn [this new-argv]
         (let [ref-c (aget this "refs" (:ref init-attrs))
               focus (:focus (ru/extract-props new-argv))
               is-focused (.isFocused ref-c)]
           (if focus
             (when-not is-focused (.focus ref-c))
             (when is-focused (.blur ref-c)))))
     :reagent-render
       (fn [attrs]
         (let [init-focus (:focus init-attrs)
               auto-focus (or (:auto-focus attrs) init-focus)
               attrs (assoc attrs :auto-focus auto-focus)]
           [input attrs]))}))
         
;; Usage

(def my-state (atom {}))

(defn my-form []
  [view 
    [focusable-input {:ref "field1"
                      :return-key-type "next"
                      :auto-focus true
                      :focus #(= "field1" (:focused-field @my-state))
                      :on-focus #(swap! my-state assoc :focused-field "field1")
                      :on-submit-editing #(swap! my-state assoc :focused-field "field2")}]
    [focusable-input {:ref "field2"
                      :return-key-type "done"
                      :focus #(= "field2" (:focused-field @my-state))
                      :on-focus #(swap! my-state assoc :focused-field "field2")
                      :on-submit-editing #(swap! my-state assoc :focused-field nil)}]])
  

I tried running your code. Unfortunately ru/extract-props is undeclared in reagent 0.10.0.