pagy 4.0.0 → 4.5.0

data/lib/pagy/extras/countless.rb

@@ -1,22 +1,23 @@
 # See the Pagy documentation: https://ddnexus.github.io/pagy/extras/countless
-# encoding: utf-8
 # frozen_string_literal: true
 
 require 'pagy/countless'
 
 class Pagy
 
-  module Backend ; private         # the whole module is private so no problem with including it in a controller
+  module Backend
+    private         # the whole module is private so no problem with including it in a controller
 
     # Return Pagy object and items
     def pagy_countless(collection, vars={})
       pagy = Pagy::Countless.new(pagy_countless_get_vars(collection, vars))
-      return pagy, pagy_countless_get_items(collection, pagy)
+      [ pagy, pagy_countless_get_items(collection, pagy) ]
     end
 
     # Sub-method called only by #pagy_countless: here for easy customization of variables by overriding
     def pagy_countless_get_vars(_collection, vars)
-      vars[:page] ||= params[ vars[:page_param] || VARS[:page_param] ]
+      pagy_set_items_from_params(vars) if defined?(UseItemsExtra)
+      vars[:page]  ||= params[ vars[:page_param] || VARS[:page_param] ]
       vars
     end
 
@@ -26,7 +27,8 @@ class Pagy
       items      = collection.offset(pagy.offset).limit(pagy.items + 1).to_a
       items_size = items.size
       items.pop if items_size == pagy.items + 1
-      pagy.finalize(items_size)                  # finalize may adjust pagy.items, so must be used after checking the size
+      # finalize may adjust pagy.items, so must be used after checking the size
+      pagy.finalize(items_size)
       items
     end
 

data/lib/pagy/extras/elasticsearch_rails.rb

@@ -1,5 +1,4 @@
 # See the Pagy documentation: https://ddnexus.github.io/pagy/extras/elasticsearch_rails
-# encoding: utf-8
 # frozen_string_literal: true
 
 class Pagy
@@ -28,7 +27,8 @@ class Pagy
   end
 
   # Add specialized backend methods to paginate ElasticsearchRails searches
-  module Backend ; private
+  module Backend
+    private
 
     # Return Pagy object and items
     def pagy_elasticsearch_rails(pagy_search_args, vars={})
@@ -39,17 +39,19 @@ class Pagy
       response       = model.search(query_or_payload, **options)
       total          = response.respond_to?(:raw_response) ? response.raw_response['hits']['total'] : response.response['hits']['total']
       vars[:count]   = total.is_a?(Hash) ? total['value'] : total
+
       pagy = Pagy.new(vars)
       # with :last_page overflow we need to re-run the method in order to get the hits
-      if defined?(Pagy::Overflow) && pagy.overflow? && pagy.vars[:overflow] == :last_page
-        return pagy_elasticsearch_rails(pagy_search_args, vars.merge(page: pagy.page))
-      end
-      return pagy, called.empty? ? response : response.send(*called)
+      return pagy_elasticsearch_rails(pagy_search_args, vars.merge(page: pagy.page)) \
+             if defined?(Pagy::UseOverflowExtra) && pagy.overflow? && pagy.vars[:overflow] == :last_page
+
+      [ pagy, called.empty? ? response : response.send(*called) ]
     end
 
     # Sub-method called only by #pagy_elasticsearch_rails: here for easy customization of variables by overriding
     # the _collection argument is not available when the method is called
     def pagy_elasticsearch_rails_get_vars(_collection, vars)
+      pagy_set_items_from_params(vars) if defined?(UseItemsExtra)
       vars[:items] ||= VARS[:items]
       vars[:page]  ||= (params[ vars[:page_param] || VARS[:page_param] ] || 1).to_i
       vars

data/lib/pagy/extras/foundation.rb

@@ -1,5 +1,4 @@
 # See the Pagy documentation: https://ddnexus.github.io/pagy/extras/foundation
-# encoding: utf-8
 # frozen_string_literal: true
 
 require 'pagy/extras/shared'
@@ -8,50 +7,81 @@ class Pagy
   module Frontend
 
     # Pagination for Foundation: it returns the html with the series of links to the pages
