lit-html-rs

A Rust library for using the HTML template library lit-html created by the Google Polymer project.

this library is still in very early stages

[dependencies]
lit-html = "0"

Here's a demo of the iconic todo list.

Basics

lit-html works by creating templates that efficiently render to the DOM. When you are building a TemplateData object your data is being moved from WebAssembly into an object in JavaScript that can be used by the lit-html template.

You can put the following data on TemplateData:

• strings
• numbers
• booleans
• callbacks functions

use js::*;
use lit_html::*;

#[no_mangle]
pub fn main() {
    let mut data = TemplateData::new();
    data.set("name", "Ferris");
    render(html!(r#"<h1>Hello ${_.name}</h1>"#, &data), DOM_BODY);
}

See it working here.

Counter

You can build up complex UI by creating Templates that contain other data bound templates. lit-html efficiently manipulates the DOM when data changes.

use js::*;
use lit_html::*;

static mut COUNT: u32 = 0;

fn counter() -> Template {
    let mut data = TemplateData::new();
    data.set("count", unsafe { COUNT });
    data.set("increment", || {
        unsafe { COUNT += 1 };
        rerender();
    });
    html!(
        r#"The current count is ${_.count} <button @click="${_.increment}">+</button>"#,
        data
    )
}

fn app() -> Template {
    let mut data = TemplateData::new();
    data.set("content", counter());
    html!(
        r#"<div>This is a counter in Rust!</div><div>${_.content}</div>"#,
        data
    )
}

fn rerender() {
    render(&app(), DOM_BODY);
}

#[no_mangle]
pub fn main() {
    rerender();
}

See it working here.

License

This project is licensed under either of

• Apache License, Version 2.0, (LICENSE-APACHE or http://www.apache.org/licenses/LICENSE-2.0)
• MIT license (LICENSE-MIT or http://opensource.org/licenses/MIT)

at your option.

Contribution

Unless you explicitly state otherwise, any contribution intentionally submitted for inclusion in js-wasm by you, as defined in the Apache-2.0 license, shall be dual licensed as above, without any additional terms or conditions.