Input + popup

[Daniel-Sainero]

Goal

Poder usar mística con un componente input junto con un popup

Context

Actualmente usamos un componente custom para los campos de ICC, el comportamiento de nuestro input de ICC es el que tiene actualmente el componente cvvField pero sería necesario poder editar el contenido de la capa que aparece
al pulsar el icono de información (popup), ya que está muy acoplado a su uso exclusivo para el CVV.

Podría ser interesante tener un componente más genérico tipo textField + popup y permitir su uso en distintos casos

Impact

Estandarizar el compontent cvvField para un uso genérico

Discussion Questions

¿hacer configurable el mensaje del popup y el número de mensajes?

Additional considerations

No response

Do you have a visual proposal?

No response

[yceballost]

Buenas Daniel!

Veo dos cosas:

1. Entiendo que lo que te gustaría es que en cualquier input field puedas pasarle en la parte de la derecha un tooltip (u otra cosa)
2. Tengo la duda de si incluyeramos lo que comento en el punto 1, tb crees que deberíamos abrir el uso del tooltip en el CVV?. En el CVV vemos que un caso muy cerrado y es una solución que ya viene dada de Mística.

Puedes enlazar un archivo de Figma (enlace para evitar problemas de confidencialidad que este repo es publico) para entender mejor vuestra necesidad?

[Daniel-Sainero]

Hola!

1.- Eso sería lo ideal, poder usar tooltips en cualquier input que por su naturaleza necesitemos ofrecer más info al usuario y que no sea suficiente el placeholder o el label.

2.-Lo que habiamos pensado es abrir el componente CvvField para otros usos (pudiendo pasarle la información para el tooltip), ya que actualmente el texto no es editable y está muy acoplado al uso del CVV

3.- No tenemos el diseño de figma, actualmente nuestro componente se ve así: (input + enlace que abre una modal)

Gracias

[yceballost]

Genial, lo que haremos es permitir esa capacidad en los inputs más genéricos como el TextField, DecimalField, IntegerField, etc.

Para el caso del CVV como tiene un uso muy concreto vamos a dejarlo cerrado de momento, pero podrás montarte tu caso con un IntegerField + slot de la derecha + maxLength si es que lo necesitaras

Muchas gracias Daniel!

[yceballost]

Dejo por aquí la issue creada y cierro la discussion
#2039

[aweell]

Muy buenas! Existe el componente TextFieldBase que permitiría pasarle un tooltip o popover en la prop endIcon que puede resolver el problema.

Aquí un ejemplo: ICC field using textFieldBase

[Daniel-Sainero]

hola! genial, no habiamos pensado en pasarle un popover en la prop icon, muchas gracias!!!