bs5 0.0.17 → 0.0.22

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 22c6a9e55865f643c0c955fa134144831a0e1aa3d68f9487757a2406429707fd
-  data.tar.gz: 94f28cbdc41c9f5cc4a223779247521659d66b0ac82aa9756bc37cbb1f73c45c
+  metadata.gz: feb6bdfa563dc0c4a846de69be606f33deacb0eca228319bb670b2f668103ce2
+  data.tar.gz: 51fd44d6cf62d4fcb10aa237f9eb0b1b4e5451bd77235d209c735f991b3eb830
 SHA512:
-  metadata.gz: 7b08a72d089dba1ac047006893c765deac278eb925c5ace940882708af292e306a5f69ee71062493d120a1bc3be347a729113d0cb4c486cf8bd899918b4c5247
-  data.tar.gz: bc39e72b8af466e92f006ce3833aa1610c294959bba9a4201d581fa4aa4839f2ec6fa841db203a6adee60c7dcffe5872697a87d9be3ee2f27014d21741de1354
+  metadata.gz: 0cd5058a2b39382182e3f3de2138f0b9c19f0c700c61ff64e7b92e889bc765cb8c292ea69e6c4fba87d3f649756c22b6901c8c8a2f989191672758e66ccc6994
+  data.tar.gz: 63705942d873ecd5ddee1cfe12cc0144b24d8c842319d389fb0eeef545b0d45eaab6f3b8133863a8885af811fc1b5c0d896e96c797470f8c5a7b128e86567d09

data/app/components/bs5/accordion_component.html.erb

@@ -17,7 +17,7 @@
           data-bs-parent="#<%= id %>"
         >
           <div class="accordion-body">
-            <%= item.content %>
+            <%= item %>
           </div>
         </div>
       </div>

data/app/components/bs5/accordion_component.rb

@@ -3,9 +3,9 @@
 module Bs5
   class AccordionComponent < ViewComponent::Base
     include ComponentsHelper
-    include ViewComponent::Slotable
+    include ViewComponent::SlotableV2
 
-    with_slot :item, collection: true, class_name: 'Item'
+    renders_many :items, 'ItemComponent'
 
     def initialize(flush: false)
       @flush = flush
@@ -25,7 +25,7 @@ module Bs5
       class_names.join(' ')
     end
 
-    class Item < ViewComponent::Slot
+    class ItemComponent < ViewComponent::Base
       attr_reader :title
 
       def initialize(title:, collapsed: true)
@@ -33,6 +33,10 @@ module Bs5
         @collapsed = collapsed
       end
 
+      def call
+        content
+      end
+
       def id
         object_id
       end

data/app/components/bs5/alert_component.rb

@@ -4,13 +4,13 @@ module Bs5
   class AlertComponent < ViewComponent::Base
     STYLES = %i[primary secondary success danger warning info light dark].freeze
 
-    attr_reader :style, :is_dismissable
+    attr_reader :color, :is_dismissable
 
     include ActiveModel::Validations
-    validates :style, style: true
+    validates :color, style: true
 
-    def initialize(style: :primary, is_dismissable: false)
-      @style = style.to_sym
+    def initialize(color: :primary, is_dismissable: false)
+      @color = color.to_sym
       @is_dismissable = is_dismissable
     end
 
@@ -31,7 +31,7 @@ module Bs5
     end
 
     def contextual_class
-      "alert-#{@style}"
+      "alert-#{@color}"
     end
   end
 end

data/app/components/bs5/badge_component.rb

@@ -4,14 +4,14 @@ module Bs5
   class BadgeComponent < ViewComponent::Base
     STYLES = %i[primary secondary success danger warning info light dark].freeze
 
-    attr_reader :text, :style
+    attr_reader :text, :color
 
     include ActiveModel::Validations
-    validates :style, style: true
+    validates :color, style: true
 
-    def initialize(text:, style: :secondary, pill: false)
+    def initialize(text:, color: :secondary, pill: false)
       @text = text
