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

# Enrollment

> Migrate Web enrollment integrations (yuno.mountEnrollmentLite + yuno.apiClientEnroll) to the unified Transaction API.

Enrollment had two sub-modes that paralleled the payment modes: a UI-driven flow (`mountEnrollmentLite`) and a headless flow (`apiClientEnroll`). Both collapse into the same `Transaction` class in the unified API. What changes is the **session you pass** (`customerSession` instead of `checkoutSession`) and **whether you provide pre-collected data** in `paymentMethod.data`.

## Before you start

* Load the unified SDK bundle instead of the legacy one and initialize it as the side-by-side shows: `window.Yuno.initialize(...)` becomes `SdkPayments.initialize(...)`. Your public API key and the customer sessions your backend creates do not change ([Before you begin](/docs/yuno-sdk/get-started#before-you-begin)).
* There is no payment to create. An enrollment config does not accept `createPayment`, `showPayButton` or the other payment-only fields. Remove them.

## Side-by-side

### Enrollment Lite (UI)

<CodeGroup>
  ```typescript Before. Enrollment Lite theme={"theme":{"light":"github-dark","dark":"github-dark-dimmed"}}
  const yuno = await window.Yuno.initialize('your-public-api-key')

  await yuno.mountEnrollmentLite({
      customerSession: 'session-from-backend',
      countryCode: 'CO',
      language: 'en',
      showPaymentStatus: true,
      yunoEnrollmentStatus: ({ status, vaultedToken }) => {
          if (status === 'CREATED' && vaultedToken) {
              // Store against customer
              console.log('vault token:', vaultedToken)
          }
      },
  })
  ```

  ```typescript After. Unified Transaction (enrollment) theme={"theme":{"light":"github-dark","dark":"github-dark-dimmed"}}
  const sdkPayments = await SdkPayments.initialize('your-public-api-key')

  const transaction = sdkPayments.transaction({
      customerSession: 'session-from-backend',
      countryCode: 'CO',
      language: 'en',
      elementSelector: '#root',
      onStatus: (result) => {
          // Same payload shape as payment flows: status / substatus / message.
          if (result.status === 'ENROLLED') {
              // Enrollment succeeded. Retrieve the vaulted token from your
              // backend's list-customer-payment-methods endpoint.
          }
      },
  })

  await transaction.start()
  ```
</CodeGroup>

### Enrollment Headless

<CodeGroup>
  ```typescript Before. Enrollment headless theme={"theme":{"light":"github-dark","dark":"github-dark-dimmed"}}
  const yuno = await window.Yuno.initialize('your-public-api-key')

  const apiClientEnroll = await yuno.apiClientEnroll({
      customer_session: 'session-from-backend',
      country_code: 'CO',
  })

  const enrollment = await apiClientEnroll.continueEnrollment({
      payment_method: {
          type: 'CARD',
          card: {
              detail: {
                  holder_name: 'John Doe',
                  number: '4111111111111111',
                  security_code: '123',
                  expiration_month: 12,
                  expiration_year: 28,
              },
          },
      },
  })

  console.log('vault token:', enrollment.vaulted_token)
  ```

  ```typescript After. Unified Transaction (enrollment headless) theme={"theme":{"light":"github-dark","dark":"github-dark-dimmed"}}
  const sdkPayments = await SdkPayments.initialize('your-public-api-key')

  const transaction = sdkPayments.transaction({
      customerSession: 'session-from-backend',
      countryCode: 'CO',
      onStatus: (result) => {
          if (result.status === 'ENROLLED') {
              // Enrollment succeeded. Retrieve the vaulted token from your
              // backend's list-customer-payment-methods endpoint.
          }
      },
  })

  await transaction.start({
      paymentMethod: {
          type: 'CARD',
          data: {
              card: {
                  holderName: 'John Doe',
                  number: '4111111111111111',
                  securityCode: '123',
                  expirationMonth: 12,
                  expirationYear: 28,
              },
          },
      },
  })
  ```
</CodeGroup>

## What changes

Grouped in the order you edit the code. **Renamed**: same role, new name. **Moved**: same value, new owner. **Removed**: nothing to call. The last column is the only thing you have to do beyond the rename.

### Initialization and config

| Enrollment | Unified | Change | What to do |
| - | - | - | - |
| `window.Yuno.initialize(publicApiKey)` | `SdkPayments.initialize(publicApiKey)` | Renamed | The global is `window.SdkPayments`. As before, `await` it: it resolves to the `SdkPayments` instance you create transactions from. |
| `customerSession` on `mountEnrollmentLite` / `customer_session` argument of `apiClientEnroll` | `customerSession` on the transaction config | Moved | Single factory: which session you pass decides the flow, `checkoutSession` for a payment, `customerSession` for an enrollment. `createPayment`, `showPayButton`, and the other payment-only config fields aren't part of the enrollment config, as there's no `/v1/payments` equivalent for enrollment. |
| `countryCode`, `language` on `mountEnrollmentLite` | The same fields on the transaction config | Moved | |
| *(none: the SDK appended its own container to `body`)* | `elementSelector` on the transaction config | New | Optional: the enrollment form renders inside that element. Without it the SDK appends its own container to `body`, as before. Headless enrollment ignores it. |
| `showPaymentStatus: true` | `showStatusScreen: true` | Renamed | Same field on `TransactionConfig`. Defaults to `true` for enrollment. |
| `holder_name`, `number`, `security_code`, `expiration_month`, `expiration_year` under `payment_method.card.detail` (argument of `continueEnrollment`) | `holderName`, `number`, `securityCode`, `expirationMonth`, `expirationYear` under `paymentMethod.data.card` | Moved | Pre-collected card data goes inline on `start()` (see Entry points). |

### Callbacks

| Enrollment | Unified | Change | What to do |
| - | - | - | - |
| `yunoEnrollmentStatus({ status, vaultedToken })` | `onStatus(result)` | Renamed | `result` carries `status`, `substatus`, and `message`, the same shape as payment flows. `result.status` carries the enrollment status as the API reports it (`CREATED`, `EXPIRED`, `REJECTED`, `READY_TO_ENROLL`, `ENROLL_IN_PROCESS`, `UNENROLL_IN_PROCESS`, `ENROLLED`, `DECLINED`, `CANCELED`, `ERROR`, `UNENROLLED`, `PENDING`) plus two SDK values: `INTERNAL_ERROR` (details in `result.message`) and `USER_CANCEL` (you unmounted before a result). A successful enrollment arrives as `status: 'ENROLLED'` with `substatus: 'CREATED'`: check `result.status === 'ENROLLED'`. **`vaultedToken` is no longer delivered to the client**: retrieve it from your backend's list-customer-payment-methods endpoint and store it against your customer. See [`Status`](/docs/yuno-sdk/reference/objects-you-receive#status). |
| `yunoError(message, data?)` | *(removed)* | Removed | Errors flow through `onStatus` (a `TransactionStatus` with `message` set), or a rejected `start()` Promise. |

### Entry points

| Enrollment | Unified | Change | What to do |
| - | - | - | - |
| `yuno.mountEnrollmentLite({ customerSession, … })` | `sdkPayments.transaction({ customerSession, elementSelector, … }).start()` | Renamed | `start()` with no argument is the UI enrollment: with `elementSelector` on the config, the SDK renders the form for the method the customer session was created for inside that element. |
| `yuno.apiClientEnroll({ customer_session, country_code })` + `.continueEnrollment({ payment_method })` | `sdkPayments.transaction({ customerSession }).start({ paymentMethod: { type: 'CARD', data: { card } } })` | Renamed | `start({ paymentMethod: { type, data } })` is the headless enrollment: same shape as headless payment, but with `customerSession`; the config's `elementSelector` is ignored. The call no longer returns the vaulted token (see Callbacks). |

## Related

* [Enrollment](/docs/yuno-sdk/features/enrollment). Full enrollment guide.
* [`TransactionConfig`](/docs/yuno-sdk/reference/objects-you-pass#transaction-config). Complete field reference.
* [`Status`](/docs/yuno-sdk/reference/objects-you-receive#status). Payload shape and status values.


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.