example_common.cljs

(ns example.common
  (:require
    [shadow.experiments.grove :as sg :refer (defc <<)]))

;; created once
(def foo
  (<< [:div "foo"]))

(defn nested [x]
  (<< [:div "nested: " x]))

(defn list-item [num]
  (<< [:div "list-item:" num]))

(defc list-item-component [num]
  ;; can have state via bind
  (render
    (<< [:div "list-item-component:" num])))

(defn example []
  (<< [:div "hello world"]

      ;; can use fragments multiple times if needed
      foo
      foo
      foo

      ;; just a nested functional fragment, no component
      ;; only need components when you need to manage state
      [:div.p-4
       (nested "foo")]

      ;; can pass fragments as args
      [:div.p-4
       (nested foo)]

      [:div.p-4
       (nested
         (<< [:div "inline arg"]))]

      ;; render clojure seqs via inline function
      (sg/simple-seq
        (range 5)
        (fn [num]
          (<< [:div "inline-item: " num])))

      ;; or function call
      (sg/simple-seq (range 5) list-item)

      ;; or component
      (sg/simple-seq (range 5) list-item-component)
      ))