Dynamic text
Personalize labels and page copy with template tokens.
Labels, descriptions, input hints, and page descriptions can include tokens such as {{firstName}} that read from current form values.
Token syntax
Dynamic text runs through resolveDynamicText. It matches double-brace tokens made of word characters and dots, trims spaces inside the braces, and reads values with getValueAtFieldPath.
- Use {{firstName}} for top-level fields and {{address.city}} or {{items[0].name}} for nested paths.
- {{ firstName }} and {{firstName}} resolve the same field.
- The token regex is /{{s*([w.$[]]+)s*}}/g and tokens must round-trip through the field-path parser, so names containing hyphens stay verbatim.
Where tokens work
Tokens work only where useFormedible calls resolveDynamicText. That includes field labels, descriptions, input hints, sections, page copy, and tab copy.
- withDynamicText resolves field label, description, input hint, and section before render.
- renderPageHeader resolves page title and page description before FormProgress receives them.
- FormTabs receives resolved label and description values for every visible tab.
- dynamicPlaceholder is typed, but string input hints resolve even when the flag is not set.
Resolution behavior
The resolver is narrow on purpose. Non-string ReactNode values pass through unchanged, missing values become an empty string, and present values are stringified.
- resolveDynamicText(text, values) returns text immediately when typeof text is not string.
- For a matched token, undefined and null become an empty string.
- Present values are converted with String(value), so numbers and booleans render as text.
Practical patterns
Use tokens for small bits of context: a name in the next page, a destination in later labels, or a car type in an extras step. Keep tokenized copy near the field that collects the value.
- Registration page 2 uses description: "How can we reach you {{firstName}} ?" after firstName is collected on page 1.
- The flow example uses labels such as "Hi {{name}}! Where are you headed for vacation?" and "Any extras for your {{carType}}?".
- The rental-flow example uses conditional pages and labels such as "What special accommodations does {{firstName}} need?" and "Where should we send {{firstName}}'s {{destination}} rental confirmation?".