Class: PhlexKit::Carousel

Inherits:
BaseComponent show all
Defined in:
app/components/phlex_kit/carousel/carousel.rb

Overview

Carousel, ported from ruby_ui's RubyUI::Carousel. Upstream drives an embla-carousel instance; that npm dependency is dropped — the phlex-kit--carousel controller is a small translate-based engine (loop, x/y axis from the options value, arrow keys, pointer drag/swipe, button disabled state), so only @hotwired/stimulus is needed. Compose Carousel(orientation:) > CarouselContent > CarouselItem(s), plus CarouselPrevious / CarouselNext. Tailwind → vanilla .pk-carousel* (carousel.css).

Constant Summary collapse

ORIENTATIONS = 
{ horizontal: "is-horizontal", vertical: "is-vertical" }.freeze

Instance Method Summary collapse

Methods inherited from BaseComponent

#on

Constructor Details

#initialize(orientation: :horizontal, options: {}, **attrs) ⇒ Carousel

Returns a new instance of Carousel.



12
13
14
15
16
 
# File 'app/components/phlex_kit/carousel/carousel.rb', line 12

def initialize(orientation: :horizontal, options: {}, **attrs)
  @orientation = orientation.to_sym
  @options = options
  @attrs = attrs
end

Instance Method Details

#view_template ⇒ Object 



18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
 
# File 'app/components/phlex_kit/carousel/carousel.rb', line 18

def view_template(&)
  base = {
    class: [ "pk-carousel", fetch_option(ORIENTATIONS, @orientation, :orientation) ].join(" ")
  }
  # Defaults only when the caller didn't supply their own — `mix` fuses
  # (a localized roledescription would announce both strings).
  base[:role] = "region" unless attr_set?(:role)
  base[:aria] = { roledescription: "carousel" } unless aria_key_set?(:roledescription)
  div(**mix(base, {
    data: {
      controller: "phlex-kit--carousel",
      phlex_kit__carousel_options_value: JSON.generate(default_options.merge(@options)),
      action: keyboard_action
    }
  }, @attrs), &)
end