better_ui 0.1.1 → 0.3.0

data/app/helpers/better_ui/general/components/dropdown/dropdown_helper.rb

@@ -0,0 +1,79 @@
+# frozen_string_literal: true
+
+module BetterUi
+  module General
+    module Components
+      module Dropdown
+        module DropdownHelper
+          ##
+          # Crea un componente dropdown interattivo con menu contestuale.
+          #
+          # @param trigger [String] Il testo del pulsante trigger (obbligatorio)
+          # @param position [Symbol] La posizione del menu dropdown (:bottom, :top, :left, :right)
+          # @param theme [Symbol] Il tema colore del trigger (:default, :white, :red, :rose, :orange, :green, :blue, :yellow, :violet)
+          # @param size [Symbol] La dimensione del trigger (:small, :medium, :large)
+          # @param rounded [Symbol] Il border radius (:none, :small, :medium, :large, :full)
+          # @param animation [Symbol] Il tipo di animazione (:fade, :slide, :none)
+          # @param classes [String] Classi CSS aggiuntive
+          # @param options [Hash] Attributi HTML aggiuntivi
+          # @param block [Proc] Il contenuto del menu dropdown
+          #
+          # @return [String] Il markup HTML del componente dropdown
+          #
+          # @example Uso base
+          #   <%= bui_dropdown(trigger: "Azioni") do %>
+          #     <%= bui_dropdown_item(text: "Modifica") %>
+          #   <% end %>
+          #
+          # @example Con posizione e tema
+          #   <%= bui_dropdown(trigger: "Menu", position: :top, theme: :blue) do %>
+          #     <%= bui_dropdown_item(text: "Profilo", icon: "user") %>
+          #     <%= bui_dropdown_divider %>
+          #     <%= bui_dropdown_item(text: "Logout", icon: "logout") %>
+          #   <% end %>
+          #
+          # @example Con dimensioni e stile
+          #   <%= bui_dropdown(trigger: "Opzioni", size: :large, rounded: :full, animation: :slide) do %>
+          #     <%= bui_dropdown_item(text: "Impostazioni", icon: "cog") %>
+          #   <% end %>
+          #
+          # @example Con link e azioni
+          #   <%= bui_dropdown(trigger: "Utente", theme: :green) do %>
+          #     <%= bui_dropdown_item(text: "Dashboard", href: "/dashboard") %>
+          #     <%= bui_dropdown_item(text: "Profilo", href: "/profile") %>
+          #     <%= bui_dropdown_divider %>
+          #     <%= bui_dropdown_item(text: "Elimina", theme: :red, icon: "trash") %>
+          #   <% end %>
+          #
+          # @example Con attributi HTML personalizzati
+          #   <%= bui_dropdown(trigger: "Menu", id: "main-menu", data: { controller: "dropdown" }) do %>
+          #     <%= bui_dropdown_item(text: "Item 1") %>
+          #   <% end %>
+          #
+          def bui_dropdown(
+            trigger:,
+            position: :bottom,
+            theme: :default,
+            size: :medium,
+            rounded: :medium,
+            animation: :fade,
+            classes: '',
+            **options,
+            &block
+          )
+            render BetterUi::General::Dropdown::Component.new(
+              trigger: trigger,
+              position: position,
+              theme: theme,
+              size: size,
+              rounded: rounded,
+              animation: animation,
+              classes: classes,
+              **options
+            ), &block
+          end
+        end
+      end
+    end
+  end
+end

data/app/helpers/better_ui/general/components/dropdown/item_helper.rb

