> ## Documentation Index
> Fetch the complete documentation index at: https://docs-terra.withunify.org/llms.txt
> Use this file to discover all available pages before exploring further.

# Variable Interpolation

> Dynamic content in form fields using {{fieldId}} syntax

# Variable Interpolation

> Use `{{fieldId}}` to insert dynamic values into labels, help text, and info blocks.

## Basic Usage

Reference any field's value:

```json theme={null}
{
  "type": "info",
  "content": {
    "en": "Thanks, {{full-name}}! Based on your income of ${{annual-income}}, you may qualify for assistance."
  }
}
```

## Supported Locations

| Location            | Example                              |
| ------------------- | ------------------------------------ |
| Labels              | `"Hello, {{name}}"`                  |
| Help text           | `"Enter your address in {{city}}"`   |
| Info blocks         | `"Based on {{income}}, you qualify"` |
| Validation messages | `"{{field}} is required"`            |

## Implementation

```typescript theme={null}
function interpolate(
  template: string,
  formData: Record<string, unknown>
): string {
  return template.replace(/\{\{([^}]+)\}\}/g, (match, fieldId) => {
    const value = formData[fieldId];
    if (value === undefined || value === null) return "";
    return String(value);
  });
}
```

## Common Patterns

**Personalized greeting:**

```
Welcome back, {{first-name}}!
```

**Dynamic eligibility:**

```
Households of {{household-size}} people may qualify for up to ${{max-benefit}}.
```

**Confirmation summary:**

```
You entered {{address-line-1}}, {{city}}, {{state}} {{zip}}.
```

***

<Card title="Translations" icon="language" href="/features/translations">
  Multi-language support
</Card>
