API

    <div class="flex flex-wrap items-center gap-space">
  <.action phx-click={Corex.Pagination.set_page("pagination-api-bind", 1)} class="button ui-size-sm">1</.action>
  <.action phx-click={Corex.Pagination.set_page("pagination-api-bind", 5)} class="button ui-size-sm">5</.action>
  <.action phx-click={Corex.Pagination.set_page("pagination-api-bind", 9)} class="button ui-size-sm">9</.action>
</div>
<.pagination id="pagination-api-bind" class="pagination" count={95} page={5} page_size={10}>
  <:prev_trigger><.heroicon name="hero-chevron-left" /></:prev_trigger>
  <:next_trigger><.heroicon name="hero-chevron-right" /></:next_trigger>
  <:ellipsis><.heroicon name="hero-ellipsis-horizontal" /></:ellipsis>
</.pagination>

  

    <.action phx-click="pagination_api_page_3" class="button ui-size-sm">Page 3</.action>
<.pagination id="pagination-api-srv" class="pagination" count={95} page={@page} page_size={10} controlled on_page_change="pagination_api_page_changed">
  <:prev_trigger><.heroicon name="hero-chevron-left" /></:prev_trigger>
  <:next_trigger><.heroicon name="hero-chevron-right" /></:next_trigger>
  <:ellipsis><.heroicon name="hero-ellipsis-horizontal" /></:ellipsis>
</.pagination>

  

    def handle_event("pagination_api_page_3", _, socket) do
  {:noreply, Corex.Pagination.set_page(socket, "pagination-api-srv", 3)}
end

def handle_event("pagination_api_page_changed", %{"page" => page}, socket) do
  {:noreply, assign(socket, :page, page)}
end