🌐 AI搜索 & 代理 主页
Skip to content

Commit 1389efa

Browse files
jacobmllr95jacobmllr95
authored
feat(config): defaults for all size properties (closes #3805) (#3841)
* feat(config): defaults for all `size` properties * Update config-defaults.js * Update config-defaults.js * Update config-defaults.js * Improve pagination config handling * Update pagination.js * Fix pagination * Update pagination.js * BFormControl => formControls * Update README.md * Update README.md * Update README.md
1 parent b02fb49 commit 1389efa

File tree

11 files changed

+135
-102
lines changed

11 files changed

+135
-102
lines changed

‎docs/markdown/misc/settings/README.md‎

Lines changed: 7 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -16,10 +16,13 @@ Note that it is not possible to change the defaults when using BootstrapVue via
1616

1717
### Default configuration
1818

19-
Default breakpoint names are stored in the `breakpoints` property, while component defaults are
20-
keyed by their <samp>PascalCase</samp> name with the props as <samp>camelCase</samp> properties.
21-
Only properties defined in the default configuration can be overridden. Attempting to set a config
22-
property that is not defined in the default will generate a console warning.
19+
Default breakpoint names are stored in the `breakpoints` property, default form control size is
20+
stored under the `formControls` property, while component specific defaults are keyed by their
21+
<samp>PascalCase</samp> name with the props as <samp>camelCase</samp> properties. Only properties
22+
defined in the default configuration can be overridden. Attempting to set a config property that is
23+
not defined in the default will generate a console warning.
24+
25+
The `formControls` entry was introduced in <span class="badge badge-info small">v2.0.0-rc.28</span>.
2326

2427
```json
2528
{{ defaultConfig }}

‎src/components/button-group/button-group.js‎

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,8 @@
11
import Vue from '../../utils/vue'
22
import { mergeData } from 'vue-functional-data-merge'
3+
import { getComponentConfig } from '../../utils/config'
4+
5+
const NAME = 'BButtonGroup'
36

47
export const props = {
58
vertical: {
@@ -8,7 +11,7 @@ export const props = {
811
},
912
size: {
1013
type: String,
11-
default: null
14+
default: () => getComponentConfig('BButton', 'size')
1215
},
1316
tag: {
1417
type: String,
@@ -22,7 +25,7 @@ export const props = {
2225

2326
// @vue/component
2427
export const BButtonGroup = /*#__PURE__*/ Vue.extend({
25-
name: 'BButtonGroup',
28+
name: NAME,
2629
functional: true,
2730
props,
2831
render(h, { props, data, children }) {

‎src/components/button/button.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@ const btnProps = {
2323
},
2424
size: {
2525
type: String,
26-
default: null
26+
default: () => getComponentConfig(NAME, 'size')
2727
},
2828
variant: {
2929
type: String,

‎src/components/dropdown/dropdown.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ export const props = {
1818
},
1919
size: {
2020
type: String,
21-
default: null
21+
default: () => getComponentConfig(NAME, 'size')
2222
},
2323
variant: {
2424
type: String,

‎src/components/form-file/form-file.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,7 @@ export const BFormFile = /*#__PURE__*/ Vue.extend({
2222
props: {
2323
size: {
2424
type: String,
25-
default: null
25+
default: () => getComponentConfig('BFormControl', 'size')
2626
},
2727
value: {
2828
// type: Object,
@@ -313,7 +313,7 @@ export const BFormFile = /*#__PURE__*/ Vue.extend({
313313
class: [
314314
this.stateClass,
315315
{
316-
[`b-custom-control-${this.size}`]: this.size
316+
[`b-custom-control-${this.size}`]: Boolean(this.size)
317317
}
318318
],
319319
attrs: { id: this.safeId('_BV_file_outer_') },

‎src/components/input-group/input-group.js‎

Lines changed: 7 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,21 @@
11
import Vue from '../../utils/vue'
22
import { mergeData } from 'vue-functional-data-merge'
3+
import { getComponentConfig } from '../../utils/config'
34
import { htmlOrText } from '../../utils/html'
45
import { hasNormalizedSlot, normalizeSlot } from '../../utils/normalize-slot'
56
import { BInputGroupPrepend } from './input-group-prepend'
67
import { BInputGroupAppend } from './input-group-append'
78
import { BInputGroupText } from './input-group-text'
89

10+
const NAME = 'BInputGroup'
11+
912
export const props = {
1013
id: {
1114
type: String
1215
},
1316
size: {
14-
type: String
17+
type: String,
18+
default: () => getComponentConfig(NAME, 'size')
1519
},
1620
prepend: {
1721
type: String
@@ -33,7 +37,7 @@ export const props = {
3337

3438
// @vue/component
3539
export const BInputGroup = /*#__PURE__*/ Vue.extend({
36-
name: 'BInputGroup',
40+
name: NAME,
3741
functional: true,
3842
props,
3943
render(h, { props, data, slots, scopedSlots }) {
@@ -85,9 +89,7 @@ export const BInputGroup = /*#__PURE__*/ Vue.extend({
8589
props.tag,
8690
mergeData(data, {
8791
staticClass: 'input-group',
88-
class: {
89-
[`input-group-${props.size}`]: Boolean(props.size)
90-
},
92+
class: { [`input-group-${props.size}`]: Boolean(props.size) },
9193
attrs: {
9294
id: props.id || null,
9395
role: 'group'

‎src/components/pagination-nav/pagination-nav.js‎

Lines changed: 22 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -2,15 +2,26 @@ import Vue from '../../utils/vue'
22
import looseEqual from '../../utils/loose-equal'
33
import toString from '../../utils/to-string'
44
import warn from '../../utils/warn'
5+
import { getComponentConfig } from '../../utils/config'
56
import { requestAF } from '../../utils/dom'
67
import { isBrowser } from '../../utils/env'
78
import { isArray, isUndefined, isFunction, isObject } from '../../utils/inspect'
89
import { computeHref, parseQuery } from '../../utils/router'
910
import paginationMixin from '../../mixins/pagination'
1011

11-
// Props object
12+
const NAME = 'BPaginationNav'
13+
14+
// Sanitize the provided number of pages (converting to a number)
15+
export const sanitizeNumberOfPages = value => {
16+
const numberOfPages = parseInt(value, 10) || 1
17+
return numberOfPages < 1 ? 1 : numberOfPages
18+
}
19+
1220
const props = {
13-
// pagination-nav specific props
21+
size: {
22+
type: String,
23+
default: () => getComponentConfig(NAME, 'size')
24+
},
1425
numberOfPages: {
1526
type: [Number, String],
1627
default: 1,
@@ -70,16 +81,10 @@ const props = {
7081
}
7182
}
7283

73-
// TODO: move this to an instance method in pagination mixin
74-
const sanitizeNumPages = value => {
75-
const num = parseInt(value, 10) || 1
76-
return num < 1 ? 1 : num
77-
}
78-
79-
// Our render function is brought in via the pagination mixin
84+
// The render function is brought in via the pagination mixin
8085
// @vue/component
8186
export const BPaginationNav = /*#__PURE__*/ Vue.extend({
82-
name: 'BPaginationNav',
87+
name: NAME,
8388
mixins: [paginationMixin],
8489
props,
8590
computed: {
@@ -96,17 +101,17 @@ export const BPaginationNav = /*#__PURE__*/ Vue.extend({
96101
watch: {
97102
numberOfPages(newVal, oldVal) {
98103
this.$nextTick(() => {
99-
this.setNumPages()
104+
this.setNumberOfPages()
100105
})
101106
},
102107
pages(newVal, oldVal) {
103108
this.$nextTick(() => {
104-
this.setNumPages()
109+
this.setNumberOfPages()
105110
})
106111
}
107112
},
108113
created() {
109-
this.setNumPages()
114+
this.setNumberOfPages()
110115
},
111116
mounted() {
112117
if (this.$router) {
@@ -121,11 +126,11 @@ export const BPaginationNav = /*#__PURE__*/ Vue.extend({
121126
}
122127
},
123128
methods: {
124-
setNumPages() {
129+
setNumberOfPages() {
125130
if (isArray(this.pages) && this.pages.length > 0) {
126-
this.localNumPages = this.pages.length
131+
this.localNumberOfPages = this.pages.length
127132
} else {
128-
this.localNumPages = sanitizeNumPages(this.numberOfPages)
133+
this.localNumberOfPages = sanitizeNumberOfPages(this.numberOfPages)
129134
}
130135
this.$nextTick(() => {
131136
this.guessCurrentPage()
@@ -263,7 +268,7 @@ export const BPaginationNav = /*#__PURE__*/ Vue.extend({
263268
? { path: loc.pathname, hash: loc.hash, query: parseQuery(loc.search) }
264269
: {}
265270
// Loop through the possible pages looking for a match until found
266-
for (let page = 1; !guess && page <= this.localNumPages; page++) {
271+
for (let page = 1; !guess && page <= this.localNumberOfPages; page++) {
267272
const to = this.makeLink(page)
268273
if ($router && (isObject(to) || this.useRouter)) {
269274
// Resolve the page via the $router

‎src/components/pagination/pagination.js‎

Lines changed: 19 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,30 @@
11
import Vue from '../../utils/vue'
2-
import paginationMixin from '../../mixins/pagination'
2+
import { getComponentConfig } from '../../utils/config'
33
import { isVisible } from '../../utils/dom'
4+
import paginationMixin from '../../mixins/pagination'
5+
6+
const NAME = 'BPagination'
47

58
const DEFAULT_PER_PAGE = 20
69
const DEFAULT_TOTAL_ROWS = 0
710

11+
// Sanitize the provided per page number (converting to a number)
812
const sanitizePerPage = val => {
913
const perPage = parseInt(val, 10) || DEFAULT_PER_PAGE
1014
return perPage < 1 ? 1 : perPage
1115
}
1216

17+
// Sanitize the provided total rows number (converting to a number)
1318
const sanitizeTotalRows = val => {
1419
const totalRows = parseInt(val, 10) || DEFAULT_TOTAL_ROWS
1520
return totalRows < 0 ? 0 : totalRows
1621
}
1722

1823
const props = {
24+
size: {
25+
type: String,
26+
default: () => getComponentConfig(NAME, 'size')
27+
},
1928
perPage: {
2029
type: [Number, String],
2130
default: DEFAULT_PER_PAGE
@@ -30,10 +39,10 @@ const props = {
3039
}
3140
}
3241

33-
// Our render function is brought in from the pagination mixin
42+
// The render function is brought in via the pagination mixin
3443
// @vue/component
3544
export const BPagination = /*#__PURE__*/ Vue.extend({
36-
name: 'BPagination',
45+
name: NAME,
3746
mixins: [paginationMixin],
3847
props,
3948
computed: {
@@ -44,21 +53,21 @@ export const BPagination = /*#__PURE__*/ Vue.extend({
4453
},
4554
watch: {
4655
numberOfPages(newVal) {
47-
if (newVal === this.localNumPages) {
56+
if (newVal === this.localNumberOfPages) {
4857
/* istanbul ignore next */
4958
return
5059
}
51-
this.localNumPages = newVal
60+
this.localNumberOfPages = newVal
5261
this.currentPage = 1
5362
}
5463
},
5564
created() {
5665
// Set the initial page count
57-
this.localNumPages = this.numberOfPages
66+
this.localNumberOfPages = this.numberOfPages
5867
// Set the initial page value
59-
const curr = parseInt(this.value, 10) || 0
60-
if (curr > 0) {
61-
this.currentPage = curr
68+
const currentPage = parseInt(this.value, 10) || 0
69+
if (currentPage > 0) {
70+
this.currentPage = currentPage
6271
} else {
6372
this.$nextTick(() => {
6473
// If this value parses to NaN or a value less than 1
@@ -69,7 +78,7 @@ export const BPagination = /*#__PURE__*/ Vue.extend({
6978
},
7079
mounted() {
7180
// Set the initial page count
72-
this.localNumPages = this.numberOfPages
81+
this.localNumberOfPages = this.numberOfPages
7382
},
7483
methods: {
7584
// These methods are used by the render function

‎src/mixins/form-size.js‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,11 @@
1+
import { getComponentConfig } from '../utils/config'
2+
13
// @vue/component
24
export default {
35
props: {
46
size: {
57
type: String,
6-
default: null
8+
default: () => getComponentConfig('formControls', 'size')
79
}
810
},
911
computed: {

0 commit comments

Comments
 (0)