Class: Primer::Alpha::TreeView::Node

Inherits:
Component
  • Object
show all
Defined in:
app/components/primer/alpha/tree_view/node.rb

Overview

A generic ‘TreeView` node.

This component is part of the <%= link_to_component(Primer::Alpha::TreeView) %> component and should not be used directly.

Constant Summary collapse

DEFAULT_NODE_VARIANT = 
Primer::Alpha::TreeView::DEFAULT_NODE_VARIANT
NODE_VARIANT_TAG_MAP = 
{ DEFAULT_NODE_VARIANT => :div, :button => :button, :anchor => :a }.freeze
NODE_VARIANT_TAG_OPTIONS = 
NODE_VARIANT_TAG_MAP.keys.freeze
DEFAULT_SELECT_VARIANT = 
:none
SELECT_VARIANT_OPTIONS = 
[
  :multiple,
  DEFAULT_SELECT_VARIANT
].freeze
DEFAULT_CHECKED_STATE = 
false
CHECKED_STATES = 
[
  DEFAULT_CHECKED_STATE,
  true,
  "mixed"
]

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 Primer::AttributesHelper

Primer::AttributesHelper::PLURAL_ARIA_ATTRIBUTES, Primer::AttributesHelper::PLURAL_DATA_ATTRIBUTES

Instance Attribute Summary collapse

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 Primer::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(path:, node_variant:, href: nil, current: false, select_variant: DEFAULT_SELECT_VARIANT, checked: DEFAULT_CHECKED_STATE, disabled: false, value: nil, **content_arguments) ⇒ Node

Returns a new instance of Node.

Parameters:

  • path (Array<String>) —

    The node’s “path,” i.e. this node’s label and the labels of all its ancestors. This node should be reachable by traversing the tree following this path.

  • node_variant (Symbol) —

    The node variant to use for the node’s content, i.e. the ‘:button` or `:div`. <%= one_of(Primer::Alpha::TreeView::NODE_VARIANT_OPTIONS) %>

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

    The URL to use as the ‘href` attribute for this node. If set to a truthy value, the `tag:` parameter is ignored and assumed to be `:a`.

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

    Whether or not this node is the current node. The current node is styled differently than regular nodes and is the first element that receives focus when tabbing to the ‘TreeView` component.

  • select_variant (Symbol) (defaults to: DEFAULT_SELECT_VARIANT) —

    Controls the type of checkbox that appears. <%= one_of(Primer::Alpha::TreeView::Node::SELECT_VARIANT_OPTIONS) %>

  • checked (Boolean | String) (defaults to: DEFAULT_CHECKED_STATE) —

    The checked state of the node’s checkbox. <%= one_of(Primer::Alpha::TreeView::Node::CHECKED_STATES) %>

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

    Whether or not the node can be activated. Passing ‘false` here will cause the node to appear visually disabled but it is still keyboard-focusable.

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

    If this node is checked, this value will be sent to the server on form submission.

  • content_arguments (Hash) —

    Arguments attached to the node’s content, i.e the ‘<button>` or `<a>` element. <%= link_to_system_arguments_docs %>



79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
 
# File 'app/components/primer/alpha/tree_view/node.rb', line 79

def initialize(
  path:,
  node_variant:,
  href: nil,
  current: false,
  select_variant: DEFAULT_SELECT_VARIANT,
  checked: DEFAULT_CHECKED_STATE,
  disabled: false,
  value: nil,
  **content_arguments
)
  @system_arguments = {
    tag: :li,
    role: :none,
    classes: "TreeViewItem"
  }

  @content_arguments = content_arguments

  @path = path
  @current = current
  @select_variant = fetch_or_fallback(SELECT_VARIANT_OPTIONS, select_variant, DEFAULT_SELECT_VARIANT)
  @checked = fetch_or_fallback(CHECKED_STATES, checked, DEFAULT_CHECKED_STATE)
  @disabled = disabled
  @node_variant = fetch_or_fallback(NODE_VARIANT_TAG_OPTIONS, node_variant, DEFAULT_NODE_VARIANT)

  @content_arguments[:tag] = NODE_VARIANT_TAG_MAP[@node_variant]
  @content_arguments[:href] = href if href
  @content_arguments[:id] = content_id
  @content_arguments[:role] = :treeitem
  @content_arguments[:tabindex] = current? ? 0 : -1
  @content_arguments[:classes] = class_names(
    @content_arguments.delete(:classes),
    "TreeViewItemContent"
  )

  @content_arguments[:aria] = merge_aria(
    @content_arguments, {
    aria: {
      level: level,
      selected: false,
      checked: checked,
      labelledby: content_id,
      disabled: disabled?
    }
  }
  )

  @content_arguments[:data] = merge_data(
    @content_arguments, {
    data: {
      value: value,
      path: @path.to_json
    }
  }
  )

  return unless current?

  @content_arguments[:aria] = merge_aria(
    @content_arguments,
    { aria: { current: true } }
  )
end

Instance Attribute Details

#checked ⇒ String (readonly)

This node’s checked state.

Returns:

  • (String) 


39
40
41
 
# File 'app/components/primer/alpha/tree_view/node.rb', line 39

def checked
  @checked
end

#current ⇒ Boolean (readonly) Also known as: current?

Wether or not this node is the current node.

Returns:

  • (Boolean) 


33
34
35
 
# File 'app/components/primer/alpha/tree_view/node.rb', line 33

def current
  @current
end

#disabled ⇒ Boolean (readonly) Also known as: disabled?

Whether or not this node is disabled, i.e. cannot be activated.

Returns:

  • (Boolean) 


54
55
56
 
# File 'app/components/primer/alpha/tree_view/node.rb', line 54

def disabled
  @disabled
end

#node_variant ⇒ Symbol (readonly)

This node’s variant, eg. ‘:button`, `:div`, etc.

Returns:

  • (Symbol) 


49
50
51
 
# File 'app/components/primer/alpha/tree_view/node.rb', line 49

def node_variant
  @node_variant
end

#select_variant ⇒ Symbol (readonly)

This node’s select variant (i.e. check box variant).

Returns:

  • (Symbol) 


44
45
46
 
# File 'app/components/primer/alpha/tree_view/node.rb', line 44

def select_variant
  @select_variant
end

Instance Method Details

#level ⇒ Integer

The numeric depth of this node.

Returns:

  • (Integer) —

    This node’s depth.



147
148
149
 
# File 'app/components/primer/alpha/tree_view/node.rb', line 147

def level
  @level ||= @path.size
end

#merge_system_arguments!(**other_arguments) ⇒ Object

Merges the given arguments into the current hash of system arguments provided when the component was initially constructed. This method can be used to add additional arguments just before rendering.

Parameters:

  • other_arguments (Hash) —

    The other hash of system arguments to merge into the current one.



155
156
157
158
159
160
161
162
163
164
165
166
167
 
# File 'app/components/primer/alpha/tree_view/node.rb', line 155

def merge_system_arguments!(**other_arguments)
  @content_arguments[:aria] = merge_aria(
    @content_arguments,
    other_arguments
  )

  @content_arguments[:data] = merge_data(
    @content_arguments,
    other_arguments
  )

  @content_arguments.merge!(**other_arguments)
end