Signup form

Render, validate, and submit configured signup fields.

Previewlight site theme

CodeApp.tsx

import {
  LockerverseSignup,
  type LockerverseSignupTheme,
  useLockerverseSignup,
} from "@lockerverse/react/signup";
import "@lockerverse/react/signup.css";
import { exampleRuntime } from "../example-runtime";

export default function SignupExample({
  theme = "light",
}: {
  theme?: LockerverseSignupTheme;
}) {
  const widget = useLockerverseSignup({
    apiBaseUrl: exampleRuntime.apiBaseUrl,
    communitySlug: exampleRuntime.communitySlug,
    environment: "development",
    sentryDsn: null,
    signupSlug: exampleRuntime.signupSlug,
  });
  return (
    <LockerverseSignup
      branding={{ accentColor: "#f1511b", name: "SDK Examples" }}
      onSignupComplete={(result) => console.log(result.id)}
      theme={theme}
      widget={widget}
    />
  );
}