A lightweight signal-based library for building web components with a React-like API.
- π Web standards with custom HTML elements
- βοΈ React-like API
- βοΈ Declarative templating with JSX (no additional parsing)
- π₯ Fine-grained reactivity with signals
- π Type-safe components with TypeScript
- πͺΆ Lightweight (~4KB minified and compressed)
import { Component, useSignal, defineComponents } from "sinho";
class Counter extends Component("x-counter") {
render() {
const [value, setValue] = useSignal(0);
return (
<>
<p>Counter: {value}</p>
<p>
<button onclick={() => setValue((n) => n + 1)}>Increment</button>{" "}
<button onclick={() => setValue((n) => n - 1)}>Decrement</button>
</p>
</>
);
}
}
defineComponents(Counter);