better_ui 0.1.0 → 0.5.0

data/lib/generators/better_ui/templates/components/_table.scss

@@ -0,0 +1,105 @@
+/* ==============================
+ * Table Component
+ * ============================== */
+
+/* Contenitore e base */
+.bui-table-container {
+  @apply overflow-hidden;
+}
+
+.bui-table-base {
+  @apply w-full;
+}
+
+.bui-table-bordered {
+  @apply border-collapse;
+}
+
+/* Bordi arrotondati */
+.bui-table-radius-none { @apply rounded-none; }
+.bui-table-radius-small { @apply rounded-md; }
+.bui-table-radius-medium { @apply rounded-lg; }
+.bui-table-radius-large { @apply rounded-xl; }
+.bui-table-radius-full { @apply rounded-3xl; }
+
+/* Celle e righe */
+.bui-table-cell { 
+  @apply px-4 py-3; 
+}
+
+.bui-table-cell-compact { 
+  @apply px-2 py-1 text-sm; 
+}
+
+.bui-table-cell-bordered {
+  @apply border;
+}
+
+/* Stili per le righe */
+.bui-table-row-hover tr:hover td { 
+  @apply bg-opacity-10 bg-gray-500; 
+}
+
+.bui-table-row-striped tr:nth-child(odd) td { 
+  @apply bg-gray-50; 
+}
+
+.bui-table-row-alternate {
+  @apply bg-gray-50;
+}
+
+/* Caption */
+.bui-table-caption { 
+  @apply p-3 font-medium; 
+}
+
+.bui-table-caption-bordered {
+  @apply border-b;
+}
+
+/* Header */
+.bui-table-header th { 
+  @apply font-semibold; 
+}
+
+/* Footer */
+.bui-table-footer td { 
+  @apply font-semibold; 
+}
+
+.bui-table-footer-cell {
+  @apply bg-opacity-90;
+}
+
+/* Varianti bordi */
+.bui-table-border-default { @apply border-gray-900; }
+.bui-table-border-white { @apply border-gray-200; }
+.bui-table-border-red { @apply border-red-600; }
+.bui-table-border-rose { @apply border-rose-600; }
+.bui-table-border-orange { @apply border-orange-600; }
+.bui-table-border-green { @apply border-green-600; }
+.bui-table-border-blue { @apply border-blue-600; }
+.bui-table-border-yellow { @apply border-yellow-600; }
+.bui-table-border-violet { @apply border-violet-600; }
+
+/* Varianti background */
+.bui-table-bg-default { @apply bg-black; }
+.bui-table-bg-white { @apply bg-white; }
+.bui-table-bg-red { @apply bg-red-500; }
+.bui-table-bg-rose { @apply bg-rose-500; }
+.bui-table-bg-orange { @apply bg-orange-500; }
+.bui-table-bg-green { @apply bg-green-500; }
+.bui-table-bg-blue { @apply bg-blue-500; }
+.bui-table-bg-yellow { @apply bg-yellow-500; }
+.bui-table-bg-violet { @apply bg-violet-500; }
+
+/* Varianti testo */
+.bui-table-text-default { @apply text-white; }
+.bui-table-text-white { @apply text-black; }
+.bui-table-text-red { @apply text-white; }
+.bui-table-text-rose { @apply text-white; }
+.bui-table-text-orange { @apply text-white; }
+.bui-table-text-green { @apply text-white; }
+.bui-table-text-blue { @apply text-white; }
+.bui-table-text-yellow { @apply text-black; }
+.bui-table-text-violet { @apply text-white; } 

data/lib/generators/better_ui/templates/components/_variables.scss

