Authentication
Sign Up
A registration form for new users with name, email, password, and confirm password. Uses a unified single-role flow and routes directly into email verification after a successful signup.
Use it when users need to create a fresh app profile.
One signup path for all users - no role selector or audience toggle.
Connect it directly to your verification screen for a complete flow.
Four things worth knowing
BuilderSignup handles the full registration flow - from collecting credentials to handing the user off to email verification.
Guided user registration
Collects full name, email, password, and confirm password using a familiar layout with a full-width submit button.
Password helper included
A password suggestion helper is shown inline to guide users toward strong credentials before they submit.
Built-in validation
Checks email format, password strength, and matching confirmation before the request is submitted to the API.
Verification-ready handoff
Routes the user to your verification screen after a successful signup and stores the pending email in context.
Find it, drop it, wire it up
Where to find it
- Open the Builder component picker.
- Go to Authentication.
- Select Sign Up.
- Drop it onto your registration screen.
Recommended setup
- In Action, connect After Sign Up to your Email Verification screen.
- In Action, connect Already have account? to your Sign In screen.
- In Style, set Primary Color and Font Style to match your theme.
- Test the full flow in Preview mode before publishing.
What you can configure in the editor
| Group | Prop | Default | What it controls |
|---|---|---|---|
| Content | headingText | Create your account | The main heading shown at the top of the registration form. |
| Content | subtitleText | none | Optional supporting copy shown below the heading. |
| Style | primaryColor | #007AFF | Accent colour used for the submit button, links, and focus highlights. |
| Style | fontStyle | preset-based | Controls the typography style applied across the form. |
| Style | sizeVariant | preset-based | Sets global sizing for typography, spacing, and button scale. |
| Action | signinScreenId | none | Screen the footer “Already have an account?” link navigates to. |
| Action | verifyScreenId | none | Screen the user is routed to after a successful signup submission. |
| Runtime | isPreview | false | Enables interaction only when the component runs in preview or live mode. |
Make it yours
| Setting | Where | What changes |
|---|---|---|
| Primary Color | Style | Button fill, link colour, and focus ring across the entire form. |
| Font Style | Style | Typography applied to headings, labels, and input text. |
| Component Size | Style | Scales spacing, input height, and button size together as a preset. |
| Heading Text | Content | The top-level label users see when they land on the registration screen. |
| Subtitle Text | Content | Optional secondary copy beneath the heading to set context or tone. |
Common mistakes to avoid
Always wire both screen destinations
Set both verifyScreenId and signinScreenId. Missing either leaves users stranded after a successful signup or when clicking the footer link.
Validation happens before submit
Email format, password strength, and password confirmation are all checked client-side before the API call is made. No need to add duplicate checks elsewhere.
Preview mode is required
The form is non-interactive in the editor canvas. Switch to Preview mode to test the full signup flow including validation and navigation.
Role selector and logo are intentionally removed
Fields like accountMode, showRoleSelector, logoUrl, and logoText no longer appear in the editor. If they show up, the registry is out of date.