A ClojureScript Material-UI wrapper.
Material-UI v3.2.0
[id.nadiar/cljs-mui "0.1.0-alpha4"]
id.nadiar/cljs-mui {:mvn/version "0.1.0-alpha4"}
In progress library. Pull request are welcomed.
(:require [id.nadiar.cljs-mui.core :as mui]
[id.nadiar.cljs-mui.icons :as icon]
[id.nadiar.cljs-mui.style :refer [theme] :as style]
[goog.object :as gobj])
Reagent example
(def custom-style
{:button {:margin (gobj/getValueByKeys theme "spacing" "unit")}
:textField {:marginLeft (gobj/getValueByKeys theme "spacing" "unit")
:marginRight (gobj/getValueByKeys theme "spacing" "unit")}})
(def with-my-styles (style/with-styles custom-styles))
(defn my-button [{:keys [classes] :as props}]
[mui/Button {:variant "contained"
:color "primary"
:className (.-button classes)}
"Hello World!"
[icon/ZoomOut]])
(defn hello-world []
[:div
[:> (with-my-styles (reagent.core/reactify-component my-button))]])
Fulcro example
(fulcro.client.primitives/defsc MyButton
[this props]
{}
(mui/Button {:variant "contained"
:color "primary"
:className (style/class-name this :button)}
"Hello World!"
(icon/ZoomOut)))
(def my-button (fulcro.client.primitives/factory
((style/with-style {:button {:margin (gobj/getValueByKeys theme "spacing" "unit")}
:textField {:marginLeft (gobj/getValueByKeys theme "spacing" "unit")
:marginRight (gobj/getValueByKeys theme "spacing" "unit")}})
MyButton)))
Fulcro example, thanks to Souenzzo
Copyright © 2018
Distributed under the Eclipse Public License v1.0.
Can you improve this documentation?Edit on GitHub
cljdoc is a website building & hosting documentation for Clojure/Script libraries
× close