all repos — h3 @ 3c61487e72e963e98ffcf4b9d102f4e1546d18eb

A tiny, extremely minimalist JavaScript microframework.

docs/example/assets/js/components/Todo.js

 1
 2
 3
 4
 5
 6
 7
 8
 9
 10
 11
 12
 13
 14
 15
 16
 17
 18
 19
import h3 from "../h3.js";

export default function Todo(data) {
  const todoStateClass = data.done ? ".done" : ".todo";
  const toggleTodo = (key) => {
    h3.dispatch("todos/toggle", key);
    h3.redraw();
  };
  const removeTodo = (key) => {
    h3.dispatch("todos/remove", key);
    h3.redraw();
  };
  return h3(`div.todo-item`, { data: { key: data.key } }, [
    h3(`div.todo-content${todoStateClass}`, [
      h3("span.todo-text", { onclick: (e) => toggleTodo(e.currentTarget.parentNode.parentNode.dataset.key) }, data.text),
    ]),
    h3("span.delete-todo", { onclick: (e) => removeTodo(e.currentTarget.parentNode.dataset.key) }, "✘"),
  ]);
}