bs5 0.0.16 → 0.0.21

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: ba1fb14f4e08a3c9b6e8196fd306954c3e2bbe5e7f074ff018dbcf5adb9554cb
-  data.tar.gz: c7d797b046934929781283e825fcb74b3e9780faf544ce92dd2ca1b38cfbc60f
+  metadata.gz: ec13b3d4b022a8136ed67a797111aa537f4ba05a6dbf30ad9b8e8eb9099577e3
+  data.tar.gz: 0ac4e60fc0ad95d59e567133fd7dc5bb2d67555a0e97b7b2ceddc7e8b5ec0bd9
 SHA512:
-  metadata.gz: f11d2a95bc6dcfe8539feeb6eba85eaa873096c0cf725aa4d800b72f86e29c39817ae867739422f549f0c3a6be0b1f378de57e8d2e03ae62daa5d4594de6ee64
-  data.tar.gz: 1de41edf38036562b6fde14f20242926d557344875a4efdfc5a552d9a8cf7d2cc5d68fbe9cd2d815178fb2ae75f57a13be92aaf72fd9c19416ba8ee214967a4a
+  metadata.gz: 942a8e42a2cbaf93928690249f8ab1f9e914a3e9265529e3aff0d76d8bb739218dbeac3d420bbd1f0b154933d182d5a0433dc3fb031f82c496f683b4484856d8
+  data.tar.gz: 3e0c2dfd11427835d34de52ec59fded37e0904ce509ad7abec7595676871526c76c79ede5bfcda74a6e47890d85293c85c89bb575191e1041c50bed4af5e2c93

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