bootstrap-vue · tmorehouse · Apr 6, 2019 · Mar 26, 2019 · Mar 26, 2019 · Mar 26, 2019
diff --git a/docs/components/componentdoc.vue b/docs/components/componentdoc.vue
@@ -207,8 +207,12 @@ export default {
       let options = {}
       if (!component.options && typeof component === 'function') {
         // Async component that hans't been resolved yet
-        component(opts => {
-          options = opts ? { ...opts } : {}
+        component(cmp => {
+          if (Object.prototype.toString.call(cmp) === '[object Object]') {
+            options = { ...cmp }
+          } else if (cmp && cmp.options) {
+            options = cmp.options
+          }
         })
       } else {
         // Regular component

diff --git a/scripts/rollup.config.js b/scripts/rollup.config.js
@@ -10,6 +10,8 @@ const base = path.resolve(__dirname, '..')
 const src = path.resolve(base, 'src')
 const dist = path.resolve(base, 'dist')
 
+const externals = ['vue', ...Object.keys(dependencies)]
+
 // Libs in `external` will not be bundled to dist,
 // since they are expected to be provided later.
 // We want to include some of them in the build, so we exclude it here.
@@ -31,19 +33,22 @@ export default [
   // UMD
   {
     ...baseConfig,
-    external: Object.keys(dependencies).filter(dep => !externalExcludes.includes(dep)),
+    external: externals.filter(dep => !externalExcludes.includes(dep)),
     output: {
       format: 'umd',
       name: camelCase(name),
       file: path.resolve(dist, `${name}.js`),
-      sourcemap: true
+      sourcemap: true,
+      globals: {
+        vue: 'Vue'
+      }
     }
   },
 
   // COMMON
   {
     ...baseConfig,
-    external: Object.keys(dependencies).filter(dep => !externalExcludes.includes(dep)),
+    external: externals.filter(dep => !externalExcludes.includes(dep)),
     output: {
       format: 'cjs',
       name: camelCase(name),

diff --git a/src/components/alert/alert.js b/src/components/alert/alert.js
@@ -1,3 +1,4 @@
+import Vue from 'vue'
 import BButtonClose from '../button/button-close'
 import { getComponentConfig } from '../../utils/config'
 import { requestAF } from '../../utils/dom'
@@ -29,7 +30,7 @@ const parseShow = show => {
 const isNumericLike = value => !isNaN(parseInt(value, 10))
 
 // @vue/component
-export default {
+export default Vue.extend({
   name: NAME,
   model: {
     prop: 'show',
@@ -38,15 +39,15 @@ export default {
   props: {
     variant: {
       type: String,
-      default: () => getComponentConfig(NAME, 'variant')
+      default: () => String(getComponentConfig(NAME, 'variant'))
     },
     dismissible: {
       type: Boolean,
       default: false
     },
     dismissLabel: {
       type: String,
-      default: () => getComponentConfig(NAME, 'dismissLabel')
+      default: () => String(getComponentConfig(NAME, 'dismissLabel'))
     },
     show: {
       type: [Boolean, Number, String],
@@ -185,4 +186,4 @@ export default {
       $alert
     )
   }
-}
+})
diff --git a/src/components/badge/badge.js b/src/components/badge/badge.js
@@ -1,3 +1,4 @@
+import Vue from 'vue'
 import { mergeData } from 'vue-functional-data-merge'
 import { getComponentConfig } from '../../utils/config'
 import pluckProps from '../../utils/pluck-props'
@@ -17,7 +18,7 @@ export const props = {
   },
   variant: {
     type: String,
-    default: () => getComponentConfig(NAME, 'variant')
+    default: () => String(getComponentConfig(NAME, 'variant'))
   },
   pill: {
     type: Boolean,
@@ -26,7 +27,7 @@ export const props = {
 }
 
 // @vue/component
-export default {
+export default Vue.extend({
   name: NAME,
   functional: true,
   props,
@@ -48,4 +49,4 @@ export default {
 
     return h(tag, mergeData(data, componentData), children)
   }
-}
+})
diff --git a/src/components/breadcrumb/breadcrumb-item.js b/src/components/breadcrumb/breadcrumb-item.js
@@ -1,8 +1,9 @@
+import Vue from 'vue'
 import { mergeData } from 'vue-functional-data-merge'
 import BBreadcrumbLink, { props } from './breadcrumb-link'
 
 // @vue/component
-export default {
+export default Vue.extend({
   name: 'BBreadcrumbItem',
   functional: true,
   props,
@@ -16,4 +17,4 @@ export default {
       [h(BBreadcrumbLink, { props }, children)]
     )
   }
-}
+})
diff --git a/src/components/breadcrumb/breadcrumb-link.js b/src/components/breadcrumb/breadcrumb-link.js
@@ -1,3 +1,4 @@
+import Vue from 'vue'
 import { mergeData } from 'vue-functional-data-merge'
 import pluckProps from '../../utils/pluck-props'
 import BLink, { propsFactory as linkPropsFactory } from '../link/link'
@@ -20,7 +21,7 @@ export const props = {
 }
 
 // @vue/component
-export default {
+export default Vue.extend({
   name: 'BBreadcrumbLink',
   functional: true,
   props,
@@ -38,4 +39,4 @@ export default {
 
     return h(tag, mergeData(data, componentData), children)
   }
-}
+})
diff --git a/src/components/breadcrumb/breadcrumb.js b/src/components/breadcrumb/breadcrumb.js
@@ -1,3 +1,4 @@
+import Vue from 'vue'
 import { mergeData } from 'vue-functional-data-merge'
 import { isArray } from '../../utils/array'
 import toString from '../../utils/to-string'
@@ -11,7 +12,7 @@ export const props = {
 }
 
 // @vue/component
-export default {
+export default Vue.extend({
   name: 'BBreadcrumb',
   functional: true,
   props,
@@ -40,4 +41,4 @@ export default {
 
     return h('ol', mergeData(data, { staticClass: 'breadcrumb' }), childNodes)
   }
-}
+})
diff --git a/src/components/button-group/button-group.js b/src/components/button-group/button-group.js
@@ -1,3 +1,4 @@
+import Vue from 'vue'
 import { mergeData } from 'vue-functional-data-merge'
 
 export const props = {
@@ -20,7 +21,7 @@ export const props = {
 }
 
 // @vue/component
-export default {
+export default Vue.extend({
   name: 'BButtonGroup',
   functional: true,
   props,
@@ -38,4 +39,4 @@ export default {
       children
     )
   }
-}
+})
diff --git a/src/components/button-toolbar/button-toolbar.js b/src/components/button-toolbar/button-toolbar.js
@@ -1,3 +1,4 @@
+import Vue from 'vue'
 import { isVisible, selectAll } from '../../utils/dom'
 import KeyCodes from '../../utils/key-codes'
 
@@ -10,7 +11,7 @@ const ITEM_SELECTOR = [
 ].join(',')
 
 // @vue/component
-export default {
+export default Vue.extend({
   name: 'BButtonToolbar',
   props: {
     justify: {
@@ -111,4 +112,4 @@ export default {
       [this.$slots.default]
     )
   }
-}
+})
diff --git a/src/components/button/button-close.js b/src/components/button/button-close.js
@@ -1,3 +1,4 @@
+import Vue from 'vue'
 import { mergeData } from 'vue-functional-data-merge'
 import { getComponentConfig } from '../../utils/config'
 
@@ -10,16 +11,16 @@ const props = {
   },
   ariaLabel: {
     type: String,
-    default: () => getComponentConfig(NAME, 'ariaLabel')
+    default: () => String(getComponentConfig(NAME, 'ariaLabel'))
   },
   textVariant: {
     type: String,
-    default: () => getComponentConfig(NAME, 'textVariant')
+    default: () => String(getComponentConfig(NAME, 'textVariant') || '') || null
   }
 }
 
 // @vue/component
-export default {
+export default Vue.extend({
   name: NAME,
   functional: true,
   props,
@@ -51,4 +52,4 @@ export default {
     }
     return h('button', mergeData(data, componentData), slots().default)
   }
-}
+})
diff --git a/src/components/button/button.js b/src/components/button/button.js
@@ -1,3 +1,4 @@
+import Vue from 'vue'
 import { mergeData } from 'vue-functional-data-merge'
 import { getComponentConfig } from '../../utils/config'
 import pluckProps from '../../utils/pluck-props'
@@ -23,7 +24,7 @@ const btnProps = {
   },
   variant: {
     type: String,
-    default: () => getComponentConfig(NAME, 'variant')
+    default: () => String(getComponentConfig(NAME, 'variant'))
   },
   type: {
     type: String,
@@ -138,7 +139,7 @@ function computeAttrs(props, data) {
 }
 
 // @vue/component
-export default {
+export default Vue.extend({
   name: NAME,
   functional: true,
   props,
@@ -179,4 +180,4 @@ export default {
 
     return h(link ? BLink : props.tag, mergeData(data, componentData), children)
   }
-}
+})
diff --git a/src/components/card/card-body.js b/src/components/card/card-body.js
@@ -1,3 +1,4 @@
+import Vue from 'vue'
 import { mergeData } from 'vue-functional-data-merge'
 import prefixPropName from '../../utils/prefix-prop-name'
 import copyProps from '../../utils/copy-props'
@@ -22,7 +23,7 @@ export const props = {
 }
 
 // @vue/component
-export default {
+export default Vue.extend({
   name: 'BCardBody',
   functional: true,
   props,
@@ -59,4 +60,4 @@ export default {
       [cardTitle, cardSubTitle, ...cardContent]
     )
   }
-}
+})
diff --git a/src/components/card/card-footer.js b/src/components/card/card-footer.js
@@ -1,3 +1,4 @@
+import Vue from 'vue'
 import { mergeData } from 'vue-functional-data-merge'
 
 import prefixPropName from '../../utils/prefix-prop-name'
@@ -22,7 +23,7 @@ export const props = {
 }
 
 // @vue/component
-export default {
+export default Vue.extend({
   name: 'BCardFooter',
   functional: true,
   props,
@@ -43,4 +44,4 @@ export default {
       children || [h('div', { domProps: htmlOrText(props.footerHtml, props.footer) })]
     )
   }
-}
+})
diff --git a/src/components/card/card-group.js b/src/components/card/card-group.js
@@ -1,3 +1,4 @@
+import Vue from 'vue'
 import { mergeData } from 'vue-functional-data-merge'
 
 export const props = {
@@ -16,7 +17,7 @@ export const props = {
 }
 
 // @vue/component
-export default {
+export default Vue.extend({
   name: 'BCardGroup',
   functional: true,
   props,
@@ -30,4 +31,4 @@ export default {
 
     return h(props.tag, mergeData(data, { class: baseClass }), children)
   }
-}
+})
diff --git a/src/components/card/card-header.js b/src/components/card/card-header.js
@@ -1,5 +1,5 @@
+import Vue from 'vue'
 import { mergeData } from 'vue-functional-data-merge'
-
 import prefixPropName from '../../utils/prefix-prop-name'
 import copyProps from '../../utils/copy-props'
 import { htmlOrText } from '../../utils/html'
@@ -22,7 +22,7 @@ export const props = {
 }
 
 // @vue/component
-export default {
+export default Vue.extend({
   name: 'BCardHeader',
   functional: true,
   props,
@@ -43,4 +43,4 @@ export default {
       children || [h('div', { domProps: htmlOrText(props.headerHtml, props.header) })]
     )
   }
-}
+})
diff --git a/src/components/card/card-img-lazy.js b/src/components/card/card-img-lazy.js
@@ -1,10 +1,11 @@
-import BImgLazy from '../image/img-lazy'
+import Vue from 'vue'
+import BImgLazy, { props as imgLazyProps } from '../image/img-lazy'
 import { omit } from '../../utils/object'
 import { mergeData } from 'vue-functional-data-merge'
 
 // Copy of `<b-img-lazy>` props, and remove conflicting/non-applicable props
 // The `omit()` util creates a new object, so we can just pass the original props
-const lazyProps = omit(BImgLazy.props, [
+const lazyProps = omit(imgLazyProps, [
   'left',
   'right',
   'center',
@@ -46,7 +47,7 @@ export const props = {
 }
 
 // @vue/component
-export default {
+export default Vue.extend({
   name: 'BCardImgLazy',
   functional: true,
   props,
@@ -72,4 +73,4 @@ export default {
       })
     )
   }
-}
+})