Skip to content
Permalink
Browse files

feat(b-form-group): remove deprecated prop `horizontal` and `breakpoi…

…nt` (#3879)
  • Loading branch information...
tmorehouse committed Aug 14, 2019
1 parent 8784f31 commit b301822902d30c77d06a3bfef7c5a580484cc4ed
Showing with 1 addition and 32 deletions.
  1. +1 −4 src/components/form-group/README.md
  2. +0 −28 src/components/form-group/form-group.js
@@ -110,14 +110,11 @@ of the width of the rendered row (handy if you have custom Bootstrap with an odd
<!-- b-form-group-horizontal.vue -->
```

**Deprecation warning:** The props `horizontal` and `breakpoint` have been deprecated in favour of
using the `label-cols` and `label-cols-{breakpoint}` props.

### Label size

You can control the label text size match the size of your form input(s) via the optional
`label-size` prop. Values can be `'sm'` or `'lg'` for small or large label, respectively. Sizes work
for both `horizontal` and non-horizontal form groups.
for both horizontal and non-horizontal form groups.

```html
<div>
@@ -1,7 +1,6 @@
// Utils
import memoize from '../../utils/memoize'
import upperFirst from '../../utils/upper-first'
import warn from '../../utils/warn'
import { arrayIncludes } from '../../utils/array'
import { getBreakpointsUpCached } from '../../utils/config'
import { select, selectAll, isVisible, setAttr, removeAttr, getAttr } from '../../utils/dom'
@@ -25,9 +24,6 @@ const NAME = 'BFormGroup'
// Selector for finding first input in the form-group
const SELECTOR = 'input:not([disabled]),textarea:not([disabled]),select:not([disabled])'

const DEPRECATED_MSG =
'Props "horizontal" and "breakpoint" are deprecated. Use "label-cols(-{breakpoint})" props instead.'

// Render helper functions (here rather than polluting the instance with more methods)
const renderInvalidFeedback = (h, ctx) => {
const content = ctx.normalizeSlot('invalid-feedback') || ctx.invalidFeedback
@@ -235,18 +231,6 @@ const generateProps = () => {
disabled: {
type: Boolean,
default: false
},
horizontal: {
// Deprecated
type: Boolean,
default: false,
deprecated: DEPRECATED_MSG
},
breakpoint: {
// Deprecated (ignored if horizontal is not true)
type: String,
default: null, // legacy value 'sm',
deprecated: DEPRECATED_MSG
}
}
}
@@ -268,18 +252,6 @@ export const BFormGroup = {
computed: {
labelColProps() {
const props = {}
/* istanbul ignore next: deprecated */
if (this.horizontal) {
// Deprecated setting of horizontal/breakpoint props
/* istanbul ignore next */
warn(`b-form-group: ${DEPRECATED_MSG}`)
// Legacy default is breakpoint sm and cols 3
const bp = this.breakpoint || getBreakpointsUpCached()[1] // 'sm'
const cols = parseInt(this.labelCols, 10) || 3
props[bp] = cols > 0 ? cols : 3
// We then return the single breakpoint prop for legacy compatibility
return props
}
getBreakpointsUpCached().forEach(breakpoint => {
// Grab the value if the label column breakpoint prop
let propVal = this[makePropName(breakpoint, 'labelCols')]

0 comments on commit b301822

Please sign in to comment.
You can’t perform that action at this time.