Affix

El componente Affix es un elemento flotante que permanece fijo dentro del viewport independientemente del scroll de la página. Su función principal es permitir al usuario regresar al inicio (top) mediante una única interacción sencilla.

Previsualización Rápida

Propósito

Facilitar la navegación en páginas o listados extensos, permitiendo al usuario volver rápidamente al inicio sin necesidad de realizar múltiples interacciones de desplazamiento (scroll).

Consideraciones Generales

Comportamiento según el dispositivo

Desktop: El componente aparece automáticamente solo cuando el desplazamiento supera el 100% del viewport (alto de la pantalla actual).
Mobile: Al superar el 100% del viewport, el componente se muestra en la esquina inferior derecha garantizando un área táctil accesible sin obstruir la lectura del contenido.

Interacciones

Click / Tap: Desplaza suavemente (smooth scroll) la pantalla hacia el inicio de la página (top: 0).
Scroll Up / Scroll Down: Aparece y desaparece dinámicamente según la posición del usuario en la página respecto al umbral del viewport.

Lineamientos de UX e Integración Layout

Componentes Relacionados

ActionIcon: Utilizado como base anatómica interna para renderizar la acción flotante con la flecha de retorno (ArrowUp).