better_ui 0.4.0 → 0.5.1

data/app/components/better_ui/general/link_component.rb

@@ -0,0 +1,132 @@
+module BetterUi
+  module General
+    class LinkComponent < ViewComponent::Base
+      attr_reader :label, :href, :theme, :icon, :classes, :active, :data, :method, :target
+
+      # Temi di colore disponibili
+      LINK_THEME = {
+        default: {
+          link: "bui-link--default",
+          active: "bui-link--active bui-link--default",
+          text: "bui-link--text bui-link--default"
+        },
+        white: {
+          link: "bui-link--white",
+          active: "bui-link--active bui-link--white",
+          text: "bui-link--text bui-link--white"
+        },
+        red: {
+          link: "bui-link--red",
+          active: "bui-link--active bui-link--red",
+          text: "bui-link--text bui-link--red"
+        },
+        rose: {
+          link: "bui-link--rose",
+          active: "bui-link--active bui-link--rose",
+          text: "bui-link--text bui-link--rose"
+        },
+        orange: {
+          link: "bui-link--orange",
+          active: "bui-link--active bui-link--orange",
+          text: "bui-link--text bui-link--orange"
+        },
+        green: {
+          link: "bui-link--green",
+          active: "bui-link--active bui-link--green",
+          text: "bui-link--text bui-link--green"
+        },
+        blue: {
+          link: "bui-link--blue",
+          active: "bui-link--active bui-link--blue",
+          text: "bui-link--text bui-link--blue"
+        },
+        yellow: {
+          link: "bui-link--yellow",
+          active: "bui-link--active bui-link--yellow",
+          text: "bui-link--text bui-link--yellow"
+        },
+        violet: {
+          link: "bui-link--violet",
+          active: "bui-link--active bui-link--violet",
+          text: "bui-link--text bui-link--violet"
+        }
+      }
+
+      # Inizializzazione del componente
+      def initialize(
+        label:, 
+        href: nil,
+        theme: :default,
+        icon: nil,
+        classes: nil,
+        active: false,
+        data: {},
+        method: nil,
+        target: nil
+      )
+        @label = label
+        @href = href
+        @theme = theme.to_sym
+        @icon = icon
+        @classes = classes
+        @active = active
+        @data = data || {}
+        @method = method
+        @target = target
+      end
+
+      # Determina se è un link attivo/corrente
+      def active?
+        @active
+      end
+
+      # Determina se è un link o solo testo
+      def link?
+        @href.present?
+      end
+
+      # Genera le classi per il componente
+      def component_classes
+        theme_classes = LINK_THEME.fetch(@theme, LINK_THEME[:default])
+        
+        base_classes = ["bui-link"]
+        
+        if active?
+          base_classes << theme_classes[:active]
+        elsif link?
+          base_classes << theme_classes[:link]
+        else
+          base_classes << theme_classes[:text]
+        end
+        
+        base_classes << @classes if @classes.present?
+        
+        base_classes.compact.join(" ")
+      end
+
+      # Restituisce gli attributi per il link
+      def link_attributes
+        attrs = {
+          class: component_classes
+        }
+        
+        attrs[:data] = @data.merge(turbo_method: @method) if @method.present?
+        attrs[:data] = @data if @data.present? && !@method.present?
+        attrs[:target] = @target if @target.present?
+        
+        attrs
+      end
+
+      # Renderizza l'icona
+      def render_icon
+        return nil unless @icon.present?
+        
+        if @icon.is_a?(String)
+          render BetterUi::General::IconComponent.new(name: @icon)
+        else
+          @icon # Assumiamo che sia già un componente renderizzato
+        end
+      end
+    end
+  end
+end 

data/app/components/better_ui/general/panel_component.rb

@@ -1,92 +1,87 @@
 module BetterUi
   module General
     class PanelComponent < ViewComponent::Base
-      attr_reader :header, :footer, :body, :title, :padding, :variant
+      attr_reader :header, :footer, :body, :title, :padding, :variant, :rounded
       