@@ -0,0 +1,62 @@
+# frozen_string_literal: true
+
+module BetterUi
+  module General
+    module Components
+      module Dropdown
+        module ItemHelper
+          ##
+          # Crea un elemento del menu dropdown.
+          #
+          # @param text [String] Il testo dell'elemento (obbligatorio)
+          # @param icon [String] Il nome dell'icona da mostrare ("edit", "trash", "share", "user", "cog", "logout")
+          # @param href [String] L'URL per renderlo un link
+          # @param theme [Symbol] Il tema colore (:default, :white, :red, :rose, :orange, :green, :blue, :yellow, :violet)
+          # @param disabled [Boolean] Se l'elemento è disabilitato
+          # @param active [Boolean] Se l'elemento è attivo/selezionato
+          # @param classes [String] Classi CSS aggiuntive
+          # @param options [Hash] Attributi HTML aggiuntivi
+          #
+          # @return [String] Il markup HTML dell'elemento dropdown
+          #
+          # @example Uso base
+          #   <%= bui_dropdown_item(text: "Modifica") %>
+          #
+          # @example Con icona
+          #   <%= bui_dropdown_item(text: "Elimina", icon: "trash") %>
+          #
+          # @example Come link
+          #   <%= bui_dropdown_item(text: "Profilo", href: "/profile", icon: "user") %>
+          #
+          # @example Con tema colorato
+          #   <%= bui_dropdown_item(text: "Azione pericolosa", theme: :red, icon: "trash") %>
+          #
+          # @example Disabilitato
+          #   <%= bui_dropdown_item(text: "Non disponibile", disabled: true) %>
+          #
+          def bui_dropdown_item(
+            text:,
+            icon: nil,
+            href: nil,
+            theme: :default,
+            disabled: false,
+            active: false,
+            classes: '',
+            **options
+          )
+            render BetterUi::General::Dropdown::ItemComponent.new(
+              text: text,
+              icon: icon,
+              href: href,
+              theme: theme,
+              disabled: disabled,
+              active: active,
+              classes: classes,
+              **options
+            )
+          end
+        end
+      end
+    end
+  end
+end

data/app/helpers/better_ui/general/components/modal/modal_helper.rb

@@ -0,0 +1,85 @@
+module BetterUi
+  module General
+    module Components
+      module Modal
+        module ModalHelper
+          # Helper per renderizzare un modal con trigger e contenuto
+          #
+          # @param close_on_backdrop [Boolean] Se chiudere il modal cliccando sul backdrop
+          # @param close_on_escape [Boolean] Se chiudere il modal premendo Escape
+          # @param lock_scroll [Boolean] Se bloccare lo scroll del body quando il modal è aperto
+          # @param classes [String] Classi CSS aggiuntive per il contenitore
+          # @param html_options [Hash] Attributi HTML aggiuntivi
+          #
+          # @option theme [Symbol] :default (default) Header con sfondo grigio chiaro
+          # @option theme [Symbol] :white Header con sfondo bianco
+          # @option theme [Symbol] :red Header con sfondo rosso chiaro
+          # @option theme [Symbol] :rose Header con sfondo rosa chiaro
+          # @option theme [Symbol] :orange Header con sfondo arancione chiaro
+          # @option theme [Symbol] :green Header con sfondo verde chiaro
+          # @option theme [Symbol] :blue Header con sfondo blu chiaro
+          # @option theme [Symbol] :yellow Header con sfondo giallo chiaro
+          # @option theme [Symbol] :violet Header con sfondo violetto chiaro
+          #
+          # @option size [Symbol] :small (max-w-sm) Modal piccolo
+          # @option size [Symbol] :medium (max-w-md, default) Modal medio
+          # @option size [Symbol] :large (max-w-2xl) Modal grande
+          #
+          # @option rounded [Symbol] :none (rounded-none) Nessun border radius
+          # @option rounded [Symbol] :small (rounded-md) Border radius piccolo
+          # @option rounded [Symbol] :medium (rounded-lg, default) Border radius medio
+          # @option rounded [Symbol] :large (rounded-xl) Border radius grande
+          # @option rounded [Symbol] :full (rounded-full) Border radius completo
+          #
+          # @return [String] HTML del modal
+          #
+          # @example Utilizzo base con button trigger
+          #   <%= bui_modal do |modal| %>
+          #     <% modal.with_trigger(label: "Apri Modal", as: :button, type: :primary) %>
+          #     <% modal.with_modal(title: "Conferma azione") do %>
+          #       <p>Sei sicuro di voler continuare?</p>
+          #     <% end %>
+          #   <% end %>
+          #
+          # @example Con link trigger
+          #   <%= bui_modal do |modal| %>
+          #     <% modal.with_trigger(label: "Visualizza dettagli", as: :link, variant: :underline) %>
+          #     <% modal.with_modal(title: "Dettagli elemento", theme: :blue, size: :large) do %>
+          #       <p>Informazioni dettagliate sull'elemento selezionato.</p>
+          #     <% end %>
+          #   <% end %>
+          #
+          # @example Modal con configurazione avanzata
+          #   <%= bui_modal(close_on_backdrop: false, lock_scroll: false) do |modal| %>
+          #     <% modal.with_trigger(label: "Elimina", as: :button, type: :red, size: :small) %>
+          #     <% modal.with_modal(title: "Elimina elemento", theme: :red, backdrop: true, closable: true) do %>
+          #       <p>Sei sicuro di voler eliminare questo elemento?</p>
+          #       <p class="text-sm text-gray-600 mt-2">Questa azione non può essere annullata.</p>
+          #       
+          #       <div class="flex justify-end space-x-3 mt-6">
+          #         <%= bui_button(label: "Annulla", type: :white, size: :medium) %>
+          #         <%= bui_button(label: "Elimina", type: :red, size: :medium) %>
+          #       </div>
+          #     <% end %>
+          #   <% end %>
+          def bui_modal(
+            close_on_backdrop: true,
+            close_on_escape: true,
+            lock_scroll: true,
+            classes: nil,
+            **html_options,
+            &block
+          )
+            render BetterUi::General::Modal::Component.new(
+              close_on_backdrop: close_on_backdrop,
+              close_on_escape: close_on_escape,
+              lock_scroll: lock_scroll,
+              classes: classes,
+              **html_options
+            ), &block
+          end
+        end
+      end
+    end
+  end
+end

