Skip to content

Commit

Permalink
Add pagination component
Browse files Browse the repository at this point in the history
  • Loading branch information
iwdt committed Dec 26, 2024
1 parent e4d59b4 commit 5b3864b
Show file tree
Hide file tree
Showing 11 changed files with 348 additions and 0 deletions.
30 changes: 30 additions & 0 deletions app/components/bulma/components/pagination/ellipsis_component.rb
Original file line number Diff line number Diff line change
@@ -0,0 +1,30 @@
module Bulma
module Components
module Pagination
class EllipsisComponent < ApplicationComponent
ELLIPSIS_ENTITY_NAME = "&hellip;".html_safe

self.root_tag = :li

style do
base { "pagination-ellipsis" }
end

def initialize(text = ELLIPSIS_ENTITY_NAME, **html_attributes)
@text = text
super(**html_attributes)
end

def call
content_tag root_tag do
content_tag(
:span,
content? ? content : @text,
**root_attributes
)
end
end
end
end
end
end
49 changes: 49 additions & 0 deletions app/components/bulma/components/pagination/link_component.rb
Original file line number Diff line number Diff line change
@@ -0,0 +1,49 @@
module Bulma
module Components
module Pagination
class LinkComponent < ApplicationComponent
self.root_tag = :li

style do
base { "pagination-link" }
variants do
# steep:ignore:start
current do
yes { "is-current" }
end
disabled do
yes { "is-disabled" }
end
# steep:ignore:end
end
end

def initialize(name = nil, options = nil, disabled: false, current: false, **html_attributes)
@name = name
@options = options
@current = current
@disabled = disabled

super(**html_attributes)
end

def call
content_tag(root_tag, pager_link)
end

private

def pager_link
html_options = root_attributes(current: @current, disabled: @disabled)

if content?
html_options = @options.merge(html_options) if @options.is_a?(Hash)
return link_to(@name, html_options) { content }
end

link_to(@name, @options, html_options)
end
end
end
end
end
37 changes: 37 additions & 0 deletions app/components/bulma/components/pagination/next_component.rb
Original file line number Diff line number Diff line change
@@ -0,0 +1,37 @@
module Bulma
module Components
module Pagination
class NextComponent < ApplicationComponent
style do
base { "pagination-next" }
variants do
# steep:ignore:start
disabled do
yes { "is-disabled" }
end
# steep:ignore:end
end
end

def initialize(name = nil, options = nil, disabled: false, **html_attributes)
@name = name
@options = options
@disabled = disabled

super(**html_attributes)
end

def call
html_options = root_attributes(disabled: @disabled)

if content?
html_options = @options.merge(html_options) if @options.is_a?(Hash)
return link_to(@name, html_options) { content }
end

link_to(@name, @options, html_options)
end
end
end
end
end
37 changes: 37 additions & 0 deletions app/components/bulma/components/pagination/prev_component.rb
Original file line number Diff line number Diff line change
@@ -0,0 +1,37 @@
module Bulma
module Components
module Pagination
class PrevComponent < ApplicationComponent
style do
base { "pagination-previous" }
variants do
# steep:ignore:start
disabled do
yes { "is-disabled" }
end
# steep:ignore:end
end
end

def initialize(name = nil, options = nil, disabled: false, **html_attributes)
@name = name
@options = options
@disabled = disabled

super(**html_attributes)
end

def call
html_options = root_attributes(disabled: @disabled)

if content?
html_options = @options.merge(html_options) if @options.is_a?(Hash)
return link_to(@name, html_options) { content }
end

link_to(@name, @options, html_options)
end
end
end
end
end
86 changes: 86 additions & 0 deletions app/components/bulma/components/pagination_component.rb
Original file line number Diff line number Diff line change
@@ -0,0 +1,86 @@
module Bulma
module Components
class PaginationComponent < ApplicationComponent
self.root_tag = :nav

# @dynamic pager_prev, with_pager_prev
renders_one :pager_prev, Pagination::PrevComponent
# @dynamic pager_next, with_pager_next
renders_one :pager_next, Pagination::NextComponent

# @dynamic pager_items, with_pager_item_link, with_pager_item_ellipsis
renders_many :pager_items, types: {
link: Pagination::LinkComponent,
ellipsis: Pagination::EllipsisComponent
}

style do
base { "pagination" }
variants do
# steep:ignore:start
rounded do
yes { "is-rounded" }
end
order do
left { "is-left" }
center { "is-centered" }
right { "is-right" }
end
size do
small { "is-small" }
normal { "is-normal" }
medium { "is-medium" }
large { "is-large" }
end
# steep:ignore:end
end
end

style :list do
base { "pagination-list" }
end

def initialize(rounded: false, size: nil, order: nil, **html_attributes)
@rounded = rounded
@size = size
@order = order

super(**html_attributes)
end

def call
content_tag(
root_tag,
safe_join([pager_prev, pager_next, pager_list]),
**root_attributes(size: @size, order: @order, rounded: @rounded)
)
end