@@ -0,0 +1,33 @@
+/* ==============================
+ * Variables
+ * ============================== */
+
+/* Colori principali - usa i colori di Tailwind */
+$bui-primary: theme('colors.blue.500') !default;
+$bui-primary-hover: theme('colors.blue.600') !default;
+$bui-secondary: theme('colors.gray.500') !default;
+$bui-secondary-hover: theme('colors.gray.600') !default;
+$bui-success: theme('colors.emerald.500') !default;
+$bui-warning: theme('colors.amber.500') !default;
+$bui-danger: theme('colors.red.500') !default;
+$bui-info: theme('colors.blue.500') !default;
+
+/* Spaziature - usa gli spacing di Tailwind */
+$bui-spacing-xs: theme('spacing.1') !default;
+$bui-spacing-sm: theme('spacing.2') !default;
+$bui-spacing-md: theme('spacing.4') !default;
+$bui-spacing-lg: theme('spacing.6') !default;
+$bui-spacing-xl: theme('spacing.8') !default;
+
+/* Tipografia - usa i font di Tailwind */
+$bui-font-family: theme('fontFamily.sans') !default;
+$bui-font-size-sm: theme('fontSize.sm[0]') !default;
+$bui-font-size-base: theme('fontSize.base[0]') !default;
+$bui-font-size-lg: theme('fontSize.lg[0]') !default;
+$bui-font-size-xl: theme('fontSize.xl[0]') !default;
+
+/* Border radius - usa i radius di Tailwind */
+$bui-radius-sm: theme('borderRadius.sm') !default;
+$bui-radius-md: theme('borderRadius.md') !default;
+$bui-radius-lg: theme('borderRadius.lg') !default;
+$bui-radius-full: theme('borderRadius.full') !default; 

data/lib/generators/better_ui/templates/components_stylesheet.scss

@@ -0,0 +1,66 @@
+/*
+ * <%= options[:prefix] %>_better_ui_components.scss
+ * Foglio di stile SCSS per la personalizzazione dei componenti di BetterUi
+ * Generato il: <%= Time.now.strftime('%d/%m/%Y %H:%M') %>
+ */
+
+/**
+ * INDICE:
+ * 1. Variabili
+ * 2. Componenti generali
+ * 3. Componenti applicativi
+ * 4. Personalizzazioni
+ */
+
+/*==================================
+  IMPORTAZIONE COMPONENTI E VARIABILI
+====================================*/
+/* Importa le variabili */
+@import "components/variables";
+
+@layer components {
+  /*==================================
+    COMPONENTI GENERALI
+  ====================================*/
+  
+  /* Importa il componente Bottone */
+  @import "components/button";
+  
+  /* Importa il componente Heading */
+  @import "components/heading";
+  
+  /* Importa il componente Breadcrumb */
+  @import "components/breadcrumb";
+  
+  /* Importa il componente Link */
+  @import "components/link";
+  
+  /* Importa il componente Panel */
+  @import "components/panel";
+  
+  /* Importa il componente Icon */
+  @import "components/icon";
+  
+  /* Importa il componente Table */
+  @import "components/table";
+  
+  /* Importa il componente Spinner */
+  @import "components/spinner";
+  
+  /* Importa il componente Badge */
+  @import "components/badge";
+  
+  /* Importa il componente Avatar */
+  @import "components/avatar";
+  
+  /*==================================
+    COMPONENTI APPLICATIVI
+  ====================================*/
+  /* Importa il componente Card */
+  @import "components/card";
+  
+  /*==================================
+    PERSONALIZZAZIONI
+  ====================================*/
+  /* Qui è possibile aggiungere personalizzazioni specifiche */
+}

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: better_ui
 version: !ruby/object:Gem::Version
-  version: 0.1.0
+  version: 0.5.0
 platform: ruby
 authors:
 - alessiobussolari
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2025-05-01 00:00:00.000000000 Z
+date: 2025-05-04 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: rails
@@ -66,6 +66,76 @@ dependencies:
     - - "~>"
       - !ruby/object:Gem::Version
         version: '2.0'
