better_ui 0.3.0 → 0.6.0

data/app/helpers/better_ui/general/components/input/select/select_helper.rb

@@ -6,45 +6,59 @@ module BetterUi
       module Input
         module Select
           module SelectHelper
-            # Renders a Select component for selection fields from option lists.
+            # Renderizza un componente Select personalizzato con ricerca, animazioni e multi-selezione.
             #
-            # @param name [String] Name of the select field
-            # @param options [Array<Hash>] Array of select options in format [{value: 'value', label: 'label'}, ...]
-            # @param selected [String, Array, nil] Selected value or values
-            # @param required [Boolean] Whether the field is required
-            # @param disabled [Boolean] Whether the field is disabled
-            # @param multiple [Boolean] Whether multiple options can be selected
-            # @param theme [Symbol] Component theme (:default, :white, :red, :rose, :orange, :green, :blue, :yellow, :violet)
-            # @param size [Symbol] Component size (:small, :medium, :large)
+            # @param name [String] Nome del campo select (obbligatorio)
+            # @param options [Array<Hash>] Array di opzioni nel formato [{value: 'value', label: 'label'}, ...]
+            # @param selected [String, Array, nil] Valore/i selezionato/i
+            # @param required [Boolean] Se il campo è obbligatorio
+            # @param disabled [Boolean] Se il campo è disabilitato
+            # @param multiple [Boolean] Se multiple opzioni possono essere selezionate
+            # @param searchable [Boolean] Se abilitare la ricerca
+            # @param theme [Symbol] Tema del componente (:default, :white, :red, :rose, :orange, :green, :blue, :yellow, :violet)
+            # @param size [Symbol] Dimensione del componente (:small, :medium, :large)
             # @param rounded [Symbol] Border radius (:none, :small, :medium, :large, :full)
-            # @param placeholder [String, nil] Placeholder text for the field (creates an initial disabled option)
-            # @param classes [String] Additional CSS classes
-            # @param form [ActionView::Helpers::FormBuilder, nil] Optional Rails form builder
-            # @param options_html [Hash] Additional HTML attributes for option tags
-            # @param html_options [Hash] Additional HTML attributes for the select tag
+            # @param placeholder [String] Testo placeholder per il trigger
+            # @param search_placeholder [String] Testo placeholder per il campo search
+            # @param max_height [String] Altezza massima del dropdown (default: "300px")
+            # @param form [ActionView::Helpers::FormBuilder, nil] Form builder Rails opzionale
+            # @param classes [String] Classi CSS aggiuntive
+            # @param options [Hash] Opzioni aggiuntive per attributi HTML
             #
-            # @return [String] Rendered HTML of the Select component
+            # @return [String] HTML del componente Select renderizzato
             #
-            # @example Basic select
-            #   <%= bui_input_select(name: 'country', options: [{value: 'it', label: 'Italy'}, {value: 'fr', label: 'France'}]) %>
+            # @example Uso base
+            #   <%= bui_input_select(name: 'country', options: [{value: 'it', label: 'Italia'}, {value: 'us', label: 'USA'}]) %>
             #
-            # @example Select with selected option
-            #   <%= bui_input_select(name: 'role', options: roles_array, selected: 'admin') %>
+            # @example Con selezione multipla
+            #   <%= bui_input_select(name: 'skills', multiple: true, options: skills_options) %>
             #
-            # @example Multiple select
-            #   <%= bui_input_select(name: 'languages[]', options: languages_array, multiple: true, selected: ['en', 'fr']) %>
+            # @example Con ricerca e temi
+            #   <%= bui_input_select(name: 'category', searchable: true, theme: :blue, options: categories) %>
             #
-            # @example Select with custom theme and size
-            #   <%= bui_input_select(name: 'category', options: categories_array, theme: :blue, size: :large) %>
+            # @example Con dimensioni personalizzate
+            #   <%= bui_input_select(name: 'priority', size: :large, options: priorities, selected: 'high') %>
             #
