Class: Shadcn::ScrollAreaComponent

Inherits:
BaseComponent
  • Object
show all
Defined in:
app/components/shadcn/scroll_area_component.rb

Overview

Scroll Area component for custom scrollbars Matches shadcn/ui ScrollArea component Uses Stimulus for interactivity

Examples:

Basic scroll area

<%= render Shadcn::ScrollAreaComponent.new(class_name: "h-72 w-48") do %>
  <div class="p-4">
    Long content here...
  </div>
<% end %>

Horizontal scroll

<%= render Shadcn::ScrollAreaComponent.new(orientation: :horizontal, class_name: "w-96 whitespace-nowrap") do %>
  <div class="flex space-x-4 p-4">
    <!-- items -->
  </div>
<% end %>

Constant Summary collapse

BASE_CLASSES = 
"relative overflow-hidden"
VIEWPORT_CLASSES = 
"h-full w-full rounded-[inherit]"
SCROLLBAR_CLASSES = 
"flex touch-none select-none transition-colors"
THUMB_CLASSES = 
"relative flex-1 rounded-full bg-border"

Instance Attribute Summary

Attributes inherited from BaseComponent

#class_name, #data, #html_options

Instance Method Summary collapse

Methods inherited from BaseComponent

#content

Methods included from Rails::Helpers::ClassNameHelper

#cn

Constructor Details

#initialize(orientation: :vertical, type: :hover, **options) ⇒ ScrollAreaComponent

Returns a new instance of ScrollAreaComponent.

Parameters:

  • orientation (Symbol) (defaults to: :vertical) —

    Scroll orientation (:vertical, :horizontal, :both)

  • type (Symbol) (defaults to: :hover) —

    Scrollbar type (:auto, :always, :scroll, :hover)



30
31
32
33
34
 
# File 'app/components/shadcn/scroll_area_component.rb', line 30

def initialize(orientation: :vertical, type: :hover, **options)
  super(**options)
  @orientation = orientation.to_sym
  @type = type.to_sym
end