-      @style = style.to_sym
+      @color = color.to_sym
       @pill = pill
     end
 
@@ -32,8 +32,8 @@ module Bs5
     end
 
     def contextual_class
-      class_names = ["bg-#{@style}"]
-      class_names << %w[text-dark] if style.in?(%i[warning info light])
+      class_names = ["bg-#{@color}"]
+      class_names << %w[text-dark] if color.in?(%i[warning info light])
       class_names.join(' ')
     end
   end

data/app/components/bs5/breadcrumb_component.html.erb

@@ -2,7 +2,7 @@
   <nav aria-label="breadcrumb">
     <ol class="breadcrumb">
       <% items.each do |item| %>
-        <li class="breadcrumb-item <%= item == items.last ? 'active' : '' %>" <%= item == items.last ? 'aria-current=page' : '' %>><%= item.content %></li>
+        <li class="breadcrumb-item <%= item == items.last ? 'active' : '' %>" <%= item == items.last ? 'aria-current=page' : '' %>><%= item %></li>
       <% end %>
     </ol>
   </nav>

data/app/components/bs5/breadcrumb_component.rb

@@ -2,11 +2,14 @@
 
 module Bs5
   class BreadcrumbComponent < ViewComponent::Base
-    include ViewComponent::Slotable
+    include ViewComponent::SlotableV2
 
-    with_slot :item, collection: true, class_name: 'Item'
+    renders_many :items, 'ItemComponent'
 
-    class Item < ViewComponent::Slot
+    class ItemComponent < ViewComponent::Base
+      def call
+        content
+      end
     end
   end
 end

data/app/components/bs5/button_group_component.html.erb

@@ -0,0 +1,3 @@
+<%= tag.div(component_attributes) do %>
+  <%= content %>
+<% end %>

data/app/components/bs5/button_group_component.rb

@@ -0,0 +1,49 @@
+# frozen_string_literal: true
+
+module Bs5
+  class ButtonGroupComponent < ViewComponent::Base
+    SIZES = { small: :sm, large: :lg }.with_indifferent_access.freeze
+    CLASS_PREFIX = 'btn-group'
+
+    attr_reader :vertical, :size
+
+    def initialize(options = {})
+      @options = options.symbolize_keys
+      @vertical = @options.delete(:vertical)
+      @size = @options.delete(:size)
+    end
+
+    def render?
+      content.present?
+    end
+
+    def component_attributes
+      default_options = { role: 'group' }
+      @options[:class] = component_class
+      @options.merge(default_options)
+    end
+
+    private
+
+    def component_class
+      class_names = Array(@options[:class])
+      class_names << vertical_class
+      class_names << size_class
+      class_names
+    end
+
+    def vertical_class
+      @vertical ? "#{CLASS_PREFIX}-vertical" : CLASS_PREFIX
+    end
+
+    def size_class
+      return unless size?
+
+      [CLASS_PREFIX, SIZES[size]].join('-')
+    end
+
+    def size?
+      !!size
+    end
+  end
+end

data/app/components/bs5/button_tag_component.rb

@@ -3,14 +3,14 @@
 module Bs5
   class ButtonTagComponent < ViewComponent::Base
     STYLES = %i[primary secondary success danger warning info light dark link].freeze
-    DEFAULT_STYLE = :primary
+    DEFAULT_COLOR = :primary
     SIZES = { small: :sm, large: :lg }.freeze
     CLASS_PREFIX = 'btn'
 
     attr_reader :content_or_options, :size
 
     include ActiveModel::Validations
-    validates :style, style: true
+    validates :color, style: true
     validates :size, inclusion: { in: SIZES.keys, valid_sizes: SIZES.keys.to_sentence, allow_nil: true }
 
     def initialize(content_or_options = nil, options = nil)
@@ -44,13 +44,13 @@ module Bs5
     end
 
     def extract_custom_options