data/app/helpers/better_ui/general/components/modal.rb

@@ -0,0 +1,11 @@
+# frozen_string_literal: true
+
+module BetterUi
+  module General
+    module Components
+      module Modal
+        include BetterUi::General::Components::Modal::ModalHelper
+      end
+    end
+  end
+end

data/app/helpers/better_ui/general/components/pagination/pagination_helper.rb

@@ -0,0 +1,82 @@
+# frozen_string_literal: true
+
+module BetterUi
+  module General
+    module Components
+      module Pagination
+        module PaginationHelper
+          # Genera un componente di navigazione paginata per liste e tabelle
+          #
+          # @param current_page [Integer] La pagina corrente (1-indexed)
+          # @param total_pages [Integer] Il numero totale di pagine
+          # @param path [String] L'URL base per costruire i link di paginazione
+          # @param theme [Symbol] Il tema del componente (:default, :blue, :red, :green, :yellow, :violet, :orange, :rose, :white)
+          # @param size [Symbol] La dimensione del componente (:small, :medium, :large)
+          # @param window [Integer] Il numero di pagine da mostrare intorno alla pagina corrente (default: 2)
+          # @param show_info [Boolean] Se mostrare le informazioni sui risultati (default: false)
+          # @param per_page [Integer] Il numero di elementi per pagina (richiesto se show_info è true)
+          # @param classes [String] Classi CSS aggiuntive
+          # @param form [FormBuilder, nil] Form builder per l'integrazione con Rails form (opzionale)
+          # @param options [Hash] Attributi HTML aggiuntivi
+          # @return [String] Il markup HTML del componente pagination
+          #
+          # @example Uso base standalone
+          #   <%= bui_pagination(current_page: 3, total_pages: 10, path: '/products') %>
+          #
+          # @example Con tema e dimensione personalizzati
+          #   <%= bui_pagination(
+          #     current_page: 5, 
+          #     total_pages: 20, 
+          #     path: '/articles',
+          #     theme: :blue,
+          #     size: :large
+          #   ) %>
+          #
+          # @example Con informazioni sui risultati
+          #   <%= bui_pagination(
+          #     current_page: 2,
+          #     total_pages: 8,
+          #     path: '/users',
+          #     show_info: true,
+          #     per_page: 25,
+          #     theme: :green
+          #   ) %>
+          #
+          # @example Con finestra di pagine personalizzata
+          #   <%= bui_pagination(
+          #     current_page: 10,
+          #     total_pages: 50,
+          #     path: '/orders',
+          #     window: 3,
+          #     size: :small
+          #   ) %>
+          #
+          # @example Con attributi HTML aggiuntivi
+          #   <%= bui_pagination(
+          #     current_page: 1,
+          #     total_pages: 5,
+          #     path: '/dashboard',
+          #     classes: 'my-4',
+          #     data: { turbo_frame: 'content' }
+          #   ) %>
+          def bui_pagination(current_page:, total_pages:, path:, theme: :default, size: :medium,
+                             window: 2, show_info: false, per_page: nil, classes: '', 
+                             form: nil, **options)
+            render BetterUi::General::Pagination::Component.new(
+              current_page: current_page,
+              total_pages: total_pages,
+              path: path,
+              theme: theme,
+              size: size,
+              window: window,
+              show_info: show_info,
+              per_page: per_page,
+              classes: classes,
+              **options
+            )
+          end
+        end
+      end
+    end
+  end
+end

