use-god-state

Simplifica la gestión de estado en React/Preact con un solo hook.
Incluye validación, persistencia, seguimiento de cambios (dirty), y control granular de campos.

Instalación

npm install use-god-state

Asegúrate de tener preact instalado como dependencia (o como peerDependency si es una librería):

npm install preact

Uso básico

import { useGodState } from "use-god-state";

const initialState = { nombre: "", edad: 0 };

function MiComponente() {
  const [state, setState] = useGodState(initialState);

  return (
    <div>
      <input
        value={state.nombre.val}
        onInput={e => state.nombre.set(e.currentTarget.value)}
      />
      <input
        type="number"
        value={state.edad.val}
        onInput={e => state.edad.set(Number(e.currentTarget.value))}
      />
      <button onClick={state.reset}>Restablecer</button>
      <div>¿Hay cambios? {state.isDirty ? "Sí" : "No"}</div>
    </div>
  );
}

Opciones avanzadas

Puedes pasar un objeto de opciones para agregar validaciones, middlewares, persistencia y más:

const [state, setState] = useGodState(
  { nombre: "", edad: 0 },
  {
    validators: {
      nombre: v => v.length > 0 || "El nombre es obligatorio",
      edad: v => v >= 0 || "La edad debe ser positiva"
    },
    middleware: [
      (key, value) => (key === "nombre" ? value.trim() : value)
    ],
    persist: {
      key: "mi-estado",
      // storage: sessionStorage, // Opcional
      // serialize: (state) => customSerialize(state),
      // deserialize: (str) => customDeserialize(str)
    },
    debounceMs: 300,
    onStateChange: (nuevo, anterior, key) => {
      console.log("Cambio de estado:", key, nuevo);
    }
  }
);

API del estado

Cada campo tiene:

• .val — valor actual
• .set(valor) — actualiza el valor
• .reset() — restablece al valor inicial
• .isDirty — indica si fue modificado

El objeto principal tiene:

• .reset() — restablece todo el estado
• .resetDirty() — limpia el seguimiento de cambios
• .isDirty — indica si algún campo cambió
• .getSnapshot() — obtiene una copia del estado actual
• .restoreSnapshot(snapshot) — restaura un snapshot

Ejemplo de validación y persistencia

const [state] = useGodState(
  { email: "" },
  {
    validators: {
      email: v => /\S+@\S+\.\S+/.test(v) || "Email inválido"
    },
    persist: { key: "form-email" }
  }
);

Notas

• Compatible con Preact (v10+) y proyectos TypeScript.
• Si usas React, puedes adaptar el hook fácilmente cambiando los imports.

¿Dudas o sugerencias? ¡Abre un issue o contribuye!