better_ui 0.6.0 → 0.7.1

data/app/components/better_ui/general/input/toggle/component.rb

@@ -1,242 +0,0 @@
-# frozen_string_literal: true
-
-module BetterUi
-  module General
-    module Input
-      module Toggle
-        class Component < ViewComponent::Base
-          # Costanti con classi Tailwind dirette
-          TOGGLE_THEME = {
-            default: 'peer-checked:bg-gray-800',
-            white: 'peer-checked:bg-white border peer-checked:border-gray-900',
-            red: 'peer-checked:bg-red-600',
-            rose: 'peer-checked:bg-rose-600',
-            orange: 'peer-checked:bg-orange-600',
-            green: 'peer-checked:bg-green-600',
-            blue: 'peer-checked:bg-blue-600',
-            yellow: 'peer-checked:bg-yellow-600',
-            violet: 'peer-checked:bg-violet-600'
-          }.freeze
-
-          TOGGLE_TRACK_SIZE = {
-            small: 'w-9 h-5',
-            medium: 'w-11 h-6',
-            large: 'w-14 h-7'
-          }.freeze
-
-          TOGGLE_THUMB_SIZE = {
-            small: 'w-4 h-4',
-            medium: 'w-5 h-5',
-            large: 'w-6 h-6'
-          }.freeze
-
-          TOGGLE_THUMB_POSITION = {
-            small: 'peer-checked:translate-x-4',
-            medium: 'peer-checked:translate-x-5',
-            large: 'peer-checked:translate-x-7'
-          }.freeze
-
-          TOGGLE_BASE_TRACK = 'relative bg-gray-300 rounded-full transition-colors duration-200 ease-in-out'.freeze
-          TOGGLE_BASE_THUMB = 'bg-white rounded-full shadow-sm transform transition-transform duration-200 ease-in-out absolute top-0.5 left-0.5'.freeze
-
-          TOGGLE_LABEL_GAP = {
-            small: 'gap-2',
-            medium: 'gap-2.5',
-            large: 'gap-3'
-          }.freeze
-
-          TOGGLE_LABEL_TEXT = {
-            small: 'text-sm',
-            medium: 'text-base',
-            large: 'text-lg'
-          }.freeze
-
-          attr_reader :name, :value, :checked, :required, :disabled, 
-                      :label, :label_position, :theme, :size,
-                      :form, :classes, :options
-
-          # @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 l'input (es. data attributes)
-          def initialize(name:, value: '1', checked: false, required: false, disabled: false, 
-                         label: nil, label_position: :right, theme: :default, 
-                         size: :medium, form: nil, classes: '', **options)
-            @name = name
-            @value = value
-            @checked = checked
-            @required = required
-            @disabled = disabled
-            @label = label
-            @label_position = label_position.to_sym
-            @theme = theme.to_sym
-            @size = size.to_sym
-            @form = form
-            @classes = classes
-            @options = options
-
-            validate_params
-          end
-
-          private
-
-          def validate_params
-            validate_theme
-            validate_size
-            validate_label_position
-          end
-
-          def validate_theme
-            return if TOGGLE_THEME.key?(@theme)
-
-            raise ArgumentError, "Invalid theme: #{@theme}. Valid themes are: #{TOGGLE_THEME.keys.join(', ')}"
-          end
-
-          def validate_size
-            return if TOGGLE_TRACK_SIZE.key?(@size)
-
-            raise ArgumentError, "Invalid size: #{@size}. Valid sizes are: #{TOGGLE_TRACK_SIZE.keys.join(', ')}"
-          end
-
-          def validate_label_position
-            return if [:left, :right].include?(@label_position)
-
-            raise ArgumentError, "Invalid label_position: #{@label_position}. Valid positions are: left, right"
-          end
-
-          def container_classes
-            base_classes = ['inline-flex', 'items-center']
-            base_classes << TOGGLE_LABEL_GAP[@size]
-            base_classes << (@disabled ? 'opacity-50 cursor-not-allowed' : 'cursor-pointer')
-            base_classes << @classes if @classes.present?
-            base_classes.join(' ')
-          end
-
-          def track_classes
-            [
-              TOGGLE_BASE_TRACK,
-              TOGGLE_THEME[@theme],
-              TOGGLE_TRACK_SIZE[@size]
-            ].join(' ')
-          end
-
-          def thumb_classes
-            [
-              TOGGLE_BASE_THUMB,
-              TOGGLE_THUMB_SIZE[@size],
-              TOGGLE_THUMB_POSITION[@size]
-            ].join(' ')
-          end
-
-          def input_attributes
-            attrs = {
-              type: 'checkbox',
-              name: input_name,
-              value: @value,
-              class: 'sr-only peer',
-              checked: @checked,
-              required: @required,
-              disabled: @disabled,
-              id: input_id
-            }
-
-            attrs.merge(@options)
-          end
-
-          def input_name
-            if @form
-              @form.field_name(@name)
-            else
-              @name
-            end
-          end
-
-          def input_id
-            @options[:id] || "toggle_#{@name}"
-          end
-
-          def label_classes
-            TOGGLE_LABEL_TEXT[@size]
-          end
-
-          def input_tag
-            if @form
-              form_checkbox
-            else
-              manual_input
-            end
-          end
-
-          def form_checkbox
-            @form.check_box(@name, {
-              class: 'sr-only peer',
-              id: input_id,
-              checked: @checked,
-              disabled: @disabled,
-              required: @required,
-              **@options
-            }, @value, '0')
-          end
-
-          def manual_input
-            attrs = input_attributes.map do |key, value|
-              if value == true
-                key.to_s
-              elsif value == false || value.nil?
-                nil
-              else
-                "#{key}=\"#{value}\""
-              end
-            end.compact.join(' ')
-            
-            "<input #{attrs} />".html_safe
-          end
-
-          def render_toggle_with_label
-            if @label_position == :left
-              label_left_content
-            else
-              label_right_content
-            end
-          end
-
-          def label_left_content
-            content_tag(:label, class: container_classes, for: input_id) do
-              safe_join([
-                content_tag(:span, @label, class: label_classes),
-                render_toggle_switch
-              ])
-            end
-          end
-
-          def label_right_content
-            content_tag(:label, class: container_classes, for: input_id) do
-              safe_join([
-                render_toggle_switch,
-                content_tag(:span, @label, class: label_classes)
-              ])
-            end
-          end
-
-          def render_toggle_switch
-            content_tag(:div, class: 'relative') do
-              safe_join([
-                input_tag,
-                content_tag(:div, '', class: track_classes),
-                content_tag(:div, '', class: thumb_classes)
-              ])
-            end
-          end
-        end
-      end
-    end
-  end
-end

