Skip to content

Commit 62a6207

Browse files
authored
chore(core): use Vue.extend() for component definitions (#2915)
1 parent 6b36d0d commit 62a6207

File tree

87 files changed

+734
-627
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

87 files changed

+734
-627
lines changed

docs/components/componentdoc.vue

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -207,8 +207,12 @@ export default {
207207
let options = {}
208208
if (!component.options && typeof component === 'function') {
209209
// Async component that hans't been resolved yet
210-
component(opts => {
211-
options = opts ? { ...opts } : {}
210+
component(cmp => {
211+
if (Object.prototype.toString.call(cmp) === '[object Object]') {
212+
options = { ...cmp }
213+
} else if (cmp && cmp.options) {
214+
options = cmp.options
215+
}
212216
})
213217
} else {
214218
// Regular component

scripts/rollup.config.js

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,8 @@ const base = path.resolve(__dirname, '..')
1010
const src = path.resolve(base, 'src')
1111
const dist = path.resolve(base, 'dist')
1212

13+
const externals = ['vue', ...Object.keys(dependencies)]
14+
1315
// Libs in `external` will not be bundled to dist,
1416
// since they are expected to be provided later.
1517
// We want to include some of them in the build, so we exclude it here.
@@ -31,19 +33,22 @@ export default [
3133
// UMD
3234
{
3335
...baseConfig,
34-
external: Object.keys(dependencies).filter(dep => !externalExcludes.includes(dep)),
36+
external: externals.filter(dep => !externalExcludes.includes(dep)),
3537
output: {
3638
format: 'umd',
3739
name: camelCase(name),
3840
file: path.resolve(dist, `${name}.js`),
39-
sourcemap: true
41+
sourcemap: true,
42+
globals: {
43+
vue: 'Vue'
44+
}
4045
}
4146
},
4247

4348
// COMMON
4449
{
4550
...baseConfig,
46-
external: Object.keys(dependencies).filter(dep => !externalExcludes.includes(dep)),
51+
external: externals.filter(dep => !externalExcludes.includes(dep)),
4752
output: {
4853
format: 'cjs',
4954
name: camelCase(name),

src/components/alert/alert.js

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import Vue from 'vue'
12
import BButtonClose from '../button/button-close'
23
import { getComponentConfig } from '../../utils/config'
34
import { requestAF } from '../../utils/dom'
@@ -29,7 +30,7 @@ const parseShow = show => {
2930
const isNumericLike = value => !isNaN(parseInt(value, 10))
3031

3132
// @vue/component
32-
export default {
33+
export default Vue.extend({
3334
name: NAME,
3435
model: {
3536
prop: 'show',
@@ -38,15 +39,15 @@ export default {
3839
props: {
3940
variant: {
4041
type: String,
41-
default: () => getComponentConfig(NAME, 'variant')
42+
default: () => String(getComponentConfig(NAME, 'variant'))
4243
},
4344
dismissible: {
4445
type: Boolean,
4546
default: false
4647
},
4748
dismissLabel: {
4849
type: String,
49-
default: () => getComponentConfig(NAME, 'dismissLabel')
50+
default: () => String(getComponentConfig(NAME, 'dismissLabel'))
5051
},
5152
show: {
5253
type: [Boolean, Number, String],
@@ -185,4 +186,4 @@ export default {
185186
$alert
186187
)
187188
}
188-
}
189+
})

src/components/badge/badge.js

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import Vue from 'vue'
12
import { mergeData } from 'vue-functional-data-merge'
23
import { getComponentConfig } from '../../utils/config'
34
import pluckProps from '../../utils/pluck-props'
@@ -17,7 +18,7 @@ export const props = {
1718
},
1819
variant: {
1920
type: String,
20-
default: () => getComponentConfig(NAME, 'variant')
21+
default: () => String(getComponentConfig(NAME, 'variant'))
2122
},
2223
pill: {
2324
type: Boolean,
@@ -26,7 +27,7 @@ export const props = {
2627
}
2728

2829
// @vue/component
29-
export default {
30+
export default Vue.extend({
3031
name: NAME,
3132
functional: true,
3233
props,
@@ -48,4 +49,4 @@ export default {
4849

4950
return h(tag, mergeData(data, componentData), children)
5051
}
51-
}
52+
})

src/components/breadcrumb/breadcrumb-item.js

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,9 @@
1+
import Vue from 'vue'
12
import { mergeData } from 'vue-functional-data-merge'
23
import BBreadcrumbLink, { props } from './breadcrumb-link'
34

45
// @vue/component
5-
export default {
6+
export default Vue.extend({
67
name: 'BBreadcrumbItem',
78
functional: true,
89
props,
@@ -16,4 +17,4 @@ export default {
1617
[h(BBreadcrumbLink, { props }, children)]
1718
)
1819
}
19-
}
20+
})

src/components/breadcrumb/breadcrumb-link.js

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import Vue from 'vue'
12
import { mergeData } from 'vue-functional-data-merge'
23
import pluckProps from '../../utils/pluck-props'
34
import BLink, { propsFactory as linkPropsFactory } from '../link/link'
@@ -20,7 +21,7 @@ export const props = {
2021
}
2122

2223
// @vue/component
23-
export default {
24+
export default Vue.extend({
2425
name: 'BBreadcrumbLink',
2526
functional: true,
2627
props,
@@ -38,4 +39,4 @@ export default {
3839

3940
return h(tag, mergeData(data, componentData), children)
4041
}
41-
}
42+
})

src/components/breadcrumb/breadcrumb.js

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import Vue from 'vue'
12
import { mergeData } from 'vue-functional-data-merge'
23
import { isArray } from '../../utils/array'
34
import toString from '../../utils/to-string'
@@ -11,7 +12,7 @@ export const props = {
1112
}
1213

1314
// @vue/component
14-
export default {
15+
export default Vue.extend({
1516
name: 'BBreadcrumb',
1617
functional: true,
1718
props,
@@ -40,4 +41,4 @@ export default {
4041

4142
return h('ol', mergeData(data, { staticClass: 'breadcrumb' }), childNodes)
4243
}
43-
}
44+
})

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

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import Vue from 'vue'
12
import { mergeData } from 'vue-functional-data-merge'
23

34
export const props = {
@@ -20,7 +21,7 @@ export const props = {
2021
}
2122

2223
// @vue/component
23-
export default {
24+
export default Vue.extend({
2425
name: 'BButtonGroup',
2526
functional: true,
2627
props,
@@ -38,4 +39,4 @@ export default {
3839
children
3940
)
4041
}
41-
}
42+
})

src/components/button-toolbar/button-toolbar.js

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import Vue from 'vue'
12
import { isVisible, selectAll } from '../../utils/dom'
23
import KeyCodes from '../../utils/key-codes'
34

@@ -10,7 +11,7 @@ const ITEM_SELECTOR = [
1011
].join(',')
1112

1213
// @vue/component
13-
export default {
14+
export default Vue.extend({
1415
name: 'BButtonToolbar',
1516
props: {
1617
justify: {
@@ -111,4 +112,4 @@ export default {
111112
[this.$slots.default]
112113
)
113114
}
114-
}
115+
})

src/components/button/button-close.js

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import Vue from 'vue'
12
import { mergeData } from 'vue-functional-data-merge'
23
import { getComponentConfig } from '../../utils/config'
34

@@ -10,16 +11,16 @@ const props = {
1011
},
1112
ariaLabel: {
1213
type: String,
13-
default: () => getComponentConfig(NAME, 'ariaLabel')
14+
default: () => String(getComponentConfig(NAME, 'ariaLabel'))
1415
},
1516
textVariant: {
1617
type: String,
17-
default: () => getComponentConfig(NAME, 'textVariant')
18+
default: () => String(getComponentConfig(NAME, 'textVariant') || '') || null
1819
}
1920
}
2021

2122
// @vue/component
22-
export default {
23+
export default Vue.extend({
2324
name: NAME,
2425
functional: true,
2526
props,
@@ -51,4 +52,4 @@ export default {
5152
}
5253
return h('button', mergeData(data, componentData), slots().default)
5354
}
54-
}
55+
})

src/components/button/button.js

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import Vue from 'vue'
12
import { mergeData } from 'vue-functional-data-merge'
23
import { getComponentConfig } from '../../utils/config'
34
import pluckProps from '../../utils/pluck-props'
@@ -23,7 +24,7 @@ const btnProps = {
2324
},
2425
variant: {
2526
type: String,
26-
default: () => getComponentConfig(NAME, 'variant')
27+
default: () => String(getComponentConfig(NAME, 'variant'))
2728
},
2829
type: {
2930
type: String,
@@ -138,7 +139,7 @@ function computeAttrs(props, data) {
138139
}
139140

140141
// @vue/component
141-
export default {
142+
export default Vue.extend({
142143
name: NAME,
143144
functional: true,
144145
props,
@@ -179,4 +180,4 @@ export default {
179180

180181
return h(link ? BLink : props.tag, mergeData(data, componentData), children)
181182
}
182-
}
183+
})

src/components/card/card-body.js

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import Vue from 'vue'
12
import { mergeData } from 'vue-functional-data-merge'
23
import prefixPropName from '../../utils/prefix-prop-name'
34
import copyProps from '../../utils/copy-props'
@@ -22,7 +23,7 @@ export const props = {
2223
}
2324

2425
// @vue/component
25-
export default {
26+
export default Vue.extend({
2627
name: 'BCardBody',
2728
functional: true,
2829
props,
@@ -59,4 +60,4 @@ export default {
5960
[cardTitle, cardSubTitle, ...cardContent]
6061
)
6162
}
62-
}
63+
})

src/components/card/card-footer.js

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import Vue from 'vue'
12
import { mergeData } from 'vue-functional-data-merge'
23

34
import prefixPropName from '../../utils/prefix-prop-name'
@@ -22,7 +23,7 @@ export const props = {
2223
}
2324

2425
// @vue/component
25-
export default {
26+
export default Vue.extend({
2627
name: 'BCardFooter',
2728
functional: true,
2829
props,
@@ -43,4 +44,4 @@ export default {
4344
children || [h('div', { domProps: htmlOrText(props.footerHtml, props.footer) })]
4445
)
4546
}
46-
}
47+
})

src/components/card/card-group.js

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import Vue from 'vue'
12
import { mergeData } from 'vue-functional-data-merge'
23

34
export const props = {
@@ -16,7 +17,7 @@ export const props = {
1617
}
1718

1819
// @vue/component
19-
export default {
20+
export default Vue.extend({
2021
name: 'BCardGroup',
2122
functional: true,
2223
props,
@@ -30,4 +31,4 @@ export default {
3031

3132
return h(props.tag, mergeData(data, { class: baseClass }), children)
3233
}
33-
}
34+
})

src/components/card/card-header.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1+
import Vue from 'vue'
12
import { mergeData } from 'vue-functional-data-merge'
2-
33
import prefixPropName from '../../utils/prefix-prop-name'
44
import copyProps from '../../utils/copy-props'
55
import { htmlOrText } from '../../utils/html'
@@ -22,7 +22,7 @@ export const props = {
2222
}
2323

2424
// @vue/component
25-
export default {
25+
export default Vue.extend({
2626
name: 'BCardHeader',
2727
functional: true,
2828
props,
@@ -43,4 +43,4 @@ export default {
4343
children || [h('div', { domProps: htmlOrText(props.headerHtml, props.header) })]
4444
)
4545
}
46-
}
46+
})

src/components/card/card-img-lazy.js

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,11 @@
1-
import BImgLazy from '../image/img-lazy'
1+
import Vue from 'vue'
2+
import BImgLazy, { props as imgLazyProps } from '../image/img-lazy'
23
import { omit } from '../../utils/object'
34
import { mergeData } from 'vue-functional-data-merge'
45

56
// Copy of `<b-img-lazy>` props, and remove conflicting/non-applicable props
67
// The `omit()` util creates a new object, so we can just pass the original props
7-
const lazyProps = omit(BImgLazy.props, [
8+
const lazyProps = omit(imgLazyProps, [
89
'left',
910
'right',
1011
'center',
@@ -46,7 +47,7 @@ export const props = {
4647
}
4748

4849
// @vue/component
49-
export default {
50+
export default Vue.extend({
5051
name: 'BCardImgLazy',
5152
functional: true,
5253
props,
@@ -72,4 +73,4 @@ export default {
7273
})
7374
)
7475
}
75-
}
76+
})

0 commit comments

Comments
 (0)