diff --git a/src/main/om/dom.cljc b/src/main/om/dom.cljc index 56619c18..dc25bdf3 100644 --- a/src/main/om/dom.cljc +++ b/src/main/om/dom.cljc @@ -633,3 +633,16 @@ :attrs (dissoc opts :ref :key) :react-key (:key opts) :children children})))) + +#?(:clj + (defn- is-element? + [e] + (or + (satisfies? p/IReactComponent e) + (satisfies? p/IReactDOMElement e)))) + +#?(:clj + (defn <> + [& args] + (let [children (if (is-element? (first args)) args (rest args))] + (vec children)))) diff --git a/src/main/om/dom.cljs b/src/main/om/dom.cljs index 9de949d0..cfbd8d62 100644 --- a/src/main/om/dom.cljs +++ b/src/main/om/dom.cljs @@ -95,3 +95,10 @@ (js/React.createElement tag opts)) ([tag opts & children] (js/React.createElement tag opts children))) + +(defn <> + "Create a `React.Fragment` with either child or children using `React.createElement`" + ([opts child] + (<> opts child nil)) + ([opts child & more] + (apply js/React.createElement js/React.Fragment opts child more))) diff --git a/src/test/om/dom_test.clj b/src/test/om/dom_test.clj index 214bdd75..d8fb9834 100644 --- a/src/test/om/dom_test.clj +++ b/src/test/om/dom_test.clj @@ -506,6 +506,14 @@ ")))) +(deftest render-react-fragment + (is (= (str (#'dom/render-to-str* + (dom/div #js {} + (dom/<> #js {} + (dom/input #js {:value "foo" :id "bar" :type "text"}) + (dom/input #js {:value "foo" :id "bar" :type "text"}))))) + "
"))) + (deftest render-wrapped-attrs (is (= (str (#'dom/render-to-str* (dom/input #js {:value "foo" :id "bar" :type "text"}))) ""))