diff --git a/deps.edn b/deps.edn index bc55cf3..cb80741 100644 --- a/deps.edn +++ b/deps.edn @@ -12,5 +12,6 @@ reagent/reagent {:mvn/version "1.1.1"} cljsjs/react {:mvn/version "17.0.2-0"} cljsjs/react-dom {:mvn/version "17.0.2-0"} - rum/rum {:mvn/version "0.12.10"}} + rum/rum {:mvn/version "0.12.10"} + lilactown/helix {:mvn/version "0.1.9"}} :jvm-opts ["-XX:-OmitStackTraceInFastThrow"]}}} diff --git a/sample/src/portfolio/components/helix.cljs b/sample/src/portfolio/components/helix.cljs new file mode 100644 index 0000000..919af46 --- /dev/null +++ b/sample/src/portfolio/components/helix.cljs @@ -0,0 +1,15 @@ +(ns portfolio.components.helix + (:require [helix.core :refer [defnc $]] + [helix.hooks :as hooks] + [helix.dom :as d] + [portfolio.react :refer-macros [defscene]])) + +(defnc counter [] + (let [[count set-count] (hooks/use-state 0)] + (d/div + (d/p "Count: " count) + (d/button {:on-click #(set-count inc)} "Increase")))) + +(defscene helix-counter + :title "Counter with React Hooks" + ($ counter)) diff --git a/sample/src/portfolio/scenes.cljs b/sample/src/portfolio/scenes.cljs index 65b40a2..85a5f76 100644 --- a/sample/src/portfolio/scenes.cljs +++ b/sample/src/portfolio/scenes.cljs @@ -3,6 +3,7 @@ [portfolio.components.button] [portfolio.components.dom] [portfolio.components.heading] + [portfolio.components.helix] [portfolio.components.html] [portfolio.components.link] [portfolio.components.reagent] diff --git a/src/portfolio/react.clj b/src/portfolio/react.clj new file mode 100644 index 0000000..f39190e --- /dev/null +++ b/src/portfolio/react.clj @@ -0,0 +1,12 @@ +(ns portfolio.react + (:require [portfolio.scene :as scene])) + +(defmacro defscene [id & opts] + (when (scene/portfolio-active?) + `(portfolio.data/register-scene! + (portfolio.react/create-scene + ~(scene/get-options-map id (:line &env) opts))))) + +(defmacro defns [title & opts] + `(portfolio.data/register-namespace! + ~(scene/get-namespace-options title opts))) diff --git a/src/portfolio/react.cljs b/src/portfolio/react.cljs new file mode 100644 index 0000000..d85eea7 --- /dev/null +++ b/src/portfolio/react.cljs @@ -0,0 +1,15 @@ +(ns portfolio.react + (:require [portfolio.adapter :as adapter] + [portfolio.data :as data] + [react :as react] + [react-dom :as react-dom]) + (:require-macros [portfolio.react])) + +(def component-impl + {`adapter/render-component + (fn [{:keys [component]} el] + (assert (some? el) "Asked to render component into null container.") + (react-dom/render component el))}) + +(defn create-scene [scene] + (adapter/prepare-scene scene component-impl))