View Source LightningWeb.Pagination (Lightning v2.10.4)
Pagination Components
This has been extracted and adapted from scrivener_html
.
See: https://github.com/mgwidmann/scrivener_html
Summary
Functions
Attributes
async_page
(Phoenix.LiveView.AsyncResult
) - Defaults tonil
.page
(:map
) (required)url
(:any
) (required)help_text
(:string
) - Defaults tonil
.
Slots
action
Returns the raw data in order to generate the proper HTML for pagination links. Data
is returned in a {text, page_number}
format where text
is intended to be the text
of the link and page_number
is the page it should go to. Defaults are already supplied
and they are as follows
Functions
Attributes
async_page
(Phoenix.LiveView.AsyncResult
) - Defaults tonil
.page
(:map
) (required)url
(:any
) (required)help_text
(:string
) - Defaults tonil
.
Slots
action
Returns the raw data in order to generate the proper HTML for pagination links. Data
is returned in a {text, page_number}
format where text
is intended to be the text
of the link and page_number
is the page it should go to. Defaults are already supplied
and they are as follows:
[distance: 5, next: :next, previous: :previous, first: true, last: true, ellipsis: :ellipsis]
distance
must be a positive non-zero integer or an exception is raised. next
and previous
should be
strings but can be anything you want as long as it is truthy, falsey values will remove
them from the output. first
and last
are only booleans, and they just include/remove
their respective link from output. An example of the data returned:
iex> Scrivener.HTML.raw_pagination_links(%{total_pages: 10, page_number: 5})
[{"<<", 4}, {1, 1}, {2, 2}, {3, 3}, {4, 4}, {5, 5}, {6, 6}, {7, 7}, {8, 8}, {9, 9}, {10, 10}, {">>", 6}]
iex> Scrivener.HTML.raw_pagination_links(%{total_pages: 20, page_number: 10}, first: ["←"], last: ["→"])
[{"<<", 9}, {["←"], 1}, {:ellipsis, {:safe, "…"}}, {5, 5}, {6, 6},{7, 7}, {8, 8}, {9, 9}, {10, 10}, {11, 11}, {12, 12}, {13, 13}, {14, 14},{15, 15}, {:ellipsis, {:safe, "…"}}, {["→"], 20}, {">>", 11}]
Simply loop and pattern match over each item and transform it to your custom HTML.