EffectsCopy Anchor Link

useFormEffect(api, selector, callback)Copy Anchor Link

Observes a form, field, or array API. The selector receives its store state; the callback receives the inferred selected value. The hook returns void and cleans up its subscription when the component unmounts or the observed API changes.

The callback runs on subsequent changes that are not deeply equal to the previous selected value. It does not run immediately for the initial value. Unrelated store changes that leave the selection deeply equal do not invoke it.

import { useFieldApi, useForm, useFormEffect } from '@oxform/react';
import { z } from 'zod';

function EmailAudit() {
  const form = useForm({ schema: z.object({ email: z.string() }), defaultValues: { email: '' } });
  const email = useFieldApi({ form, name: 'email' });

  useFormEffect(
    email,
    state => state.value,
    value => {
      console.info(value);
    },
  );

  return null;
}

Callbacks may return Promise<void>, but the effect does not await completion before accepting another change. No result or cancellation signal is supplied. Keep the selector and callback stable for a given API: the current hook does not reliably replace an existing subscription when only those function arguments change.

createEffect(api, selector, callback)Copy Anchor Link

The core equivalent has the same selector and callback contract. It returns a subscription with unsubscribe(). Call it to stop future callbacks; it does not cancel a callback already running.

import { createEffect, createForm } from '@oxform/core';
import { z } from 'zod';

const form = createForm({ schema: z.object({ email: z.string() }), defaultValues: { email: '' } });
const subscription = createEffect(
  form,
  state => state.values.email,
  email => {
    console.info(email);
  },
);

form.field.change('email', 'ada@example.com');
subscription.unsubscribe();

SignaturesCopy Anchor Link