Components
ElvixIdentityForm

ElvixIdentityForm

Hosted profile editor: name, locale, timezone, pronouns, contact. Plugs straight into the elvix User record. In-frame edit → confirm → done lifecycle.

components/profile-pane.tsx
"use client";
import { ElvixIdentityForm } from "@elvix.is/sdk/react";
export function ProfilePane() {
return (
<ElvixIdentityForm
onResult={(r) => {
if (!r.ok) return console.warn("identity save failed", r.error);
// Saved. The SDK has already written to elvix and transitioned to
// its in-frame "done" pane. This is the HOST hook: close a modal,
// refresh a stale cache, toast.
}}
/>
);
}

Props

PropTypeRequiredDefaultDescription
initialPartial<IdentityInput>optionalfetched on mountPre-loaded identity fields (givenName, familyName, birthdate, gender, pronouns). Omit it and the SDK GETs /api/account/profile/identity itself so you don't thread server state in.
onResult(r: ElvixIdentityFormResult) => voidoptionalnoneTerminal callback. r.ok discriminates success / failure. No PII is echoed back. Fires before the in-frame done pane, so a host that navigates here wins.

The form reads current values from elvix on mount via the per-app context (useElvixAppContext()). You don't need to pass initial props: the provider already has them. Same applies to every identity-surface component: `ElvixUsername`, `ElvixAvatar`, `ElvixRegion`.

Related