-            # @example With Rails form builder
+            # @example Con Rails form builder
             #   <%= form_with model: @user do |form| %>
-            #     <%= bui_input_select(name: :country_id, options: countries_array, form: form, required: true) %>
+            #     <%= bui_input_select(name: :role, form: form, options: role_options, theme: :green) %>
             #   <% end %>
+            #
+            # @example Con opzioni avanzate
+            #   <%= bui_input_select(
+            #         name: 'tags', 
+            #         multiple: true, 
+            #         searchable: true,
+            #         placeholder: 'Seleziona tag...',
+            #         search_placeholder: 'Cerca tag...',
+            #         max_height: '200px',
+            #         options: tag_options,
+            #         selected: ['ruby', 'rails']
+            #       ) %>
             def bui_input_select(name:, options:, selected: nil, required: false, disabled: false, 
-                           multiple: false, theme: :default, size: :medium, rounded: :medium, 
-                           placeholder: nil, classes: '', form: nil, options_html: {}, **html_options)
-              
+                                 multiple: false, searchable: true, theme: :default, size: :medium, 
+                                 rounded: :medium, placeholder: nil, search_placeholder: nil, 
+                                 max_height: "300px", form: nil, classes: '', **html_options)
               render BetterUi::General::Input::Select::Component.new(
                 name: name,
                 options: options,
@@ -52,13 +66,15 @@ module BetterUi
                 required: required,
                 disabled: disabled,
                 multiple: multiple,
+                searchable: searchable,
                 theme: theme,
                 size: size,
                 rounded: rounded,
                 placeholder: placeholder,
-                classes: classes,
+                search_placeholder: search_placeholder,
+                max_height: max_height,
                 form: form,
-                options_html: options_html,
+                classes: classes,
                 **html_options
               )
             end
@@ -67,4 +83,4 @@ module BetterUi
       end
     end
   end
-end
+end

data/app/helpers/better_ui/general/components/input/toggle/toggle_helper.rb

@@ -0,0 +1,77 @@
+# frozen_string_literal: true
+
+module BetterUi
+  module General
+    module Components
+      module Input
+        module Toggle
+          module ToggleHelper
+            # Renderizza un componente Toggle/Switch moderno per sostituire i checkbox tradizionali.
+            #
+            # @param name [String] Nome del campo toggle (obbligatorio)
+            # @param value [String] Valore del toggle quando è attivo (default: "1")
+            # @param checked [Boolean] Se il toggle è attivo
+            # @param required [Boolean] Se il campo è obbligatorio
+            # @param disabled [Boolean] Se il campo è disabilitato
+            # @param label [String, nil] Testo della label associata al toggle
+            # @param label_position [Symbol] Posizione della label (:left, :right)
+            # @param theme [Symbol] Tema del componente (:default, :white, :red, :rose, :orange, :green, :blue, :yellow, :violet)
+            # @param size [Symbol] Dimensione del componente (:small, :medium, :large)
+            # @param form [ActionView::Helpers::FormBuilder, nil] Form builder Rails opzionale
+            # @param classes [String] Classi CSS aggiuntive
+            # @param options [Hash] Opzioni aggiuntive per attributi HTML
+            #
+            # @return [String] HTML del componente Toggle renderizzato
+            #
+            # @example Uso base
+            #   <%= bui_input_toggle(name: 'notifications') %>
+            #
+            # @example Con label e stato iniziale
+            #   <%= bui_input_toggle(name: 'dark_mode', label: 'Modalità scura', checked: true) %>
+            #
+            # @example Con tema e dimensioni
+            #   <%= bui_input_toggle(name: 'premium', label: 'Account Premium', theme: :green, size: :large) %>
+            #
+            # @example Con posizione label e stato disabilitato
+            #   <%= bui_input_toggle(name: 'maintenance', label: 'Modalità manutenzione', label_position: :left, disabled: true) %>
+            #
+            # @example Con Rails form builder
+            #   <%= form_with model: @user do |form| %>
+            #     <%= bui_input_toggle(name: :email_notifications, form: form, label: 'Notifiche email', theme: :blue) %>
+            #     <%= bui_input_toggle(name: :sms_notifications, form: form, label: 'Notifiche SMS', theme: :green) %>
+            #   <% end %>
+            #
+            # @example Con attributi HTML personalizzati
+            #   <%= bui_input_toggle(
+            #         name: 'api_access', 
+            #         label: 'Accesso API',
+            #         theme: :violet,
+            #         size: :small,
+            #         required: true,
+            #         data: { action: 'toggle-api-access' },
+            #         'aria-describedby': 'api-help-text'
+            #       ) %>
+            def bui_input_toggle(name:, value: '1', checked: false, required: false, disabled: false, 
+                                 label: nil, label_position: :right, theme: :default, size: :medium, 
+                                 form: nil, classes: '', **options)
+              render BetterUi::General::Input::Toggle::Component.new(
+                name: name,
+                value: value,
+                checked: checked,
+                required: required,
+                disabled: disabled,
+                label: label,
+                label_position: label_position,
+                theme: theme,
+                size: size,
+                form: form,
+                classes: classes,
+                **options
+              )
+            end
+          end
+        end
+      end
+    end
+  end
+end

