> ## Documentation Index > Fetch the complete documentation index at: https://auth0.generaltranslation.app/llms.txt > Use this file to discover all available pages before exploring further. > Learn about Form nodes and available components. # Nodes and components Forms lets you add nodes and components, such as fields, blocks, and widgets for your users to interact with the form. You can then reference the data input, from components, in your forms and flows. ## Form nodes There are five types of form nodes: Start, Step, Flow, Router and Ending screen. These nodes have a very specific purpose for the structure of the form. Dashboard > Forms > Form Editor ## Step node Step nodes are the visual representation of the form. They can contain any number of components, such as fields, blocks, and widgets where the user can fill in their data. Dashboard > Foms > Step node ### Field components Fields are UI components where users input their information in Forms. Dashboard > Forms > Fields #### Field settings Fields have a number of default settings that you can configure to meet your requirements. The default field settings are:
Settings Description
ID The unique id
Label Display or hide a label
Required Input value is required
Hint text Display a hint text
Placeholder text Text visible to the user
Default value Default value visible to the user
Transient Enable or disable data mask
#### Field validation rules
Settings Description
Min. length / Max. length Require an input value length.
Min. value / Max. value Require a number value length.
#### Available fields in Forms The available fields with their specific settings and data output types are: Standard input lets a user enter any string value. ##### Text field settings The text field setting is:
Settings Description
Multiline Enable multi-line input text.
##### Text field output value The text field output value data type is a `string`. ```json lines theme={null} { "text_field_id": "Auth0" } ``` Standard input lets a user enter email string values. ##### Email field output value The email field output value data type is a `string`. ```json lines theme={null} { "email_field_id": "username@domain.com" } ``` Standard input lets a user enter phone number values. ##### Phone field settings The phone field settings are:
Settings Description
Country picker Enable or disable Country picker. By default, it displays the user’s IP location.
Filter placeholder text Text visible to the user in the country search window.
##### Phone field output value The phone field output value data type is either a `string` or, if Country picker is enabled, an `object` . The phone field output data type value as a `string`: ```json lines theme={null} { "phone_field_id": "8005550175" } ``` The phone field output data type value as an `object` : ```json lines theme={null} { "phone_field_id": { "national_number": "8005550175", "national_format": "(800) 555-0175", "international_number": "+18005550175", "international_format": "+1 800-555-0175", "country_code_iso": "US", "country_code_number": "1" } } ``` Standard input that lets a user select single or multiple choice values. ##### Choice field settings The Choice field settings are:
Settings Description
Multiple choice Enable several choice options.
Other option Let users enter their own option.
Advanced > Internal values Assign an internal value to each choice option.
Advanced > Bulk edit Bulk edit label and internal choice option values.
##### Choice field output value The choice field output value data type is either a `string` or, if multiple choice is enabled, as an `array of strings` . The choice field output data type  value as a `string`: ```json lines theme={null} { "choice_field_id": "Option A" } ``` The choice field output data type value as an  `array of strings`: ```json lines theme={null} { "choice_field_id": ["Option A", "Option B"] } ``` Standard input that lets a user select single or multiple choice image values. ##### Cards field settings The cards field settings are:
Settings Description
Multiple choice Enable several choice options.
Hide labels Hide card labels.
Advanced > Internal values Assign an internal value for each option.
##### Cards field output value The cards field output value data type is either a `string` or, if multiple choice is enabled, as an `array of strings`. The cards field output data type value as a `string`: ```json lines theme={null} { "card_field_id": "Option A" } ``` The cards field output data type value as an `array of strings`: ```json lines theme={null} { "card_field_id": ["Option A", "Option B"] } ``` Standard input lets a user enter a URL value. ##### URL field output value The URL field output value data type is a string: ```json lines theme={null} { "url_field_id": "https://auth0.com" } ``` Standard input that lets a user enter a password or a secret value. ##### Password field settings The password field settings are:
Settings Description
Require complex password Passwords must contain an uppercase, a lowercase, a symbol and a number.
Enforce NIST guidelines The password cannot be less than 8 characters, passwords obtained from previous breach corpuses, dictionary words, repetitive or sequential characters, content-specific words.
Add strength meter A graphical meter with a red, yellow and green scale is displayed under the password field to show the strength of the password input.
Hash Select an algorithm to hash the input value directly in the browser.
##### Password field output value The password field output value data type is a masked `string`: ```json lines theme={null} { "password_field_id": "███" } ``` Standard input that lets a user enter payment information using a payment provider. Payments are processed before the Ending node. ##### Payment field settings The payment field settings are:
Settings Description
Payment type Select either a one-off (Charge) or recurring (Subscription) payments.
Amount Specify the amount for a one-off (Charge) payment.
Currency Specify the currency for a one- off ( Charge) payment.
Subscription action Select either to create or update an existing subscription.
Customer action Select either to create or update an existing customer.
Display options Display and edit Card number, Expiration date, and Security code labels and Trustmarks.
##### Payment field output value The payment field output value data type is either a string or an object  for after submission flows. The payment field output value data type as a `string`: ```json lines theme={null} { "payment_field_id": "pm_1P19e..." } ``` The payment field output value data type for subscriptions as an `object` : ```json lines theme={null} { "payment_field_id": { "payment_method_id": "pm_1P19e...", "customer_id": "cus_PqrM...", "price_ids": [ "price_1ONHR..." ], "subscription_id": "sub_1P1A...", "payment_intent_id": "pi_3P19e5..." } } ``` The payment field output value data type for charge as an `object` : ```json lines theme={null} { "payment_field_id": { "payment_method_id": "pm_1P19e...", "customer_id": "cus_PqrM...", "amount": 100, "payment_intent_id": "pi_3P19e5..." } } ``` Standard input that adds legal text and a check input. ##### Legal field output value The legal field output value data type is a `boolean`. ```json lines theme={null} { "legal_field_id": true } ``` Standard input that lets a user select single or multiple dropdown choice values. ##### Dropdown field settings The dropdown field settings are:
Settings Description
Multiple selector Enable several choice options.
Advanced > Internal values Assign an internal value for each option.
Advanced > Bulk edit Bulk edit label and internal values.
##### Dropdown field output value The dropdown field output value data type is either a `string` or, if multiple choice is enabled, as an `array of strings` . The dropdown field output data type  value as a `string`: ```json lines theme={null} { "dropdown_field_id": "Option A" } ``` The dropdown field output data type value as an `array of strings`: ```json lines theme={null} { "dropdown_field_id": ["Option A", "Option B"] } ``` Standard input that lets a user enter number values. ##### Number field output value The number field output value data type is a `number`. ```json lines theme={null} { "number_field_id": 123 } ``` Standard input that lets a user enter either a date or time values. ##### Date / Time field settings The date/time field settings include:
Key Description
Format Select either Date or Time format.
##### Date / Time field output value The date/time field output data type value for date is a `string`: ```json lines theme={null} { "date_time_field_id": "2023-04-11" } ``` The date/time field output data type value for time is a `string`: ```json lines theme={null} { "date_time_field_id": "23:15" } ``` Standard input that lets a user enter true or false values. ##### Boolean field output value The boolean field output value data type is a boolean. ```json lines theme={null} { "boolean_field_id": true } ``` Standard field that you can customize to create your own field. ##### Custom field settings The custom field setting are:
Settings Description
Params Add key-value pairs to reference in the custom field source code.
Source code Add your Javascript code to the custom field.
JSON Schema By default, the custom field accepts any value format. However, you can use JSON Schema to validate values.
To learn more, read [Custom Field Components for Forms](/docs/customize/forms/custom-field-components). ### Blocks components Blocks are UI components that add functionality to your forms but do not gather user information. Dashboard > Forms > Components > Blocks #### Available blocks in Forms The available blocks are: A button that lets users continue to the next form node. * Before continuing, field validation rules are applied and validated on the client-side and server-side. If field validation rules fail, an error message is displayed for the user to verify. * If the next node is a flow node, a spinner loader is displayed until the flow completes. If the flow fails or returns a custom error message, an error message is displayed. A button that lets users go to the previous step node. If a user selects the previous button, field validation rules are re-run again even if no change to input data is done before continuing. A button that lets users skip the current step and directly jumps to the destination node. When skipping the current step, we won't validate and neither collect any filled out information of the current step. A component that lets users re-run a flow to generate and send a new OTP code if a user selects the resend button, the associated flow will generate and send a new OTP code.
Settings Description
Text alignment Select text alignment, left, center, or right
Text Default text displayed when users select the resend button
Button text Button text
Waiting text Text displayed when users have selected the resend button. Replaces Text and the Button text settings. Use the `“{{remaining_seconds}}”` variable to dynamically display the remaining number of seconds until the send button is enabled again. For example: “Resend in `{{remaining_seconds}}` seconds”.
Flow Flow executed after the user selects the resend button.
Max attempts The maximum number of attempts the user can select the resend button
Waiting time The waiting time between attempts in seconds.
A rich text block to personalize the step node with additional information. A line to divide different sections of the step node. It can contain a small text. A HTML block to create your custom UI. An image block to personalize the step adding images. ### Widgets components Widgets are pre-built components, with third-party integrations, that add client-side and server-side logic to your forms. Dashboard > Forms > Components > Widget #### Available widgets in Forms The available widget is: A widget that lets a user enter and validate their address. ##### Google Address widget settings The Google Address widget settings include:
Settings Description
API key Requires a Google Maps API key to authenticate requests.
##### Google Address widget output value The Google Address widget output value data type is an `object`. ```json lines theme={null} { "google_address_widget_id": { "type": "Feature", "geometry": { "type": "Point", "coordinates": [ -73.9654415, 40.8054491 ] }, "properties": { "geocoding": { "type": "house", "housenumber": "2880", "street": "Broadway", "city": "New York", "county": "New York County", "state": "New York", "country": "United States", "postcode": "10025" } } } } ``` A widget that helps protect your website from spam and abuse by verifying that a user is a human and not a bot. The widget supports: * Score-based (v3) * Challenge (v2) * Invisible reCAPTCHA badge Differences between `v2` and `v3`: * `v2` requires user interaction with visible challenges, such as clicking a checkbox or solving puzzles. * `v3` runs in the background and provides a score based on user behavior, without requiring user interaction. When using this version, make sure to implement additional business logic to handle the score and determine if further action is needed. ##### Google reCAPTCHA widget settings The Google reCAPTCHA widget settings include:
Settings Description
Site key The public site key used to initialize the reCAPTCHA on your website. You can create it in Google reCAPTCHA console or your Google Cloud Platform project.
Secret key The secret key used to communicate securely with the reCAPTCHA service server-side. You can create it in Google reCAPTCHA console or your Google Cloud Platform project.
##### Google reCAPTCHA output value The Google reCAPTCHA widget output value data type is an `object`. Example of `v2` response: ```json lines theme={null} { "recaptcha_widget_id": { "success": true, "challenge_ts": "2025-03-26T11:22:18Z", "hostname": "auth.example.com" } } ``` Example of `v3` response: ```json lines theme={null} { "recaptcha_widget_id": { "success": true, "challenge_ts": "2025-03-26T11:22:18Z", "hostname": "auth.example.com", "score": 0.9 } } ``` A widget that lets a user verify their identity using verifiable credentials stored in their digital wallet. ##### Verifiable Credentials widget settings The Verifiable Credentials widget settings include:
Settings Description
URL The URL value used to generate the QR code. This value is returned in the engagement property of the verification request.
Link text Alternative text that will be displayed for users who cannot scan the QR code and prefer to open the link directly on their device.
Size The size of the QR code.
Public token The access token required to consume the polling endpoint. Please ensure the token is generated with only the read:verification\_request scope to avoid exposing access to other resources.
Verification ID The verification ID generated when you start the verification request.
Maximum waiting time The maximum amount of time to wait for the verification process to complete. Once the set time is reached, polling will stop and an error will be thrown, regardless of the verification status.
##### Verifiable Credentials output value The Verifiable Credentials widget output value data type is an `object`. ```json lines theme={null} { "verifiable_credentials_widget_id": { "state": "honored", "reason": "...", // The reason field contains additional information (if available) regarding the state of the verification request. "presentation": {} // The presentation contains the claims provided by the wallet in response to the presentation definition. } } ``` ## Router node Router nodes let you add rules to create conditional logic jumps between nodes. By default, a router node has a single pass-through rule named **Default Case** that connects to other nodes. You can add additional rules based on a set of conditions that a variable must meet to then connect to other nodes. To learn more, read [Router.](/docs/customize/forms/routers) Dashboard > Forms > Routers ## Flow node Flow nodes let you add and create custom logic and integration flows to your forms. To learn more, read [Flows.](/docs/customize/forms/flows) Dashboard > Forms > Flow Dashboard > Forms > Flow > Editor ## Start node Start nodes are not visible to the user. It is where you can configure hidden field variables, such as user attributes when [rendering a form with an Action.](/docs/customize/forms/render) Dashboard > Forms > Start node ## Ending screen node Every form has an Ending screen node. By default this node resumes the authentication flow and this is where you can configure an After submission flow. Dashboard > Forms > Ending screen node