-      PADDING_OPTIONS = {
-        none: '',
-        small: 'p-2',
-        medium: 'p-4',
-        large: 'p-6'
+      # Opzioni di padding disponibili
+      PANEL_PADDING = {
+        none: 'bui-panel--padding-none',
+        small: 'bui-panel--padding-small',
+        medium: 'bui-panel--padding-medium',
+        large: 'bui-panel--padding-large'
       }.freeze
       
-      def initialize(title: nil, body: nil, header: nil, footer: nil, padding: :medium, variant: :default)
+      # Temi di colore per il panel
+      PANEL_THEME = {
+        default: 'bui-panel--default',
+        white: 'bui-panel--white',
+        red: 'bui-panel--red',
+        rose: 'bui-panel--rose',
+        orange: 'bui-panel--orange',
+        green: 'bui-panel--green',
+        blue: 'bui-panel--blue',
+        yellow: 'bui-panel--yellow',
+        violet: 'bui-panel--violet'
+      }.freeze
+      
+      # Opzioni di bordi arrotondati standardizzati
+      PANEL_RADIUS = {
+        none: 'bui-panel--radius-none',
+        small: 'bui-panel--radius-small',
+        medium: 'bui-panel--radius-medium',
+        large: 'bui-panel--radius-large',
+        full: 'bui-panel--radius-full'
+      }.freeze
+      
+      def initialize(title: nil, body: nil, header: nil, footer: nil, padding: :medium, variant: :default, rounded: :small)
         @title = title
         @body = body
         @header = header
         @footer = footer
         @padding = padding.to_sym
         @variant = variant.to_sym
+        @rounded = rounded.to_sym
       end
 
       def panel_classes
-        ThemeHelper.generate_component_classes(:panel, @variant)
+        [
+          'bui-panel',
+          get_theme_class,
+          get_border_radius_class
+        ].compact.join(' ')
+      end
+
+      def get_border_radius_class
+        PANEL_RADIUS[@rounded] || PANEL_RADIUS[:small]
+      end
+      
+      def get_theme_class
+        PANEL_THEME[@variant] || PANEL_THEME[:default]
       end
 
       def header_classes
         [
-          'panel-header',
-          ThemeHelper::LAYOUT_STYLES[:panel][:header],
-          header_color_classes,
-          PADDING_OPTIONS.fetch(@padding, PADDING_OPTIONS[:medium])
+          'bui-panel__header',
+          PANEL_PADDING.fetch(@padding, PANEL_PADDING[:medium])
         ].compact.join(' ')
       end
 
       def body_classes
         [
-          'panel-body',
-          ThemeHelper::LAYOUT_STYLES[:panel][:body],
-          'overflow-x-auto break-words',
-          PADDING_OPTIONS.fetch(@padding, PADDING_OPTIONS[:medium])
+          'bui-panel__body',
+          PANEL_PADDING.fetch(@padding, PANEL_PADDING[:medium])
         ].compact.join(' ')
       end
 
       def footer_classes
         [
-          'panel-footer',
-          ThemeHelper::LAYOUT_STYLES[:panel][:footer],
-          footer_color_classes,
-          'overflow-x-auto break-words',
-          PADDING_OPTIONS.fetch(@padding, PADDING_OPTIONS[:medium])
+          'bui-panel__footer',
+          PANEL_PADDING.fetch(@padding, PANEL_PADDING[:medium])
         ].compact.join(' ')
       end
 
       def title_classes
-        'text-lg font-medium'
-      end
-      
-      def header_color_classes
-        case @variant
-        when :primary
-          'bg-orange-50 text-orange-700'
-        when :success
-          'bg-green-50 text-green-700'
-        when :warning
-          'bg-amber-50 text-amber-700'
-        when :danger
-          'bg-red-50 text-red-700'
-        when :info
-          'bg-blue-50 text-blue-700'
-        else
-          'bg-gray-50 text-gray-700'
-        end
-      end
-      
-      def footer_color_classes
-        case @variant
-        when :primary
-          'bg-orange-50 text-orange-600'
-        when :success
-          'bg-green-50 text-green-600'
-        when :warning
-          'bg-amber-50 text-amber-600'
-        when :danger
-          'bg-red-50 text-red-600'
-        when :info
-          'bg-blue-50 text-blue-600'
-        else
-          'bg-gray-50 text-gray-600'
-        end
+        'bui-panel__title'
       end
 
       def render?

data/app/components/better_ui/general/spinner_component.html.erb

@@ -0,0 +1,15 @@
+<div <%= spinner_attributes.to_s.html_safe %>>
+  <div class="bui-spinner__animation"></div>
+  
+  <% if @label.present? %>
+    <div class="bui-spinner__label">
+      <%= @label %>
+    </div>
+  <% end %>
+  
+  <% if content.present? %>
+    <div class="bui-spinner__content">
+      <%= content %>
+    </div>
+  <% end %>
+</div> 

data/app/components/better_ui/general/spinner_component.rb

@@ -0,0 +1,79 @@
+module BetterUi
+  module General
+    class SpinnerComponent < ViewComponent::Base
+      attr_reader :size, :theme, :fullscreen, :label, :classes, :id
+
+      # Temi di colore disponibili
+      SPINNER_THEME = {
+        default: "bui-spinner--default",
+        white: "bui-spinner--white",
+        red: "bui-spinner--red",
+        rose: "bui-spinner--rose",
+        orange: "bui-spinner--orange",
+        green: "bui-spinner--green",
+        blue: "bui-spinner--blue",
+        yellow: "bui-spinner--yellow",
+        violet: "bui-spinner--violet"
+      }
+
+      # Dimensioni disponibili
+      SPINNER_SIZES = {
+        small: "bui-spinner--small",
+        medium: "bui-spinner--medium",
+        large: "bui-spinner--large"
+      }
+
+      # Stati e comportamenti dello spinner
+      SPINNER_STATES = {
+        fullscreen: "bui-spinner--fullscreen"
+      }
+
+      # Inizializzazione del componente
+      def initialize(
+        size: :medium,
+        theme: :default,
+        fullscreen: false,
+        label: nil,
+        classes: nil,
+        id: nil
+      )
+        @size = size.to_sym
+        @theme = theme.to_sym
+        @fullscreen = fullscreen
+        @label = label
+        @classes = classes
+        @id = id
+      end
+
+      # Combina tutte le classi
+      def combined_classes
+        [
+          "bui-spinner", # Classe base per tutti gli spinner
+          get_spinner_theme_class,
+          get_spinner_size_class,
+          @fullscreen ? SPINNER_STATES[:fullscreen] : "",
+          @classes
+        ].compact.join(" ")
+      end
+      
+      def get_spinner_theme_class
+        SPINNER_THEME[@theme] || SPINNER_THEME[:default]
+      end
+      
+      def get_spinner_size_class
+        SPINNER_SIZES[@size] || SPINNER_SIZES[:medium]
+      end
+      
+      # Restituisce gli attributi per lo spinner
+      def spinner_attributes
+        attrs = {
+          class: combined_classes,
+          id: @id,
+          role: "status"
+        }
+        
+        attrs
+      end
+    end
+  end
+end 

data/app/components/better_ui/general/table_component.html.erb

@@ -7,31 +7,67 @@
     <% end %>
     
     <thead class="<%= thead_classes %>">
-      <tr>
-        <% headers_for_display.each do |header| %>
-          <th scope="col" class="<%= th_classes %>">
-            <%= header.to_s.humanize %>
-          </th>
-        <% end %>
-      </tr>
+      <% if header_rows_partial.present? %>
+        <%= render partial: header_rows_partial, locals: { 
+          component: self, 
+          headers: headers_for_display 
+        } %>
+      <% else %>
+        <tr>
+          <% headers_for_display.each do |header| %>
+            <th scope="col" class="<%= th_classes %>">
+              <%= header.to_s.humanize %>
+            </th>
+          <% end %>
+        </tr>
+      <% end %>
     </thead>
     
     <tbody class="<%= tbody_classes %>">
       <% data.each_with_index do |row, index| %>
-        <tr class="<%= tr_classes(index) %>">
-          <% headers_for_display.each do |header| %>
-            <td class="<%= td_classes %>">
-              <% if row.is_a?(Hash) %>
-                <%= row[header.to_s] || row[header.to_sym] %>
-              <% elsif row.respond_to?(header.to_sym) %>
-                <%= row.send(header.to_sym) %>
-              <% else %>
-                —
-              <% end %>
-            </td>
-          <% end %>
-        </tr>
+        <% if body_row_partial.present? %>
+          <%= render partial: body_row_partial, locals: { 
+            component: self, 
+            row: row,
+            index: index,
+            headers: headers_for_display 
+          } %>
+        <% else %>
+          <tr class="<%= tr_classes(index) %>">
+            <% headers_for_display.each do |header| %>
+              <td class="<%= td_classes %>">
+                <% if row.is_a?(Hash) %>
+                  <%= row[header.to_s] || row[header.to_sym] %>
+                <% elsif row.respond_to?(header.to_sym) %>
+                  <%= row.send(header.to_sym) %>
+                <% else %>
+                  —
+                <% end %>
+              </td>
+            <% end %>
+          </tr>
+        <% end %>
       <% end %>
     </tbody>
+    
+    <% if footer.present? %>
+      <tfoot class="<%= tfoot_classes %>">
+        <% if footer_rows_partial.present? %>
+          <%= render partial: footer_rows_partial, locals: { 
+            component: self, 
+            footer: footer, 
+            headers: headers_for_display 
+          } %>
+        <% else %>
+          <tr>
+            <% footer.each_with_index do |value, index| %>
+              <td class="<%= tf_classes %>">
+                <%= value || "—" %>
+              </td>
+            <% end %>
+          </tr>
+        <% end %>
+      </tfoot>
+    <% end %>
   </table>
 </div> 

data/app/components/better_ui/general/table_component.rb

@@ -1,137 +1,139 @@
 module BetterUi
   module General
     class TableComponent < ViewComponent::Base
-      attr_reader :data, :headers, :caption, :striped, :hoverable, :bordered, :compact, :classes, :variant
+      attr_reader :data, :headers, :caption, :striped, :hoverable, :bordered, :compact, :classes, :variant, :rounded, :footer,
+                  :header_rows_partial, :body_row_partial, :footer_rows_partial
       
-      def initialize(data:, headers: nil, caption: nil, striped: false, hoverable: false, bordered: true, compact: false, classes: nil, variant: :default)
+      # Costanti per configurazione stili
+      TABLE_THEMES = {
+        default: "bui-table--default",
+        white:   "bui-table--white",
+        red:     "bui-table--red",
+        rose:    "bui-table--rose",
+        orange:  "bui-table--orange",
+        green:   "bui-table--green",
+        blue:    "bui-table--blue",
+        yellow:  "bui-table--yellow",
+        violet:  "bui-table--violet"
+      }.freeze
+      
+      # Opzioni di bordi arrotondati standardizzati
+      TABLE_RADIUS = {
+        none: "bui-table--radius-none",
+        small: "bui-table--radius-small",
+        medium: "bui-table--radius-medium",
+        large: "bui-table--radius-large",
+        full: "bui-table--radius-full"
+      }.freeze
+      
+      def initialize(data:, headers: nil, caption: nil, striped: false, hoverable: false, bordered: true, compact: false, classes: nil, variant: :default, rounded: :small, footer: nil, header_rows_partial: nil, body_row_partial: nil, footer_rows_partial: nil)
         @data = data || []
         @headers = headers
         @caption = caption
-        @striped = striped
-        @hoverable = hoverable
-        @bordered = bordered
-        @compact = compact
+        @striped = !!striped
+        @hoverable = !!hoverable
+        @bordered = !!bordered
+        @compact = !!compact
         @classes = classes
-        @variant = variant.to_sym
+        @variant = (TABLE_THEMES.key?(variant.to_sym) ? variant.to_sym : :default)
+        @rounded = (TABLE_RADIUS.key?(rounded.to_sym) ? rounded.to_sym : :small)
+        @footer = footer.is_a?(Array) ? footer : nil  # Valida che sia un array
+        @header_rows_partial = header_rows_partial
+        @body_row_partial = body_row_partial
+        @footer_rows_partial = footer_rows_partial
       end
 
       def table_classes
-        ThemeHelper.generate_component_classes(:table, @variant, { bordered: @bordered, classes: @classes })
+        [
+          "bui-table",
+          get_theme_class,
+          @bordered ? "bui-table--bordered" : nil,
+          @striped ? "bui-table--striped" : nil,
+          @hoverable ? "bui-table--hoverable" : nil,
+          @compact ? "bui-table--compact" : nil,
+          @classes
+        ].compact.join(" ")
       end
 
       def table_container_classes
         [
-          ThemeHelper::LAYOUT_STYLES[:table][:container],
-          get_border_color
-        ].compact.join(' ')
+          "bui-table__container",
+          get_border_radius_class
+        ].compact.join(" ")
+      end
+
+      def get_border_radius_class
+        TABLE_RADIUS[@rounded] || TABLE_RADIUS[:small]
+      end
+      
+      def get_theme_class
+        TABLE_THEMES[@variant] || TABLE_THEMES[:default]
       end
 
       def caption_classes