data/app/components/better_ui/general/link/component.html.erb

@@ -1,18 +0,0 @@
-<%# Template per il link %>
-<% if link? %>
-  <%= link_to @href, **element_attributes do %>
-    <% if show_icon? %>
-      <span class="<%= icon_classes %>"><%= render_icon %></span>
-    <% end %>
-    <span class="<%= text_classes %>"><%= @label %></span>
-    <%= content %>
-  <% end %>
-<% else %>
-  <%= tag.span(**element_attributes) do %>
-    <% if show_icon? %>
-      <span class="<%= icon_classes %>"><%= render_icon %></span>
-    <% end %>
-    <span class="<%= text_classes %>"><%= @label %></span>
-    <%= content %>
-  <% end %>
-<% end %>

data/app/components/better_ui/general/link/component.rb

@@ -1,258 +0,0 @@
-module BetterUi
-  module General
-    module Link
-      class Component < ViewComponent::Base
-        attr_reader :label, :href, :theme, :orientation, :style, :size, :icon, :active, :disabled, :data, :method, :target
-
-        # Classi base sempre presenti
-        LINK_BASE_CLASSES = "transition-colors duration-200 no-underline"
-
-        # Temi con classi Tailwind dirette - LOGICA CORRETTA
-        LINK_THEME_CLASSES = {
-          default: "text-white hover:text-gray-300",        # Bianco per sfondi scuri
-          white: "text-gray-900 hover:text-gray-700",      # Nero per sfondi chiari
-          red: "text-red-500 hover:text-red-600",
-          rose: "text-rose-500 hover:text-rose-600",
-          orange: "text-orange-500 hover:text-orange-600",
-          green: "text-green-500 hover:text-green-600",
-          blue: "text-blue-500 hover:text-blue-600",
-          yellow: "text-yellow-600 hover:text-yellow-700",
-          violet: "text-violet-500 hover:text-violet-600"
-        }
-
-        # Orientamenti con classi Tailwind dirette
-        LINK_ORIENTATION_CLASSES = {
-          horizontal: "inline-flex items-center",
-          vertical: "flex flex-col items-center"
-        }
-
-        # Stili con classi Tailwind dirette
-        LINK_STYLE_CLASSES = {
-          default: "",
-          underline: "underline",
-          bold: "font-bold",
-          text: "no-underline"
-        }
-
-        # Dimensioni con classi Tailwind dirette
-        LINK_SIZE_CLASSES = {
-          extra_small: "text-xs",
-          small: "text-sm",
-          medium: "text-base",
-          large: "text-lg"
-        }
-
-        # Stati con classi Tailwind dirette
-        LINK_STATE_CLASSES = {
-          normal: "",
-          active: "font-semibold",
-          disabled: "opacity-50 cursor-not-allowed pointer-events-none"
-        }
-
-        # @param label [String] testo del link
-        # @param href [String] URL di destinazione (nil per semplice testo)
-        # @param theme [Symbol] tema del colore (:default, :white, etc.)
-        # @param orientation [Symbol] orientamento (:horizontal, :vertical)
-        # @param style [Symbol] stile (:default, :underline, :bold, :text)
-        # @param size [Symbol] dimensione (:extra_small, :small, :medium, :large)
-        # @param icon [String] icona opzionale
-        # @param active [Boolean] stato attivo del link
-        # @param disabled [Boolean] stato disabilitato del link
-        # @param data [Hash] attributi data
-        # @param method [Symbol] metodo HTTP (per Turbo)
-        # @param target [String] target del link
-        # @param html_options [Hash] opzioni HTML aggiuntive
-        def initialize(
-          label:,
-          href: nil,
-          theme: :white,
-          orientation: :horizontal,
-          style: :default,
-          size: :medium,
-          icon: nil,
-          active: false,
-          disabled: false,
-          data: {},
-          method: nil,
-          target: nil,
-          **html_options
-        )
-          @label = label
-          @href = href
-          @theme = theme.to_sym
-          @orientation = orientation.to_sym
-          @style = style.to_sym
-          @size = size.to_sym
-          @icon = icon
-          @active = active
-          @disabled = disabled
-          @data = data || {}
-          @method = method
-          @target = target
-          @html_options = html_options
-
-          validate_params
-        end
-
-        # Determina se è un link attivo/corrente
-        def active?
-          @active
-        end
-
-        # Determina se è disabilitato
-        def disabled?
-          @disabled
-        end
-
-        # Determina se è un link o solo testo
-        def link?
-          @href.present? && !@disabled
-        end
-
-        # Combina tutte le classi CSS
-        def combined_classes
-          [
-            LINK_BASE_CLASSES,
-            get_theme_class,
-            get_orientation_class,
-            get_style_class,
-            get_size_class,
-            get_state_class,
-            @html_options[:class]
-          ].compact.join(" ")
-        end
-
-        # Classi per l'icona con dimensionamento proporzionale
-        def icon_classes
-          return "" unless @icon.present?
-
-          # Definisce spacing e dimensioni icona basate su size
-          base_spacing = case @orientation
-          when :horizontal
-            "mr-2"
-          when :vertical
-            "mb-1"
-          else
-            "mr-2"
-          end
-
-          icon_size = case @size
-          when :extra_small
-            "w-3 h-3"
-          when :small
-            "w-4 h-4"
-          when :medium
-            "w-5 h-5"
-          when :large
-            "w-6 h-6"
-          else
-            "w-5 h-5"
-          end
-
-          "#{base_spacing} #{icon_size} inline-block"
-        end
-
-        # Classi per il testo
-        def text_classes
-          "inline-block"
-        end
-
-        # Restituisce gli attributi per il link/span
-        def element_attributes
-          attrs = @html_options.except(:class)
-          attrs[:class] = combined_classes
-
-          if link?
-            # Attributi specifici per i link
-            if @method.present?
-              attrs[:data] = @data.merge(turbo_method: @method)
-            elsif @data.present?
-              attrs[:data] = @data
-            end
-
-            attrs[:target] = @target if @target.present?
-            attrs[:aria] ||= {}
-            attrs[:aria][:current] = "page" if active?
-          else
-            # Attributi per span (testo semplice o disabilitato)
-            attrs[:aria] ||= {}
-            attrs[:aria][:disabled] = true if disabled?
-          end
-
-          attrs
-        end
-
-        # Determina se mostrare l'icona
-        def show_icon?
-          @icon.present?
-        end
-
-        # Renderizza l'icona
-        def render_icon
-          return nil unless show_icon?
-
-          if @icon.is_a?(String)
-            render BetterUi::General::IconComponent.new(name: @icon)
-          else
-            @icon # Assumiamo che sia già un componente renderizzato
-          end
-        end
-
-        private
-
-        def get_theme_class
-          LINK_THEME_CLASSES[@theme] || LINK_THEME_CLASSES[:white]
-        end
-
-        def get_orientation_class
-          LINK_ORIENTATION_CLASSES[@orientation] || LINK_ORIENTATION_CLASSES[:horizontal]
-        end
-
-        def get_style_class
-          LINK_STYLE_CLASSES[@style] || LINK_STYLE_CLASSES[:default]
-        end
-
-        def get_size_class
-          LINK_SIZE_CLASSES[@size] || LINK_SIZE_CLASSES[:medium]
-        end
-
-        def get_state_class
-          return LINK_STATE_CLASSES[:disabled] if disabled?
-          return LINK_STATE_CLASSES[:active] if active?
-          LINK_STATE_CLASSES[:normal]
-        end
-
-        def validate_params
-          validate_theme
-          validate_orientation
-          validate_style
-          validate_size
-        end
-
-        def validate_theme
-          unless LINK_THEME_CLASSES.keys.include?(@theme)
-            raise ArgumentError, "Il tema deve essere uno tra: #{LINK_THEME_CLASSES.keys.join(', ')}"
-          end
-        end
-
-        def validate_orientation
-          unless LINK_ORIENTATION_CLASSES.keys.include?(@orientation)
-            raise ArgumentError, "L'orientamento deve essere uno tra: #{LINK_ORIENTATION_CLASSES.keys.join(', ')}"
-          end
-        end
-
-        def validate_style
-          unless LINK_STYLE_CLASSES.keys.include?(@style)
-            raise ArgumentError, "Lo stile deve essere uno tra: #{LINK_STYLE_CLASSES.keys.join(', ')}"
-          end
-        end
-
-        def validate_size
-          unless LINK_SIZE_CLASSES.keys.include?(@size)
-            raise ArgumentError, "La dimensione deve essere una tra: #{LINK_SIZE_CLASSES.keys.join(', ')}"
-          end
-        end
-      end
-    end
-  end
-end