private :with_pager_prev
def prev(name = nil, option = nil, **html_attributes, &block)
with_pager_prev(name, option, **html_attributes, &block)
end

private :with_pager_next
def next(name = nil, option = nil, **html_attributes, &block)
with_pager_next(name, option, **html_attributes, &block)
end

private :with_pager_item_link
def page(name = nil, option = nil, **html_attributes, &block)
with_pager_item_link(name, option, **html_attributes, &block)
end

private :with_pager_item_ellipsis
def ellipsis(text = Pagination::EllipsisComponent::ELLIPSIS_ENTITY_NAME, **html_attributes, &block)
with_pager_item_ellipsis(text, **html_attributes, &block)
end

private

def pager_list
content_tag :ul, safe_join(pager_items), class: style(:list)
end
end
end
end
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
module Bulma
module Components
module Pagination
class EllipsisComponent < ApplicationComponent
ELLIPSIS_ENTITY_NAME: String

@text: String?

def initialize: (?String? text, **untyped html_attributes) -> void
end
end
end
end
17 changes: 17 additions & 0 deletions sig/app/components/bulma/components/pagination/link_component.rbs
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
module Bulma
module Components
module Pagination
class LinkComponent < ApplicationComponent
@name: untyped?
@options: untyped?
@current: bool?
@disabled: bool?
def initialize: (?untyped?, ?untyped?, ?disabled: bool?, ?current: bool?, **untyped) -> void

private

def pager_link: -> String
end
end
end
end
12 changes: 12 additions & 0 deletions sig/app/components/bulma/components/pagination/next_component.rbs
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
module Bulma
module Components
module Pagination
class NextComponent < ApplicationComponent
@name: untyped?
@options: untyped?
@disabled: bool?
def initialize: (?untyped?, ?untyped?, ?disabled: bool?, **untyped) -> void
end
end
end
end
12 changes: 12 additions & 0 deletions sig/app/components/bulma/components/pagination/prev_component.rbs
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
module Bulma
module Components
module Pagination
class PrevComponent < ApplicationComponent
@name: untyped?
@options: untyped?
@disabled: bool?
def initialize: (?untyped?, ?untyped?, ?disabled: bool?, **untyped) -> void
end
end
end
end
29 changes: 29 additions & 0 deletions sig/app/components/bulma/components/pagination_component.rbs
Original file line number Diff line number Diff line change
@@ -0,0 +1,29 @@
module Bulma
module Components
class PaginationComponent < ApplicationComponent
type order = :left | :center | :right
type size = :small | :normal | :medium | :large

@order: order?
@rounded: bool?
@size: size?
def initialize: (?rounded: bool?, ?size: size?, ?order: order?, **untyped) -> void

def prev: (?untyped, ?untyped, **untyped) ?{ (?Pagination::PrevComponent component) -> String } -> Pagination::PrevComponent
def next: (?untyped, ?untyped, **untyped) ?{ (?Pagination::NextComponent component) -> String } -> Pagination::NextComponent
def page: (?untyped, ?untyped, **untyped) ?{ (?Pagination::LinkComponent component) -> String } -> Pagination::LinkComponent
def ellipsis: (?String, **untyped) ?{ (?Pagination::EllipsisComponent component) -> String } -> Pagination::EllipsisComponent

private

def pager_prev: -> Pagination::PrevComponent
def pager_next: -> Pagination::NextComponent
def pager_list: -> String
def pager_items: -> Array[Pagination::LinkComponent | Pagination::EllipsisComponent]
def with_pager_prev: (?untyped, ?untyped, **untyped) ?{ (?Pagination::PrevComponent component) -> String } -> Pagination::PrevComponent
def with_pager_next: (?untyped, ?untyped, **untyped) ?{ (?Pagination::NextComponent component) -> String } -> Pagination::NextComponent
def with_pager_item_link: (?untyped, ?untyped, **untyped) ?{ (?Pagination::LinkComponent component) -> String } -> Pagination::LinkComponent
def with_pager_item_ellipsis: (?String, **untyped) ?{ (?Pagination::EllipsisComponent component) -> String } -> Pagination::EllipsisComponent
end
end
end
26 changes: 26 additions & 0 deletions test/app/components/bulma/components/pagination_component_test.rb
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
require "test_helper"

module Bulma
module Components
class PaginationComponentTest < ViewComponents::TestCase
def test_render_component
component = PaginationComponent.new
render_inline(component) do |pager|
pager.prev "Previous", "#"
pager.next "Next page", "#"

pager.page 1, "#", aria: {label: "Goto page 1"}
pager.ellipsis
pager.page("#", aria: {label: "Goto page 45"}) { "45" }
pager.page 46, "#", current: true, aria: {current: :page, label: "Current page"}
pager.page 47, "#", aria: {label: "Goto page 47"}
pager.ellipsis { tag.b("...") }
pager.page 86, "#", aria: {label: "Goto page 86"}
end
assert_component_rendered
binding.irb
# TODO: Write more tests
end
end
end
end

0 comments on commit 5b3864b

Please sign in to comment.