@zoijs/action

The write-side companion to resource. Wrap a submit, save, or delete and get reactive pending / error / done state.

npm install @zoijs/core @zoijs/action

Example#

import { html, mount } from "@zoijs/core";
import { action } from "@zoijs/action";

const save = action(async (formData) => {
  const res = await fetch("/api/users", { method: "POST", body: formData });
  if (!res.ok) throw new Error("Could not save");
  return res.json();
});

function Form() {
  return html`
    <form onsubmit=${(e) => { e.preventDefault(); save.run(new FormData(e.currentTarget)); }}>
      <input name="name" />
      <button disabled=${() => save.pending()}>
        ${() => (save.pending() ? "Saving…" : "Save")}
      </button>
      ${() => (save.error() ? html`<p role="alert">${save.error().message}</p>` : null)}
    </form>
  `;
}

run() never throws — failures land in error(), so await save.run(...) is safe without try/catch.

API#

Member	What it does
`action(fn)`	Wrap a write function; nothing runs until `run()`
`run(...args)`	Call `fn`; sets pending, then done+result or error
`pending()`	`true` while running
`error()`	The error, or `null`
`done()`	`true` after success
`result()`	The latest successful result
`reset()`	Clear all state

Known limitations#

No cache, query invalidation, retries, or optimistic updates — by design.
To refresh data after a write, call your resource's refresh() yourself.