data/app/components/better_ui/general/modal/component.html.erb

@@ -1,5 +0,0 @@
-<%# Wrapper component con controller Stimulus e slots %>
-<div <%= tag.attributes(wrapper_attributes) %>>
-  <%= trigger %>
-  <%= modal %>
-</div>

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

@@ -1,47 +0,0 @@
-module BetterUi
-  module General
-    module Modal
-      class Component < ViewComponent::Base
-        renders_one :trigger
-        renders_one :modal
-        
-        attr_reader :close_on_backdrop, :close_on_escape, :lock_scroll, :classes, :html_options
-
-
-
-        # Inizializzazione del wrapper component
-        def initialize(
-          close_on_backdrop: true,
-          close_on_escape: true,
-          lock_scroll: true,
-          classes: nil,
-          **html_options
-        )
-          @close_on_backdrop = close_on_backdrop
-          @close_on_escape = close_on_escape
-          @lock_scroll = lock_scroll
-          @classes = classes
-          @html_options = html_options
-        end
-
-        # Combina tutte le classi per il wrapper
-        def wrapper_classes
-          [@classes, @html_options[:class]].compact.join(" ")
-        end
-
-        # Restituisce gli attributi per il wrapper principale (con controller Stimulus)
-        def wrapper_attributes
-          {
-            class: wrapper_classes,
-            'data-controller': 'bui-modal',
-            'data-bui-modal-close-on-backdrop-value': close_on_backdrop,
-            'data-bui-modal-close-on-escape-value': close_on_escape,
-            'data-bui-modal-lock-scroll-value': lock_scroll
-          }.merge(@html_options.except(:class))
-        end
-
-
-      end
-    end
-  end
-end

