Noora (0.11.0)

Pagination Group

Basic pagination scenarios with different page positions Open in playground 
<.pagination_group
  page_patch={fn page -> "?page=#{page}" end}
  current_page={1}
  number_of_pages={12}
/>
<.pagination_group
  page_patch={fn page -> "?page=#{page}" end}
  current_page={6}
  number_of_pages={12}
/>
<.pagination_group
  page_patch={fn page -> "?page=#{page}" end}
  current_page={12}
  number_of_pages={12}
/>
<.pagination_group
  page_patch={fn page -> "?page=#{page}" end}
  current_page={2}
  number_of_pages={12}
/>
Different total page counts showing ellipsis behavior Open in playground
1 2 3 4 5
1 ... 24 25 26 ... 50
1 ... 499 500 501 ... 999 
<.pagination_group page_patch={fn page -> "?page=#{page}" end} current_page={3} number_of_pages={5}/>
<.pagination_group
  page_patch={fn page -> "?page=#{page}" end}
  current_page={25}
  number_of_pages={50}
/>
<.pagination_group
  page_patch={fn page -> "?page=#{page}" end}
  current_page={500}
  number_of_pages={999}
/>
Edge cases and special scenarios Open in playground 
<.pagination_group page_patch={fn page -> "?page=#{page}" end} current_page={1} number_of_pages={1}/>
<.pagination_group page_patch={fn page -> "?page=#{page}" end} current_page={1} number_of_pages={2}/>
<.pagination_group page_patch={fn page -> "?page=#{page}" end} current_page={2} number_of_pages={2}/>
<.pagination_group
  page_patch={fn page -> "?page=#{page}" end}
  current_page={3}
  number_of_pages={20}
/>
<.pagination_group
  page_patch={fn page -> "?page=#{page}" end}
  current_page={18}
  number_of_pages={20}
/>