-      extract_style
+      extract_color
       extract_outline
       extract_size
     end
 
-    def extract_style
-      @style = @options.delete(:style)
+    def extract_color
+      @color = @options.delete(:color)
     end
 
     def extract_outline
@@ -76,7 +76,7 @@ module Bs5
     end
 
     def contextual_class
-      [CLASS_PREFIX, outline? ? 'outline' : nil, style].compact.join('-')
+      [CLASS_PREFIX, outline? ? 'outline' : nil, color].compact.join('-')
     end
 
     def size_class
@@ -85,8 +85,8 @@ module Bs5
       [CLASS_PREFIX, SIZES[size]].join('-')
     end
 
-    def style
-      (@style || DEFAULT_STYLE).to_sym
+    def color
+      (@color || DEFAULT_COLOR).to_sym
     end
 
     def outline?

data/app/components/bs5/button_to_component.rb

@@ -3,14 +3,14 @@
 module Bs5
   class ButtonToComponent < ViewComponent::Base
     STYLES = %i[primary secondary success danger warning info light dark link].freeze
-    DEFAULT_STYLE = :primary
+    DEFAULT_COLOR = :primary
     SIZES = { small: :sm, large: :lg }.freeze
     CLASS_PREFIX = 'btn'
 
     attr_reader :size
 
     include ActiveModel::Validations
-    validates :style, style: true
+    validates :color, style: true
     validates :size, inclusion: { in: SIZES.keys, valid_sizes: SIZES.keys.to_sentence, allow_nil: true }
 
     def initialize(name = nil, options = nil, html_options = nil)
@@ -53,13 +53,13 @@ module Bs5
     end
 
     def extract_custom_options
-      extract_style
+      extract_color
       extract_outline
       extract_size
     end
 
-    def extract_style
-      @style = @button_to_options.delete(:style)
+    def extract_color
+      @color = @button_to_options.delete(:color)
     end
 
     def extract_outline
@@ -85,7 +85,7 @@ module Bs5
     end
 
     def contextual_class
-      [CLASS_PREFIX, outline? ? 'outline' : nil, style].compact.join('-')
+      [CLASS_PREFIX, outline? ? 'outline' : nil, color].compact.join('-')
     end
 
     def size_class
@@ -94,8 +94,8 @@ module Bs5
       [CLASS_PREFIX, SIZES[size]].join('-')
     end
 
-    def style
-      (@style || DEFAULT_STYLE).to_sym
+    def color
+      (@color || DEFAULT_COLOR).to_sym
     end
 
     def outline?

data/app/components/bs5/button_toolbar_component.html.erb

@@ -0,0 +1,3 @@
+<%= tag.div(component_attributes) do %>
+  <%= content %>
+<% end %>

data/app/components/bs5/button_toolbar_component.rb

@@ -0,0 +1,21 @@
+# frozen_string_literal: true
+
+module Bs5
+  class ButtonToolbarComponent < ViewComponent::Base
+    def initialize(options = {})
+      @options = options
+    end
+
+    def render?
+      content.present?
+    end
+
+    def component_attributes
+      default_options = { role: 'toolbar' }
+      @options[:class] = Array(@options[:class])
+      @options[:class] << 'btn-toolbar'
+
+      @options.merge(default_options)
+    end
+  end
+end

data/app/components/bs5/list_group_component.html.erb

@@ -2,14 +2,14 @@
   <% if actionables? %>
     <div class="<%= component_class %>">
       <% items.each do |item| %>
-        <%= item.decorated_content %>
+        <%= item %>
       <% end %>
     </div>
   <% else %>
     <ul class="<%= component_class %>">
       <% items.each do |item| %>
         <%= tag.li(**item.options) do %>
-          <%= item.content %>
+          <%= item %>
         <% end %>
       <% end %>
     </ul>

data/app/components/bs5/list_group_component.rb