data/app/helpers/better_ui/general/components/tabs/panel_helper.rb

@@ -0,0 +1,62 @@
+# frozen_string_literal: true
+
+module BetterUi
+  module General
+    module Components
+      module Tabs
+        module PanelHelper
+          # Crea un pannello di contenuto associato a una tab
+          #
+          # @param id [String] l'identificatore univoco del pannello (deve corrispondere al target della tab)
+          # @param active [Boolean] se questo pannello è attualmente visibile
+          # @param classes [String] classi CSS aggiuntive da applicare al pannello
+          # @param options [Hash] attributi HTML aggiuntivi da applicare all'elemento
+          # @param block [Proc] il contenuto del pannello
+          # @return [String] l'HTML del pannello
+          #
+          # @example Uso base
+          #   <%= bui_tab_panel(id: "generale", active: true) do %>
+          #     <h3>Impostazioni Generali</h3>
+          #     <p>Contenuto del pannello generale...</p>
+          #   <% end %>
+          #
+          # @example Pannello nascosto
+          #   <%= bui_tab_panel(id: "sicurezza") do %>
+          #     <h3>Sicurezza</h3>
+          #     <p>Contenuto del pannello sicurezza...</p>
+          #   <% end %>
+          #
+          # @example Con classi personalizzate
+          #   <%= bui_tab_panel(id: "notifiche", classes: "p-6 bg-gray-50") do %>
+          #     <h3>Notifiche</h3>
+          #     <p>Contenuto del pannello notifiche...</p>
+          #   <% end %>
+          #
+          # @example Con attributi personalizzati
+          #   <%= bui_tab_panel(id: "dashboard", data: { testid: "dashboard-panel" }) do %>
+          #     <div class="grid grid-cols-2 gap-4">
+          #       <div>Statistiche</div>
+          #       <div>Grafici</div>
+          #     </div>
+          #   <% end %>
+          #
+          # @example Con form Rails
+          #   <%= bui_tab_panel(id: "profile") do %>
+          #     <%= form_with model: @user do |form| %>
+          #       <%= form.text_field :name, class: "form-input" %>
+          #       <%= form.submit "Salva", class: "btn btn-primary" %>
+          #     <% end %>
+          #   <% end %>
+          def bui_tab_panel(id:, active: false, classes: '', **options, &block)
+            render BetterUi::General::Tabs::PanelComponent.new(
+              id: id,
+              active: active,
+              classes: classes,
+              **options
+            ), &block
+          end
+        end
+      end
+    end
+  end
+end

data/app/helpers/better_ui/general/components/tabs/tab_helper.rb

