Skip to content

Instantly share code, notes, and snippets.

@taylorSando
Last active November 18, 2016 11:06
Show Gist options
  • Save taylorSando/f6edfd51b16ec26e13a1 to your computer and use it in GitHub Desktop.
Save taylorSando/f6edfd51b16ec26e13a1 to your computer and use it in GitHub Desktop.
How to use material ui with om
(ns om-material-ui.core
(:require [clojure.string :as str]
[om-tools.dom :as omt]))
(defn kebab-case
"Converts CamelCase / camelCase to kebab-case"
[s]
(str/join "-" (map str/lower-case (re-seq #"\w[a-z]+" s))))
(def material-tags
'[AppBar
AppCanvas
Circle
Checkbox
DialogWindow
Dialog
DropDownIcon
DropDownMenu
EnhancedButton
FlatButton
FloatingActionButton
FocusRipple
IconButton
Icon
InkBar
Input
LeftNav
MenuItem
Menu
Overlay
Paper
RadioButton
RaisedButton
Slider
SlideIn
Snackbar
Tab
TabTemplate
Tabs
TableHeader
TableRowsItem
TableRows
Toggle
ToolbarGroup
Toolbar
Tooltip
TouchRipple])
#+clj
(defn ^:private gen-bootstrap-inline-fn [tag]
`(defmacro ~(symbol (kebab-case (str tag)))
[opts# & children#]
(let [ctor# '~(symbol "js" (str "MaterialUI." (name tag)))]
(if (om-tools.dom/literal? opts#)
(let [[opts# children#] (om-tools.dom/element-args opts# children#)]
(cond
(every? (complement om-tools.dom/possible-coll?) children#)
`(~ctor# ~opts# ~@children#)
(and (= (count children#) 1) (vector? (first children#)))
`(~ctor# ~opts# ~@(-> children# first flatten))
:else
`(apply ~ctor# ~opts# (flatten (vector ~@children#)))))
`(om-tools.dom/element ~ctor# ~opts# (vector ~@children#))))))
(defmacro ^:private gen-bootstrap-inline-fns []
`(do ~@(clojure.core/map gen-bootstrap-inline-fn material-tags)))
#+clj
(gen-bootstrap-inline-fns)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment