diff --git a/app/components/tailwinds/table/cell_component.html.haml b/app/components/tailwinds/table/cell_component.html.haml index 0ce514ad..ceb30b47 100644 --- a/app/components/tailwinds/table/cell_component.html.haml +++ b/app/components/tailwinds/table/cell_component.html.haml @@ -1,2 +1,2 @@ -.div-table-cell.px-6.py-4.font-medium.text-gray-900.whitespace-nowrap.dark:text-white.text-xs.sm:text-base += cell_tag do = content diff --git a/app/components/tailwinds/table/cell_component.rb b/app/components/tailwinds/table/cell_component.rb index 009fddd2..7e59b878 100644 --- a/app/components/tailwinds/table/cell_component.rb +++ b/app/components/tailwinds/table/cell_component.rb @@ -4,6 +4,23 @@ module Tailwinds module Table # Component for rendering a cell in a table class CellComponent < Tramway::Component::Base + option :options, optional: true, default: -> { {} } + + def cell_tag + classes = [*default_classes, options[:class]].join(' ') + + tag.div(**options, class: classes) do + yield if block_given? + end + end + + private + + def default_classes + [ + 'div-table-cell', 'px-6', 'py-4', 'font-medium', 'text-gray-900', 'whitespace-nowrap', 'dark:text-white', 'text-xs.sm:text-base' + ] + end end end end diff --git a/app/components/tailwinds/table/header_component.html.haml b/app/components/tailwinds/table/header_component.html.haml index bec2f374..250f65d2 100644 --- a/app/components/tailwinds/table/header_component.html.haml +++ b/app/components/tailwinds/table/header_component.html.haml @@ -1,4 +1,4 @@ -.div-table-row.grid.text-white.text-small.gap-4.bg-purple-700.dark:bg-gray-700.dark:text-gray-400{ class: "grid-cols-#{columns_count}", aria: { label: "Table Header" }, role: "row" } += header_tag do - if headers.any? - headers.each do |header| .div-table-cell.py-4.px-6 diff --git a/app/components/tailwinds/table/header_component.rb b/app/components/tailwinds/table/header_component.rb index 7983a152..269de415 100644 --- a/app/components/tailwinds/table/header_component.rb +++ b/app/components/tailwinds/table/header_component.rb @@ -6,10 +6,32 @@ module Table class HeaderComponent < Tramway::Component::Base option :headers, optional: true, default: -> { [] } option :columns, optional: true, default: -> { 3 } + option :options, optional: true, default: -> { {} } def columns_count headers.present? ? headers.size : columns end + + def header_tag + default_attributes = { aria: { label: "Table Header" }, role: :row } + + classes = [*default_classes, options[:class]].join(' ') + + tag.div(**options.merge(default_attributes), class: classes) do + yield if block_given? + end + end + + private + + def default_classes + [ + 'div-table-row', 'grid', 'text-white', + 'text-small', 'gap-4', 'bg-purple-700', + 'dark:bg-gray-700', 'dark:text-gray-400', + "grid-cols-#{columns_count}" + ] + end end end end