rails_bootstrap_form 0.7.2 → 0.8.0

Sign up to get free protection for your applications and to get access to all the features.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: 3f98bbe1d1d5622bd4c653b8bfb5e3c0d3f36b6cb648bfc5c84eb7810655417c
4
- data.tar.gz: 6b839de8bef9b7933fa57c0ff61e3d7c45aa3052304c8b8cf987c3447f47f0c5
3
+ metadata.gz: 831ca7bb90715c33bd12b94176eecf4e229142b7b7c3b8a1d0366e5f287fb0fd
4
+ data.tar.gz: 6915c42e2221adce489e7a6564d6a88c31b52ce119dabb27a9e03ae51767d2d5
5
5
  SHA512:
6
- metadata.gz: fce1f7f63f502adfa7978cb94e0c2aa5d189e286d8359b2eca9775d81ee39eb9c95045734f9a51692f4b9706a715f09210ca2977280513567fc1d9fdb231672d
7
- data.tar.gz: 3c344d354b8c8f5496309db25a579231ef82d1eda138044b1ef9d7d27039d349c261f7644228ea3d088e50edd43de90f72dac7ce9282008b5e2a25e963e3e3b3
6
+ metadata.gz: 31e6404b0c40f4ea07c148cee2b1b66edbe3a71a8290195705e8ab6507c754148b80ad601b84f4afa0908ed42ec3098d5f971d8c92eb33085b3fb100926aa015
7
+ data.tar.gz: 5bd3c08a5b50abef3af433b93b2ae518c9d7e5807a1c5aef9105dddaa5e52f17e5ec8e8f09ea7931298a24be195694b48eb8b6c98f26a34f5f8df7f0f04d0e32
data/CHANGELOG.md CHANGED
@@ -4,6 +4,11 @@ You can find recent releases with docs in GitHub:
4
4
 
5
5
  https://github.com/shivam091/rails_bootstrap_form/releases
6
6
 
7
+ ## [0.8.0](https://github.com/shivam091/rails_bootstrap_form/compare/v0.7.2...v0.8.0) - 2023-05-26
8
+
9
+ ### What's new
10
+ - Added support for `inline` layout for forms.
11
+
7
12
  ## [0.7.2](https://github.com/shivam091/rails_bootstrap_form/compare/v0.7.1...v0.7.2) - 2023-05-25
8
13
 
9
14
  ### What's new
data/Gemfile.lock CHANGED
@@ -1,7 +1,7 @@
1
1
  PATH
2
2
  remote: .
3
3
  specs:
4
- rails_bootstrap_form (0.7.2)
4
+ rails_bootstrap_form (0.8.0)
5
5
  actionpack (~> 7.0)
6
6
  activemodel (~> 7.0)
7
7
 
