PtahUi.Components.Pagination (PtahUI v0.1.0)

Copy Markdown View Source

Generic join-based pagination component — groups buttons with shared borders (the DaisyUI join pattern).

Example

<.pager>
  <:item disabled>«</:item>
  <:item active={@page == 1} on_click={JS.push("goto", value: %{page: 1})}>1</:item>
  <:item active={@page == 2} on_click={JS.push("goto", value: %{page: 2})}>2</:item>
  <:item on_click={JS.push("goto", value: %{page: @page + 1})}>»</:item>
</.pager>

Summary

Functions

pager(assigns)

Functions

pager(assigns)

Attributes

  • size (:string) - Size of each page button. Defaults to "md".
  • direction (:string) - Layout direction. Defaults to "horizontal".
  • equal_width (:boolean) - Stretch all items to equal width (useful for Prev/Next two-button layout). Defaults to false.
  • class (:string) - Defaults to nil.
  • Global attributes are accepted.

Slots

  • item (required) - A single page button or nav link. Accepts attributes:
    • active (:boolean) - Marks this page as current (dark fill).
    • disabled (:boolean) - Grays out and disables the button.
    • on_click (:any) - phx-click event.
    • href (:string) - Renders an <a> tag instead of a button.
    • class (:string)