Class: Ariadne::BaseButton

Inherits:
Component
  • Object
show all
Defined in:
app/components/ariadne/base_button.rb

Overview

Use ‘BaseButton` to render an unstyled `<button>` tag that can be customized.

Constant Summary collapse

DEFAULT_TAG = 
:button
TAG_OPTIONS = 
[DEFAULT_TAG, :a, :summary].freeze
DEFAULT_TYPE = 
:button
TYPE_OPTIONS = 
[DEFAULT_TYPE, :reset, :submit].freeze
SIZE_CLASS_MAPPINGS = 
{
  xs: "inline-flex items-center px-2.5 py-1.5 text-xs font-medium rounded",
  s: "inline-flex items-center px-3 py-2 text-sm leading-4 font-medium rounded-m",
  m: "inline-flex items-center px-4 py-2 text-sm font-medium rounded-md",
  l: "inline-flex items-center px-4 py-2 text-base font-medium rounded-md",
  xl: "inline-flex items-center px-6 py-3 text-base font-medium rounded-md",
}.freeze
VALID_SIZES = 
SIZE_CLASS_MAPPINGS.keys.freeze
DEFAULT_CLASSES = 
"inline-flex items-center px-4 py-2 text-sm border border-gray-300 shadow-sm text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500"
DEFAULT_SIZE = 
:m

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, FetchOrFallbackHelper::TRUE_OR_FALSE

Instance Method Summary collapse

Methods included from LoggerHelper

#logger, #silence_deprecations?, #silence_warnings?

Methods included from JoinStyleArgumentsHelper

#join_style_arguments

Methods included from TestSelectorHelper

#add_test_selector

Methods included from FetchOrFallbackHelper

#check_incoming_attribute, #check_incoming_tag, #check_incoming_value, #fetch_or_raise, #fetch_or_raise_boolean

Methods included from ClassNameHelper

#class_names

Constructor Details

#initialize(tag: DEFAULT_TAG, type: DEFAULT_TYPE, size: DEFAULT_SIZE, classes: "", attributes: {}) ⇒ BaseButton

Returns a new instance of BaseButton.

Examples:

Setting the size

<%= render(Ariadne::BaseButton.new(size: :xs)) { "I am an extra small button!" } %>
<%= render(Ariadne::BaseButton.new(size: :s)) { "I am a small button!" } %>
<%= render(Ariadne::BaseButton.new(size: :m)) { "I am a medium button!" } %>
<%= render(Ariadne::BaseButton.new(size: :l)) { "I am a large button!" } %>
<%= render(Ariadne::BaseButton.new(size: :xl)) { "I am an extra large button!" } %>



37
38
39
40
41
42
43
44
45
46
47
48
49
50
 
# File 'app/components/ariadne/base_button.rb', line 37

def initialize(
  tag: DEFAULT_TAG,
  type: DEFAULT_TYPE,
  size: DEFAULT_SIZE,
  classes: "",
  attributes: {}
)
  @attributes = attributes
  @tag = fetch_or_raise(TAG_OPTIONS, tag)
  @size = fetch_or_raise(VALID_SIZES, size)

  @attributes[:type] = fetch_or_raise(TYPE_OPTIONS, type) if button?
  @classes = class_names(DEFAULT_CLASSES, SIZE_CLASS_MAPPINGS[@size], classes)
end

Instance Method Details

#call ⇒ Object 



52
53
54
 
# File 'app/components/ariadne/base_button.rb', line 52

def call
  render(Ariadne::BaseComponent.new(tag: @tag, classes: @classes, attributes: @attributes)) { content }
end