data/README.md CHANGED
@@ -22,7 +22,7 @@ And follow the remaining instructions in the [official bootstrap installation gu
22
22
  Add the `rails_bootstrap_form` gem to your `Gemfile`:
23
23
 
24
24
  ```ruby
25
- gem "rails_bootstrap_form", "~> 0.6.1"
25
+ gem "rails_bootstrap_form", "~> 0.7.2"
26
26
  ```
27
27
 
28
28
  Then:
@@ -66,3 +66,275 @@ The current configuration options are:
66
66
  | Option | Default value | Description |
67
67
  |---------------------------|------------------|-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
68
68
  | `default_form_attributes` | | Set this option to `{role: "form"}` to make forms non-compliant with W3C, but generate the `role="form"` attribute. |
69
+
70
+ ## Usage
71
+
72
+ ### bootstrap_form_for
73
+
74
+ To get started, use the `bootstrap_form_for` helper in place of the Rails `form_for` helper. Here's an example:
75
+
76
+ ![bootstrap_form_for](https://github.com/shivam091/rails_bootstrap_form/assets/7858927/dfc5f03b-049a-4c12-b575-8298cf5551d7)
77
+
78
+ ```erb
79
+ <%= bootstrap_form_for(@user) do |f| %>
80
+ <%= f.email_field :email %>
81
+ <%= f.password_field :password %>
82
+ <%= f.check_box :remember_me %>
83
+ <%= f.primary "Log In" %>
84
+ <% end %>
85
+ ```
86
+
87
+ This generates the following HTML:
88
+
89
+
90
+ ```html
91
+ <form role="form" novalidate="novalidate" class="new_user" id="new_user" action="/users" accept-charset="UTF-8" method="post">
92
+ <div class="mb-3">
93
+ <label class="form-label required" for="user_email">Email address</label>
94
+ <input class="form-control" aria-required="true" required="required" type="email" name="user[email]" id="user_email">
95
+ </div>
96
+ <div class="mb-3">
97
+ <label class="form-label required" for="user_password">Password</label>
98
+ <input class="form-control" aria-required="true" required="required" type="password" name="user[password]" id="user_password">
99
+ </div>
100
+ <div class="form-check mb-3">
101
+ <input name="user[remember_me]" type="hidden" value="0" autocomplete="off">
102
+ <input class="form-check-input" type="checkbox" value="1" name="user[remember_me]" id="user_remember_me">
103
+ <label class="form-check-label" for="user_remember_me">Remember me</label>
104
+ </div>
105
+ <input type="submit" name="commit" value="Log In" class="btn btn-primary" data-disable-with="Log In">
106
+ </form>
107
+ ```
108
+
109
+ ### bootstrap_form_with
110
+
111
+ To get started, use the `bootstrap_form_with` helper in place of the Rails `form_with` helper. Here's an example:
112
+
113
+ ![bootstrap_form_with](https://github.com/shivam091/rails_bootstrap_form/assets/7858927/06c605b9-29e2-4670-9495-0e913508d73f)
114
+
115
+ ```erb
116
+ <%= bootstrap_form_with(model: @user) do |f| %>
117
+ <%= f.email_field :email %>
118
+ <%= f.password_field :password %>
119
+ <%= f.check_box :remember_me %>
120
+ <%= f.primary "Log In" %>
121
+ <% end %>
122
+ ```
123
+
124
+ This generates the following HTML:
125
+
126
+
127
+ ```html
128
+ <form role="form" novalidate="novalidate" class="new_user" id="new_user" action="/users" accept-charset="UTF-8" method="post">
129
+ <div class="mb-3">
130
+ <label class="form-label required" for="user_email">Email address</label>
131
+ <input class="form-control" aria-required="true" required="required" type="email" name="user[email]" id="user_email">
132
+ </div>
133
+ <div class="mb-3">
134
+ <label class="form-label required" for="user_password">Password</label>
135
+ <input class="form-control" aria-required="true" required="required" type="password" name="user[password]" id="user_password">
136
+ </div>
137
+ <div class="form-check mb-3">
138
+ <input name="user[remember_me]" type="hidden" value="0" autocomplete="off">
139
+ <input class="form-check-input" type="checkbox" value="1" name="user[remember_me]" id="user_remember_me">
140
+ <label class="form-check-label" for="user_remember_me">Remember me</label>
141
+ </div>
142
+ <input type="submit" name="commit" value="Log In" class="btn btn-primary" data-disable-with="Log In">
143
+ </form>
144
+ ```
145
+
146
+ ## Bootstrap configuration options
147
+
148
+ Here's a list of all possible options you can pass via `bootstrap_form` option that can be attached to the `bootstrap_form_for` or `bootstrap_form_with` or any field helpers inside of it:
149
+
150
+ | Option | Description | Default value |
151
+ | ------ | ------------- | ----------- |
152
+ | `layout` | Controls layout of form and field helpers. It can be `vertical` `horizontal`, or `inline`. | `vertical` |
153
+ | `field_class` | A CSS class that will be applied to all form fields. | `form-control` |
154
+ | `additional_field_class` | An additional CSS class that will be added along with the existing css classes of field helpers. | `nil` |
155
+ | `help_text` | Describes help text for the HTML field. Help text is automatically read from translation file. If you want to customize it, you can pass a string. You can also set it `false` if you do not want help text displayed. | `nil` |
156
+ | `label_text` | An option to customize automatically generated label text. | `nil` |
157
+ | `skip_label` | An option to control whether the label is to be displayed or not. | `false` |
158
+ | `hide_label` | An option to control whether the label is only accessible to a screen readers. | `false` |
159
+ | `hide_class` | A CSS class that will be used when the label is only accessible to a screen readers. | `visually-hidden` |
160
+ | `label_class` | A CSS class that will be applied to all labels when layout is `vertical`. | `form-label` |
161
+ | `additional_label_class` | An additional CSS class that will be added along with the existing label css classes. | `nil` |
162
+ | `prepend` | Raw or HTML content to be prepended to the field. | `nil` |
163
+ | `append` | Raw or HTML content to be appended to the field. | `nil` |
164
+ | `additional_input_group_class` | An additional CSS class that will be added to existing input group wrapper css classes. | `nil` |
165
+ | `floating` | An option to control whether the field should have a floating label. | `false` |
166
+ | `static_field_class` | A CSS class that will be applied to all static fields. | `form-control-plaintext` |
167
+ | `switch` | An option to control whether the check box should look like Bootstrap switches. | `false` |
168
+ | `wrapper_options` | An option to control the HTML attributes and options that will be added to a field wrapper. | `{}` |
169
+ | `size` | An option to control the size of input groups, buttons, labels, and fields. It can be `sm` or `lg`. | `nil` |
170
+ | `inline` | An option to group checkboxes and radio buttons on the same horizontal row. | `false` |
171
+ | `label_col_class` | A CSS class that will be applied to all labels when layout is `horizontal`. | `col-form-label` |
172
+ | `label_col_wrapper_class` | A CSS class for label column when layout is `horizontal`. | `col-sm-2` |
173
+ | `field_col_wrapper_class` | A CSS class for field column when layout is `horizontal`. | `col-sm-10` |
174
+ | `render_as_button` | An option to render submit button using `<button type="submit">` instead of `<input type="submit">`. | `false` |
175
+
176
+ Options applied on the form level will apply to all field helpers. Options applied on field helpers will override form-level options.
177
+ Here's an example of a form where one field uses different layout:
178
+
179
+ ![bootstrap_option_override](https://github.com/shivam091/rails_bootstrap_form/assets/7858927/9d312870-033f-4bc4-922b-1b65df202352)
180
+
181
+ ```erb
182
+ <%= bootstrap_form_for @user do |form| %>
183
+ <%= form.text_field :name %>
184
+ <%= form.email_field :email %>
185
+ <%= form.password_field :password, bootstrap_form: {layout: :horizontal} %>
186
+ <%= form.check_box :terms, required: true %>
187
+ <%= form.primary "Register" %>
188
+ <% end %>
189
+ ```
190
+
191
+ This generates the following HTML:
192
+
193
+ ```html
194
+ <form role="form" novalidate="novalidate" class="new_user" id="new_user" action="/users" accept-charset="UTF-8" method="post">
195
+ <div class="mb-3">
196
+ <label class="form-label required" for="user_name">Name</label>
197
+ <input class="form-control" aria-required="true" required="required" type="text" name="user[name]" id="user_name">
198
+ </div>
199
+ <div class="mb-3">
200
+ <label class="form-label required" for="user_email">Email address</label>
201
+ <input class="form-control" aria-required="true" required="required" type="email" name="user[email]" id="user_email">
202
+ </div>
203
+ <div class="row mb-3">
204
+ <label class="col-form-label col-sm-2 required" for="user_password">Password</label>
205
+ <div class="col-sm-10">
206
+ <input class="form-control" aria-required="true" required="required" type="password" name="user[password]" id="user_password">
207
+ </div>
208
+ </div>
209
+ <div class="form-check mb-3">
210
+ <input name="user[terms]" type="hidden" value="0" autocomplete="off">
211
+ <input required="required" class="form-check-input" type="checkbox" value="1" name="user[terms]" id="user_terms">
212
+ <label class="form-check-label required" for="user_terms">I accept terms and conditions</label>
213
+ <div class="form-text text-muted">You must first accept terms and conditions in order to continue</div>
214
+ </div>
215
+ <input type="submit" name="commit" value="Register" class="btn btn-primary" data-disable-with="Register">
216
+ </form>
217
+ ```
218
+
219
+ ## Supported form helpers
220
+
221
+ This gem wraps most of the form field helpers. Here's the current list:
222
+
223
+ ```
224
+ check_box collection_check_boxes collection_radio_buttons
225
+ collection_select color_field date_field
226
+ date_select datetime_field datetime_local_field
227
+ datetime_select email_field file_field
228
+ grouped_collection_select hidden_field month_field
229
+ number_field password_field phone_field
230
+ radio_button range_field rich_text_area
231
+ search_field select static_field
232
+ telephone_field text_area text_field
233
+ time_field time_select time_zone_select
234
+ url_field week_field weekday_select
235
+ ```
236
+
237
+ ## Supported form layouts
238
+
239
+ ### Vertical layout
240
+
241
+ This layout is default layout for the form in which labels are above the fields and labels and fields take 100% of the width.
242
+
243
+ Here's an example of how it looks like:
244
+
245
+ ![vertical_layout](https://github.com/shivam091/rails_bootstrap_form/assets/7858927/0795cad6-f2f9-4cc6-bb39-aace67156781)
246
+
247
+ ```erb
248
+ <%= bootstrap_form_for @user do |form| %>
249
+ <%= form.email_field :email %>
250
+ <%= form.password_field :password %>
251
+ <%= form.primary "Sign in" %>
252
+ <% end %>
253
+ ```
254
+
255
+ This generates the following HTML:
256
+
257
+ ```html
258
+ <form role="form" novalidate="novalidate" class="new_user" id="new_user" action="/users" accept-charset="UTF-8" method="post">
259
+ <div class="mb-3">
260
+ <label class="form-label required" for="user_email">Email address</label>
261
+ <input class="form-control" aria-required="true" required="required" type="email" name="user[email]" id="user_email">
262
+ </div>
263
+ <div class="mb-3">
264
+ <label class="form-label required" for="user_password">Password</label>
265
+ <input class="form-control" aria-required="true" required="required" type="password" name="user[password]" id="user_password">
266
+ </div>
267
+ <input type="submit" name="commit" value="Sign in" class="btn btn-primary" data-disable-with="Sign in">
268
+ </form>
269
+ ```
270
+
271
+ ### Horizontal layout
272
+
273
+ If you want to align label and field side by side, you can use horizontal layout for the form.
274
+ You can optionally override `label_col_wrapper_class` and `field_col_wrapper_class` at either form level or field helpers if want to customize
275
+ space between label and field.
276
+
277
+ Here's an example of how it looks like by default:
278
+
279
+ ![horizontal_layout](https://github.com/shivam091/rails_bootstrap_form/assets/7858927/71493945-31d5-4917-83c2-8cb7b0825371)
280
+
281
+ ```erb
282
+ <%= bootstrap_form_for @user, bootstrap_form: {layout: :horizontal} do |form| %>
283
+ <%= form.email_field :email %>
284
+ <%= form.password_field :password %>
285
+ <%= form.primary "Sign in" %>
286
+ <% end %>
287
+ ```
288
+ This generates the following HTML:
289
+
290
+ ```html
291
+ <form role="form" novalidate="novalidate" class="new_user" id="new_user" action="/users" accept-charset="UTF-8" method="post">
292
+ <div class="row mb-3">
293
+ <label class="col-form-label col-sm-2 required" for="user_email">Email address</label>
294
+ <div class="col-sm-10">
295
+ <input class="form-control" aria-required="true" required="required" type="email" name="user[email]" id="user_email">
296
+ </div>
297
+ </div>
298
+ <div class="row mb-3">
299
+ <label class="col-form-label col-sm-2 required" for="user_password">Password</label>
300
+ <div class="col-sm-10">
301
+ <input class="form-control" aria-required="true" required="required" type="password" name="user[password]" id="user_password">
302
+ </div>
303
+ </div>
304
+ <input type="submit" name="commit" value="Sign in" class="btn btn-primary" data-disable-with="Sign in">
305
+ </form>
306
+ ```
307
+
308
+ ### Inline layout
309
+
310
+ You may choose to render form elements in one line. Please note that this layout won't render all form elements perfectly. Things like errors messages and help text won't show up right.
311
+
312
+ Here's an example of how it looks like:
313
+
314
+ ![inline_layout](https://github.com/shivam091/rails_bootstrap_form/assets/7858927/644a08ec-b249-4e1c-8d61-5350e6649f11)
315
+
316
+ ```erb
317
+ <%= bootstrap_form_for @user, bootstrap_form: {layout: :inline} do |form| %>
318
+ <%= form.email_field :email %>
319
+ <%= form.password_field :password %>
320
+ <%= form.primary "Sign in" %>
321
+ <% end %>
322
+ ```
323
+
324
+ This generates the following HTML:
325
+
326
+ ```html
327
+ <form role="form" novalidate="novalidate" class="new_user row row-cols-lg-auto g-3 align-items-center" id="new_user" action="/users" accept-charset="UTF-8" method="post">
328
+ <div class="col-12">
329
+ <label class="form-label visually-hidden required" for="user_email">Email address</label>
330
+ <input class="form-control" aria-required="true" required="required" placeholder="Email address" type="email" name="user[email]" id="user_email">
331
+ </div>
332
+ <div class="col-12">
333
+ <label class="form-label visually-hidden required" for="user_password">Password</label>
334
+ <input class="form-control" aria-required="true" required="required" placeholder="Password" type="password" name="user[password]" id="user_password">
335
+ </div>
336
+ <div class="col-12">
337
+ <input type="submit" name="commit" value="Sign in" class="btn btn-primary" data-disable-with="Sign in">
338
+ </div>
339
+ </form>
340
+ ```
@@ -3,6 +3,9 @@
3
3
  # -*- warn_indent: true -*-
4
4
 
5
5
  class User < ApplicationRecord
6
+
7
+ attr_accessor :username, :remember_me
8
+
6
9
  validates :name, presence: true, length: {in: 2..50}
7
10
  validates :terms, acceptance: true
8
11
  validates :email,
@@ -2,6 +2,14 @@
2
2
  <%= render partial: "users/form_without_bootstrap_helpers" %>
3
3
  <% end %>
4
4
 
5
- <%= render partial: "users/vertical_form" %>
5
+ <% if true %>
6
+ <%= render partial: "users/inline_form" %>
7
+ <% end %>
8
+
9
+ <% if true %>
10
+ <%= render partial: "users/vertical_form" %>
11
+ <% end %>
6
12
 
7
- <%= render partial: "users/horizontal_form" %>
13
+ <% if true %>
14
+ <%= render partial: "users/horizontal_form" %>
15
+ <% end %>
@@ -1,10 +1,11 @@
1
1
  <div class="card card-primary my-3">
2
2
  <div class="card-header fw-bold">
3
- Profile Form (Horizontal layout)
3
+ Horizontal layout
4
4
  </div>
5
5
  <div class="card-body">
6
6
  <%= bootstrap_form_for @user, bootstrap_form: {layout: :horizontal} do |form| %>
7
7
  <%= form.text_field :name, autocomplete: "new-name" %>
8
+ <%= form.text_field :username, autocomplete: "new-username" %>
8
9
  <%= form.email_field :email, autocomplete: "new-email" %>
9
10
  <%= form.password_field :password, autocomplete: "new-password" %>
10
11
  <%= form.phone_field :mobile_number %>
@@ -23,10 +24,8 @@
23
24
  {include_blank: "Select Country"} %>
24
25
  <% end %>
25
26
  <%= form.check_box :terms, required: true %>
26
- <div class="mt-3">
27
- <%= form.primary "Register" %>
28
- <%= link_to "Cancel", users_path, class: "btn btn-secondary" %>
29
- </div>
27
+ <%= form.primary "Register" %>
28
+ <%= link_to "Cancel", users_path, class: "btn btn-secondary" %>
30
29
  <% end %>
31
30
  </div>
32
31
  </div>
@@ -0,0 +1,13 @@
1
+ <div class="card card-primary my-3">
2
+ <div class="card-header fw-bold">
3
+ Inline layout
4
+ </div>
5
+ <div class="card-body">
6
+ <%= bootstrap_form_for @user, bootstrap_form: {layout: :inline} do |form| %>
7
+ <%= form.text_field :username, autocomplete: "new-username" %>
8
+ <%= form.password_field :password, autocomplete: "new-password" %>
9
+ <%= form.check_box :remember_me %>
10
+ <%= form.primary "Login" %>
11
+ <% end %>
12
+ </div>
13
+ </div>
@@ -1,10 +1,11 @@
1
1
  <div class="card card-primary my-3">
2
2
  <div class="card-header fw-bold">
3
- Profile Form (Vertical layout)
3
+ Vertical layout
4
4
  </div>
5
5
  <div class="card-body">
6
6
  <%= bootstrap_form_for @user do |form| %>
7
7
  <%= form.text_field :name, autocomplete: "new-name" %>
8
+ <%= form.text_field :username, autocomplete: "new-username" %>
8
9
  <%= form.email_field :email, autocomplete: "new-email" %>
9
10
  <%= form.password_field :password, autocomplete: "new-password" %>
10
11
  <%= form.phone_field :mobile_number %>
@@ -23,10 +24,8 @@
23
24
  {include_blank: "Select Country"} %>
24
25
  <% end %>
25
26
  <%= form.check_box :terms, required: true %>
26
- <div class="mt-3">
27
- <%= form.primary "Register" %>
28
- <%= link_to "Cancel", users_path, class: "btn btn-secondary" %>
29
- </div>
27
+ <%= form.primary "Register" %>
28
+ <%= link_to "Cancel", users_path, class: "btn btn-secondary" %>
30
29
  <% end %>
31
30
  </div>
32
31
  </div>
@@ -27,6 +27,8 @@
27
27
  terms: "I accept terms and conditions",
28
28
  excellence: "Excellence",
29
29
  skill_ids: "Skills",
30
+ username: "Username",
31
+ remember_me: "Keep me signed in",
30
32
  },
31
33
  user_skill: {
32
34
  user_id: "User",
@@ -45,7 +47,7 @@
45
47
  email: "Please use official email address",
46
48
  terms: "You must first accept terms and conditions in order to continue",
47
49
  skill_ids: "Select your strong skills",
48
- fruit_id: "Select your favorite fruit"
50
+ fruit_id: "Select your favorite fruit",
49
51
  }
50
52
  },
51
53
  }
@@ -17,6 +17,7 @@ module RailsBootstrapForm
17
17
  def initialize(object_name, object, template, options)
18
18
  @bootstrap_form_options = RailsBootstrapForm::BootstrapFormOptions.new(options[:bootstrap_form])
19
19
  apply_default_form_options(options)
20
+ apply_default_form_classes(options)
20
21
  super(object_name, object, template, options)
21
22
  end
22
23
 
@@ -31,12 +32,20 @@ module RailsBootstrapForm
31
32
  options[:html].reverse_merge!(RailsBootstrapForm.config.default_form_attributes)
32
33
  end
33
34
 
35
+ def apply_default_form_classes(options)
36
+ return unless @bootstrap_form_options.layout_inline?
37
+
38
+ options[:html][:class] =
39
+ ([*options[:html][:class]&.split(/\s+/)] + %w[row row-cols-lg-auto g-3 align-items-center])
40
+ .compact.uniq.join(" ")
41
+ end
42
+
34
43
  def fields_for_options(record_object, fields_options)
35
44
  field_options = record_object if record_object.is_a?(Hash) && record_object.extractable_options?
36
45
  field_options = {bootstrap_form: options[:bootstrap_form]}.deep_merge!(field_options)
37
46
  field_options
38
47
  end
39
48
 
40
- private :apply_default_form_options, :fields_for_options
49
+ private :apply_default_form_options, :fields_for_options, :apply_default_form_classes
41
50
  end
42
51
  end
@@ -16,47 +16,47 @@ module RailsBootstrapForm
16
16
  #
17
17
  class BootstrapFormOptions
18
18
 
19
- # Controls form and field layout. It can be "vertical, "horizontal", or "inline".
20
- # It can also be "floating" if field should have floating labels.
19
+ # Controls layout of form and field helpers. It can be "vertical,
20
+ # "horizontal", or "inline". The default value is `vertical`.
21
21
  attr_accessor :layout
22
22
 
23
- # A CSS class that will be applied to all form fields and it can be overridden
24
- # by the `BootstrapFormOptions` object. Default is `form-control`.
23
+ # A CSS class that will be applied to all form fields.
24
+ # The default value is `form-control`.
25
25
  attr_accessor :field_class
26
26
 
27
27
  # An additional CSS class that will be added along with the existing
28
- # `field_class` of the field. Default is nil.
28
+ # css classes of field helpers. The default value is nil.
29
29
  attr_accessor :additional_field_class
30
30
 
31
31
  # Describes help text for the HTML field. Help text is automatically read
32
32
  # from translation file. If you want to customize it, you can pass string.
33
33
  # You can also set it false if you do not want help text displayed.
34
- # Default is nil.
34
+ # The default value is nil.
35
35
  attr_accessor :help_text
36
36
 
37
- # An option to override automatically generated label text.
38
- # Default is `nil`.
37
+ # An option to customize automatically generated label text.
38
+ # The default value is `nil`.
39
39
  attr_accessor :label_text
40
40
 
41
- # An option to custmize whether the label is to be displayed or not.
42
- # Default is `false`.
41
+ # An option to control whether the label is to be displayed or not.
42
+ # The default value is `false`.
43
43
  attr_accessor :skip_label
44
44
 
45
- # An option to customize whether the label is only visible to screen readers.
46
- # Default is `false`.
45
+ # An option to control whether the label is only visible to a screen readers.
46
+ # The default value is `false`.
47
47
  attr_accessor :hide_label
48
48
 
49
- # The CSS class that will be used when the label is only accessible by screen
50
- # readers. Default is `visually-hidden`
49
+ # The CSS class that will be used when the label is only accessible to a
50
+ # screen readers. The default value is `visually-hidden`.
51
51
  attr_accessor :hide_class
52
52
 
53
- # Default CSS class that will be applied to all label tags when layout is
53
+ # A CSS class that will be applied to all label tags when layout is
54
54
  # vertical.
55
55
  # The default value is `form-label`.
56
56
  attr_accessor :label_class
57
57
 
58
- # An additional CSS class that will be added along with the existing
59
- # `label_class` of the label. Default is `nil`.
58
+ # An additional CSS class that will be added along with the existing label
59
+ # css classes. The default value is `nil`.
60
60
  attr_accessor :additional_label_class
61
61
 
62
62
  # Input group specific options. Input groups allow prepending and appending
@@ -68,58 +68,57 @@ module RailsBootstrapForm
68
68
  # form.text_field :search, bootstrap_form: {input_group: {append: button_tag("Go", type: :submit, class: "btn btn-secondary")}}
69
69
  #
70
70
  # Raw or HTML content to be prepended to the field.
71
- # Default is `nil`.
71
+ # The default value is `nil`.
72
72
  attr_accessor :prepend
73
73
 
74
74
  # Raw or HTML content to be appended to the field.
75
- # Default is `nil`.
75
+ # The default value is `nil`.
76
76
  attr_accessor :append
77
77
 
78
- # Append additional CSS class added to the input group wrapper.
79
- # Default is `nil`.
78
+ # An additional CSS class that will be added to existing input group wrapper
79
+ # css classes. The default value is `nil`.
80
80
  attr_accessor :additional_input_group_class
81
81
 
82
- # Option to control whether the field should have a floating label.
83
- # Default is false.
82
+ # An option to control whether the field should have a floating label.
83
+ # The default value is false.
84
84
  attr_accessor :floating
85
85
 
86
- # Default CSS class that will be applied to all static fields.
87
- # Default is `form-control-plaintext`.
86
+ # A CSS class that will be applied to all static fields.
87
+ # The default value is `form-control-plaintext`.
88
88
  attr_accessor :static_field_class
89
89
 
90
- # Option to control whether the check box should look like bootstrap switches.
91
- # Default is `false`.
90
+ # An option to control whether the check box should look like Bootstrap switches.
91
+ # The default value is `false`.
92
92
  attr_accessor :switch
93
93
 
94
- # Controls the HTML attributes and options that will be added to the field wrapper.
95
- # Default is `{}`.
94
+ # An option to control the HTML attributes and options that will be added to
95
+ # the field wrapper. The default value is `{}`.
96
96
  attr_accessor :wrapper_options
97
97
 
98
- # Option to specify the size of input groups and fields.
98
+ # An option to control the size of input groups, buttons, labels, and fields.
99
99
  # The valid values are `sm` and `lg`. The default value is `nil`.
100
100
  attr_accessor :size
101
101
 
102
- # Option to render checkboxes and radio buttons inline.
103
- # The default value if `false`.
102
+ # An option to group checkboxes and radio buttons on the same horizontal row.
103
+ # The default value is `false`.
104
104
  #
105
105
  # Example:
106
106
  # form.collection_radio_buttons :choices, ["yes", "no"], :to_s, :to_s, bootstrap_form: {inline: true}
107
107
  attr_accessor :inline
108
108
 
109
- # Default CSS class that will be applied to all label tags when layout is
110
- # horizontal.
109
+ # A CSS class that will be applied to all labels when layout is horizontal.
111
110
  # The default value is `col-form-label`.
112
111
  attr_accessor :label_col_class
113
112
 
114
- # Default CSS class for label column when using horizontal form.
113
+ # A CSS class for label column when layout is horizontal.
115
114
  # The default value is `col-sm-2`.
116
115
  attr_accessor :label_col_wrapper_class
117
116
 
118
- # Default CSS class for control column when using horizontal form.
117
+ # A CSS class for field column when layout is horizontal.
119
118
  # The default value is `col-sm-10`.
120
119
  attr_accessor :field_col_wrapper_class
121
120
 
122
- # Option to render submit button using `<button type="submit">` instead of
121
+ # An option to render submit button using `<button type="submit">` instead of
123
122
  # `<input type="submit">`.
124
123
  # The default value is `false`.
125
124
  attr_accessor :render_as_button
@@ -181,6 +180,10 @@ module RailsBootstrapForm
181
180
  @label_class = "form-label"
182
181
  @additional_label_class = nil
183
182
 
183
+ @prepend = nil
184
+ @append = nil
185
+ @additional_input_group_class = nil
186
+
184
187
  @floating = false
185
188
 
186
189
  @static_field_class = "form-control-plaintext"
@@ -58,12 +58,12 @@ module RailsBootstrapForm
58
58
  def field_wrapper_classes(bootstrap_options)
59
59
  classes = []
60
60
  classes << "row" if bootstrap_options.layout_horizontal?
61
- classes << form_wrapper_default_class
61
+ classes << form_wrapper_default_class(bootstrap_options)
62
62
  classes.flatten.compact
63
63
  end
64
64
 
65
- def form_wrapper_default_class
66
- "mb-3"
65
+ def form_wrapper_default_class(bootstrap_options)
66
+ bootstrap_options.layout_inline? ? "col-12" : "mb-3"
67
67
  end
68
68
 
69
69
  def field_css_options(attribute, bootstrap_options, options, html_options)
@@ -82,7 +82,7 @@ module RailsBootstrapForm
82
82
  css_options[:class] = field_classes.flatten.compact
83
83
  css_options.merge!(required_field_options(attribute, options))
84
84
 
85
- if (bootstrap_options.floating? && !bootstrap_options.layout_horizontal?)
85
+ if placeholder_required?(bootstrap_options)
86
86
  css_options[:placeholder] ||= label_text(attribute, bootstrap_options)
87
87
  end
88
88
 
@@ -97,6 +97,10 @@ module RailsBootstrapForm
97
97
  classes
98
98
  end
99
99
 
100
+ def placeholder_required?(bootstrap_options)
101
+ (bootstrap_options.floating? && !bootstrap_options.layout_horizontal?) || bootstrap_options.layout_inline?
102
+ end
103
+
100
104
  private :field_wrapper, :field_wrapper_classes, :form_wrapper_default_class,
101
105
  :field_css_options, :floating_label_classes
102
106
  end
@@ -12,11 +12,17 @@ module RailsBootstrapForm
12
12
  value, options = nil, value if value.is_a?(Hash)
13
13
  bootstrap_options = bootstrap_form_options.scoped(options.delete(:bootstrap_form))
14
14
 
15
- if (bootstrap_options.render_as_button? || block)
15
+ button_html = if (bootstrap_options.render_as_button? || block)
16
16
  button(value, options, &block)
17
17
  else
18
18
  submit(value, options)
19
19
  end
20
+
21
+ if bootstrap_options.layout_inline?
22
+ tag.div(class: "col-12") { button_html }
23
+ else
24
+ button_html
25
+ end
20
26
  end
21
27
 
22
28
  def secondary(value = nil, options = {}, &block)
@@ -62,7 +62,9 @@ module RailsBootstrapForm
62
62
  classes = Array("form-check")
63
63
  classes << "form-switch" if bootstrap_options.switch?
64
64
  classes << "form-check-inline" if bootstrap_options.inline?
65
- classes << "mb-3" unless (bootstrap_options.layout_horizontal? || bootstrap_options.inline?)
65
+ if (bootstrap_options.layout_vertical? && !bootstrap_options.inline?)
66
+ classes << "mb-3"
67
+ end
66
68
  classes.flatten.compact
67
69
  end
68
70
 
@@ -22,23 +22,32 @@ module RailsBootstrapForm
22
22
 
23
23
  def label_classes(attribute, bootstrap_options)
24
24
  classes = []
25
- classes << if bootstrap_options.layout_horizontal?
26
- [bootstrap_options.label_col_class, bootstrap_options.label_col_wrapper_class]
27
- else
28
- bootstrap_options.label_class
29
- end
25
+ classes << label_layout_classes(bootstrap_options)
30
26
  classes << bootstrap_options.additional_label_class
31
- classes << bootstrap_options.hide_class if bootstrap_options.hide_label?
27
+ classes << bootstrap_options.hide_class if hide_class_required?(bootstrap_options)
32
28
  classes << "required" if is_attribute_required?(attribute)
33
29
  classes << "is-invalid" if is_invalid?(attribute)
34
30
  classes.flatten.compact
35
31
  end
36
32
 
33
+ def label_layout_classes(bootstrap_options)
34
+ if bootstrap_options.layout_horizontal?
35
+ [bootstrap_options.label_col_class, bootstrap_options.label_col_wrapper_class]
36
+ else
37
+ bootstrap_options.label_class
38
+ end
39
+ end
40
+
37
41
  def label_text(attribute, bootstrap_options)
38
42
  bootstrap_options.label_text || object&.class.try(:human_attribute_name, attribute)
39
43
  end
40
44
 
41
- private :draw_label, :label_classes, :label_text
45
+ def hide_class_required?(bootstrap_options)
46
+ bootstrap_options.hide_label? || (bootstrap_options.layout_inline? && !bootstrap_options.floating?)
47
+ end
48
+
49
+ private :draw_label, :label_classes, :label_text, :label_layout_classes,
50
+ :hide_class_required?
42
51
  end
43
52
  end
44
53
  end
@@ -58,7 +58,9 @@ module RailsBootstrapForm
58
58
  def radio_button_wrapper_class(bootstrap_options)
59
59
  classes = Array("form-check")
60
60
  classes << "form-check-inline" if bootstrap_options.inline?
61
- classes << "mb-3" unless (bootstrap_options.layout_horizontal? || bootstrap_options.inline?)
61
+ if (bootstrap_options.layout_vertical? && !bootstrap_options.inline?)
62
+ classes << "mb-3"
63
+ end
62
64
  classes.flatten.compact
63
65
  end
64
66
 
@@ -34,6 +34,8 @@ module RailsBootstrapForm
34
34
  check_box_html
35
35
  end
36
36
  end
37
+ elsif bootstrap_options.layout_inline?
38
+ tag.div(class: "col-12") { check_box_html }
37
39
  else
38
40
  check_box_html
39
41
  end
@@ -34,6 +34,8 @@ module RailsBootstrapForm
34
34
  radio_button_html
35
35
  end
36
36
  end
37
+ elsif bootstrap_options.layout_inline?
38
+ tag.div(class: "col-12") { radio_button_html }
37
39
  else
38
40
  radio_button_html
39
41
  end
@@ -3,6 +3,6 @@
3
3
  # -*- warn_indent: true -*-
4
4
 
5
5
  module RailsBootstrapForm
6
- VERSION = "0.7.2".freeze
6
+ VERSION = "0.8.0".freeze
7
7
  REQUIRED_RAILS_VERSION = "~> 7.0".freeze
8
8
  end
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: rails_bootstrap_form
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.7.2
4
+ version: 0.8.0
5
5
  platform: ruby
6
6
  authors:
7
7
  - Harshal LADHE (shivam091)
8
8
  autorequire:
9
9
  bindir: exe
10
10
  cert_chain: []
11
- date: 2023-05-25 00:00:00.000000000 Z
11
+ date: 2023-05-26 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: generator_spec
@@ -94,6 +94,7 @@ files:
94
94
  - demo/app/views/users/_form.html.erb
95
95
  - demo/app/views/users/_form_without_bootstrap_helpers.html.erb
96
96
  - demo/app/views/users/_horizontal_form.html.erb
97
+ - demo/app/views/users/_inline_form.html.erb
97
98
  - demo/app/views/users/_vertical_form.html.erb
98
99
  - demo/app/views/users/edit.html.erb
99
100
  - demo/app/views/users/index.html.erb