@@ -6,9 +6,9 @@ module Bs5
     CLASS_NAME_FLUSH = "#{CLASS_NAME_BASE}-flush"
     CLASS_NAME_HORIZONTAL = "#{CLASS_NAME_BASE}-horizontal"
 
-    include ViewComponent::Slotable
+    include ViewComponent::SlotableV2
 
-    with_slot :item, collection: true, class_name: 'Item'
+    renders_many :items, 'Item'
 
     def initialize(flush: false, horizontal: false)
       @flush = flush
@@ -22,7 +22,10 @@ module Bs5
     end
 
     def actionables?
-      items.any?(&:actionable?)
+      items.any? do |item|
+        elements = Nokogiri::HTML::DocumentFragment.parse(item.to_s).elements
+        elements.one? && elements.first.name.in?(%w[a button label])
+      end
     end
 
     def horizontal?
@@ -48,7 +51,7 @@ module Bs5
       class_names.join('-')
     end
 
-    class Item < ViewComponent::Slot
+    class Item < ViewComponent::Base
       CLASS_NAME_BASE = 'list-group-item'
       CLASS_NAME_ACTION = "#{CLASS_NAME_BASE}-action"
 
@@ -59,11 +62,15 @@ module Bs5
 
         @active = @options.delete(:active) || false
         @disabled = @options.delete(:disabled) || false
-        @style = @options.delete(:style)
+        @color = @options.delete(:color)
 
         set_attributes
       end
 
+      def call
+        actionable? ? decorated_content : content
+      end
+
       def actionable?
         !!actionable_element
       end
@@ -118,7 +125,7 @@ module Bs5
         class_names = [CLASS_NAME_BASE]
         class_names << 'active' if active?
         class_names << 'disabled' if disabled?
-        class_names << contextual_class if style?
+        class_names << contextual_class if color?
 
         class_names
       end
@@ -131,12 +138,12 @@ module Bs5
         !!@disabled
       end
 
-      def style?
-        !!@style
+      def color?
+        !!@color
       end
 
       def contextual_class
-        [CLASS_NAME_BASE, @style].join('-')
+        [CLASS_NAME_BASE, @color].join('-')
       end
     end
   end

data/app/components/bs5/spinner_component.html.erb

@@ -0,0 +1,5 @@
+<%= tag.div(**component_attributes) do %>
+  <%- if text %>
+    <span class="visually-hidden"><%= text %></span>
+  <% end %>
+<% end %>

data/app/components/bs5/spinner_component.rb

@@ -0,0 +1,65 @@
+# frozen_string_literal: true
+
+module Bs5
+  class SpinnerComponent < ViewComponent::Base
+    STYLES = %i[primary secondary success danger warning info light dark].freeze
+    SIZES = { small: :sm, large: :lg }.freeze
+
+    attr_reader :text, :color, :size, :options
+
+    include ActiveModel::Validations
+    validates :color, style: true, if: -> { color }
+
+    def initialize(options = {})
+      @options = options.symbolize_keys
+
+      @text = @options.delete(:text)
+      @color = @options.delete(:color)&.to_sym
+      @grow = @options.delete(:grow)
+      @size = @options.delete(:size)&.to_sym
+    end
+
+    def before_render
+      raise errors.full_messages.to_sentence if invalid?
+    end
+
+    def component_attributes
+      options[:class] = component_class
+      options[:role] = 'status'
+      options
+    end
+
+    def component_class
+      class_names = Array(options[:class])
+      class_names << shape_class
+      class_names << contextual_class
+      class_names << size_class
+
+      class_names.compact.join(' ')
+    end
+
+    private
+
+    def shape_class
+      grow? ? 'spinner-grow' : 'spinner-border'
+    end
+
+    def contextual_class
+      "text-#{@color}" if color
+    end
+
+    def size_class
+      return unless size?
+
+      [shape_class, SIZES[size]].join('-')
+    end
+
+    def grow?
+      !!@grow
+    end
+
+    def size?
+      !!size
+    end
+  end
+end