+- !ruby/object:Gem::Dependency
+  name: coderay
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '1.1'
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '1.1'
+- !ruby/object:Gem::Dependency
+  name: font-awesome-sass
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: 6.5.1
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: 6.5.1
+- !ruby/object:Gem::Dependency
+  name: lookbook
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '2.1'
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '2.1'
+- !ruby/object:Gem::Dependency
+  name: listen
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
+- !ruby/object:Gem::Dependency
+  name: actioncable
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
 - !ruby/object:Gem::Dependency
   name: sqlite3
   requirement: !ruby/object:Gem::Requirement
@@ -94,8 +164,8 @@ dependencies:
     - - ">="
       - !ruby/object:Gem::Version
         version: '0'
-description: Una gem Rails che funziona come engine montabile contenente componenti
-  UI riutilizzabili e pagine di documentazione
+description: A Rails gem that works as a mountable engine containing reusable UI components
+  and documentation pages
 email:
 - alessio.bussolari@pandev.it
 executables: []
@@ -105,21 +175,76 @@ files:
 - MIT-LICENSE
 - README.md
 - Rakefile
+- app/assets/javascripts/better_ui/controllers/navbar_controller.js
+- app/assets/javascripts/better_ui/controllers/sidebar_controller.js
+- app/assets/javascripts/better_ui/controllers/toast_controller.js
+- app/assets/javascripts/better_ui/index.js
+- app/assets/javascripts/better_ui/toast_manager.js
 - app/assets/stylesheets/better_ui/application.css
+- app/components/better_ui/application/alert_component.html.erb
+- app/components/better_ui/application/alert_component.rb
+- app/components/better_ui/application/card_component.html.erb
+- app/components/better_ui/application/card_component.rb
+- app/components/better_ui/application/card_container_component.html.erb
+- app/components/better_ui/application/card_container_component.rb
+- app/components/better_ui/application/header_component.html.erb
+- app/components/better_ui/application/header_component.rb
+- app/components/better_ui/application/navbar_component.html.erb
+- 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/application/toast_component.html.erb
+- app/components/better_ui/application/toast_component.rb
+- app/components/better_ui/general/avatar_component.html.erb
+- app/components/better_ui/general/avatar_component.rb
+- app/components/better_ui/general/badge_component.html.erb
+- app/components/better_ui/general/badge_component.rb
+- app/components/better_ui/general/breadcrumb_component.html.erb
+- app/components/better_ui/general/breadcrumb_component.rb
+- app/components/better_ui/general/button_component.html.erb
+- app/components/better_ui/general/button_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
+- app/components/better_ui/general/icon_component.rb
+- app/components/better_ui/general/link_component.html.erb
+- app/components/better_ui/general/link_component.rb
+- app/components/better_ui/general/panel_component.html.erb
+- app/components/better_ui/general/panel_component.rb
+- app/components/better_ui/general/spinner_component.html.erb
+- app/components/better_ui/general/spinner_component.rb
+- app/components/better_ui/general/table_component.html.erb
+- app/components/better_ui/general/table_component.rb
+- app/components/better_ui/theme_helper.rb
 - app/controllers/better_ui/application_controller.rb
 - app/controllers/better_ui/docs_controller.rb
-- app/helpers/better_ui/application_helper.rb
 - app/jobs/better_ui/application_job.rb
 - app/mailers/better_ui/application_mailer.rb
 - app/models/better_ui/application_record.rb
-- app/views/better_ui/docs/component.html.erb
-- app/views/better_ui/docs/index.html.erb
-- app/views/better_ui/docs/show.html.erb
-- app/views/layouts/better_ui/application.html.erb
+- app/views/components/better_ui/general/table/_custom_body_row.html.erb
+- app/views/components/better_ui/general/table/_custom_footer_rows.html.erb
+- app/views/components/better_ui/general/table/_custom_header_rows.html.erb
+- app/views/layouts/component_preview.html.erb
+- config/initializers/lookbook.rb
 - config/routes.rb
 - lib/better_ui.rb
 - lib/better_ui/engine.rb
 - lib/better_ui/version.rb
