Skip to content

Commit

Permalink
feat(b-form-group): allow setting label cols props to auto (closes #…
Browse files Browse the repository at this point in the history
  • Loading branch information
tmorehouse committed Oct 14, 2019
1 parent 605d4c4 commit 21a822b
Show file tree
Hide file tree
Showing 2 changed files with 7 additions and 4 deletions.
9 changes: 6 additions & 3 deletions src/components/form-group/README.md
Expand Up @@ -79,9 +79,10 @@ By default, the label appears above the input element(s), but you may optionally
(label to the left of the input) at the various standard Bootstrap breakpoints.

The props`label-cols` and `label-cols-{breakpoint}` allow you to specify how many columns the label
should occupy in the row. The input(s) will fill the rest of the row. The value must be a number
should occupy in the row. The input will fill the rest of the row width. The value must be a number
greater than `0`. Or you can set the prop to `true` to make the label and input(s) each occupy half
of the width of the rendered row (handy if you have custom Bootstrap with an odd number of columns).
of the width of the rendered row (handy if you have custom Bootstrap with an odd number of columns),
or set the value to `'auto'` so that the label occupies only the width that is needed.

| prop | description |
| --------------- | --------------------------------- |
Expand All @@ -107,6 +108,8 @@ of the width of the rendered row (handy if you have custom Bootstrap with an odd
</div>
</div>

The ability to set the label cols to `'auto'` was added in BootstrapVue version <samp>2.1.0</samp>.

<!-- b-form-group-horizontal.vue -->
```

Expand Down Expand Up @@ -228,7 +231,7 @@ of related form controls:
Setting the `disabled` prop will disable the rendered `<fieldset>` and, on most browsers, will
disable all the input elements contained within the fieldset.

`disabled` has no effect when `label-for` is set (as a `fieldset` element is not rendered).
`disabled` has no effect when `label-for` is set (as a `<fieldset>` element is not rendered).

## Validation state feedback

Expand Down
2 changes: 1 addition & 1 deletion src/components/form-group/form-group.js
Expand Up @@ -258,7 +258,7 @@ export const BFormGroup = {
// Handle case where the prop's value is an empty string,
// which represents true
propVal = propVal === '' ? true : propVal || false
if (!isBoolean(propVal)) {
if (!isBoolean(propVal) && propVal !== 'auto') {
// Convert to column size to number
propVal = parseInt(propVal, 10) || 0
// Ensure column size is greater than 0
Expand Down

0 comments on commit 21a822b

Please sign in to comment.