data/app/helpers/better_ui/general/components/text/text_helper.rb

@@ -0,0 +1,83 @@
+# frozen_string_literal: true
+
+module BetterUi
+  module General
+    module Components
+      module Text
+        module TextHelper
+          # Genera un testo usando BetterUi::General::Text::Component
+          #
+          # @param text [String] testo da mostrare (nil se si usa blocco)
+          # @param theme [Symbol] tema del colore (:default, :white, :red, :blue, etc.)
+          # @param size [Symbol] dimensione (:xs, :small, :medium, :large, :xl, :"2xl")
+          # @param align [Symbol] allineamento (:left, :center, :right, :justify)
+          # @param weight [Symbol] peso font (:thin, :light, :normal, :medium, :semibold, :bold, :extrabold)
+          # @param style [Symbol] stile (:normal, :italic, :underline, :line_through)
+          # @param classes [String] classi CSS aggiuntive
+          # @param html_options [Hash] opzioni HTML aggiuntive
+          # @return [String] HTML del testo renderizzato
+          #
+          # @example Uso base
+          #   bui_text("Testo semplice")
+          #   bui_text("Testo importante", theme: :blue, weight: :bold)
+          #
+          # @example Con dimensioni e stili
+          #   bui_text("Titolo grande", size: :xl, weight: :bold)
+          #   bui_text("Testo sottile", theme: :muted, size: :small)
+          #
+          # @example Con allineamento
+          #   bui_text("Testo centrato", align: :center)
+          #   bui_text("Testo giustificato", align: :justify)
+          #
+          # @example Con stili tipografici
+          #   bui_text("Testo corsivo", style: :italic)
+          #   bui_text("Testo sottolineato", style: :underline)
+          #
+          # @example Con blocco Ruby
+          #   bui_text(theme: :green, weight: :semibold) do
+          #     "Contenuto complesso con <strong>HTML</strong>".html_safe
+          #   end
+          #
+          # @example Con attributi HTML personalizzati
+          #   bui_text("Testo con ID", 
+          #            theme: :blue, 
+          #            id: "my-text",
+          #            data: { action: "click->handler#process" })
+          #
+          # @example Per sostituire paragrafi standard
+          #   # Invece di: <p class="text-gray-600">Descrizione</p>
+          #   bui_text("Descrizione", theme: :gray)
+          #
+          # @example Combinazioni complesse
+          #   bui_text("Messaggio di errore", 
+          #            theme: :red, 
+          #            size: :small, 
+          #            weight: :medium,
+          #            classes: "mb-2")
+          def bui_text(
+            text = nil,
+            theme: :default,
+            size: :medium,
+            align: :left,
+            weight: :normal,
+            style: :normal,
+            classes: '',
+            **html_options,
+            &block
+          )
+            render BetterUi::General::Text::Component.new(
+              text: text,
+              theme: theme,
+              size: size,
+              align: align,
+              weight: weight,
+              style: style,
+              classes: classes,
+              **html_options
+            ), &block
+          end
+        end
+      end
+    end
+  end
+end