-        [
-          'px-4 py-2',
-          'text-sm font-medium text-left',
-          caption_color_classes,
-          @bordered ? "border-b #{get_border_color}" : nil
-        ].compact.join(' ')
+        "bui-table__caption"
       end
 
       def thead_classes
-        ThemeHelper::LAYOUT_STYLES[:table][:header]
+        "bui-table__header"
       end
 
       def tbody_classes
-        @striped ? ThemeHelper::LAYOUT_STYLES[:table][:row][:striped] : nil
+        "bui-table__body"
+      end
+      
+      def tfoot_classes
+        "bui-table__footer"
       end
 
       def tr_classes(index)
-        [
-          @hoverable ? ThemeHelper::LAYOUT_STYLES[:table][:row][:hover] : nil,
-          @striped ? nil : (index.odd? ? 'bg-gray-50' : nil)
-        ].compact.join(' ')
+        "bui-table__row"
       end
 
       def th_classes
         [
-          @compact ? 'px-2 py-1' : 'px-4 py-3',
-          'text-left text-xs font-medium uppercase tracking-wider',
-          th_color_classes,
-          @bordered ? "border #{get_border_color}" : nil
-        ].compact.join(' ')
+          "bui-table__cell",
+          "bui-table__cell--header"
+        ].compact.join(" ")
       end
 
       def td_classes
