better_ui 0.3.0 → 0.7.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (183) hide show
  1. checksums.yaml +4 -4
  2. data/README.md +257 -212
  3. data/Rakefile +11 -2
  4. data/app/components/better_ui/action_messages_component/action_messages_component.html.erb +48 -0
  5. data/app/components/better_ui/action_messages_component.rb +544 -0
  6. data/app/components/better_ui/application_component.rb +66 -0
  7. data/app/components/better_ui/button_component/button_component.html.erb +31 -0
  8. data/app/components/better_ui/button_component.rb +307 -0
  9. data/app/components/better_ui/card_component/card_component.html.erb +17 -0
  10. data/app/components/better_ui/card_component.rb +460 -0
  11. data/app/components/better_ui/drawer/header_component/header_component.html.erb +24 -0
  12. data/app/components/better_ui/drawer/header_component.rb +238 -0
  13. data/app/components/better_ui/drawer/layout_component/layout_component.html.erb +44 -0
  14. data/app/components/better_ui/drawer/layout_component.rb +270 -0
  15. data/app/components/better_ui/drawer/nav_group_component/nav_group_component.html.erb +10 -0
  16. data/app/components/better_ui/drawer/nav_group_component.rb +155 -0
  17. data/app/components/better_ui/drawer/nav_item_component/nav_item_component.html.erb +13 -0
  18. data/app/components/better_ui/drawer/nav_item_component.rb +225 -0
  19. data/app/components/better_ui/drawer/sidebar_component/sidebar_component.html.erb +17 -0
  20. data/app/components/better_ui/drawer/sidebar_component.rb +263 -0
  21. data/app/components/better_ui/forms/base_component.rb +450 -0
  22. data/app/components/better_ui/forms/checkbox_component/checkbox_component.html.erb +28 -0
  23. data/app/components/better_ui/forms/checkbox_component.rb +419 -0
  24. data/app/components/better_ui/forms/checkbox_group_component/checkbox_group_component.html.erb +40 -0
  25. data/app/components/better_ui/forms/checkbox_group_component.rb +363 -0
  26. data/app/components/better_ui/forms/number_input_component/number_input_component.html.erb +40 -0
  27. data/app/components/better_ui/forms/number_input_component.rb +320 -0
  28. data/app/components/better_ui/forms/password_input_component/password_input_component.html.erb +71 -0
  29. data/app/components/better_ui/forms/password_input_component.rb +206 -0
  30. data/app/components/better_ui/forms/text_input_component/text_input_component.html.erb +40 -0
  31. data/app/components/better_ui/forms/text_input_component.rb +258 -0
  32. data/app/components/better_ui/forms/textarea_component/textarea_component.html.erb +40 -0
  33. data/app/components/better_ui/forms/textarea_component.rb +329 -0
  34. data/app/form_builders/better_ui/ui_form_builder.rb +467 -0
  35. data/app/helpers/better_ui/application_helper.rb +325 -51
  36. data/app/views/layouts/better_ui/application.html.erb +1 -1
  37. data/config/routes.rb +1 -0
  38. data/lib/better_ui/engine.rb +34 -5
  39. data/lib/better_ui/version.rb +1 -1
  40. data/lib/better_ui.rb +32 -4
  41. data/lib/generators/better_ui/install/USAGE +44 -0
  42. data/lib/generators/better_ui/install/install_generator.rb +87 -0
  43. data/lib/generators/better_ui/install/templates/better_ui_theme.css.tt +280 -0
  44. data/lib/tasks/better_ui_tasks.rake +39 -4
  45. metadata +52 -185
  46. data/app/components/better_ui/application/card/component.html.erb +0 -20
  47. data/app/components/better_ui/application/card/component.rb +0 -214
  48. data/app/components/better_ui/application/main/component.html.erb +0 -9
  49. data/app/components/better_ui/application/main/component.rb +0 -123
  50. data/app/components/better_ui/application/navbar/component.html.erb +0 -92
  51. data/app/components/better_ui/application/navbar/component.rb +0 -136
  52. data/app/components/better_ui/application/sidebar/component.html.erb +0 -227
  53. data/app/components/better_ui/application/sidebar/component.rb +0 -130
  54. data/app/components/better_ui/general/accordion/component.html.erb +0 -5
  55. data/app/components/better_ui/general/accordion/component.rb +0 -92
  56. data/app/components/better_ui/general/accordion/item_component.html.erb +0 -12
  57. data/app/components/better_ui/general/accordion/item_component.rb +0 -176
  58. data/app/components/better_ui/general/alert/component.html.erb +0 -32
  59. data/app/components/better_ui/general/alert/component.rb +0 -242
  60. data/app/components/better_ui/general/avatar/component.html.erb +0 -20
  61. data/app/components/better_ui/general/avatar/component.rb +0 -301
  62. data/app/components/better_ui/general/badge/component.html.erb +0 -23
  63. data/app/components/better_ui/general/badge/component.rb +0 -248
  64. data/app/components/better_ui/general/breadcrumb/component.html.erb +0 -15
  65. data/app/components/better_ui/general/breadcrumb/component.rb +0 -187
  66. data/app/components/better_ui/general/button/component.html.erb +0 -34
  67. data/app/components/better_ui/general/button/component.rb +0 -214
  68. data/app/components/better_ui/general/divider/component.html.erb +0 -10
  69. data/app/components/better_ui/general/divider/component.rb +0 -226
  70. data/app/components/better_ui/general/dropdown/component.html.erb +0 -25
  71. data/app/components/better_ui/general/dropdown/component.rb +0 -170
  72. data/app/components/better_ui/general/dropdown/divider_component.html.erb +0 -1
  73. data/app/components/better_ui/general/dropdown/divider_component.rb +0 -41
  74. data/app/components/better_ui/general/dropdown/item_component.html.erb +0 -6
  75. data/app/components/better_ui/general/dropdown/item_component.rb +0 -119
  76. data/app/components/better_ui/general/field/component.html.erb +0 -27
  77. data/app/components/better_ui/general/field/component.rb +0 -37
  78. data/app/components/better_ui/general/heading/component.html.erb +0 -22
  79. data/app/components/better_ui/general/heading/component.rb +0 -257
  80. data/app/components/better_ui/general/icon/component.html.erb +0 -7
  81. data/app/components/better_ui/general/icon/component.rb +0 -239
  82. data/app/components/better_ui/general/input/checkbox/component.html.erb +0 -5
  83. data/app/components/better_ui/general/input/checkbox/component.rb +0 -238
  84. data/app/components/better_ui/general/input/datetime/component.html.erb +0 -5
  85. data/app/components/better_ui/general/input/datetime/component.rb +0 -223
  86. data/app/components/better_ui/general/input/radio/component.html.erb +0 -5
  87. data/app/components/better_ui/general/input/radio/component.rb +0 -230
  88. data/app/components/better_ui/general/input/select/component.html.erb +0 -16
  89. data/app/components/better_ui/general/input/select/component.rb +0 -184
  90. data/app/components/better_ui/general/input/select/select_component.html.erb +0 -5
  91. data/app/components/better_ui/general/input/select/select_component.rb +0 -37
  92. data/app/components/better_ui/general/input/text/component.html.erb +0 -5
  93. data/app/components/better_ui/general/input/text/component.rb +0 -171
  94. data/app/components/better_ui/general/input/textarea/component.html.erb +0 -5
  95. data/app/components/better_ui/general/input/textarea/component.rb +0 -166
  96. data/app/components/better_ui/general/link/component.html.erb +0 -18
  97. data/app/components/better_ui/general/link/component.rb +0 -258
  98. data/app/components/better_ui/general/modal/component.html.erb +0 -5
  99. data/app/components/better_ui/general/modal/component.rb +0 -47
  100. data/app/components/better_ui/general/modal/modal_component.html.erb +0 -52
  101. data/app/components/better_ui/general/modal/modal_component.rb +0 -160
  102. data/app/components/better_ui/general/pagination/component.html.erb +0 -85
  103. data/app/components/better_ui/general/pagination/component.rb +0 -216
  104. data/app/components/better_ui/general/panel/component.html.erb +0 -28
  105. data/app/components/better_ui/general/panel/component.rb +0 -249
  106. data/app/components/better_ui/general/progress/component.html.erb +0 -11
  107. data/app/components/better_ui/general/progress/component.rb +0 -160
  108. data/app/components/better_ui/general/spinner/component.html.erb +0 -35
  109. data/app/components/better_ui/general/spinner/component.rb +0 -93
  110. data/app/components/better_ui/general/table/component.html.erb +0 -5
  111. data/app/components/better_ui/general/table/component.rb +0 -217
  112. data/app/components/better_ui/general/table/tbody_component.html.erb +0 -3
  113. data/app/components/better_ui/general/table/tbody_component.rb +0 -30
  114. data/app/components/better_ui/general/table/td_component.html.erb +0 -3
  115. data/app/components/better_ui/general/table/td_component.rb +0 -44
  116. data/app/components/better_ui/general/table/tfoot_component.html.erb +0 -3
  117. data/app/components/better_ui/general/table/tfoot_component.rb +0 -28
  118. data/app/components/better_ui/general/table/th_component.html.erb +0 -6
  119. data/app/components/better_ui/general/table/th_component.rb +0 -51
  120. data/app/components/better_ui/general/table/thead_component.html.erb +0 -3
  121. data/app/components/better_ui/general/table/thead_component.rb +0 -28
  122. data/app/components/better_ui/general/table/tr_component.html.erb +0 -3
  123. data/app/components/better_ui/general/table/tr_component.rb +0 -30
  124. data/app/components/better_ui/general/tabs/component.html.erb +0 -11
  125. data/app/components/better_ui/general/tabs/component.rb +0 -120
  126. data/app/components/better_ui/general/tabs/panel_component.html.erb +0 -3
  127. data/app/components/better_ui/general/tabs/panel_component.rb +0 -37
  128. data/app/components/better_ui/general/tabs/tab_component.html.erb +0 -13
  129. data/app/components/better_ui/general/tabs/tab_component.rb +0 -111
  130. data/app/components/better_ui/general/tag/component.html.erb +0 -3
  131. data/app/components/better_ui/general/tag/component.rb +0 -104
  132. data/app/components/better_ui/general/tooltip/component.html.erb +0 -7
  133. data/app/components/better_ui/general/tooltip/component.rb +0 -239
  134. data/app/helpers/better_ui/application/components/card/card_helper.rb +0 -96
  135. data/app/helpers/better_ui/application/components/card.rb +0 -11
  136. data/app/helpers/better_ui/application/components/main/main_helper.rb +0 -64
  137. data/app/helpers/better_ui/application/components/navbar/navbar_helper.rb +0 -77
  138. data/app/helpers/better_ui/application/components/sidebar/sidebar_helper.rb +0 -51
  139. data/app/helpers/better_ui/general/components/accordion/accordion_helper.rb +0 -73
  140. data/app/helpers/better_ui/general/components/accordion.rb +0 -11
  141. data/app/helpers/better_ui/general/components/alert/alert_helper.rb +0 -57
  142. data/app/helpers/better_ui/general/components/avatar/avatar_helper.rb +0 -29
  143. data/app/helpers/better_ui/general/components/badge/badge_helper.rb +0 -53
  144. data/app/helpers/better_ui/general/components/breadcrumb/breadcrumb_helper.rb +0 -37
  145. data/app/helpers/better_ui/general/components/button/button_helper.rb +0 -65
  146. data/app/helpers/better_ui/general/components/container/container_helper.rb +0 -60
  147. data/app/helpers/better_ui/general/components/divider/divider_helper.rb +0 -63
  148. data/app/helpers/better_ui/general/components/dropdown/divider_helper.rb +0 -32
  149. data/app/helpers/better_ui/general/components/dropdown/dropdown_helper.rb +0 -79
  150. data/app/helpers/better_ui/general/components/dropdown/item_helper.rb +0 -62
  151. data/app/helpers/better_ui/general/components/field/field_helper.rb +0 -26
  152. data/app/helpers/better_ui/general/components/heading/heading_helper.rb +0 -72
  153. data/app/helpers/better_ui/general/components/icon/icon_helper.rb +0 -16
  154. data/app/helpers/better_ui/general/components/input/checkbox/checkbox_helper.rb +0 -81
  155. data/app/helpers/better_ui/general/components/input/datetime/datetime_helper.rb +0 -91
  156. data/app/helpers/better_ui/general/components/input/radio/radio_helper.rb +0 -79
  157. data/app/helpers/better_ui/general/components/input/radio_group/radio_group_helper.rb +0 -124
  158. data/app/helpers/better_ui/general/components/input/select/select_helper.rb +0 -70
  159. data/app/helpers/better_ui/general/components/input/text/text_helper.rb +0 -138
  160. data/app/helpers/better_ui/general/components/input/textarea/textarea_helper.rb +0 -73
  161. data/app/helpers/better_ui/general/components/link/link_helper.rb +0 -89
  162. data/app/helpers/better_ui/general/components/modal/modal_helper.rb +0 -85
  163. data/app/helpers/better_ui/general/components/modal.rb +0 -11
  164. data/app/helpers/better_ui/general/components/pagination/pagination_helper.rb +0 -82
  165. data/app/helpers/better_ui/general/components/panel/panel_helper.rb +0 -83
  166. data/app/helpers/better_ui/general/components/progress/progress_helper.rb +0 -53
  167. data/app/helpers/better_ui/general/components/spinner/spinner_helper.rb +0 -19
  168. data/app/helpers/better_ui/general/components/table/table_helper.rb +0 -53
  169. data/app/helpers/better_ui/general/components/table/tbody_helper.rb +0 -13
  170. data/app/helpers/better_ui/general/components/table/td_helper.rb +0 -19
  171. data/app/helpers/better_ui/general/components/table/tfoot_helper.rb +0 -13
  172. data/app/helpers/better_ui/general/components/table/th_helper.rb +0 -19
  173. data/app/helpers/better_ui/general/components/table/thead_helper.rb +0 -13
  174. data/app/helpers/better_ui/general/components/table/tr_helper.rb +0 -13
  175. data/app/helpers/better_ui/general/components/tabs/panel_helper.rb +0 -62
  176. data/app/helpers/better_ui/general/components/tabs/tab_helper.rb +0 -55
  177. data/app/helpers/better_ui/general/components/tabs/tabs_helper.rb +0 -95
  178. data/app/helpers/better_ui/general/components/tag/tag_helper.rb +0 -26
  179. data/app/helpers/better_ui/general/components/tooltip/tooltip_helper.rb +0 -60
  180. data/app/jobs/better_ui/application_job.rb +0 -4
  181. data/app/mailers/better_ui/application_mailer.rb +0 -6
  182. data/config/initializers/lookbook.rb +0 -23
  183. data/lib/better_ui/railtie.rb +0 -20
