paul-ex.tsx

/** @jsx h */
import { bind, h } from "https://deno.land/x/[email protected]/paul.ts";

bind("my-component", ({ on, morph }) => {
  let count = 0;

  on("click", "button", () => {
    count++;
    render();
  });

  const render = () => morph(<Component count={count} />);
  render();
});

export default function Component({ count }: { count: number }) {
  return (
    <div class="my-component">
      <div>{count}</div>
      <button>
        Click me!
      </button>
    </div>
  );
}

paul-ex2.tsx

/** @jsx h */
import { bind, h } from "https://deno.land/x/[email protected]/paul.ts";

bind("my-component", ({ on, morph }) => {
  let count = 0;

  on("click", "button", () => {
    count++;
    render();
  });

  const render = () =>
    morph(
      <div class="my-component">
        <div>{count}</div>
        <button>
          Click me!
        </button>
      </div>,
    );

  render();
});