Campo

Un campo donde el usuario captura un dato, y que se transforma según el "Tipo de campo": texto, texto largo, número, contraseña, correo, teléfono, fecha (calendario), hora, selector de color, interruptor, casilla, deslizador, deslizar para confirmar o lista de opciones. «Mostrar etiqueta» la apaga sin borrar el texto que le pusiste (para volver a prenderla tal cual); «Color de la etiqueta» solo aparece con ella prendida. «Bordes» (grosor por lado, radio por esquina, color y estilo) usa el mismo editor que Contenedor/Botón/Imagen, y solo aparece en las modalidades de caja. «Fondo», «Color del texto» y «Color del placeholder» solo aparecen en las modalidades que se ven como una caja (texto, texto largo, número, contraseña, correo, teléfono, fecha, hora y lista) — interruptor, casilla, deslizador, selector de color y «Deslizar para confirmar» ya tienen su propio look, con sus propios colores. DESLIZAR PARA CONFIRMAR (como en Uber): una pista con una pieza que se arrastra de izquierda a derecha. Se personaliza casi todo: el texto, el ícono de la pieza, los colores de la pista, el avance, la pieza, el ícono y el texto, el alto, el redondeo y el borde. El evento «Al llegar al porcentaje» corre cuando el usuario suelta la pieza habiendo llegado al % que elijas (por defecto 90): ahí pones la lógica (iniciar el viaje, enviar…), y el valor del campo trae el porcentaje. Si la suelta antes, regresa al inicio sola; al llegar puede regresar o quedarse al final. Con «Bloqueado» (que se puede cambiar con «Modificar control») no se deja deslizar. Su evento "Al cambiar el valor" se ejecuta cuando el usuario cambia algo (en los de texto, al terminar de editar; en los demás, al instante), y "Al confirmar (Enter)" al presionar Enter. Para usar lo que el usuario puso en tus pasos, abre el menú ▾ de cualquier campo y elige "Valor de un campo". Formatos: fecha AAAA-MM-DD, hora HH:MM, color #rrggbb, interruptor y casilla true/false.

Estilo

• Mostrar etiqueta
• Color de la etiqueta
• Fondo
• Color del texto
• Color del placeholder
• Color del borde
• Color de la pista
• Color del avance
• Color de la pieza
• Color del ícono
• Color del texto

Data

• Tipo de campo
• Etiqueta
• Placeholder
• Valor inicial
• Opciones (separadas por coma)
• Mínimo
• Máximo
• Paso
• Texto de la pista
• Ícono de la pieza
• Llegar al (%) para confirmar
• Después de llegar
• Bloqueado (no se puede deslizar)
• Alto de la pista (px)
• Redondeo (px)
• Grosor del borde (px)

Eventos

• Al cargar — Cuando el componente aparece en pantalla
• Al cambiar el valor — Cuando el usuario cambia el valor del campo (en los de texto, al terminar de editar)
• Al confirmar (Enter) — Cuando el usuario presiona Enter en el campo
• Al llegar al porcentaje — Cuando el usuario suelta la pieza deslizable habiendo llegado al porcentaje configurado (ej. deslizar para confirmar). El valor del campo trae el porcentaje