Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Lisp/Hiccup style templating for Facebook's React in ClojureScript.
Clojure JavaScript Other
branch: master

README.md

ŜABLONO

Build Status Dependencies Status

Lisp/Hiccup style templating for Facebook's React in ClojureScript.

Installation

Via Clojars: https://clojars.org/sablono

Current Version

Usage

Most functions from Hiccup are provided in the sablono.core namespace. The library can be used with Om like this:

(ns example
  (:require [om.core :as om :include-macros true]
            [sablono.core :as html :refer-macros [html]]))

(defn widget [data]
  (om/component
   (html [:div "Hello world!"
          [:ul (for [n (range 1 10)]
                 [:li n])]
          (html/submit-button "React!")])))

(om/root widget {} {:target js/document.body})

HTML Tags

Ŝablono only supports tags and attributes that can be handled by React. This means you can't have your own custom tags and attributes at the moment. For more details take a look at the Tags and Attributes section in the React documentation.

HTML Attributes

HTML attributes in React are camel-cased and the class and for attributes are treated special. Ŝablono renames attributes with dashes in their name to the camel-cased version and handles the class and for special case. This is more consistent with Hiccup and naming conventions used in Clojure.

An input element with event listeners attached to it would look like this in Ŝablono:

(html [:input
       {:auto-complete "off"
        :class "autocomplete"
        :on-change #(on-change %1)
        :on-key-down #(on-key-down %1)
        :type "text"}])

innerHTML (Unsafe)

It is really not recommended to directly set the innerHTML attribute, but in rare cases it is necessary. i.e. injecting a html string that was generated from Markdown.

(html [:div
       {:dangerouslySetInnerHTML {:__html my-content-string }}])

You can read more at React's special attributes.

Thanks

This library is based on James Reeves Hiccup library.

License

Copyright © 2013-2015 r0man

Distributed under the Eclipse Public License either version 1.0 or (at your option) any later version.

Something went wrong with that request. Please try again.