-        [
-          @compact ? 'px-2 py-1' : 'px-4 py-3',
-          @bordered ? "border #{get_border_color}" : nil,
-          'text-sm'
-        ].compact.join(' ')
+        "bui-table__cell"
       end
       
-      def get_border_color
-        case @variant
-        when :primary
-          'border-orange-200'
-        when :success
-          'border-green-200'
-        when :warning
-          'border-amber-200'
-        when :danger
-          'border-red-200'
-        when :info
-          'border-blue-200'
-        else
-          'border-gray-200'
-        end
-      end
-      
-      def caption_color_classes
-        case @variant
-        when :primary
-          'bg-orange-50 text-orange-700'
-        when :success
-          'bg-green-50 text-green-700'
-        when :warning
-          'bg-amber-50 text-amber-700'
-        when :danger
-          'bg-red-50 text-red-700'
-        when :info
-          'bg-blue-50 text-blue-700'
-        else
-          'bg-gray-50 text-gray-700'
-        end
-      end
-      
-      def th_color_classes
-        case @variant
-        when :primary
-          'text-orange-700'
-        when :success
-          'text-green-700'
-        when :warning
-          'text-amber-700'
-        when :danger
-          'text-red-700'
-        when :info
-          'text-blue-700'
-        else
-          'text-gray-700'
-        end
+      def tf_classes
+        [
+          "bui-table__cell",
+          "bui-table__cell--footer"
+        ].compact.join(" ")
       end
 
       def headers_for_display
         return @headers if @headers.present?
         return [] if @data.empty?
         
-        # Se non sono stati forniti headers, li derivo dalle chiavi del primo elemento
-        first_item = @data.first
-        if first_item.is_a?(Hash)
+        case first_item = @data.first
+        when Hash
           first_item.keys
-        elsif first_item.respond_to?(:attributes)
-          first_item.attributes.keys - ['id', 'created_at', 'updated_at']
+        when -> (item) { item.respond_to?(:attributes) }
+          first_item.attributes.keys - %w[id created_at updated_at]
         else
           []
         end
       end
+      
+      # Ottiene il valore di una cella in modo consistente
+      def get_cell_value(row, header)
+        if row.is_a?(Hash)
+          row[header.to_s] || row[header.to_sym] || "—"
+        elsif row.respond_to?(header.to_sym)
+          row.send(header.to_sym)
+        elsif row.is_a?(Array) && headers_for_display.index(header)
+          row[headers_for_display.index(header)] || "—"
+        else
+          "—"
+        end
+      end
 
       def render?
         @data.present?