@@ -1,79 +0,0 @@
1
- # frozen_string_literal: true
2
-
3
- module BetterUi
4
- module General
5
- module Components
6
- module Dropdown
7
- module DropdownHelper
8
- ##
9
- # Crea un componente dropdown interattivo con menu contestuale.
10
- #
11
- # @param trigger [String] Il testo del pulsante trigger (obbligatorio)
12
- # @param position [Symbol] La posizione del menu dropdown (:bottom, :top, :left, :right)
13
- # @param theme [Symbol] Il tema colore del trigger (:default, :white, :red, :rose, :orange, :green, :blue, :yellow, :violet)
14
- # @param size [Symbol] La dimensione del trigger (:small, :medium, :large)
15
- # @param rounded [Symbol] Il border radius (:none, :small, :medium, :large, :full)
16
- # @param animation [Symbol] Il tipo di animazione (:fade, :slide, :none)
17
- # @param classes [String] Classi CSS aggiuntive
18
- # @param options [Hash] Attributi HTML aggiuntivi
19
- # @param block [Proc] Il contenuto del menu dropdown
20
- #
21
- # @return [String] Il markup HTML del componente dropdown
22
- #
23
- # @example Uso base
24
- # <%= bui_dropdown(trigger: "Azioni") do %>
25
- # <%= bui_dropdown_item(text: "Modifica") %>
26
- # <% end %>
27
- #
28
- # @example Con posizione e tema
29
- # <%= bui_dropdown(trigger: "Menu", position: :top, theme: :blue) do %>
30
- # <%= bui_dropdown_item(text: "Profilo", icon: "user") %>
31
- # <%= bui_dropdown_divider %>
32
- # <%= bui_dropdown_item(text: "Logout", icon: "logout") %>
33
- # <% end %>
34
- #
35
- # @example Con dimensioni e stile
36
- # <%= bui_dropdown(trigger: "Opzioni", size: :large, rounded: :full, animation: :slide) do %>
37
- # <%= bui_dropdown_item(text: "Impostazioni", icon: "cog") %>
38
- # <% end %>
39
- #
40
- # @example Con link e azioni
41
- # <%= bui_dropdown(trigger: "Utente", theme: :green) do %>
42
- # <%= bui_dropdown_item(text: "Dashboard", href: "/dashboard") %>
43
- # <%= bui_dropdown_item(text: "Profilo", href: "/profile") %>
44
- # <%= bui_dropdown_divider %>
45
- # <%= bui_dropdown_item(text: "Elimina", theme: :red, icon: "trash") %>
46
- # <% end %>
47
- #
48
- # @example Con attributi HTML personalizzati
49
- # <%= bui_dropdown(trigger: "Menu", id: "main-menu", data: { controller: "dropdown" }) do %>
50
- # <%= bui_dropdown_item(text: "Item 1") %>
51
- # <% end %>
52
- #
53
- def bui_dropdown(
54
- trigger:,
55
- position: :bottom,
56
- theme: :default,
57
- size: :medium,
58
- rounded: :medium,
59
- animation: :fade,
60
- classes: '',
61
- **options,
62
- &block
63
- )
64
- render BetterUi::General::Dropdown::Component.new(
65
- trigger: trigger,
66
- position: position,
67
- theme: theme,
68
- size: size,
69
- rounded: rounded,
70
- animation: animation,
71
- classes: classes,
72
- **options
73
- ), &block
74
- end
75
- end
76
- end
77
- end
78
- end
79
- end
@@ -1,62 +0,0 @@
1
- # frozen_string_literal: true
2
-
3
- module BetterUi
4
- module General
5
- module Components
6
- module Dropdown
7
- module ItemHelper
8
- ##
9
- # Crea un elemento del menu dropdown.
10
- #
11
- # @param text [String] Il testo dell'elemento (obbligatorio)
12
- # @param icon [String] Il nome dell'icona da mostrare ("edit", "trash", "share", "user", "cog", "logout")
13
- # @param href [String] L'URL per renderlo un link
14
- # @param theme [Symbol] Il tema colore (:default, :white, :red, :rose, :orange, :green, :blue, :yellow, :violet)
15
- # @param disabled [Boolean] Se l'elemento è disabilitato
16
- # @param active [Boolean] Se l'elemento è attivo/selezionato
17
- # @param classes [String] Classi CSS aggiuntive
18
- # @param options [Hash] Attributi HTML aggiuntivi
19
- #
20
- # @return [String] Il markup HTML dell'elemento dropdown
21
- #
22
- # @example Uso base
23
- # <%= bui_dropdown_item(text: "Modifica") %>
24
- #
25
- # @example Con icona
26
- # <%= bui_dropdown_item(text: "Elimina", icon: "trash") %>
27
- #
28
- # @example Come link
29
- # <%= bui_dropdown_item(text: "Profilo", href: "/profile", icon: "user") %>
30
- #
31
- # @example Con tema colorato
32
- # <%= bui_dropdown_item(text: "Azione pericolosa", theme: :red, icon: "trash") %>
33
- #
34
- # @example Disabilitato
35
- # <%= bui_dropdown_item(text: "Non disponibile", disabled: true) %>
36
- #
37
- def bui_dropdown_item(
38
- text:,
39
- icon: nil,
40
- href: nil,
41
- theme: :default,
42
- disabled: false,
43
- active: false,
44
- classes: '',
45
- **options
46
- )
47
- render BetterUi::General::Dropdown::ItemComponent.new(
48
- text: text,
49
- icon: icon,
50
- href: href,
51
- theme: theme,
52
- disabled: disabled,
53
- active: active,
54
- classes: classes,
55
- **options
56
- )
57
- end
58
- end
59
- end
60
- end
61
- end
62
- end
@@ -1,26 +0,0 @@
1
- module BetterUi
2
- module General
3
- module Components
4
- module Field
5
- module FieldHelper
6
- # @param label [String] Label del campo
7
- # @param name [String] Nome del campo
8
- # @param required [Boolean] Se il campo è obbligatorio
9
- # @param error [String] Messaggio di errore
10
- # @param help_text [String] Testo di aiuto
11
- # @return [BetterUi::General::FieldComponent] Componente del campo
12
- def bui_field(label:, name:, required: false, error: nil, help_text: nil, id: nil, &block)
13
- render BetterUi::General::Field::Component.new(
14
- label: label,
15
- name: name,
16
- required: required,
17
- error: error,
18
- help_text: help_text,
19
- id: id || SecureRandom.uuid
20
- ), &block
21
- end
22
- end
23
- end
24
- end
25
- end
26
- end
@@ -1,72 +0,0 @@
1
- module BetterUi
2
- module General
3
- module Components
4
- module Heading
5
- module HeadingHelper
6
- # Genera un heading usando BetterUi::General::Heading::Component
7
- #
8
- # @param text [String] testo del heading
9
- # @param level [Integer] livello del heading (1-6)
10
- # @param theme [Symbol] tema del colore (:default, :white, etc.)
11
- # @param align [Symbol] allineamento (:left, :center, :right)
12
- # @param size [Symbol] dimensione (:small, :medium, :large)
13
- # @param style [Symbol] stile (:normal, :bold, :italic, :underline)
14
- # @param icon [String] icona opzionale
15
- # @param subtitle [String] sottotitolo opzionale
16
- # @param with_divider [Boolean] mostra linea divisoria
17
- # @param html_options [Hash] opzioni HTML per il container
18
- # @return [String] HTML del heading renderizzato
19
- #
20
- # @example Uso base
21
- # bui_heading("Titolo principale")
22
- # bui_heading("Sottotitolo", level: 3, theme: :blue)
23
- #
24
- # @example Con icona e sottotitolo
25
- # bui_heading("Dashboard", icon: "home", subtitle: "Panoramica generale")
26
- #
27
- # @example Con divider
28
- # bui_heading("Sezione", level: 2, with_divider: true, theme: :green)
29
- #
30
- # @example Con opzioni avanzate
31
- # bui_heading(
32
- # "Titolo personalizzato",
33
- # level: 1,
34
- # theme: :violet,
35
- # align: :center,
36
- # size: :large,
37
- # style: :bold,
38
- # icon: "star",
39
- # subtitle: "Con tutte le opzioni",
40
- # with_divider: true,
41
- # id: "main-title",
42
- # class: "custom-heading"
43
- # )
44
- def bui_heading(
45
- text,
46
- level: 2,
47
- theme: :white,
48
- align: :left,
49
- size: :medium,
50
- style: :normal,
51
- icon: nil,
52
- subtitle: nil,
53
- with_divider: false,
54
- **html_options
55
- )
56
- render BetterUi::General::Heading::Component.new(
57
- level: level,
58
- theme: theme,
59
- align: align,
60
- size: size,
61
- style: style,
62
- icon: icon,
63
- subtitle: subtitle,
64
- with_divider: with_divider,
65
- **html_options
66
- ).with_content(text)
67
- end
68
- end
69
- end
70
- end
71
- end
72
- end
@@ -1,16 +0,0 @@
1
- module BetterUi
2
- module General
3
- module Components
4
- module Icon
5
- module IconHelper
6
- def bui_icon(name = nil, **options)
7
- render BetterUi::General::Icon::Component.new(
8
- name: name,
9
- **options
10
- )
11
- end
12
- end
13
- end
14
- end
15
- end
16
- end
@@ -1,81 +0,0 @@
1
- # frozen_string_literal: true
2
-
3
- module BetterUi
4
- module General
5
- module Components
6
- module Input
7
- module Checkbox
8
- module CheckboxHelper
9
- # Renderizza un componente Checkbox con tutti i parametri disponibili.
10
- #
11
- # @param name [String] Nome del campo checkbox (obbligatorio)
12
- # @param value [String] Valore del checkbox (default: "1")
13
- # @param checked [Boolean] Se il checkbox è selezionato
14
- # @param required [Boolean] Se il campo è obbligatorio
15
- # @param disabled [Boolean] Se il campo è disabilitato
16
- # @param indeterminate [Boolean] Se il checkbox è in stato indeterminate
17
- # @param label [String, nil] Testo della label associata al checkbox
18
- # @param label_position [Symbol] Posizione della label (:left, :right)
19
- # @param theme [Symbol] Tema del componente (:default, :white, :red, :rose, :orange, :green, :blue, :yellow, :violet)
20
- # @param size [Symbol] Dimensione del componente (:small, :medium, :large)
21
- # @param rounded [Symbol] Border radius (:none, :small, :medium, :large, :full)
22
- # @param classes [String] Classi CSS aggiuntive
23
- # @param form [ActionView::Helpers::FormBuilder, nil] Form builder Rails opzionale
24
- # @param options [Hash] Opzioni aggiuntive per l'input (es. data attributes, aria attributes)
25
- #
26
- # @return [String] HTML del componente Checkbox renderizzato
27
- #
28
- # @example Uso base
29
- # <%= bui_input_checkbox(name: 'accept_terms') %>
30
- #
31
- # @example Con label
32
- # <%= bui_input_checkbox(name: 'newsletter', label: 'Iscriviti alla newsletter', checked: true) %>
33
- #
34
- # @example Con label a sinistra
35
- # <%= bui_input_checkbox(name: 'terms', label: 'Accetto i termini e condizioni', label_position: :left, required: true) %>
36
- #
37
- # @example Con tema e dimensione personalizzati
38
- # <%= bui_input_checkbox(name: 'important', label: 'Importante', theme: :green, size: :large) %>
39
- #
40
- # @example Con border radius personalizzato
41
- # <%= bui_input_checkbox(name: 'rounded_option', label: 'Opzione arrotondata', rounded: :full) %>
42
- #
43
- # @example Con classi aggiuntive
44
- # <%= bui_input_checkbox(name: 'custom', label: 'Campo personalizzato', classes: 'mb-4', checked: true) %>
45
- #
46
- # @example Con attributi HTML aggiuntivi
47
- # <%= bui_input_checkbox(name: 'data-field', label: 'Campo obbligatorio', 'data-validation': 'required', 'aria-describedby': 'help-text') %>
48
- #
49
- # @example Con Rails form builder
50
- # <%= form_with model: @user do |form| %>
51
- # <%= bui_input_checkbox(name: :terms_accepted, label: 'Accetto i termini', form: form, theme: :green, required: true) %>
52
- # <% end %>
53
- #
54
- # @example Stato indeterminate
55
- # <%= bui_input_checkbox(name: 'partial_selection', label: 'Selezione parziale', indeterminate: true, theme: :blue) %>
56
- def bui_input_checkbox(name:, value: '1', checked: false, required: false, disabled: false,
57
- indeterminate: false, label: nil, label_position: :right, theme: :default,
58
- size: :medium, rounded: :medium, classes: '', form: nil, **options)
59
- render BetterUi::General::Input::Checkbox::Component.new(
60
- name: name,
61
- value: value,
62
- checked: checked,
63
- required: required,
64
- disabled: disabled,
65
- indeterminate: indeterminate,
66
- label: label,
67
- label_position: label_position,
68
- theme: theme,
69
- size: size,
70
- rounded: rounded,
71
- classes: classes,
72
- form: form,
73
- **options
74
- )
75
- end
76
- end
77
- end
78
- end
79
- end
80
- end
81
- end
@@ -1,91 +0,0 @@
1
- # frozen_string_literal: true
2
-
3
- module BetterUi
4
- module General
5
- module Components
6
- module Input
7
- module Datetime
8
- module DatetimeHelper
9
- # Crea un campo input datetime unificato
10
- #
11
- # @param name [String] Nome del campo input (obbligatorio)
12
- # @param type [Symbol] Tipo del campo datetime (default: :date)
13
- # Valori disponibili: :date, :month, :week, :time
14
- # @param value [String] Valore del campo nel formato appropriato per il tipo
15
- # @param required [Boolean] Se il campo è obbligatorio (default: false)
16
- # @param disabled [Boolean] Se il campo è disabilitato (default: false)
17
- # @param min [String] Valore minimo selezionabile nel formato appropriato
18
- # @param max [String] Valore massimo selezionabile nel formato appropriato
19
- # @param theme [Symbol] Tema del componente (default: :default)
20
- # Valori disponibili: :default, :white, :red, :rose, :orange, :green, :blue, :yellow, :violet
21
- # @param size [Symbol] Dimensione del componente (default: :medium)
22
- # Valori disponibili: :small, :medium, :large
23
- # @param rounded [Symbol] Border radius (default: :medium)
24
- # Valori disponibili: :none, :small, :medium, :large, :full
25
- # @param classes [String] Classi CSS aggiuntive
26
- # @param form [ActionView::Helpers::FormBuilder] Form builder Rails opzionale per integrazione con form
27
- # @param options [Hash] Attributi HTML aggiuntivi da passare all'elemento input
28
- # @return [String] HTML del componente datetime input renderizzato
29
- #
30
- # @example Uso base per date
31
- # <%= bui_input_datetime(name: 'birthdate', type: :date) %>
32
- #
33
- # @example Input per mese con validazione
34
- # <%= bui_input_datetime(name: 'report_month', type: :month, required: true, min: '2024-01', max: '2024-12') %>
35
- #
36
- # @example Input per settimana con tema
37
- # <%= bui_input_datetime(name: 'work_week', type: :week, theme: :blue, size: :large) %>
38
- #
39
- # @example Input per time con stili personalizzati
40
- # <%= bui_input_datetime(name: 'meeting_time', type: :time, theme: :green, rounded: :full) %>
41
- #
42
- # @example Con Rails form builder
43
- # <%= form_with model: @event do |form| %>
44
- # <%= bui_input_datetime(name: :start_date, type: :date, form: form, theme: :blue, required: true) %>
45
- # <%= bui_input_datetime(name: :start_time, type: :time, form: form, theme: :green) %>
46
- # <% end %>
47
- def bui_input_datetime(name:, type: :date, value: nil, required: false, disabled: false,
48
- min: nil, max: nil, theme: :default, size: :medium, rounded: :medium,
49
- classes: '', form: nil, **options)
50
- render BetterUi::General::Input::Datetime::Component.new(
51
- name: name,
52
- type: type,
53
- value: value,
54
- required: required,
55
- disabled: disabled,
56
- min: min,
57
- max: max,
58
- theme: theme,
59
- size: size,
60
- rounded: rounded,
61
- classes: classes,
62
- form: form,
63
- **options
64
- )
65
- end
66
-
67
- # Helper convenienza per input date
68
- def bui_input_date(name:, **options)
69
- bui_input_datetime(name: name, type: :date, **options)
70
- end
71
-
72
- # Helper convenienza per input month
73
- def bui_input_month(name:, **options)
74
- bui_input_datetime(name: name, type: :month, **options)
75
- end
76
-
77
- # Helper convenienza per input week
78
- def bui_input_week(name:, **options)
79
- bui_input_datetime(name: name, type: :week, **options)
80
- end
81
-
82
- # Helper convenienza per input time
83
- def bui_input_time(name:, **options)
84
- bui_input_datetime(name: name, type: :time, **options)
85
- end
86
- end
87
- end
88
- end
89
- end
90
- end
91
- end
@@ -1,79 +0,0 @@
1
- # frozen_string_literal: true
2
-
3
- module BetterUi
4
- module General
5
- module Components
6
- module Input
7
- module Radio
8
- # Helper specifico per radio button Better UI
9
- module RadioHelper
10
- # Genera un radio button con stili Better UI
11
- #
12
- # @param name [String] Nome del campo radio (obbligatorio)
13
- # @param value [String] Valore del radio button (obbligatorio)
14
- # @param checked [Boolean] Se il radio è selezionato
15
- # @param required [Boolean] Se il campo è obbligatorio
16
- # @param disabled [Boolean] Se il campo è disabilitato
17
- # @param label [String, nil] Testo della label associata al radio
18
- # @param label_position [Symbol] Posizione della label (:left, :right)
19
- # @param theme [Symbol] Tema del componente (:default, :white, :red, :rose, :orange, :green, :blue, :yellow, :violet)
20
- # @param size [Symbol] Dimensione del componente (:small, :medium, :large)
21
- # @param rounded [Symbol] Border radius (:none, :small, :medium, :large, :full)
22
- # @param classes [String] Classi CSS aggiuntive
23
- # @param form [ActionView::Helpers::FormBuilder, nil] Form builder Rails opzionale
24
- # @param options [Hash] Opzioni aggiuntive per l'input
25
- # @return [String] HTML del radio button renderizzato
26
- #
27
- # @example Gruppo radio base - Selezione genere (STESSO name, value DIVERSI)
28
- # bui_input_radio(name: "gender", value: "male", label: "Maschio")
29
- # bui_input_radio(name: "gender", value: "female", label: "Femmina")
30
- # bui_input_radio(name: "gender", value: "other", label: "Altro")
31
- #
32
- # @example Gruppo radio con temi diversi - Priorità task
33
- # bui_input_radio(name: "priority", value: "low", label: "Bassa", theme: :green)
34
- # bui_input_radio(name: "priority", value: "medium", label: "Media", theme: :yellow)
35
- # bui_input_radio(name: "priority", value: "high", label: "Alta", theme: :red, size: :large)
36
- #
37
- # @example Gruppo radio con Rails form builder
38
- # <%= form_with model: @user do |form| %>
39
- # <%= bui_input_radio(name: :role, value: "admin", label: "Amministratore", form: form) %>
40
- # <%= bui_input_radio(name: :role, value: "user", label: "Utente", form: form) %>
41
- # <%= bui_input_radio(name: :role, value: "guest", label: "Ospite", form: form) %>
42
- # <% end %>
43
- #
44
- # @example Gruppo radio con selezione dinamica e validazione
45
- # current_method = @user&.payment_method
46
- # bui_input_radio(name: "payment", value: "card", label: "Carta", checked: current_method == "card", required: true)
47
- # bui_input_radio(name: "payment", value: "bank", label: "Bonifico", checked: current_method == "bank", required: true)
48
- # bui_input_radio(name: "payment", value: "cash", label: "Contrassegno", checked: current_method == "cash", required: true)
49
- #
50
- # @example Gruppo radio con attributi HTML personalizzati
51
- # bui_input_radio(name: "notification", value: "email", label: "Email", theme: :blue, data: { action: "change->form#updateNotification" })
52
- # bui_input_radio(name: "notification", value: "sms", label: "SMS", theme: :blue, data: { action: "change->form#updateNotification" })
53
- # bui_input_radio(name: "notification", value: "push", label: "Push", theme: :blue, data: { action: "change->form#updateNotification" })
54
- #
55
- def bui_input_radio(name:, value:, checked: false, required: false, disabled: false,
56
- label: nil, label_position: :right, theme: :default,
57
- size: :medium, rounded: :full, classes: '', form: nil, **options)
58
- render BetterUi::General::Input::Radio::Component.new(
59
- name: name,
60
- value: value,
61
- checked: checked,
62
- required: required,
63
- disabled: disabled,
64
- label: label,
65
- label_position: label_position,
66
- theme: theme,
67
- size: size,
68
- rounded: rounded,
69
- classes: classes,
70
- form: form,
71
- **options
72
- )
73
- end
74
- end
75
- end
76
- end
77
- end
78
- end
79
- end
@@ -1,124 +0,0 @@
1
- # frozen_string_literal: true
2
-
3
- module BetterUi
4
- module General
5
- module Components
6
- module Input
7
- module RadioGroup
8
- # Helper per creare gruppi di radio button Better UI
9
- module RadioGroupHelper
10
- # Genera un gruppo completo di radio button con stili Better UI
11
- #
12
- # @param name [String] Nome del campo radio (comune a tutto il gruppo)
13
- # @param options [Array<Hash>] Array di opzioni per ogni radio button
14
- # @param selected [String, nil] Valore dell'opzione selezionata
15
- # @param theme [Symbol] Tema del componente (:default, :white, :red, :rose, :orange, :green, :blue, :yellow, :violet)
16
- # @param size [Symbol] Dimensione del componente (:small, :medium, :large)
17
- # @param rounded [Symbol] Border radius (:none, :small, :medium, :large, :full)
18
- # @param direction [Symbol] Direzione del gruppo (:vertical, :horizontal)
19
- # @param required [Boolean] Se il gruppo è obbligatorio
20
- # @param disabled [Boolean] Se il gruppo è disabilitato
21
- # @param classes [String] Classi CSS aggiuntive per il contenitore
22
- # @param form [ActionView::Helpers::FormBuilder, nil] Form builder Rails opzionale
23
- # @param html_options [Hash] Opzioni HTML aggiuntive per ogni radio
24
- # @return [String] HTML del gruppo radio renderizzato
25
- #
26
- # @example Gruppo radio base - Selezione genere
27
- # bui_input_radio_group(
28
- # name: "gender",
29
- # options: [
30
- # { value: "male", label: "Maschio" },
31
- # { value: "female", label: "Femmina" },
32
- # { value: "other", label: "Altro" }
33
- # ]
34
- # )
35
- #
36
- # @example Gruppo radio con tema e selezione
37
- # bui_input_radio_group(
38
- # name: "priority",
39
- # options: [
40
- # { value: "low", label: "Bassa", theme: :green },
41
- # { value: "medium", label: "Media", theme: :yellow },
42
- # { value: "high", label: "Alta", theme: :red }
43
- # ],
44
- # selected: "medium",
45
- # size: :large
46
- # )
47
- #
48
- # @example Gruppo radio orizzontale con Rails form
49
- # <%= form_with model: @user do |form| %>
50
- # <%= bui_input_radio_group(
51
- # name: :role,
52
- # options: [
53
- # { value: "admin", label: "Amministratore" },
54
- # { value: "user", label: "Utente" },
55
- # { value: "guest", label: "Ospite" }
56
- # ],
57
- # selected: @user.role,
58
- # direction: :horizontal,
59
- # form: form
60
- # ) %>
61
- # <% end %>
62
- #
63
- # @example Gruppo radio con validazione e attributi HTML
64
- # bui_input_radio_group(
65
- # name: "notification_type",
66
- # options: [
67
- # { value: "email", label: "Email" },
68
- # { value: "sms", label: "SMS" },
69
- # { value: "push", label: "Push Notification" }
70
- # ],
71
- # required: true,
72
- # theme: :blue,
73
- # html_options: { data: { action: "change->form#validateNotification" } }
74
- # )
75
- #
76
- # @example Gruppo radio con temi personalizzati per opzione
77
- # bui_input_radio_group(
78
- # name: "status",
79
- # options: [
80
- # { value: "active", label: "Attivo", theme: :green },
81
- # { value: "pending", label: "In Sospeso", theme: :yellow },
82
- # { value: "inactive", label: "Inattivo", theme: :red }
83
- # ],
84
- # selected: "active",
85
- # direction: :horizontal
86
- # )
87
- #
88
- def bui_input_radio_group(name:, options:, selected: nil, theme: :default, size: :medium,
89
- rounded: :full, direction: :vertical, required: false, disabled: false,
90
- classes: '', form: nil, **html_options)
91
- container_classes = [
92
- 'space-y-2',
93
- direction == :horizontal ? 'flex flex-wrap gap-6' : 'space-y-2',
94
- classes
95
- ].compact.join(' ')
96
-
97
- content_tag(:div, class: container_classes) do
98
- options.map do |option|
99
- option_theme = option[:theme] || theme
100
- option_classes = option[:classes] || ''
101
-
102
- render BetterUi::General::Input::Radio::Component.new(
103
- name: name,
104
- value: option[:value],
105
- label: option[:label],
106
- checked: selected.to_s == option[:value].to_s,
107
- theme: option_theme,
108
- size: size,
109
- rounded: rounded,
110
- required: required,
111
- disabled: disabled || option[:disabled],
112
- classes: option_classes,
113
- form: form,
114
- **html_options
115
- )
116
- end.join.html_safe
117
- end
118
- end
119
- end
120
- end
121
- end
122
- end
123
- end
124
- end