Reagent 0.5.1 contains a new convenient shortcut for nested elements, better error messages, new logic for maintaining cursor position in inputs, a new version of React, and some bug fixes and improvements.

New syntax for nested elements

The ”Hiccup syntax” used in Reagent now supports defining nested elements using ”>” as a separator in keywords. This is probably easier to show than to explain…

So, instead of doing this:

you can now do this:

with identical results, thus saving several square brackets from an untimely death.

Keeping position

Reagent now tries harder to maintain cursor position in text inputs, even when the value of the input is transformed in code.

Previously, the cursor would jump to the end of the text whenever you made a change in the middle of the text in something like this:

hide Example Value is: FOOBAR Source ( ns example.core ( :require [ reagent.core :as r ] ) ) ( def upper-value ( r/atom "FOOBAR" ) ) ( defn upper-input [ ] [ :div [ :p "Value is: " @upper-value ] [ :input { :type 'text :value @upper-value :on-change # ( reset! upper-value ( -> % .-target .-value string/upper-case ) ) } ] ] )

Other news