¿Cómo validar un form que usa Wallet?

[acyment]

Estoy usando el componente Wallet como botón de un form y quisiera poder implementar alguna de estas dos estrategias para la validación del form:

• Cambiar el Wallet a un estado "disabled" (como se haría con un botón típico de Submit - idealmente gris y con cursor de not-allowed). No encuentro ningun atributo que permita hacer esto.
• Capturar el onSubmit y poder frenar el proceso si el form no valida. Cuando hago esto (por ejemplo devolviendo un Promise con reject) el form no hace el submit, pero aparece el cartel de Redirigiendo y el botón no vuelve a aparecer

Entiendo que es un caso de uso bastante común, pero no logro encontrar un ejemplo que lo implemente de estas u otras maneras. Muchas gracias

[icaldana]

Hola, buenas!

En primer lugar, perdón por la demora en responderte. Ahora sobre su pregunta:

El Wallet Brick te permite ofrecer pagos desde tu cuenta de Mercado Pago en cualquier etapa del proceso de compra, pero no fue diseñado para acoplarse a un formulario de pago, ejerciendo la funcionalidad de un botón de submit. En verdad, los usos recomendables son:

• Con el uso de una preferencia creada antes de la inicialización del Brick (caso de uso de ejemplo: carrito)
• Sin el uso de una preferencia ya creada, pero que se crea en el envío (ejemplo de caso de uso: one-click shop)

Por las características que mencionaste, se recomendaría usar el Payment Brick, un formulario completo con varias opciones de pago disponibles, con responsividad, manejo de errores y varias opciones de personalización.

[icaldana]

Hola @acyment!

Capturar el onSubmit y poder frenar el proceso si el form no válida. Cuando hago esto (por ejemplo devolviendo un Promise con reject) el form no hace el submit, pero aparece el cartel de Redirigiendo y el botón no vuelve a aparecer

Sobre ese punto, una posibilidad sería utilizar el flujo de enviar la preference en submit, pero solo cuando el formulario se haya completado correctamente. Dejo un ejemplo de cómo se comportaría el Wallet en este caso (con una preference vacía):

wallet_sin_preference.mov