Class: Primer::OpenProject::BorderBox::CollapsibleHeader

Inherits:
Component
  • Object
show all
Defined in:
app/components/primer/open_project/border_box/collapsible_header.rb

Overview

A component to be used inside Primer::Beta::BorderBox. It will toggle the visibility of the complete Box body

Constant Summary collapse

TITLE_TAG_DEFAULT = 
:h3
TITLE_TAG_OPTIONS = 
[:h1, :h2, TITLE_TAG_DEFAULT, :h4, :h5, :h6].freeze

Constants inherited from Component

Component::INVALID_ARIA_LABEL_TAGS

Constants included from Status::Dsl

Status::Dsl::STATUSES

Constants included from ViewHelper

ViewHelper::HELPERS

Constants included from TestSelectorHelper

TestSelectorHelper::TEST_SELECTOR_TAG

Constants included from FetchOrFallbackHelper

FetchOrFallbackHelper::InvalidValueError

Constants included from AttributesHelper

AttributesHelper::PLURAL_ARIA_ATTRIBUTES, AttributesHelper::PLURAL_DATA_ATTRIBUTES

Instance Method Summary collapse

Methods inherited from Component

deprecated?, generate_id

Methods included from JoinStyleArgumentsHelper

#join_style_arguments

Methods included from TestSelectorHelper

#add_test_selector

Methods included from FetchOrFallbackHelper

#fetch_or_fallback, #fetch_or_fallback_boolean, #silence_deprecations?

Methods included from ClassNameHelper

#class_names

Methods included from AttributesHelper

#aria, #data, #extract_data, #merge_aria, #merge_data, #merge_prefixed_attribute_hashes

Methods included from ExperimentalSlotHelpers

included

Methods included from ExperimentalRenderHelpers

included

Constructor Details

#initialize(id: self.class.generate_id, box: nil, collapsed: false, collapsible_id: nil, multi_line: true, **system_arguments) ⇒ CollapsibleHeader

Returns a new instance of CollapsibleHeader.

Parameters:

  • id (String) (defaults to: self.class.generate_id) —

    The unique ID of the collapsible header.

  • box (Primer::Beta::BorderBox) (defaults to: nil) —

    Deprecated. Previously used to reference the parent BorderBox.

  • collapsed (Boolean) (defaults to: false) —

    Whether the header is collapsed on initial render.

  • collapsible_id (String) (defaults to: nil) —

    The id or ids of the elements that will be collapsed. This should include the BorderBox’s list, body and footer. This will be required in future versions.

  • multi_line (Boolean) (defaults to: true) —

    Whether the description is on its own line and can wrap across multiple lines.

  • system_arguments (Hash) —

    <%= link_to_system_arguments_docs %>



62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
 
# File 'app/components/primer/open_project/border_box/collapsible_header.rb', line 62

def initialize(id: self.class.generate_id, box: nil, collapsed: false, collapsible_id: nil, multi_line: true, **system_arguments)
  deprecation_warn("The `box:` param is deprecated and a no-op. It will be removed in a future version.") if box
  deprecation_warn("Omitting the `collapsible_id` param is deprecated. It will be required in a future version.") unless collapsible_id

  @collapsed = collapsed
  @collapsible_id = collapsible_id

  @system_arguments = deny_tag_argument(**system_arguments)
  @system_arguments[:tag] = :"collapsible-header"
  @system_arguments[:id] = id
  @system_arguments[:classes] = class_names(
    system_arguments[:classes],
    "CollapsibleHeader",
    "CollapsibleHeader--collapsed" => @collapsed,
    "CollapsibleHeader--multi-line" => multi_line
  )

  if @collapsed
    @system_arguments[:data] = merge_data(
      @system_arguments, {
        data: {
          collapsed: @collapsed
        }
      }
    )
  end

  @trigger_area_arguments = { tag: :div }
  @trigger_area_arguments[:role] = "button"
  @trigger_area_arguments[:tabindex] = 0
  @trigger_area_arguments[:classes] = "CollapsibleHeader-triggerArea"
  @trigger_area_arguments[:aria] = {
    controls: @collapsible_id,
    expanded: !@collapsed
  }
  @trigger_area_arguments[:data] = {
    target: "collapsible-header.triggerElement",
    action: "click:collapsible-header#toggle keydown:collapsible-header#toggleViaKeyboard"
  }
end