@@ -0,0 +1,55 @@
+# frozen_string_literal: true
+
+module BetterUi
+  module General
+    module Components
+      module Tabs
+        module TabHelper
+          # Crea una singola tab all'interno di un container tabs
+          #
+          # @param text [String] il testo da visualizzare nella tab
+          # @param target [String] l'ID del pannello associato a questa tab
+          # @param active [Boolean] se questa tab è attualmente attiva
+          # @param icon [String] il nome dell'icona opzionale da visualizzare
+          # @param disabled [Boolean] se questa tab è disabilitata
+          # @param badge [String] il testo/numero del badge opzionale
+          # @param theme [Symbol] il tema di colore della tab (:default, :blue, :red, :green, :yellow, :violet, :orange, :rose, :white)
+          # @param size [Symbol] la dimensione della tab (:small, :medium, :large)
+          # @param classes [String] classi CSS aggiuntive da applicare alla tab
+          # @param options [Hash] attributi HTML aggiuntivi da applicare all'elemento
+          # @return [String] l'HTML della tab
+          #
+          # @example Uso base
+          #   <%= bui_tab(text: "Generale", target: "generale", active: true) %>
+          #
+          # @example Con icona e badge
+          #   <%= bui_tab(text: "Messaggi", target: "messages", icon: "envelope", badge: "3") %>
+          #
+          # @example Tab disabilitata
+          #   <%= bui_tab(text: "Premium", target: "premium", disabled: true, icon: "star") %>
+          #
+          # @example Con temi personalizzati
+          #   <%= bui_tab(text: "Errori", target: "errors", theme: :red, badge: "12") %>
+          #
+          # @example Con attributi personalizzati
+          #   <%= bui_tab(text: "Settings", target: "settings", classes: "font-bold", data: { testid: "settings-tab" }) %>
+          def bui_tab(text:, target:, active: false, icon: nil, disabled: false, badge: nil, 
+                     theme: :default, size: :medium, classes: '', **options)
+            render BetterUi::General::Tabs::TabComponent.new(
+              text: text,
+              target: target,
+              active: active,
+              icon: icon,
+              disabled: disabled,
+              badge: badge,
+              theme: theme,
+              size: size,
+              classes: classes,
+              **options
+            )
+          end
+        end
+      end
+    end
+  end
+end

data/app/helpers/better_ui/general/components/tabs/tabs_helper.rb

@@ -0,0 +1,95 @@
+# frozen_string_literal: true
+
+module BetterUi
+  module General
+    module Components
+      module Tabs
+        module TabsHelper
+          # Crea un sistema completo di tabs con navigazione e panel inclusi
+          #
+          # @param variant [Symbol] lo stile delle tabs (:pills, :underline, :bordered, :minimal)
+          # @param theme [Symbol] il tema di colore delle tabs (:default, :blue, :red, :green, :yellow, :violet, :orange, :rose, :white)
+          # @param size [Symbol] la dimensione delle tabs (:small, :medium, :large)
+          # @param orientation [Symbol] l'orientamento delle tabs (:horizontal, :vertical)
+          # @param navigation_classes [String] classi CSS aggiuntive per la navigazione
+          # @param panels_classes [String] classi CSS aggiuntive per i panel (default: 'mt-4')
+          # @param options [Hash] attributi HTML aggiuntivi da applicare all'elemento wrapper
+          # @param block [Proc] il contenuto che definisce navigation e panels tramite slots
+          # @return [String] l'HTML completo del sistema tabs
+          #
+          # @example Uso base con slots
+          #   <%= bui_tabs do |tabs| %>
+          #     <% tabs.with_navigation do %>
+          #       <%= bui_tab(text: "Tab 1", target: "tab1", active: true) %>
+          #       <%= bui_tab(text: "Tab 2", target: "tab2") %>
+          #     <% end %>
+          #     <% tabs.with_panels do %>
+          #       <%= bui_tab_panel(id: "tab1", active: true) do %>
+          #         Contenuto del primo pannello
+          #       <% end %>
+          #       <%= bui_tab_panel(id: "tab2") do %>
+          #         Contenuto del secondo pannello
+          #       <% end %>
+          #     <% end %>
+          #   <% end %>
+          #
+          # @example Con temi e dimensioni
+          #   <%= bui_tabs(variant: :underline, theme: :blue, size: :large) do |tabs| %>
+          #     <% tabs.with_navigation do %>
+          #       <%= bui_tab(text: "Dashboard", target: "dashboard", active: true, icon: "chart-bar") %>
+          #       <%= bui_tab(text: "Impostazioni", target: "settings", icon: "cog-6-tooth") %>
+          #     <% end %>
+          #     <% tabs.with_panels do %>
+          #       <%= bui_tab_panel(id: "dashboard", active: true) do %>
+          #         Dashboard content...
+          #       <% end %>
+          #       <%= bui_tab_panel(id: "settings") do %>
+          #         Settings content...
+          #       <% end %>
+          #     <% end %>
+          #   <% end %>
+          #
+          # @example Tabs verticali
+          #   <%= bui_tabs(orientation: :vertical, variant: :pills) do |tabs| %>
+          #     <% tabs.with_navigation do %>
+          #       <%= bui_tab(text: "Profilo", target: "profile", active: true) %>
+          #       <%= bui_tab(text: "Account", target: "account") %>
+          #     <% end %>
+          #     <% tabs.with_panels do %>
+          #       <%= bui_tab_panel(id: "profile", active: true) do %>
+          #         Informazioni profilo...
+          #       <% end %>
+          #       <%= bui_tab_panel(id: "account") do %>
+          #         Impostazioni account...
+          #       <% end %>
+          #     <% end %>
+          #   <% end %>
+          #
+          # @example Con classi personalizzate
+          #   <%= bui_tabs(navigation_classes: "border-b-2", panels_classes: "p-6 bg-gray-50") do |tabs| %>
+          #     <% tabs.with_navigation do %>
+          #       <%= bui_tab(text: "Home", target: "home", active: true) %>
+          #     <% end %>
+          #     <% tabs.with_panels do %>
+          #       <%= bui_tab_panel(id: "home", active: true) do %>
+          #         Home content with custom styling...
+          #       <% end %>
+          #     <% end %>
+          #   <% end %>
+          def bui_tabs(variant: :pills, theme: :default, size: :medium, orientation: :horizontal, 
+                      navigation_classes: '', panels_classes: 'mt-4', **options, &block)
+            render BetterUi::General::Tabs::Component.new(
+              variant: variant,
+              theme: theme,
+              size: size,
+              orientation: orientation,
+              navigation_classes: navigation_classes,
+              panels_classes: panels_classes,
+              **options
+            ), &block
+          end
+        end
+      end
+    end
+  end
+end

