Click to simulate loading state:

Loading State (static example)

Pager Component

• pa-pager - Pager container (centered by default)
• pa-pager--left - Left-align pager
• pa-pager--center - Center-align pager (default)
• pa-pager--right - Right-align pager
• pa-pager__container - Inner container for pager content
• pa-pager__controls - Container for navigation buttons
• pa-pager__info - Container for page info display
• pa-pager__input - Page number input field
• pa-pager__text - Text labels (e.g., "Page", "of 10")

Load More Component

• pa-load-more - Load more container (centered by default)
• pa-load-more--left - Left-align load more
• pa-load-more--center - Center-align load more (default)
• pa-load-more--right - Right-align load more
• pa-load-more__button - The load more button
• pa-load-more__button--loading - Loading state for button
• pa-load-more__spinner - Loading spinner element
• pa-load-more__text - Button text
• pa-load-more__count - Item count display