@iniz/preact

Iniz

Iniz is a reactive store library. Try it out on our website!

npm i @iniz/preact

• Guide

Guide

@iniz/preact already re-exports @iniz/core, so don't need to install @iniz/core yourself

Simply use atom() values in components, they will re-render correctly with custom jsxImportSource.

/** @jsxImportSource @iniz/preact */
import { useAtom, useComputed, useSideEffect } from "@iniz/preact";

function MessageInput() {
  // Equivalient to `atom()`
  const counter = useAtom(10);

  // Equivalent to `computed()`
  const computedCounter = useComputed(
    () => `Computed: ${nestedCounter$$().obj.message}`
  );

  // Equivalent to `effect()`
  // NOTE: You can also use `useEffect` with atoms actually
  useSideEffect(() => {
    console.log("[Latest message] ", computedCounter());
  });

  return (
    <div>
      <button onClick={() => counter(counter() + 1)}>{counter()}++</button>
    </div>
  );
}