Class: Shadcn::Slider::Range::Component

Inherits:
ApplicationViewComponent show all
Defined in:
app/components/shadcn/slider/range/component.rb

Overview

The filled part of the groove, between the lowest and highest thumb. Two inline percentages rather than a width, which is Radix's own (measured: left:25%;right:50% for values 25 and 50) and is what makes a two-thumb range one element instead of two.

Constant Summary

Constants inherited from ApplicationViewComponent

ApplicationViewComponent::CONTENTS_STYLE, ApplicationViewComponent::VOID_TAGS

Instance Attribute Summary collapse

Attributes inherited from ApplicationViewComponent

#attributes

Instance Method Summary collapse

Methods inherited from ApplicationViewComponent

#call, #css_classes, default_tag, #merged_style, #render_element, #shadcn_t, slot_name, #style_variants, #tag_name

Constructor Details

#initialize(orientation: :horizontal, start_percent: 0, end_percent: 100, **attributes) ⇒ Component

Returns a new instance of Component.



22
23
24
25
26
27
# File 'app/components/shadcn/slider/range/component.rb', line 22

def initialize(orientation: :horizontal, start_percent: 0, end_percent: 100, **attributes)
  @orientation = orientation
  @start_percent = start_percent
  @end_percent = end_percent
  super(**attributes)
end

Instance Attribute Details

#end_percentObject (readonly)

Returns the value of attribute end_percent.



20
21
22
# File 'app/components/shadcn/slider/range/component.rb', line 20

def end_percent
  @end_percent
end

#orientationObject (readonly)

Returns the value of attribute orientation.



20
21
22
# File 'app/components/shadcn/slider/range/component.rb', line 20

def orientation
  @orientation
end

#start_percentObject (readonly)

Returns the value of attribute start_percent.



20
21
22
# File 'app/components/shadcn/slider/range/component.rb', line 20

def start_percent
  @start_percent
end

Instance Method Details

#element_attributes(**defaults) ⇒ Object



29
30
31
32
33
34
35
# File 'app/components/shadcn/slider/range/component.rb', line 29

def element_attributes(**defaults)
  super(**{
    "data-orientation" => orientation,
    "data-shadcn--slider-target" => "range",
    style: merged_style(edges)
  }.merge(defaults))
end