Module: UI::AccordionContentBehavior

Included in:
AccordionContent, AccordionContentComponent
Defined in:
app/behaviors/ui/accordion_content_behavior.rb

Overview

Shared behavior for Accordion Content component Handles classes, ARIA attributes, and animations

Instance Method Summary collapse

Instance Method Details

#content_base_classes ⇒ Object

Base CSS classes for content area with animations Using transition with Radix UI timing (300ms, cubic-bezier(0.87, 0, 0.13, 1))



10
11
12
 
# File 'app/behaviors/ui/accordion_content_behavior.rb', line 10

def content_base_classes
  "overflow-hidden text-sm transition-[height] duration-[var(--duration-accordion)] ease-[var(--ease-accordion)] data-[state=closed]:h-0"
end

#content_classes ⇒ Object

Merge base classes with custom classes using TailwindMerge



15
16
17
 
# File 'app/behaviors/ui/accordion_content_behavior.rb', line 15

def content_classes
  TailwindMerge::Merger.new.merge([content_base_classes, @classes].compact.join(" "))
end

#content_data_attributes ⇒ Object

Data attributes for Stimulus



39
40
41
42
43
 
# File 'app/behaviors/ui/accordion_content_behavior.rb', line 39

def content_data_attributes
  {
    ui__accordion_target: "content"
  }
end

#content_html_attributes ⇒ Object

Build complete HTML attributes hash for content container



52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
 
# File 'app/behaviors/ui/accordion_content_behavior.rb', line 52

def content_html_attributes
  base_attrs = @attributes&.except(:data) || {}
  attrs = base_attrs.merge(
    class: content_classes,
    id: content_id,
    role: "region",
    "aria-labelledby": trigger_id,
    "data-state": content_state,
    "data-orientation": @orientation || "vertical",
    data: merged_content_data_attributes
  )

  # Add hidden attribute for closed state to prevent flash on initial load
  # JavaScript will handle the CSS variable for height
  if content_state == "closed"
    attrs[:hidden] = true
  end

  attrs
end

#content_id ⇒ Object 



24
25
26
 
# File 'app/behaviors/ui/accordion_content_behavior.rb', line 24

def content_id
  @content_id ||= "accordion-content-#{item_value}"
end

#content_state ⇒ Object

Determine initial state from context



34
35
36
 
# File 'app/behaviors/ui/accordion_content_behavior.rb', line 34

def content_state
  @initial_open ? "open" : "closed"
end

#item_value ⇒ Object

Get item value from context (set by parent AccordionItem)



29
30
31
 
# File 'app/behaviors/ui/accordion_content_behavior.rb', line 29

def item_value
  @item_value || SecureRandom.hex(4)
end

#merged_content_data_attributes ⇒ Object

Merge user-provided data attributes



46
47
48
49
 
# File 'app/behaviors/ui/accordion_content_behavior.rb', line 46

def merged_content_data_attributes
  user_data = @attributes&.fetch(:data, {}) || {}
  user_data.merge(content_data_attributes)
end

#trigger_id ⇒ Object

Generate unique IDs for ARIA relationships (matching trigger)



20
21
22
 
# File 'app/behaviors/ui/accordion_content_behavior.rb', line 20

def trigger_id
  @trigger_id ||= "accordion-trigger-#{item_value}"
end