Class: Panda::Core::Admin::PageHeaderComponent

Inherits:
Base
  • Object
show all
Defined in:
app/components/panda/core/admin/page_header_component.rb

Overview

Page header component with title, optional breadcrumbs, and action buttons.

Follows Tailwind UI Plus pattern for page headers with responsive layout and support for multiple action buttons.

Examples:

Basic header with title only

render Panda::Core::Admin::PageHeaderComponent.new(
  title: "Back End Developer"
)

Header with breadcrumbs

render Panda::Core::Admin::PageHeaderComponent.new(
  title: "Back End Developer",
  breadcrumbs: [
    { text: "Jobs", href: "/admin/jobs" },
    { text: "Engineering", href: "/admin/jobs/engineering" },
    { text: "Back End Developer", href: "/admin/jobs/engineering/1" }
  ]
)

Header with action buttons using block

render Panda::Core::Admin::PageHeaderComponent.new(
  title: "Back End Developer",
  breadcrumbs: breadcrumb_items
) do |header|
  header.button(text: "Edit", variant: :secondary, href: edit_path)
  header.button(text: "Publish", variant: :primary, href: publish_path)
end

Constant Summary

Constants inherited from Base

Base::TAILWIND_MERGER

Instance Method Summary collapse

Methods inherited from Base

#after_template, #attrs, #before_template, #default_attrs, #merge_attrs, #tailwind_merge_attrs

Constructor Details

#initialize(**props) ⇒ PageHeaderComponent

Returns a new instance of PageHeaderComponent.



40
41
42
43
 
# File 'app/components/panda/core/admin/page_header_component.rb', line 40

def initialize(**props)
  super
  @buttons = []
end

Instance Method Details

#button(text:, variant: :secondary, href: "#", **props) ⇒ Object

Define a button to be rendered in the header actions area

Parameters:

  • text (String) —

    Button text

  • variant (Symbol) (defaults to: :secondary) —

    Button variant (:primary or :secondary)

  • href (String) (defaults to: "#") —

    Link href

  • props (Hash) —

    Additional button properties



85
86
87
 
# File 'app/components/panda/core/admin/page_header_component.rb', line 85

def button(text:, variant: :secondary, href: "#", **props)
  @buttons << {text: text, variant: variant, href: href, **props}
end

#view_template(&block) ⇒ Object 



45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
 
# File 'app/components/panda/core/admin/page_header_component.rb', line 45

def view_template(&block)
  # Allow buttons to be defined via block
  instance_eval(&block) if block_given?

  div do
    # Breadcrumbs section
    if @breadcrumbs
      render Panda::Core::Admin::BreadcrumbComponent.new(
        items: @breadcrumbs,
        show_back: @show_back
      )
    end

    # Title and actions section
    div(class: "mt-2 md:flex md:items-center md:justify-between") do
      # Title
      div(class: "min-w-0 flex-1") do
        h2(class: "text-2xl/7 font-bold text-gray-900 sm:truncate sm:text-3xl sm:tracking-tight dark:text-white") do
          @title
        end
      end

      # Action buttons
      if @buttons.any?
        div(class: "mt-4 flex shrink-0 md:mt-0 md:ml-4") do
          @buttons.each_with_index do |button_data, index|
            render create_button(button_data, index)
          end
        end
      end
    end
  end
end