-    def pagy_foundation_nav(pagy)
-      link, p_prev, p_next = pagy_link_proc(pagy), pagy.prev, pagy.next
+    def pagy_foundation_nav(pagy, pagy_id: nil, link_extra: '')
+      p_id = %( id="#{pagy_id}") if pagy_id
+      link = pagy_link_proc(pagy, link_extra: link_extra)
 
-      html = +(p_prev ? %(<li class="prev">#{link.call p_prev, pagy_t('pagy.nav.prev'), 'aria-label="previous"'}</li>)
-                      : %(<li class="prev disabled">#{pagy_t('pagy.nav.prev')}</li>))
+      html = +%(<nav#{p_id} class="pagy-foundation-nav" role="navigation" aria-label="Pagination"><ul class="pagination">)
+      html << pagy_foundation_prev_html(pagy, link)
       pagy.series.each do |item| # series example: [1, :gap, 7, 8, "9", 10, 11, :gap, 36]
-        html << if    item.is_a?(Integer); %(<li>#{link.call item}</li>)                        # page link
-                elsif item.is_a?(String) ; %(<li class="current">#{item}</li>)                  # active page
-                elsif item == :gap       ; %(<li class="ellipsis gap" aria-hidden="true"></li>) # page gap
+        html << case item
+                when Integer then %(<li>#{link.call item}</li>)                        # page link
+                when String  then %(<li class="current">#{item}</li>)                  # active page
+                when :gap    then %(<li class="ellipsis gap" aria-hidden="true"></li>) # page gap
                 end
       end
-      html << (p_next ? %(<li class="next">#{link.call p_next, pagy_t('pagy.nav.next'), 'aria-label="next"'}</li>)
-                      : %(<li class="next disabled">#{pagy_t('pagy.nav.next')}</li>))
-      %(<nav class="pagy-foundation-nav" role="navigation" aria-label="Pagination"><ul class="pagination">#{html}</ul></nav>)
+      html << pagy_foundation_next_html(pagy, link)
+      html << %(</ul></nav>)
     end
 
     # Javascript pagination for foundation: it returns a nav and a JSON tag used by the Pagy.nav javascript
-    def pagy_foundation_nav_js(pagy, id=pagy_id)
-      link, p_prev, p_next = pagy_link_proc(pagy), pagy.prev, pagy.next
-      tags = { 'before' => ( '<ul class="pagination">' \
-                           + (p_prev ? %(<li class="prev">#{link.call(p_prev, pagy_t('pagy.nav.prev'), 'aria-label="previous"')}</li>)
-                                     : %(<li class="prev disabled">#{pagy_t('pagy.nav.prev')}</li>)) ),
-               'link'   => %(<li>#{link.call(PAGE_PLACEHOLDER)}</li>),
+    def pagy_foundation_nav_js(pagy, deprecated_id=nil, pagy_id: nil, link_extra: '', steps: nil)
+      pagy_id = Pagy.deprecated_arg(:id, deprecated_id, :pagy_id, pagy_id) if deprecated_id
+      p_id = %( id="#{pagy_id}") if pagy_id
+      link = pagy_link_proc(pagy, link_extra: link_extra)
+      tags = { 'before' => %(<ul class="pagination">#{pagy_foundation_prev_html pagy, link}),
+               'link'   => %(<li>#{link.call PAGE_PLACEHOLDER}</li>),
                'active' => %(<li class="current">#{pagy.page}</li>),
                'gap'    => %(<li class="ellipsis gap" aria-hidden="true"></li>),
-               'after'  => ( (p_next ? %(<li class="next">#{link.call(p_next, pagy_t('pagy.nav.next'), 'aria-label="next"')}</li>)
-                                     : %(<li class="next disabled">#{pagy_t('pagy.nav.next')}</li>)) \
-                           + '</ul>' ) }
-      %(<nav id="#{id}" class="pagy-foundation-nav-js" role="navigation" aria-label="Pagination"></nav>#{pagy_json_tag(pagy, :nav, id, tags, pagy.sequels)})
+               'after'  => %(#{pagy_foundation_next_html pagy, link}</ul>) }
+
+      html = %(<nav#{p_id} class="pagy-njs pagy-foundation-nav-js" role="navigation" aria-label="Pagination"></nav>)
+      html << pagy_json_tag(pagy, :nav, tags, pagy.sequels(steps))
     end
 
     # Javascript combo pagination for Foundation: it returns a nav and a JSON tag used by the Pagy.combo_nav javascript
-    def pagy_foundation_combo_nav_js(pagy, id=pagy_id)
-      link, p_prev, p_next, p_page, p_pages = pagy_link_proc(pagy), pagy.prev, pagy.next, pagy.page, pagy.pages
-
-      html = %(<nav id="#{id}" class="pagy-foundation-combo-nav-js" role="navigation" aria-label="Pagination">) + %(<div class="input-group">)
-      html << (p_prev ? link.call(p_prev, pagy_t('pagy.nav.prev'), 'style="margin-bottom: 0px;" aria-label="previous" class="prev button primary"')
-                      : %(<a style="margin-bottom: 0px;" class="prev button primary disabled" href="#">#{pagy_t('pagy.nav.prev')}</a>))
-      input = %(<input class="input-group-field cell shrink" type="number" min="1" max="#{p_pages}" value="#{p_page}" style="width: #{p_pages.to_s.length+1}rem; padding: 0 0.3rem; margin: 0 0.3rem;">)
-      html << %(<span class="input-group-label">#{pagy_t('pagy.combo_nav_js', page_input: input, count: p_page, pages: p_pages)}</span>)
-      html << (p_next ? link.call(p_next, pagy_t('pagy.nav.next'), 'style="margin-bottom: 0px;" aria-label="next" class="next button primary"')
-                      : %(<a style="margin-bottom: 0px;" class="next button primary disabled" href="#">#{pagy_t('pagy.nav.next')}</a>))
-      html << %(</div></nav>#{pagy_json_tag(pagy, :combo_nav, id, p_page, pagy_marked_link(link))})
+    def pagy_foundation_combo_nav_js(pagy, deprecated_id=nil, pagy_id: nil, link_extra: '')
+      pagy_id = Pagy.deprecated_arg(:id, deprecated_id, :pagy_id, pagy_id) if deprecated_id
+      p_id    = %( id="#{pagy_id}") if pagy_id
+      link    = pagy_link_proc(pagy, link_extra: link_extra)
+      p_page  = pagy.page
+      p_pages = pagy.pages
+      input   = %(<input class="input-group-field cell shrink" type="number" min="1" max="#{p_pages}" value="#{p_page}" style="width: #{p_pages.to_s.length+1}rem; padding: 0 0.3rem; margin: 0 0.3rem;">)
+
+      %(<nav#{p_id} class="pagy-foundation-combo-nav-js" role="navigation" aria-label="Pagination"><div class="input-group">#{
+          if (p_prev  = pagy.prev)
+            link.call p_prev, pagy_t('pagy.nav.prev'), 'style="margin-bottom: 0px;" aria-label="previous" class="prev button primary"'
+          else
+            %(<a style="margin-bottom: 0px;" class="prev button primary disabled" href="#">#{pagy_t 'pagy.nav.prev'}</a>)
+          end
+      }<span class="input-group-label">#{pagy_t 'pagy.combo_nav_js', page_input: input, count: p_page, pages: p_pages}</span>#{
+          if (p_next  = pagy.next)
+            link.call p_next, pagy_t('pagy.nav.next'), 'style="margin-bottom: 0px;" aria-label="next" class="next button primary"'
+          else
+            %(<a style="margin-bottom: 0px;" class="next button primary disabled" href="#">#{pagy_t 'pagy.nav.next'}</a>)
+          end
+      }</div></nav>#{
+          pagy_json_tag pagy, :combo_nav, p_page, pagy_marked_link(link)
+      })
     end
 
+    private
+
+      def pagy_foundation_prev_html(pagy, link)
+        if (p_prev = pagy.prev)
+          %(<li class="prev">#{link.call p_prev, pagy_t('pagy.nav.prev'), 'aria-label="previous"'}</li>)
+        else
+          %(<li class="prev disabled">#{pagy_t 'pagy.nav.prev' }</li>)
+        end
+      end
+
+      def pagy_foundation_next_html(pagy, link)
+        if (p_next = pagy.next)
+          %(<li class="next">#{link.call p_next, pagy_t('pagy.nav.next'), 'aria-label="next"'}</li>)
+        else
+          %(<li class="next disabled">#{pagy_t 'pagy.nav.next'}</li>)
+        end
+      end
+
   end
 end

data/lib/pagy/extras/headers.rb

@@ -1,10 +1,10 @@
 # See the Pagy documentation: https://ddnexus.github.io/pagy/extras/headers
-# encoding: utf-8
 # frozen_string_literal: true
 
 class Pagy
   # Add specialized backend methods to add pagination response headers
-  module Backend ; private
+  module Backend
+    private
 
     VARS[:headers] = { page: 'Current-Page', items: 'Page-Items', count: 'Total-Count', pages: 'Total-Pages' }
 
@@ -15,17 +15,21 @@ class Pagy
     end
 
     def pagy_headers(pagy)
-      hash = pagy_headers_hash(pagy)
-      hash['Link'] = hash['Link'].map{|rel, link| %(<#{link}>; rel="#{rel}")}.join(', ')
-      hash
+      pagy_headers_hash(pagy).tap do |hash|
+        hash['Link'] = hash['Link'].map{|rel, link| %(<#{link}>; rel="#{rel}")}.join(', ')
+      end
     end
 
     def pagy_headers_hash(pagy)
       countless = defined?(Pagy::Countless) && pagy.is_a?(Pagy::Countless)
-      rels      = { 'first' => 1, 'prev' => pagy.prev, 'next' => pagy.next }; rels['last'] = pagy.last unless countless
-      url_str   = pagy_url_for(PAGE_PLACEHOLDER, pagy, :url)
-      hash      = { 'Link' => Hash[rels.map{|rel, n|[rel, url_str.sub(PAGE_PLACEHOLDER, n.to_s)] if n}.compact] }
-      headers   = pagy.vars[:headers]
+      rels = { 'first' => 1, 'prev' => pagy.prev, 'next' => pagy.next }
+      rels['last'] = pagy.last unless countless
+      url_str = pagy_url_for(pagy, PAGE_PLACEHOLDER, absolute: true)
+      hash    = { 'Link' => rels.filter_map do |rel, num|
+                              next unless num
+                              [ rel, url_str.sub(PAGE_PLACEHOLDER, num.to_s) ]
+                            end.to_h }
+      headers = pagy.vars[:headers]
       hash[headers[:page]]  = pagy.page.to_s         if headers[:page]
       hash[headers[:items]] = pagy.vars[:items].to_s if headers[:items]
       unless countless

data/lib/pagy/extras/i18n.rb

@@ -1,5 +1,4 @@
 # See the Pagy documentation: https://ddnexus.github.io/pagy/extras/i18n
-# encoding: utf-8
 # frozen_string_literal: true
 
 class Pagy
@@ -8,12 +7,16 @@ class Pagy
 
     ::I18n.load_path += Dir[Pagy.root.join('locales', '*.yml')]
 
-    Pagy::I18n.clear.instance_eval { undef :load; undef :t } # unload the pagy default constant for efficiency
+    # unload the pagy default constant for efficiency
+    Pagy::I18n.clear.instance_eval do
+      undef :load
+      undef :t
+    end
 
-    module I18n
+    module UseI18nGem
       def pagy_t(key, **opts) = ::I18n.t(key, **opts)
     end
-    prepend I18n
+    prepend UseI18nGem
 
   end
 end

data/lib/pagy/extras/items.rb

@@ -1,5 +1,4 @@
 # See the Pagy documentation: https://ddnexus.github.io/pagy/extras/items
-# encoding: utf-8
 # frozen_string_literal: true
 
 require 'pagy/extras/shared'
@@ -10,47 +9,43 @@ class Pagy
   VARS[:items_param] = :items
   VARS[:max_items]   = 100
 
+  VARS[:enable_items_extra] = true
+
   ITEMS_PLACEHOLDER = '__pagy_items__'
 
-  module Items ; private
+  module UseItemsExtra; end
+
+  module Backend
+    private
 
-    [:pagy_get_vars, :pagy_countless_get_vars, :pagy_elasticsearch_rails_get_vars, :pagy_searchkick_get_vars].each do |meth|
-      if Pagy::Backend.private_method_defined?(meth, true)
-        define_method(meth) do |collection, vars|
-          vars[:items] ||= (items = params[vars[:items_param] || VARS[:items_param]]) &&                           # :items from :items_param
-                           [items.to_i, vars.key?(:max_items) ? vars[:max_items] : VARS[:max_items]].compact.min   # :items capped to :max_items
-          super(collection, vars)
-        end
+      def pagy_set_items_from_params(vars)
+        return if vars[:items]
+        return unless vars.key?(:enable_item_extra) ? vars[:enable_item_extra] : VARS[:enable_items_extra]
+        return unless (items = params[vars[:items_param] || VARS[:items_param]])                               # :items from :items_param
+        vars[:items] = [items.to_i, vars.key?(:max_items) ? vars[:max_items] : VARS[:max_items]].compact.min   # :items capped to :max_items
       end
-    end
 
   end
-  Backend.prepend Items
-
 
   module Frontend
 
-    module Items
-      def pagy_url_for(page, pagy, url=false)
-        p_vars = pagy.vars; params = request.GET.merge(p_vars[:params]); params[p_vars[:page_param].to_s] = page
-        params[p_vars[:items_param].to_s] = p_vars[:items]
-        "#{request.base_url if url}#{request.path}?#{Rack::Utils.build_nested_query(pagy_get_params(params))}#{p_vars[:anchor]}"
-      end
-    end
-    prepend Items
-
     # Return the items selector HTML. For example "Show [20] items per page"
-    def pagy_items_selector_js(pagy, id=pagy_id)
+    def pagy_items_selector_js(pagy, deprecated_id=nil, pagy_id: nil, item_name: nil, i18n_key: nil, link_extra: '')
+      return '' unless pagy.vars[:enable_items_extra]
+      pagy_id        = Pagy.deprecated_arg(:id, deprecated_id, :pagy_id, pagy_id) if deprecated_id
+      p_id           = %( id="#{pagy_id}") if pagy_id
       p_vars         = pagy.vars
       p_items        = p_vars[:items]
       p_vars[:items] = ITEMS_PLACEHOLDER
-      link           = pagy_marked_link(pagy_link_proc(pagy))
+      link           = pagy_marked_link(pagy_link_proc(pagy, link_extra: link_extra))
       p_vars[:items] = p_items # restore the items
 
-      html = %(<span id="#{id}">)
+      html  = %(<span#{p_id} class="pagy-items-selector-js">)
       input = %(<input type="number" min="1" max="#{p_vars[:max_items]}" value="#{p_items}" style="padding: 0; text-align: center; width: #{p_items.to_s.length+1}rem;">)
-      html << %(#{pagy_t('pagy.items_selector_js', item_name: pagy_t(p_vars[:i18n_key], count: p_items), items_input: input, count: p_items)})
-      html << %(</span>#{pagy_json_tag(pagy, :items_selector, id, pagy.from, link)})
+      html << pagy_t('pagy.items_selector_js', item_name:   item_name || pagy_t(i18n_key || p_vars[:i18n_key], count: p_items),
+                                               items_input: input,
+                                               count:       p_items)
+      html << %(</span>#{pagy_json_tag pagy, :items_selector, pagy.from, link})
     end
 
   end

data/lib/pagy/extras/materialize.rb

@@ -1,5 +1,4 @@
 # See the Pagy documentation: https://ddnexus.github.io/pagy/extras/materialize
-# encoding: utf-8
 # frozen_string_literal: true
 
 require 'pagy/extras/shared'
@@ -8,52 +7,77 @@ class Pagy
   module Frontend
 
     # Pagination for materialize: it returns the html with the series of links to the pages
-    def pagy_materialize_nav(pagy)
-      link, p_prev, p_next = pagy_link_proc(pagy), pagy.prev, pagy.next
-      html = (p_prev ? %(<li class="waves-effect prev">#{link.call p_prev, '<i class="material-icons">chevron_left</i>', 'aria-label="previous"'}</li>)
-                     : +%(<li class="prev disabled"><a href="#"><i class="material-icons">chevron_left</i></a></li>))
+    def pagy_materialize_nav(pagy, pagy_id: nil, link_extra: '')
+      p_id = %( id="#{pagy_id}") if pagy_id
+      link = pagy_link_proc(pagy, link_extra: link_extra)
+
+      html = +%(<div#{p_id} class="pagy-materialize-nav pagination" role="navigation" aria-label="pager"><ul class="pagination">)
+      html << pagy_materialize_prev_html(pagy, link)
       pagy.series.each do |item| # series example: [1, :gap, 7, 8, "9", 10, 11, :gap, 36]
-        html << if    item.is_a?(Integer); %(<li class="waves-effect">#{link.call item}</li>)                                             # page link
-                elsif item.is_a?(String) ; %(<li class="active">#{link.call item}</li>)                                                   # active page
-                elsif item == :gap       ; %(<li class="gap disabled"><a href="#">#{pagy_t('pagy.nav.gap')}</a></li>)   # page gap
+        html << case item
+                when Integer then %(<li class="waves-effect">#{link.call item}</li>)                           # page link
+                when String  then %(<li class="active">#{link.call item}</li>)                                 # active page
+                when :gap    then %(<li class="gap disabled"><a href="#">#{pagy_t 'pagy.nav.gap'}</a></li>)    # page gap
                 end
       end
-      html << (p_next ? %(<li class="waves-effect next">#{link.call p_next, '<i class="material-icons">chevron_right</i>', 'aria-label="next"'}</li>)
-                      : %(<li class="next disabled"><a href="#"><i class="material-icons">chevron_right</i></a></li>))
-      %(<div class="pagy-materialize-nav pagination" role="navigation" aria-label="pager"><ul class="pagination">#{html}</ul></div>)
+      html << pagy_materialize_next_html(pagy, link)
+      html << %(</ul></div>)
     end
 
     # Javascript pagination for materialize: it returns a nav and a JSON tag used by the Pagy.nav javascript
-    def pagy_materialize_nav_js(pagy, id=pagy_id)
-      link, p_prev, p_next = pagy_link_proc(pagy), pagy.prev, pagy.next
-      tags = { 'before' => ( '<ul class="pagination">' \
-                           + (p_prev  ? %(<li class="waves-effect prev">#{link.call(p_prev, '<i class="material-icons">chevron_left</i>', 'aria-label="previous"')}</li>)
-                                      : %(<li class="prev disabled"><a href="#"><i class="material-icons">chevron_left</i></a></li>)) ),
+    def pagy_materialize_nav_js(pagy, deprecated_id=nil, pagy_id: nil, link_extra: '', steps: nil)
+      pagy_id = Pagy.deprecated_arg(:id, deprecated_id, :pagy_id, pagy_id) if deprecated_id
+      p_id = %( id="#{pagy_id}") if pagy_id
+      link = pagy_link_proc(pagy, link_extra: link_extra)
+
+      tags = { 'before' => %(<ul class="pagination">#{pagy_materialize_prev_html pagy, link}),
                'link'   => %(<li class="waves-effect">#{mark = link.call(PAGE_PLACEHOLDER)}</li>),
                'active' => %(<li class="active">#{mark}</li>),
-               'gap'    => %(<li class="gap disabled"><a href="#">#{pagy_t('pagy.nav.gap')}</a></li>),
-               'after'  => ( (p_next ? %(<li class="waves-effect next">#{link.call(p_next, '<i class="material-icons">chevron_right</i>', 'aria-label="next"')}</li>)
-                                     : %(<li class="next disabled"><a href="#"><i class="material-icons">chevron_right</i></a></li>)) \
-                           + '</ul>' ) }
-      %(<div id="#{id}" class="pagy-materialize-nav-js" role="navigation" aria-label="pager"></div>#{pagy_json_tag(pagy, :nav, id, tags, pagy.sequels)})
+               'gap'    => %(<li class="gap disabled"><a href="#">#{pagy_t 'pagy.nav.gap'}</a></li>),
+               'after'  => %(#{pagy_materialize_next_html pagy, link}</ul>) }
+
+      html = %(<div#{p_id} class="pagy-njs pagy-materialize-nav-js" role="navigation" aria-label="pager"></div>)
+      html << pagy_json_tag(pagy, :nav, tags, pagy.sequels(steps))
     end
 
     # Javascript combo pagination for materialize: it returns a nav and a JSON tag used by the Pagy.combo_nav javascript
-    def pagy_materialize_combo_nav_js(pagy, id=pagy_id)
-      link, p_prev, p_next, p_page, p_pages = pagy_link_proc(pagy), pagy.prev, pagy.next, pagy.page, pagy.pages
-
-      html = %(<div id="#{id}" class="pagy-materialize-combo-nav-js pagination" role="navigation" aria-label="pager">) \
-           + %(<div class="pagy-compact-chip role="group" style="height: 35px; border-radius: 18px; background: #e4e4e4; display: inline-block;">)
-      html << '<ul class="pagination" style="margin: 0px;">'
-      li_style = 'style="vertical-align: middle;"'
-      html << (p_prev ? %(<li class="waves-effect prev" #{li_style}>#{link.call p_prev, '<i class="material-icons">chevron_left</i>', 'aria-label="previous"'}</li>)
-                      : %(<li class="prev disabled" #{li_style}><a href="#"><i class="material-icons">chevron_left</i></a></li>))
-      input = %(<input type="number" class="browser-default" min="1" max="#{p_pages}" value="#{p_page}" style="padding: 2px; border: none; border-radius: 2px; text-align: center; width: #{p_pages.to_s.length+1}rem;">)
-      html << %(<div class="pagy-combo-input btn-flat" style="cursor: default; padding: 0px">#{pagy_t('pagy.combo_nav_js', page_input: input, count: p_page, pages: p_pages)}</div>)
-      html << (p_next ? %(<li class="waves-effect next" #{li_style}>#{link.call p_next, '<i class="material-icons">chevron_right</i>', 'aria-label="next"'}</li>)
-                      : %(<li class="next disabled" #{li_style}><a href="#"><i class="material-icons">chevron_right</i></a></li>))
-      html << %(</ul></div>#{pagy_json_tag(pagy, :combo_nav, id, p_page, pagy_marked_link(link))})
+    def pagy_materialize_combo_nav_js(pagy, deprecated_id=nil, pagy_id: nil, link_extra: '')
+      pagy_id = Pagy.deprecated_arg(:id, deprecated_id, :pagy_id, pagy_id) if deprecated_id
+      p_id    = %( id="#{pagy_id}") if pagy_id
+      link    = pagy_link_proc(pagy, link_extra: link_extra)
+      p_page  = pagy.page
+      p_pages = pagy.pages
+      style   = ' style="vertical-align: middle;"'
+      input   = %(<input type="number" class="browser-default" min="1" max="#{p_pages}" value="#{p_page}" style="padding: 2px; border: none; border-radius: 2px; text-align: center; width: #{p_pages.to_s.length+1}rem;">)
+
+      %(<div#{p_id} class="pagy-materialize-combo-nav-js pagination" role="navigation" aria-label="pager"><div class="pagy-compact-chip role="group" style="height: 35px; border-radius: 18px; background: #e4e4e4; display: inline-block;"><ul class="pagination" style="margin: 0px;">#{
+          pagy_materialize_prev_html pagy, link, style
+      }<div class="pagy-combo-input btn-flat" style="cursor: default; padding: 0px">#{
+          pagy_t 'pagy.combo_nav_js', page_input: input, count: p_page, pages: p_pages
+      }</div>#{
+          pagy_materialize_next_html pagy, link, style
+      }</ul></div>#{
+          pagy_json_tag pagy, :combo_nav, p_page, pagy_marked_link(link)
+      })
     end
 
+    private
+
+      def pagy_materialize_prev_html(pagy, link, style='')
+        if (p_prev = pagy.prev)
+          %(<li class="waves-effect prev"#{style}>#{link.call p_prev, '<i class="material-icons">chevron_left</i>', 'aria-label="previous"'}</li>)
+        else
+          %(<li class="prev disabled"#{style}><a href="#"><i class="material-icons">chevron_left</i></a></li>)
+        end
+      end
+
+      def pagy_materialize_next_html(pagy, link, style='')
+        if (p_next = pagy.next)
+          %(<li class="waves-effect next"#{style}>#{link.call p_next, '<i class="material-icons">chevron_right</i>', 'aria-label="next"'}</li>)
+        else
+          %(<li class="next disabled"#{style}><a href="#"><i class="material-icons">chevron_right</i></a></li>)
+        end
+      end
+
   end
 end