+- lib/generators/better_ui/stylesheet_generator.rb
+- lib/generators/better_ui/templates/README
+- lib/generators/better_ui/templates/components/_avatar.scss
+- lib/generators/better_ui/templates/components/_badge.scss
+- lib/generators/better_ui/templates/components/_breadcrumb.scss
+- lib/generators/better_ui/templates/components/_button.scss
+- lib/generators/better_ui/templates/components/_card.scss
+- lib/generators/better_ui/templates/components/_heading.scss
+- lib/generators/better_ui/templates/components/_icon.scss
+- lib/generators/better_ui/templates/components/_link.scss
+- lib/generators/better_ui/templates/components/_panel.scss
+- lib/generators/better_ui/templates/components/_spinner.scss
+- lib/generators/better_ui/templates/components/_table.scss
+- lib/generators/better_ui/templates/components/_variables.scss
+- lib/generators/better_ui/templates/components_stylesheet.scss
 - lib/tasks/better_ui_tasks.rake
 homepage: https://github.com/alessiobussolari/better_ui
 licenses:
@@ -147,5 +272,5 @@ requirements: []
 rubygems_version: 3.5.11
 signing_key:
 specification_version: 4
-summary: Componenti UI riutilizzabili per Rails con documentazione integrata
+summary: Reusable UI components for Rails with integrated documentation
 test_files: []

data/app/helpers/better_ui/application_helper.rb

