Pagination
Overview
En el sistema de diseño Energy, la paginación ayuda a que la navegación por contenidos extensos sea más clara, ágil y ordenada. En lugar de mostrar todo de golpe, se organiza la información en bloques accesibles, reduciendo la carga visual y mejorando la experiencia.
Este componente también aporta beneficios de accesibilidad, ya que permite a las personas entender en qué parte del recorrido se encuentran y cómo avanzar o retroceder de manera predecible.
En definitiva, la paginación es clave para orientar al usuario, mantener la interfaz limpia y garantizar una experiencia de uso coherente en los productos digitales de Repsol.
.jpg)
Variantes
Opciones
La paginación incluye opciones de configuración que la hacen más flexible según las necesidades de cada producto.
Jump To
Añade flechas para moverse directamente al inicio o al final de los elementos paginados, agilizando la navegación en listados muy largos.
.jpg)
Dropdown en versión texto
Despliega un panel para seleccionar la página deseada de forma rápida, ofreciendo una alternativa cómoda y accesible para el usuario.
.jpg)
Behaviour
El comportamiento de la paginación está definido para garantizar una experiencia consistente y clara. Queremos aseguramos de que la navegación entre páginas sea siempre predecible, accesible y coherente, independientemente del contexto en el que se use.
Constraints
Anchura: El item de página no permite más de tres cifras. El máximo de páginas del componente es de 999.

Ellipsis
En caso de que sepamos el número de páginas y sea mayor a 10, podremos mostrar la última página y una elipsis previa. Cuando estemos a la mitad + 1 será igual pero al contrario.
