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,70 +0,0 @@
1
- # frozen_string_literal: true
2
-
3
- module BetterUi
4
- module General
5
- module Components
6
- module Input
7
- module Select
8
- module SelectHelper
9
- # Renders a Select component for selection fields from option lists.
10
- #
11
- # @param name [String] Name of the select field
12
- # @param options [Array<Hash>] Array of select options in format [{value: 'value', label: 'label'}, ...]
13
- # @param selected [String, Array, nil] Selected value or values
14
- # @param required [Boolean] Whether the field is required
15
- # @param disabled [Boolean] Whether the field is disabled
16
- # @param multiple [Boolean] Whether multiple options can be selected
17
- # @param theme [Symbol] Component theme (:default, :white, :red, :rose, :orange, :green, :blue, :yellow, :violet)
18
- # @param size [Symbol] Component size (:small, :medium, :large)
19
- # @param rounded [Symbol] Border radius (:none, :small, :medium, :large, :full)
20
- # @param placeholder [String, nil] Placeholder text for the field (creates an initial disabled option)
21
- # @param classes [String] Additional CSS classes
22
- # @param form [ActionView::Helpers::FormBuilder, nil] Optional Rails form builder
23
- # @param options_html [Hash] Additional HTML attributes for option tags
24
- # @param html_options [Hash] Additional HTML attributes for the select tag
25
- #
26
- # @return [String] Rendered HTML of the Select component
27
- #
28
- # @example Basic select
29
- # <%= bui_input_select(name: 'country', options: [{value: 'it', label: 'Italy'}, {value: 'fr', label: 'France'}]) %>
30
- #
31
- # @example Select with selected option
32
- # <%= bui_input_select(name: 'role', options: roles_array, selected: 'admin') %>
33
- #
34
- # @example Multiple select
35
- # <%= bui_input_select(name: 'languages[]', options: languages_array, multiple: true, selected: ['en', 'fr']) %>
36
- #
37
- # @example Select with custom theme and size
38
- # <%= bui_input_select(name: 'category', options: categories_array, theme: :blue, size: :large) %>
39
- #
40
- # @example With Rails form builder
41
- # <%= form_with model: @user do |form| %>
42
- # <%= bui_input_select(name: :country_id, options: countries_array, form: form, required: true) %>
43
- # <% end %>
44
- def bui_input_select(name:, options:, selected: nil, required: false, disabled: false,
45
- multiple: false, theme: :default, size: :medium, rounded: :medium,
46
- placeholder: nil, classes: '', form: nil, options_html: {}, **html_options)
47
-
48
- render BetterUi::General::Input::Select::Component.new(
49
- name: name,
50
- options: options,
51
- selected: selected,
52
- required: required,
53
- disabled: disabled,
54
- multiple: multiple,
55
- theme: theme,
56
- size: size,
57
- rounded: rounded,
58
- placeholder: placeholder,
59
- classes: classes,
60
- form: form,
61
- options_html: options_html,
62
- **html_options
63
- )
64
- end
65
- end
66
- end
67
- end
68
- end
69
- end
70
- end
@@ -1,138 +0,0 @@
1
- # frozen_string_literal: true
2
-
3
- module BetterUi
4
- module General
5
- module Components
6
- module Input
7
- module Text
8
- module TextHelper
9
- # Renderizza un componente Text Input con tutti i parametri disponibili.
10
- #
11
- # @param name [String] Nome del campo input (obbligatorio)
12
- # @param value [String, nil] Valore del campo
13
- # @param placeholder [String, nil] Placeholder del campo
14
- # @param required [Boolean] Se il campo è obbligatorio
15
- # @param disabled [Boolean] Se il campo è disabilitato
16
- # @param type [Symbol] Tipo del campo input (:text, :password, :email, :tel, :url, :number, :search, :color)
17
- # @param theme [Symbol] Tema del componente (:default, :white, :red, :rose, :orange, :green, :blue, :yellow, :violet)
18
- # @param size [Symbol] Dimensione del componente (:small, :medium, :large)
19
- # @param rounded [Symbol] Border radius (:none, :small, :medium, :large, :full)
20
- # @param classes [String] Classi CSS aggiuntive
21
- # @param form [ActionView::Helpers::FormBuilder, nil] Form builder Rails opzionale
22
- # @param options [Hash] Opzioni aggiuntive per l'input (es. data attributes, aria attributes)
23
- #
24
- # @return [String] HTML del componente Text Input renderizzato
25
- #
26
- # @example Uso base
27
- # <%= bui_input_text(name: 'email') %>
28
- #
29
- # @example Con placeholder e validazione
30
- # <%= bui_input_text(name: 'email', placeholder: 'Inserisci la tua email', required: true) %>
31
- #
32
- # @example Con tema e dimensione personalizzati
33
- # <%= bui_input_text(name: 'search', theme: :blue, size: :large, placeholder: 'Cerca...') %>
34
- #
35
- # @example Con border radius personalizzato
36
- # <%= bui_input_text(name: 'username', rounded: :full, placeholder: 'Username') %>
37
- #
38
- # @example Con classi aggiuntive
39
- # <%= bui_input_text(name: 'custom', classes: 'mb-4', placeholder: 'Campo personalizzato') %>
40
- #
41
- # @example Con attributi HTML aggiuntivi
42
- # <%= bui_input_text(name: 'data-field', 'data-validation': 'email', 'aria-label': 'Campo email') %>
43
- #
44
- # @example Con Rails form builder
45
- # <%= form_with model: @user do |form| %>
46
- # <%= bui_input_text(name: :email, form: form, theme: :blue, placeholder: 'Email utente') %>
47
- # <% end %>
48
- def bui_input_text(name:, value: nil, placeholder: nil, required: false, disabled: false,
49
- type: :text, theme: :default, size: :medium, rounded: :medium, classes: '', form: nil, **options)
50
- render BetterUi::General::Input::Text::Component.new(
51
- name: name,
52
- value: value,
53
- placeholder: placeholder,
54
- required: required,
55
- disabled: disabled,
56
- type: type,
57
- theme: theme,
58
- size: size,
59
- rounded: rounded,
60
- classes: classes,
61
- form: form,
62
- **options
63
- )
64
- end
65
-
66
- # Helper specifici per ogni tipo di input
67
-
68
- # Input di tipo password
69
- def bui_input_password(name:, value: nil, placeholder: nil, required: false, disabled: false,
70
- theme: :default, size: :medium, rounded: :medium, classes: '', form: nil, **options)
71
- bui_input_text(
72
- name: name, value: value, placeholder: placeholder, required: required, disabled: disabled,
73
- type: :password, theme: theme, size: size, rounded: rounded, classes: classes, form: form, **options
74
- )
75
- end
76
-
77
- # Input di tipo email
78
- def bui_input_email(name:, value: nil, placeholder: nil, required: false, disabled: false,
79
- theme: :default, size: :medium, rounded: :medium, classes: '', form: nil, **options)
80
- bui_input_text(
81
- name: name, value: value, placeholder: placeholder, required: required, disabled: disabled,
82
- type: :email, theme: theme, size: size, rounded: rounded, classes: classes, form: form, **options
83
- )
84
- end
85
-
86
- # Input di tipo tel
87
- def bui_input_tel(name:, value: nil, placeholder: nil, required: false, disabled: false,
88
- theme: :default, size: :medium, rounded: :medium, classes: '', form: nil, **options)
89
- bui_input_text(
90
- name: name, value: value, placeholder: placeholder, required: required, disabled: disabled,
91
- type: :tel, theme: theme, size: size, rounded: rounded, classes: classes, form: form, **options
92
- )
93
- end
94
-
95
- # Input di tipo url
96
- def bui_input_url(name:, value: nil, placeholder: nil, required: false, disabled: false,
97
- theme: :default, size: :medium, rounded: :medium, classes: '', form: nil, **options)
98
- bui_input_text(
99
- name: name, value: value, placeholder: placeholder, required: required, disabled: disabled,
100
- type: :url, theme: theme, size: size, rounded: rounded, classes: classes, form: form, **options
101
- )
102
- end
103
-
104
- # Input di tipo number
105
- def bui_input_number(name:, value: nil, placeholder: nil, required: false, disabled: false,
106
- theme: :default, size: :medium, rounded: :medium, classes: '', form: nil, **options)
107
- bui_input_text(
108
- name: name, value: value, placeholder: placeholder, required: required, disabled: disabled,
109
- type: :number, theme: theme, size: size, rounded: rounded, classes: classes, form: form, **options
110
- )
111
- end
112
-
113
- # Input di tipo search
114
- def bui_input_search(name:, value: nil, placeholder: nil, required: false, disabled: false,
115
- theme: :default, size: :medium, rounded: :medium, classes: '', form: nil, **options)
116
- bui_input_text(
117
- name: name, value: value, placeholder: placeholder, required: required, disabled: disabled,
118
- type: :search, theme: theme, size: size, rounded: rounded, classes: classes, form: form, **options
119
- )
120
- end
121
-
122
-
123
-
124
-
125
- # Input di tipo color
126
- def bui_input_color(name:, value: nil, placeholder: nil, required: false, disabled: false,
127
- theme: :default, size: :medium, rounded: :medium, classes: '', form: nil, **options)
128
- bui_input_text(
129
- name: name, value: value, placeholder: placeholder, required: required, disabled: disabled,
130
- type: :color, theme: theme, size: size, rounded: rounded, classes: classes, form: form, **options
131
- )
132
- end
133
- end
134
- end
135
- end
136
- end
137
- end
138
- end
@@ -1,73 +0,0 @@
1
- # frozen_string_literal: true
2
-
3
- module BetterUi
4
- module General
5
- module Components
6
- module Input
7
- module Textarea
8
- module TextareaHelper
9
- # Renderizza un componente Textarea con tutti i parametri disponibili.
10
- #
11
- # @param name [String] Nome del campo textarea (obbligatorio)
12
- # @param value [String, nil] Valore del campo
13
- # @param placeholder [String, nil] Placeholder del campo
14
- # @param required [Boolean] Se il campo è obbligatorio
15
- # @param disabled [Boolean] Se il campo è disabilitato
16
- # @param rows [Integer] Numero di righe per la textarea
17
- # @param theme [Symbol] Tema del componente (:default, :white, :red, :rose, :orange, :green, :blue, :yellow, :violet)
18
- # @param size [Symbol] Dimensione del componente (:small, :medium, :large)
19
- # @param rounded [Symbol] Border radius (:none, :small, :medium, :large, :full)
20
- # @param classes [String] Classi CSS aggiuntive
21
- # @param form [ActionView::Helpers::FormBuilder, nil] Form builder Rails opzionale
22
- # @param options [Hash] Opzioni aggiuntive per la textarea (es. data attributes, aria attributes)
23
- #
24
- # @return [String] HTML del componente Textarea renderizzato
25
- #
26
- # @example Uso base
27
- # <%= bui_input_textarea(name: 'description') %>
28
- #
29
- # @example Con placeholder e validazione
30
- # <%= bui_input_textarea(name: 'message', placeholder: 'Inserisci il tuo messaggio', required: true) %>
31
- #
32
- # @example Con numero di righe personalizzato
33
- # <%= bui_input_textarea(name: 'content', rows: 5, placeholder: 'Contenuto lungo...') %>
34
- #
35
- # @example Con tema e dimensione personalizzati
36
- # <%= bui_input_textarea(name: 'feedback', theme: :blue, size: :large, rows: 4) %>
37
- #
38
- # @example Con border radius personalizzato
39
- # <%= bui_input_textarea(name: 'notes', rounded: :large, rows: 3, placeholder: 'Note aggiuntive') %>
40
- #
41
- # @example Con classi aggiuntive
42
- # <%= bui_input_textarea(name: 'custom', classes: 'mb-4', rows: 6, placeholder: 'Campo personalizzato') %>
43
- #
44
- # @example Con attributi HTML aggiuntivi
45
- # <%= bui_input_textarea(name: 'data-field', rows: 4, 'data-validation': 'required', 'aria-label': 'Campo textarea') %>
46
- #
47
- # @example Con Rails form builder
48
- # <%= form_with model: @post do |form| %>
49
- # <%= bui_input_textarea(name: :content, form: form, theme: :blue, rows: 8, placeholder: 'Contenuto del post') %>
50
- # <% end %>
51
- def bui_input_textarea(name:, value: nil, placeholder: nil, required: false, disabled: false,
52
- rows: 3, theme: :default, size: :medium, rounded: :medium, classes: '', form: nil, **options)
53
- render BetterUi::General::Input::Textarea::Component.new(
54
- name: name,
55
- value: value,
56
- placeholder: placeholder,
57
- required: required,
58
- disabled: disabled,
59
- rows: rows,
60
- theme: theme,
61
- size: size,
62
- rounded: rounded,
63
- classes: classes,
64
- form: form,
65
- **options
66
- )
67
- end
68
- end
69
- end
70
- end
71
- end
72
- end
73
- end
@@ -1,89 +0,0 @@
1
- module BetterUi
2
- module General
3
- module Components
4
- module Link
5
- module LinkHelper
6
- # Genera un link usando BetterUi::General::Link::Component
7
- #
8
- # @param label [String] testo del link
9
- # @param href [String] URL di destinazione (nil per semplice testo)
10
- # @param theme [Symbol] tema del colore (:default, :white, etc.)
11
- # @param orientation [Symbol] orientamento (:horizontal, :vertical)
12
- # @param style [Symbol] stile (:default, :underline, :bold, :text)
13
- # @param size [Symbol] dimensione (:extra_small, :small, :medium, :large)
14
- # @param icon [String] icona opzionale
15
- # @param active [Boolean] stato attivo del link
16
- # @param disabled [Boolean] stato disabilitato del link
17
- # @param data [Hash] attributi data
18
- # @param method [Symbol] metodo HTTP (per Turbo)
19
- # @param target [String] target del link
20
- # @param html_options [Hash] opzioni HTML aggiuntive
21
- # @return [String] HTML del link renderizzato
22
- #
23
- # @example Uso base
24
- # bui_link("Home", href: "/")
25
- # bui_link("Contatti", href: "/contact", theme: :blue)
26
- #
27
- # @example Con icona
28
- # bui_link("Dashboard", href: "/admin", icon: "home", theme: :green)
29
- #
30
- # @example Link attivo
31
- # bui_link("Pagina corrente", href: "/current", active: true)
32
- #
33
- # @example Link disabilitato (diventa span)
34
- # bui_link("Non disponibile", disabled: true)
35
- #
36
- # @example Con attributi Turbo
37
- # bui_link("Elimina", href: "/delete", method: :delete,
38
- # data: { confirm: "Sei sicuro?" }, theme: :red)
39
- #
40
- # @example Con opzioni avanzate
41
- # bui_link(
42
- # "Link esterno",
43
- # href: "https://example.com",
44
- # theme: :violet,
45
- # orientation: :vertical,
46
- # style: :bold,
47
- # size: :large,
48
- # icon: "external-link",
49
- # target: "_blank",
50
- # id: "external-link",
51
- # class: "custom-link"
52
- # )
53
- def bui_link(
54
- label,
55
- href: nil,
56
- theme: :white,
57
- orientation: :horizontal,
58
- style: :default,
59
- size: :medium,
60
- icon: nil,
61
- active: false,
62
- disabled: false,
63
- data: {},
64
- method: nil,
65
- target: nil,
66
- **html_options,
67
- &block
68
- )
69
- render BetterUi::General::Link::Component.new(
70
- label: label,
71
- href: href,
72
- theme: theme,
73
- orientation: orientation,
74
- style: style,
75
- size: size,
76
- icon: icon,
77
- active: active,
78
- disabled: disabled,
79
- data: data,
80
- method: method,
81
- target: target,
82
- **html_options
83
- ), &block
84
- end
85
- end
86
- end
87
- end
88
- end
89
- end
@@ -1,85 +0,0 @@
1
- module BetterUi
2
- module General
3
- module Components
4
- module Modal
5
- module ModalHelper
6
- # Helper per renderizzare un modal con trigger e contenuto
7
- #
8
- # @param close_on_backdrop [Boolean] Se chiudere il modal cliccando sul backdrop
9
- # @param close_on_escape [Boolean] Se chiudere il modal premendo Escape
10
- # @param lock_scroll [Boolean] Se bloccare lo scroll del body quando il modal è aperto
11
- # @param classes [String] Classi CSS aggiuntive per il contenitore
12
- # @param html_options [Hash] Attributi HTML aggiuntivi
13
- #
14
- # @option theme [Symbol] :default (default) Header con sfondo grigio chiaro
15
- # @option theme [Symbol] :white Header con sfondo bianco
16
- # @option theme [Symbol] :red Header con sfondo rosso chiaro
17
- # @option theme [Symbol] :rose Header con sfondo rosa chiaro
18
- # @option theme [Symbol] :orange Header con sfondo arancione chiaro
19
- # @option theme [Symbol] :green Header con sfondo verde chiaro
20
- # @option theme [Symbol] :blue Header con sfondo blu chiaro
21
- # @option theme [Symbol] :yellow Header con sfondo giallo chiaro
22
- # @option theme [Symbol] :violet Header con sfondo violetto chiaro
23
- #
24
- # @option size [Symbol] :small (max-w-sm) Modal piccolo
25
- # @option size [Symbol] :medium (max-w-md, default) Modal medio
26
- # @option size [Symbol] :large (max-w-2xl) Modal grande
27
- #
28
- # @option rounded [Symbol] :none (rounded-none) Nessun border radius
29
- # @option rounded [Symbol] :small (rounded-md) Border radius piccolo
30
- # @option rounded [Symbol] :medium (rounded-lg, default) Border radius medio
31
- # @option rounded [Symbol] :large (rounded-xl) Border radius grande
32
- # @option rounded [Symbol] :full (rounded-full) Border radius completo
33
- #
34
- # @return [String] HTML del modal
35
- #
36
- # @example Utilizzo base con button trigger
37
- # <%= bui_modal do |modal| %>
38
- # <% modal.with_trigger(label: "Apri Modal", as: :button, type: :primary) %>
39
- # <% modal.with_modal(title: "Conferma azione") do %>
40
- # <p>Sei sicuro di voler continuare?</p>
41
- # <% end %>
42
- # <% end %>
43
- #
44
- # @example Con link trigger
45
- # <%= bui_modal do |modal| %>
46
- # <% modal.with_trigger(label: "Visualizza dettagli", as: :link, variant: :underline) %>
47
- # <% modal.with_modal(title: "Dettagli elemento", theme: :blue, size: :large) do %>
48
- # <p>Informazioni dettagliate sull'elemento selezionato.</p>
49
- # <% end %>
50
- # <% end %>
51
- #
52
- # @example Modal con configurazione avanzata
53
- # <%= bui_modal(close_on_backdrop: false, lock_scroll: false) do |modal| %>
54
- # <% modal.with_trigger(label: "Elimina", as: :button, type: :red, size: :small) %>
55
- # <% modal.with_modal(title: "Elimina elemento", theme: :red, backdrop: true, closable: true) do %>
56
- # <p>Sei sicuro di voler eliminare questo elemento?</p>
57
- # <p class="text-sm text-gray-600 mt-2">Questa azione non può essere annullata.</p>
58
- #
59
- # <div class="flex justify-end space-x-3 mt-6">
60
- # <%= bui_button(label: "Annulla", type: :white, size: :medium) %>
61
- # <%= bui_button(label: "Elimina", type: :red, size: :medium) %>
62
- # </div>
63
- # <% end %>
64
- # <% end %>
65
- def bui_modal(
66
- close_on_backdrop: true,
67
- close_on_escape: true,
68
- lock_scroll: true,
69
- classes: nil,
70
- **html_options,
71
- &block
72
- )
73
- render BetterUi::General::Modal::Component.new(
74
- close_on_backdrop: close_on_backdrop,
75
- close_on_escape: close_on_escape,
76
- lock_scroll: lock_scroll,
77
- classes: classes,
78
- **html_options
79
- ), &block
80
- end
81
- end
82
- end
83
- end
84
- end
85
- end
@@ -1,11 +0,0 @@
1
- # frozen_string_literal: true
2
-
3
- module BetterUi
4
- module General
5
- module Components
6
- module Modal
7
- include BetterUi::General::Components::Modal::ModalHelper
8
- end
9
- end
10
- end
11
- end
@@ -1,82 +0,0 @@
1
- # frozen_string_literal: true
2
-
3
- module BetterUi
4
- module General
5
- module Components
6
- module Pagination
7
- module PaginationHelper
8
- # Genera un componente di navigazione paginata per liste e tabelle
9
- #
10
- # @param current_page [Integer] La pagina corrente (1-indexed)
11
- # @param total_pages [Integer] Il numero totale di pagine
12
- # @param path [String] L'URL base per costruire i link di paginazione
13
- # @param theme [Symbol] Il tema del componente (:default, :blue, :red, :green, :yellow, :violet, :orange, :rose, :white)
14
- # @param size [Symbol] La dimensione del componente (:small, :medium, :large)
15
- # @param window [Integer] Il numero di pagine da mostrare intorno alla pagina corrente (default: 2)
16
- # @param show_info [Boolean] Se mostrare le informazioni sui risultati (default: false)
17
- # @param per_page [Integer] Il numero di elementi per pagina (richiesto se show_info è true)
18
- # @param classes [String] Classi CSS aggiuntive
19
- # @param form [FormBuilder, nil] Form builder per l'integrazione con Rails form (opzionale)
20
- # @param options [Hash] Attributi HTML aggiuntivi
21
- # @return [String] Il markup HTML del componente pagination
22
- #
23
- # @example Uso base standalone
24
- # <%= bui_pagination(current_page: 3, total_pages: 10, path: '/products') %>
25
- #
26
- # @example Con tema e dimensione personalizzati
27
- # <%= bui_pagination(
28
- # current_page: 5,
29
- # total_pages: 20,
30
- # path: '/articles',
31
- # theme: :blue,
32
- # size: :large
33
- # ) %>
34
- #
35
- # @example Con informazioni sui risultati
36
- # <%= bui_pagination(
37
- # current_page: 2,
38
- # total_pages: 8,
39
- # path: '/users',
40
- # show_info: true,
41
- # per_page: 25,
42
- # theme: :green
43
- # ) %>
44
- #
45
- # @example Con finestra di pagine personalizzata
46
- # <%= bui_pagination(
47
- # current_page: 10,
48
- # total_pages: 50,
49
- # path: '/orders',
50
- # window: 3,
51
- # size: :small
52
- # ) %>
53
- #
54
- # @example Con attributi HTML aggiuntivi
55
- # <%= bui_pagination(
56
- # current_page: 1,
57
- # total_pages: 5,
58
- # path: '/dashboard',
59
- # classes: 'my-4',
60
- # data: { turbo_frame: 'content' }
61
- # ) %>
62
- def bui_pagination(current_page:, total_pages:, path:, theme: :default, size: :medium,
63
- window: 2, show_info: false, per_page: nil, classes: '',
64
- form: nil, **options)
65
- render BetterUi::General::Pagination::Component.new(
66
- current_page: current_page,
67
- total_pages: total_pages,
68
- path: path,
69
- theme: theme,
70
- size: size,
71
- window: window,
72
- show_info: show_info,
73
- per_page: per_page,
74
- classes: classes,
75
- **options
76
- )
77
- end
78
- end
79
- end
80
- end
81
- end
82
- end
@@ -1,83 +0,0 @@
1
- module BetterUi
2
- module General
3
- module Components
4
- module Panel
5
- module PanelHelper
6
- # Genera un pannello usando BetterUi::General::Panel::Component
7
- #
8
- # @param title [String] titolo del pannello (opzionale)
9
- # @param body [String] contenuto HTML del pannello (opzionale)
10
- # @param header [String] header personalizzato (opzionale)
11
- # @param footer [String] footer del pannello (opzionale)
12
- # @param theme [Symbol] tema del colore (:default, :white, etc.)
13
- # @param style [Symbol] stile (:default, :flat, :raised, :bordered)
14
- # @param padding [Symbol] padding interno (:none, :small, :medium, :large)
15
- # @param radius [Symbol] raggio dei bordi (:none, :small, :medium, :large, :full)
16
- # @param html_options [Hash] opzioni HTML aggiuntive
17
- # @return [String] HTML del pannello renderizzato
18
- #
19
- # @example Uso base
20
- # bui_panel(title: "Dashboard")
21
- # bui_panel(body: "Contenuto del pannello")
22
- #
23
- # @example Pannello completo
24
- # bui_panel(
25
- # title: "Impostazioni",
26
- # body: "Configura le tue preferenze",
27
- # footer: "Ultimo aggiornamento: oggi",
28
- # theme: :blue
29
- # )
30
- #
31
- # @example Con header personalizzato
32
- # bui_panel(
33
- # header: "<h2>Header Custom</h2>",
34
- # body: "Il mio contenuto",
35
- # theme: :green,
36
- # style: :raised
37
- # )
38
- #
39
- # @example Pannello con stili avanzati
40
- # bui_panel(
41
- # title: "Card Premium",
42
- # body: "Contenuto speciale",
43
- # theme: :violet,
44
- # style: :bordered,
45
- # padding: :large,
46
- # radius: :large,
47
- # id: "premium-panel",
48
- # class: "special-panel"
49
- # )
50
- #
51
- # @example Con contenuto block
52
- # bui_panel(title: "Lista Utenti", theme: :white) do
53
- # "<ul><li>Utente 1</li><li>Utente 2</li></ul>".html_safe
54
- # end
55
- def bui_panel(
56
- title: nil,
57
- body: nil,
58
- header: nil,
59
- footer: nil,
60
- theme: :white,
61
- style: :default,
62
- padding: :medium,
63
- radius: :small,
64
- **html_options,
65
- &block
66
- )
67
- render BetterUi::General::Panel::Component.new(
68
- title: title,
69
- body: body,
70
- header: header,
71
- footer: footer,
72
- theme: theme,
73
- style: style,
74
- padding: padding,
75
- radius: radius,
76
- **html_options
77
- ), &block
78
- end
79
- end
80
- end
81
- end
82
- end
83
- end