@alphea/react

React hooks and Provider bindings for ALPHEA browser app runtimes.

npm install @alphea/react react react-dom
npm install -D @types/react @types/react-dom

import {
  alpheaError,
  createAlpheaAppGatewayResolver,
  createAlpheaReactHooks,
  getAlpheaBrowserClient,
  isAlpheaErrorCode,
} from "@alphea/react";
import type { AlpheaFns } from "./alphea-fns.generated";

const alphea = createAlpheaReactHooks<AlpheaFns>();

export function NewNote() {
  const createNote = alphea.useFn("createNote");

  return (
    <button
      disabled={createNote.loading}
      onClick={() => void createNote.call({ title: "Hello" })}
    >
      Save
    </button>
  );
}

The hooks resolve the served runtime's ambient window.alphea binding by default. Use AlpheaProvider only when you want to inject an explicit client, for example in tests or a custom bootstrap.

@alphea/react is the normal browser-safe dependency for React UI apps. In addition to the hooks, it re-exports the browser Client Framework factories, ambient client helpers, shared JSON/error/function/worker types, and ALPN app resolver helpers so React app code does not need a direct @alphea/framework or @alphea/client dependency for those browser-safe surfaces.

Keep credential-bearing Foundation RPC clients, bearer/session transports, and auth login helpers in trusted tooling or server code that depends on @alphea/foundation; they are not exported by @alphea/react.