Overview

Partners typically already hold data about their customers — email addresses, company names, country of incorporation, and more. The Embedded Journey allows partners to pass this data via a prefill callback, so users do not have to re-enter information you already have.

Prefilling data:

• Reduces friction — users skip fields that are already populated, completing the journey faster.
• Improves data accuracy — data sourced from the partner's system is less likely to contain errors.
• Increases conversion — fewer steps to complete means lower drop-off rates.

How it works

When the user opens the Embedded Journey panel, the SDK invokes a callback function provided by the partner. This callback can return an EmbeddedJourneyPrefill object containing any known data. The SDK uses this data to pre-populate the corresponding fields in the application form.

The callback is:

• Asynchronous — you can fetch data from your backend before returning.
• Optional — returning void is valid if no data is available.
• Called on panel open — it runs each time the user opens the journey panel, so it always has the latest data.

UI SDK integration

Pass the prefill callback as the second argument to mountCta:

import {
  WayflyerUiSdk,
  type EmbeddedJourneyPrefillCallback,
  type EmbeddedJourneyPrefill,
} from '@wf-financing/ui-sdk';

const wayflyerUiSdk = await WayflyerUiSdk.loadSdk(companyToken);

const prefillCallback: EmbeddedJourneyPrefillCallback = async () => {
  const prefill: EmbeddedJourneyPrefill = {
    email: 'merchant@example.com',
    companyName: 'Acme Ltd',
    country: 'IE',
    monthlyRevenue: 50000,
    primaryStoreUrl: 'https://acme.com',
  };

  return prefill;
};

wayflyerUiSdk.mountCta('wayflyer-cta', prefillCallback);

Fetching data asynchronously

The callback supports asynchronous operations. You can fetch data from your backend before returning:

const prefillCallback: EmbeddedJourneyPrefillCallback = async () => {
  const customerData = await fetch('/api/current-customer');
  const data = await customerData.json();

  return {
    email: data.email,
    companyName: data.businessName,
    country: data.countryCode,
    monthlyRevenue: data.revenue,
  };
};

Available prefill fields

All fields are optional. Provide whichever fields you have available.

Behaviour

• Prefilled fields are shown to the user as pre-populated but editable — users can change any prefilled value.
• If the user already has saved progress on an in-progress application, the saved progress takes precedence over prefilled data.
• Fields that are not provided in the prefill object are left blank for the user to complete.

Headless SDK

The prefill callback is a UI SDK concept. If you are using the Headless SDK to build your own UI, you already have full control over the data you pass to updateUserDetails() and updateCompanyDetails() — you can pre-populate your own form fields directly from your data sources.