data/app/components/better_ui/general/modal/modal_component.html.erb

@@ -1,52 +0,0 @@
-<%# Template per il modal content %>
-<% if @backdrop %>
-  <%= tag.div **backdrop_attributes do %>
-    <%= tag.div **container_attributes do %>
-      <%# Header del modal %>
-      <%= tag.div **header_attributes do %>
-        <h3 class="text-lg font-semibold" id="modal-title"><%= @title %></h3>
-        <% if @closable %>
-          <%= helpers.bui_button(
-            label: "Chiudi", 
-            icon: "x-mark",
-            type: :white,
-            size: :small,
-            data: [
-              { name: 'bui-modal-target', value: 'closeButton' },
-              { name: 'action', value: 'click->bui-modal#closeButtonClicked' }
-            ]
-          ) %>
-        <% end %>
-      <% end %>
-      
-      <%# Body del modal %>
-      <div class="p-6">
-        <%= content %>
-      </div>
-    <% end %>
-  <% end %>
-<% else %>
-  <%= tag.div **container_attributes do %>
-    <%# Header del modal %>
-    <%= tag.div **header_attributes do %>
-      <h3 class="text-lg font-semibold" id="modal-title"><%= @title %></h3>
-      <% if @closable %>
-        <%= helpers.bui_button(
-          label: "Chiudi", 
-          icon: "x-mark",
-          type: :white,
-          size: :small,
-          data: [
-            { name: 'bui-modal-target', value: 'closeButton' },
-            { name: 'action', value: 'click->bui-modal#closeButtonClicked' }
-          ]
-        ) %>
-      <% end %>
-    <% end %>
-    
-    <%# Body del modal %>
-    <div class="p-6">
-      <%= content %>
-    </div>
-  <% end %>
-<% end %>