@@ -1,183 +0,0 @@
-module BetterUi
-  module ApplicationHelper
-    # Metodi helper per i componenti UI semplici
-    
-    # Button component
-    def better_ui_button(text, options = {})
-      options = BetterUi.configuration.button_defaults.deep_merge(options)
-      type = options.delete(:type) || 'primary'
-      css_class = "better-ui-button better-ui-button-#{type}"
-      css_class += " #{options.delete(:class)}" if options[:class]
-      
-      button_tag(text, **options.merge(class: css_class))
-    end
-    
-    # Alert component
-    def better_ui_alert(message, options = {})
-      options = BetterUi.configuration.alert_defaults.deep_merge(options)
-      type = options.delete(:type) || 'info'
-      css_class = "better-ui-alert better-ui-alert-#{type}"
-      css_class += " #{options.delete(:class)}" if options[:class]
-      
-      content_tag(:div, class: css_class) do
-        concat content_tag(:div, message, class: 'better-ui-alert-message')
-        if options[:dismissible]
-          concat content_tag(:button, 'x', class: 'better-ui-alert-close')
-        end
-      end
-    end
-    
-    # Card component
-    def better_ui_card(options = {}, &block)
-      options = BetterUi.configuration.card_defaults.deep_merge(options)
-      css_class = "better-ui-card"
-      css_class += " #{options.delete(:class)}" if options[:class]
-      
-      content_tag(:div, class: css_class, **options, &block)
-    end
-    
-    # Card header
-    def better_ui_card_header(title, options = {})
-      css_class = "better-ui-card-header"
-      css_class += " #{options.delete(:class)}" if options[:class]
-      
-      content_tag(:div, class: css_class) do
-        content_tag(:h3, title, class: 'better-ui-card-title')
-      end
-    end
-    
-    # Card body
-    def better_ui_card_body(options = {}, &block)
-      css_class = "better-ui-card-body"
-      css_class += " #{options.delete(:class)}" if options[:class]
-      
-      content_tag(:div, class: css_class, **options, &block)
-    end
-    
-    # Card footer
-    def better_ui_card_footer(options = {}, &block)
-      css_class = "better-ui-card-footer"
-      css_class += " #{options.delete(:class)}" if options[:class]
-      
-      content_tag(:div, class: css_class, **options, &block)
-    end
-    
-    # Tabs component
-    def better_ui_tabs(options = {}, &block)
-      options = BetterUi.configuration.tabs_defaults.deep_merge(options)
-      css_class = "better-ui-tabs"
-      css_class += " #{options.delete(:class)}" if options[:class]
-      
-      content_tag(:div, class: css_class, **options, &block)
-    end
-    
-    # Tab list
-    def better_ui_tab_list(options = {}, &block)
-      css_class = "better-ui-tab-list"
-      css_class += " #{options.delete(:class)}" if options[:class]
-      
-      content_tag(:div, class: css_class, role: 'tablist', **options, &block)
-    end
-    
-    # Tab item
-    def better_ui_tab_item(text, target, options = {})
-      active = options.delete(:active) || false
-      css_class = "better-ui-tab-item"
-      css_class += " better-ui-tab-active" if active
-      css_class += " #{options.delete(:class)}" if options[:class]
-      
-      content_tag(:button, text, {
-        class: css_class,
-        role: 'tab',
-        'aria-selected': active,
-        'data-target': target,
-      }.merge(options))
-    end
-    
-    # Tab content
-    def better_ui_tab_content(options = {}, &block)
-      css_class = "better-ui-tab-content"
-      css_class += " #{options.delete(:class)}" if options[:class]
-      
-      content_tag(:div, class: css_class, role: 'tabpanel', **options, &block)
-    end
-    
-    # Modal component
-    def better_ui_modal(id, options = {}, &block)
-      css_class = "better-ui-modal"
-      css_class += " #{options.delete(:class)}" if options[:class]
-      
-      content_tag(:div, id: id, class: css_class) do
-        concat content_tag(:div, '', class: 'better-ui-modal-background')
-        concat content_tag(:div, class: 'better-ui-modal-dialog', &block)
-      end
-    end
-    
-    # Modal header
-    def better_ui_modal_header(title, options = {})
-      css_class = "better-ui-modal-header"
-      css_class += " #{options.delete(:class)}" if options[:class]
-      
-      content_tag(:div, class: css_class) do
-        concat content_tag(:h5, title, class: 'better-ui-modal-title')
-        concat content_tag(:button, '×', type: 'button', class: 'better-ui-modal-close')
-      end
-    end
-    
-    # Modal body
-    def better_ui_modal_body(options = {}, &block)
-      css_class = "better-ui-modal-body"
-      css_class += " #{options.delete(:class)}" if options[:class]
-      
-      content_tag(:div, class: css_class, **options, &block)
-    end
-    
-    # Modal footer
-    def better_ui_modal_footer(options = {}, &block)
-      css_class = "better-ui-modal-footer"
-      css_class += " #{options.delete(:class)}" if options[:class]
-      
-      content_tag(:div, class: css_class, **options, &block)
-    end
-    
-    # Trigger button for modal
-    def better_ui_modal_trigger(text, modal_id, options = {})
-      options = BetterUi.configuration.button_defaults.deep_merge(options)
-      type = options.delete(:type) || 'primary'
-      css_class = "better-ui-button better-ui-button-#{type}"
-      css_class += " #{options.delete(:class)}" if options[:class]
-      
-      button_tag(text, **options.merge(
-        class: css_class,
-        type: 'button',
-        onclick: "document.getElementById('#{modal_id}').style.display='flex'"
-      ))
-    end
-    
-    # Render markdown
-    def better_ui_markdown(text)
-      return '' if text.blank?
-      
-      renderer = Redcarpet::Render::HTML.new(
-        filter_html: false,
-        hard_wrap: true,
-        link_attributes: { target: '_blank', rel: 'noopener noreferrer' }
-      )
-      
-      markdown = Redcarpet::Markdown.new(
-        renderer,
-        autolink: true,
-        tables: true,
-        fenced_code_blocks: true,
-        strikethrough: true,
-        superscript: true,
-        underline: true,
-        highlight: true,
-        quote: true,
-        footnotes: true
-      )
-      
-      markdown.render(text).html_safe
-    end
-  end
-end