data/lib/better_ui/version.rb

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

data/lib/better_ui.rb

@@ -3,6 +3,7 @@ require "better_ui/engine"
 require "better_ui/railtie"
 
 require "font-awesome-sass"
+require "view_component"
 
 module BetterUi
   # Your code goes here...

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: better_ui
 version: !ruby/object:Gem::Version
-  version: 0.3.0
+  version: 0.6.0
 platform: ruby
 authors:
 - alessiobussolari
@@ -9,7 +9,7 @@ authors:
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2025-06-03 00:00:00.000000000 Z
+date: 2025-06-07 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: rails
@@ -141,6 +141,10 @@ files:
 - 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/grid/cell_component.html.erb
+- app/components/better_ui/general/grid/cell_component.rb
+- app/components/better_ui/general/grid/component.html.erb
+- app/components/better_ui/general/grid/component.rb
 - app/components/better_ui/general/heading/component.html.erb
 - app/components/better_ui/general/heading/component.rb
 - app/components/better_ui/general/icon/component.html.erb
@@ -149,8 +153,12 @@ files:
 - app/components/better_ui/general/input/checkbox/component.rb
 - app/components/better_ui/general/input/datetime/component.html.erb
 - app/components/better_ui/general/input/datetime/component.rb
+- app/components/better_ui/general/input/pin/component.html.erb
+- app/components/better_ui/general/input/pin/component.rb
 - app/components/better_ui/general/input/radio/component.html.erb
 - app/components/better_ui/general/input/radio/component.rb
+- app/components/better_ui/general/input/rating/component.html.erb
+- app/components/better_ui/general/input/rating/component.rb
 - app/components/better_ui/general/input/select/component.html.erb
 - app/components/better_ui/general/input/select/component.rb
 - app/components/better_ui/general/input/select/select_component.html.erb
@@ -159,6 +167,8 @@ files:
 - app/components/better_ui/general/input/text/component.rb
 - app/components/better_ui/general/input/textarea/component.html.erb
 - app/components/better_ui/general/input/textarea/component.rb
+- app/components/better_ui/general/input/toggle/component.html.erb
+- app/components/better_ui/general/input/toggle/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
@@ -195,6 +205,8 @@ files:
 - 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/text/component.html.erb
+- app/components/better_ui/general/text/component.rb
 - app/components/better_ui/general/tooltip/component.html.erb
 - app/components/better_ui/general/tooltip/component.rb
 - app/controllers/better_ui/application_controller.rb
@@ -204,7 +216,6 @@ 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
@@ -217,17 +228,20 @@ files:
 - 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/grid/grid_helper.rb
 - app/helpers/better_ui/general/components/heading/heading_helper.rb
 - app/helpers/better_ui/general/components/icon/icon_helper.rb
 - app/helpers/better_ui/general/components/input/checkbox/checkbox_helper.rb
 - app/helpers/better_ui/general/components/input/datetime/datetime_helper.rb
+- app/helpers/better_ui/general/components/input/pin/pin_helper.rb
 - app/helpers/better_ui/general/components/input/radio/radio_helper.rb
 - app/helpers/better_ui/general/components/input/radio_group/radio_group_helper.rb
+- app/helpers/better_ui/general/components/input/rating/rating_helper.rb
 - app/helpers/better_ui/general/components/input/select/select_helper.rb
 - 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/input/toggle/toggle_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
@@ -244,6 +258,7 @@ files:
 - 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/text/text_helper.rb
 - app/helpers/better_ui/general/components/tooltip/tooltip_helper.rb
 - app/jobs/better_ui/application_job.rb
 - app/mailers/better_ui/application_mailer.rb

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

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

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

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