data/lib/better_ui/version.rb

@@ -1,3 +1,3 @@
 module BetterUi
-  VERSION = "0.1.1"
+  VERSION = "0.3.0"
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: better_ui
 version: !ruby/object:Gem::Version
-  version: 0.1.1
+  version: 0.3.0
 platform: ruby
 authors:
 - alessiobussolari
@@ -9,7 +9,7 @@ authors:
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2025-06-01 00:00:00.000000000 Z
+date: 2025-06-03 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: rails
@@ -117,6 +117,10 @@ files:
 - app/components/better_ui/application/navbar/component.rb
 - app/components/better_ui/application/sidebar/component.html.erb
 - app/components/better_ui/application/sidebar/component.rb
+- app/components/better_ui/general/accordion/component.html.erb
+- app/components/better_ui/general/accordion/component.rb
+- app/components/better_ui/general/accordion/item_component.html.erb
+- app/components/better_ui/general/accordion/item_component.rb
 - app/components/better_ui/general/alert/component.html.erb
 - app/components/better_ui/general/alert/component.rb
 - app/components/better_ui/general/avatar/component.html.erb
@@ -129,6 +133,12 @@ files:
 - app/components/better_ui/general/button/component.rb
 - app/components/better_ui/general/divider/component.html.erb
 - app/components/better_ui/general/divider/component.rb
+- app/components/better_ui/general/dropdown/component.html.erb
+- app/components/better_ui/general/dropdown/component.rb
+- app/components/better_ui/general/dropdown/divider_component.html.erb
+- app/components/better_ui/general/dropdown/divider_component.rb
+- app/components/better_ui/general/dropdown/item_component.html.erb
+- app/components/better_ui/general/dropdown/item_component.rb
 - app/components/better_ui/general/field/component.html.erb
 - app/components/better_ui/general/field/component.rb
 - app/components/better_ui/general/heading/component.html.erb
@@ -151,6 +161,12 @@ files:
 - app/components/better_ui/general/input/textarea/component.rb
 - app/components/better_ui/general/link/component.html.erb
 - app/components/better_ui/general/link/component.rb
