Class: Primer::Alpha::SegmentedControl

Inherits:
Component
  • Object
show all
Defined in:
app/components/primer/alpha/segmented_control.rb,
app/components/primer/alpha/segmented_control/item.rb

Overview

Use a segmented control to let users select an option from a short list and immediately apply the selection

Defined Under Namespace

Classes: Item

Constant Summary collapse

FULL_WIDTH_DEFAULT =
false
HIDE_LABELS_DEFAULT =
false
DEFAULT_SIZE =
:medium
SIZE_MAPPINGS =
{
  :small => "SegmentedControl--small",
  :medium => "SegmentedControl--medium",
  :large => "SegmentedControl--large",
  DEFAULT_SIZE => "SegmentedControl--medium"
}.freeze
SIZE_OPTIONS =
SIZE_MAPPINGS.keys

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 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, #merge_aria, #merge_data, #merge_prefixed_attribute_hashes

Constructor Details

#initialize(hide_labels: HIDE_LABELS_DEFAULT, full_width: FULL_WIDTH_DEFAULT, size: Primer::Beta::Button::DEFAULT_SIZE, **system_arguments) ⇒ SegmentedControl

Returns a new instance of SegmentedControl.

Parameters:

  • hide_labels (Boolean) (defaults to: HIDE_LABELS_DEFAULT)

    Whether to hide the labels and only show the icons

  • full_width (Boolean) (defaults to: FULL_WIDTH_DEFAULT)

    If the component should be full width

  • size (Symbol) (defaults to: Primer::Beta::Button::DEFAULT_SIZE)

    <%= one_of(Primer::Beta::Button::SIZE_OPTIONS) %>

  • system_arguments (Hash)

    <%= link_to_system_arguments_docs %>



44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
# File 'app/components/primer/alpha/segmented_control.rb', line 44

def initialize(hide_labels: HIDE_LABELS_DEFAULT, full_width: FULL_WIDTH_DEFAULT, size: Primer::Beta::Button::DEFAULT_SIZE, **system_arguments)
  @full_width = full_width
  @size = size
  @hide_labels = hide_labels

  @system_arguments = system_arguments
  @system_arguments[:tag] = :ul
  @system_arguments[:role] = "list"
  @system_arguments[:classes] = class_names(
    system_arguments[:classes],
    SIZE_MAPPINGS[fetch_or_fallback(SIZE_OPTIONS, size, DEFAULT_SIZE)],
    "SegmentedControl",
    "SegmentedControl--iconOnly": hide_labels,
    "SegmentedControl--fullWidth": full_width
  )

  validate_aria_label
end

Instance Method Details

#render?Boolean

Returns:

  • (Boolean)

Raises:

  • (ArgumentError)


63
64
65
66
67
68
# File 'app/components/primer/alpha/segmented_control.rb', line 63

def render?
  valid_items_count = items.count <= (@hide_labels ? 6 : 5) && items.count >= 2
  raise ArgumentError, "A segmented control should have 2–5 choices with text labels, or up to 6 icon-only buttons." if !valid_items_count && !Rails.env.production?

  valid_items_count
end