SDK de adhesiones

https://app.tapipay.la/s/acme-corp/embed/CLI-00042/autopay
https://app.tapipay.la/c/MX-S-12345/embed/CLI-00042/autopay

// Las adhesiones activas terminaron de cargar
tapipay.on("autopayLoaded", function (data) {
  console.log("Adhesiones activas:", data.count, data.mediaTypes);
});

// Una nueva domiciliación quedó activa
tapipay.on("autopayActivated", function (data) {
  console.log("Adhesión activa:", data.mediaType, data.lastFour);
});

// El usuario desadhirió un medio con éxito
tapipay.on("autopayRemoved", function (data) {
  console.log("Medio desadherido:", data.mediaType, data.lastFour);
});

// Falló la carga de adhesiones o la desadhesión
tapipay.on("autopayError", function (data) {
  console.log("Error de autopay:", data.stage, data.message);
});

// Quitar un listener
tapipay.off("autopayLoaded", handler);

type TapipayAutopayMediaType = "card" | "bank_account" | "debit_card";

interface TapipayAutopayAdhesionSummary {
  id: string;                            // hash opaco de la adhesión
  mediaType: TapipayAutopayMediaType;
  lastFour: string | null;               // últimos 4 dígitos (tarjeta o CLABE)
}

interface TapipayAutopayLoadedEvent {
  count: number;                         // cantidad de adhesiones activas
  mediaTypes: TapipayAutopayMediaType[]; // tipos presentes, sin duplicados
  adhesions: TapipayAutopayAdhesionSummary[];
}

interface TapipayAutopayActivatedEvent {
  id: string;
  mediaType: TapipayAutopayMediaType;
  lastFour: string | null;
}

interface TapipayAutopayRemovedEvent {
  id: string;
  mediaType: TapipayAutopayMediaType;
  lastFour: string | null;
}

interface TapipayAutopayErrorEvent {
  stage: "load" | "remove";              // en qué fase falló
  message: string;                       // mensaje neutral, sin datos personales
}

// El usuario eligió su banco
tapipay.on("domiciliationBankSelected", function (data) {
  console.log("Banco elegido:", data.name);
});

// Los datos de la cuenta pasaron la validación
tapipay.on("domiciliationFormCompleted", function (data) {
  console.log("Cuenta validada:", data.accountType, data.lastFour);
});

// La verificación de la cuenta concluyó
tapipay.on("domiciliationVerificationCompleted", function (data) {
  console.log("Verificación:", data.method, data.outcome);
});

// El usuario confirmó la adhesión
tapipay.on("domiciliationConfirmed", function (data) {
  console.log("Confirmó:", data.enrollAllDebts, data.selectedProductsCount);
  // Muestra "estamos registrando tu domiciliación" y espera `autopayActivated`
});

// El chequeo en vivo de la CLABE o tarjeta rechazó el valor
tapipay.on("domiciliationAccountCheckFailed", function (data) {
  console.log("Chequeo rechazado:", data.bankId, data.reason);
});

interface TapipayDomiciliationBankSelectedEvent {
  bankId: string;    // id del banco en el catálogo de TapiPay
  speiCode: string;  // clave SPEI del banco
  name: string;      // nombre comercial del banco
}

interface TapipayDomiciliationFormCompletedEvent {
  bankId: string;
  accountType: "BANK_ACCOUNT" | "DEBIT_CARD";
  lastFour: string | null;               // últimos 4 dígitos de la CLABE o tarjeta
}

interface TapipayDomiciliationVerificationCompletedEvent {
  method: "penny" | "kyc" | "transfer";  // método con el que se verificó
  outcome: "approved" | "failed";
}

interface TapipayDomiciliationConfirmedEvent {
  enrollAllDebts: boolean;               // true si adhirió todas sus deudas
  selectedProductsCount: number;         // cuántos servicios seleccionó
}

interface TapipayDomiciliationAccountCheckFailedEvent {
  bankId: string;
  reason: "checksum" | "plaza" | "luhn" | "card_type_blocked" | "bank_mismatch";
}

<TapipayWidget
  organization="acme-corp"
  identifier={clienteId}
  view="autopay"
  onDomiciliationConfirmed={() => mostrarPantallaProcesando()}
  onDomiciliationAccountCheckFailed={(data) => registrar(data.reason)}
  onAutopayActivated={(data) => mostrarExito(data.lastFour)}
/>