@paypal/paypal-js
    Preparing search index...

    Type Alias BaseCardFieldsSession

    type BaseCardFieldsSession = {
        createCardFieldsComponent: (config: CardFieldOptions) => HTMLElement;
        on: (
            eventName: MerchantMessagingEvents,
            callback: CardFieldsEventsOptions[MerchantMessagingEvents],
        ) => Promise<void>;
        update: (options: UpdateOptions) => void;
    }
    Index

    Properties

    createCardFieldsComponent: (config: CardFieldOptions) => HTMLElement

    Use this method to create and configure individual Card Field components.

    Type Declaration

      • (config: CardFieldOptions): HTMLElement
      • Parameters

        • config: CardFieldOptions

          Configuration options for creating individual Card Field components and customizing different base aspects such as type, placeholder, styling, and accessibility attributes.

        Returns HTMLElement

        An instance of the created Card Field component that can be appended to the DOM

    const numberField = cardFieldsInstance.createCardFieldsComponent({
    type: "number",
    placeholder: "Enter a number",
    });
    document
    .querySelector("#paypal-card-fields-number-container")
    .appendChild(numberField);
    on: (
        eventName: MerchantMessagingEvents,
        callback: CardFieldsEventsOptions[MerchantMessagingEvents],
    ) => Promise<void>

    Use this method to register event listeners and set callbacks for them.

    Type Declaration

    cardFieldsInstance.on("focus", (eventPayload) => {
    console.log("Focus event triggered: ", eventPayload);
    });
    update: (options: UpdateOptions) => void

    Use this method to update the Card Fields session with new options.

    Type Declaration

      • (options: UpdateOptions): void
      • Parameters

        • options: UpdateOptions

          Configuration object to update the Card Fields session with new options.

        Returns void

    cardFieldsInstance.update({
    amount: {
    currencyCode: "EUR",
    value: "100.00",
    },
    isCobrandedEligible: true,
    });