+- app/components/better_ui/general/modal/component.html.erb
+- app/components/better_ui/general/modal/component.rb
+- app/components/better_ui/general/modal/modal_component.html.erb
+- app/components/better_ui/general/modal/modal_component.rb
+- app/components/better_ui/general/pagination/component.html.erb
+- app/components/better_ui/general/pagination/component.rb
 - app/components/better_ui/general/panel/component.html.erb
 - app/components/better_ui/general/panel/component.rb
 - app/components/better_ui/general/progress/component.html.erb
@@ -171,6 +187,12 @@ files:
 - app/components/better_ui/general/table/thead_component.rb
 - app/components/better_ui/general/table/tr_component.html.erb
 - app/components/better_ui/general/table/tr_component.rb
+- app/components/better_ui/general/tabs/component.html.erb
+- app/components/better_ui/general/tabs/component.rb
+- app/components/better_ui/general/tabs/panel_component.html.erb
+- app/components/better_ui/general/tabs/panel_component.rb
+- app/components/better_ui/general/tabs/tab_component.html.erb
+- app/components/better_ui/general/tabs/tab_component.rb
 - app/components/better_ui/general/tag/component.html.erb
 - app/components/better_ui/general/tag/component.rb
 - app/components/better_ui/general/tooltip/component.html.erb
@@ -182,6 +204,8 @@ files:
 - app/helpers/better_ui/application/components/navbar/navbar_helper.rb
 - app/helpers/better_ui/application/components/sidebar/sidebar_helper.rb
 - app/helpers/better_ui/application_helper.rb
+- app/helpers/better_ui/general/components/accordion.rb
+- app/helpers/better_ui/general/components/accordion/accordion_helper.rb
 - app/helpers/better_ui/general/components/alert/alert_helper.rb
 - app/helpers/better_ui/general/components/avatar/avatar_helper.rb
 - app/helpers/better_ui/general/components/badge/badge_helper.rb
@@ -189,6 +213,9 @@ files:
 - app/helpers/better_ui/general/components/button/button_helper.rb
 - app/helpers/better_ui/general/components/container/container_helper.rb
 - app/helpers/better_ui/general/components/divider/divider_helper.rb
+- app/helpers/better_ui/general/components/dropdown/divider_helper.rb
+- app/helpers/better_ui/general/components/dropdown/dropdown_helper.rb
+- app/helpers/better_ui/general/components/dropdown/item_helper.rb
 - app/helpers/better_ui/general/components/field/field_helper.rb
 - app/helpers/better_ui/general/components/heading/heading_helper.rb
 - app/helpers/better_ui/general/components/icon/icon_helper.rb
@@ -200,6 +227,9 @@ files:
 - app/helpers/better_ui/general/components/input/text/text_helper.rb
 - app/helpers/better_ui/general/components/input/textarea/textarea_helper.rb
 - app/helpers/better_ui/general/components/link/link_helper.rb
+- app/helpers/better_ui/general/components/modal.rb
+- app/helpers/better_ui/general/components/modal/modal_helper.rb
+- app/helpers/better_ui/general/components/pagination/pagination_helper.rb
 - app/helpers/better_ui/general/components/panel/panel_helper.rb
 - app/helpers/better_ui/general/components/progress/progress_helper.rb
 - app/helpers/better_ui/general/components/spinner/spinner_helper.rb
@@ -210,6 +240,9 @@ files:
 - app/helpers/better_ui/general/components/table/th_helper.rb
 - app/helpers/better_ui/general/components/table/thead_helper.rb
 - app/helpers/better_ui/general/components/table/tr_helper.rb
+- app/helpers/better_ui/general/components/tabs/panel_helper.rb
+- app/helpers/better_ui/general/components/tabs/tab_helper.rb
+- app/helpers/better_ui/general/components/tabs/tabs_helper.rb
 - app/helpers/better_ui/general/components/tag/tag_helper.rb
 - app/helpers/better_ui/general/components/tooltip/tooltip_helper.rb
 - app/jobs/better_ui/application_job.rb