0.25.0

Added

• Add guide about load-more buttons and infinite scroll.
• Add guide about CSS styles.
• Add guide about page size controls.

Changed

• Remove opts attribute from Flop.Phoenix.pagination/1 and remove
  configuration of the pagination component via application environment.
• Remove all default classes from pagination component.
• Remove wrapper_attrs from pagination component in favor of global
  attributes.
• Set page link aria label function with page_link_aria_label_fun attribute
  on Flop.Phoenix.pagination/1 component instead of using
  pagination_link_aria_label option.
• Set previous and next link attributes and content with slots instead of
  options.
• Set ellipsis content with slot instead of option.
• Set pagination list attributes with page_list_attrs attribute instead of
  pagination_list_attrs option.
• Set pagination list item attributes with page_list_item_attrs attribute
  instead of pagination_list_item_attrs option.
• Set pagination link attributes with page_link_attrs attribute
  instead of pagination_link_attrs option.
• Set current pagination link attributes with current_page_link_attrs
  attribute instead of current_link_attrs option.
• Set disabled link attributes with disabled_link_attrs attribute instead of
  disabled_attrs option.
• Remove default classes for pagination root element, pagination list and
  pagination links.
• Use <button> elements for pagination if no path is set.
• Remove role attribute from the pagination component. The <nav> element
  already has the implicit ARIA role navigation.
• Add rel attribute to previous/next links.
• Mark up disabled previous/next links of the pagination component as
  <a role="link" aria-disabled="true"> instead of <span>.
• Update documentation for hidden_inputs_for_filter/1 to use
  Phoenix.Component.inputs_for/1 with the skip_persistent_id option.
• Require Phoenix >= 1.6.0 and < 1.9.0.

How to upgrade

The configuration via pagination_opts is deprecated. Instead of referencing a
function that returns the pagination opts, it is recommended to define a
component that wraps the Flop.Phoenix.pagination/1 component and sets the
necessary attributes.

Follow the upgrade guide of version 0.24.0 to update the pagination component
configuration, including the removal of the application configuration, if you
haven't done so already.

Remove the wrapper_opts from your pagination options and pass them directly
as attributes instead.

  <Flop.Phoenix.pagination
    meta={@meta}
    path={@path}
    opts={[
-     wrapper_attrs: [
-       class: "pagination",
-       aria: [label: "Quppernerit"]
-     ]
    ]}
+   class="pagination"
+   aria-label="Quppernerit"
  />

Replace the :previous_link_attrs, :previous_link_content, next_link_attrs,
and next_link_content attributes with the previous and next slots.

  <Flop.Phoenix.pagination
    meta={@meta}
    path={@path}
    opts={[
-     previous_link_attrs: [class: "previous"],
-     previous_link_content: Phoenix.HTML.raw(~s(<i class="fas fa-chevron-left" />)),
-     next_link_attrs: [class: "next"],
-     next_link_content: Phoenix.HTML.raw(~s(<i class="fas fa-chevron-right" />))
    ]}
- />
+ >
+   <:previous attrs={[class: "previous"]}>
+     <i class="fas fa-chevron-left" />
+   </:previous>
+   <:next attrs={[class: "next"]}>
+     <i class="fas fa-chevron-right" />
+   </:next>
+ </Flop.Phoenix.pagination>

Replace the :ellipsis_attrs and :ellipsis_content attributes with the
ellipsis slot.

  <Flop.Phoenix.pagination
    meta={@meta}
    path={@path}
    opts={[
-     ellipsis_attrs: [class: "ellipsis", aria-hidden: "true"],
-     elipsis_content: "‥"
    ]}
- />
+ >
+   <:ellipsis>
+     <span class="ellipsis" aria-hidden="true">‥</span>
+   </:ellipsis>
+ </Flop.Phoenix.pagination>

Remove the :disabled_attrs option. Note that the disabled and
aria-disabled attributes are set automatically and do not need to be passed
here.

To style disabled links/buttons without a CSS class, use the CSS selector
[disabled], [aria-disabled="true"].

  <Flop.Phoenix.pagination
    meta={@meta}
    path={@path}
    opts={[
-     disabled_attrs: [class: "is-disabled"]
    ]}
+     disabled_link_attrs: [class: "is-disabled"]
  >

Remove the :pagination_link_aria_label option and set the
page_link_aria_label_fun attribute instead.

  <Flop.Phoenix.pagination
    meta={@meta}
    path={@path}
    opts={[
-     pagination_link_aria_label: &"#{&1}ページ目へ"
    ]}
+     page_link_aria_label_fun={&"#{&1}ページ目へ"}
  >

Remove the :pagination_list_attrs, :pagination_list_item_attrs,
:pagination_link_attrs, and :current_link_attrs options and set the
page_list_attrs, page_list_item_attrs, page_link_attrs, and
current_page_link_attrs attributes instead. If you relied on the default page
list class and page link classes, set them explicitly. Note that the
aria-current attribute is set automatically and does not need to be set here.

To style the current page link without a CSS class, use the CSS selector
[aria-current="page"].

  <Flop.Phoenix.pagination
    meta={@meta}
    path={@path}
    opts={[
-     pagination_list_attrs: [class: "pagination-list"]
-     pagination_list_item_attrs: [class: "pagination-list-item"]
-     pagination_link_attrs: [class: "pagination-link"]
-     current_link_attrs: [
-       class: "pagination-link is-current",
-       aria: [current: "page"]
-     ]
    ]}
+     page_list_attrs={[class: "pagination-list"]}
+     page_list_item_attrs={[class: "pagination-list-item"]}
+     page_link_attrs={[class: "pagination-link"]}
+     current_page_link_attrs={[class: "pagination-link is-current"]}
  >

Ensure that your CSS styles work with both <a> elements (used when a path is
set) and <button> elements (used when no path is set). Check the appearance
of the pagination component carefully.