diff --git a/package.json b/package.json index d30176d81ba..a5c7de50a3a 100644 --- a/package.json +++ b/package.json @@ -43,6 +43,7 @@ "typescript": "^3.1.3", "typescript-eslint-parser": "^20.0.0", "typestrict": "^1.0.1", - "vue": "^2.5.17" + "vue": "^2.5.21", + "vue-template-compiler": "^2.5.21" } } diff --git a/packages/api-generator/package.json b/packages/api-generator/package.json index 8c5e3775d9f..3144dd9aac6 100755 --- a/packages/api-generator/package.json +++ b/packages/api-generator/package.json @@ -12,7 +12,6 @@ "license": "ISC", "dependencies": { "deepmerge": "^2.2.1", - "vue": "^2.5.16", "vuetify": "^1.3.13" }, "devDependencies": { diff --git a/packages/vuetify/package.json b/packages/vuetify/package.json index f2e2465e47d..f5b976aac66 100644 --- a/packages/vuetify/package.json +++ b/packages/vuetify/package.json @@ -77,7 +77,6 @@ "url-loader": "^1.1.2", "vue-loader": "^15.4.2", "vue-router": "^3.0.1", - "vue-template-compiler": "^2.5.17", "vue-template-es2015-compiler": "^1.6.0", "vuetify-loader": "^0.2.0", "webpack": "^4.23.1", @@ -86,7 +85,7 @@ "webpack-merge": "^4.1.4" }, "peerDependencies": { - "vue": "^2.5.10" + "vue": "^2.5.18" }, "publishConfig": { "access": "public" diff --git a/packages/vuetify/src/components/VAlert/VAlert.ts b/packages/vuetify/src/components/VAlert/VAlert.ts index e3e0875a8bb..56c382eae2f 100644 --- a/packages/vuetify/src/components/VAlert/VAlert.ts +++ b/packages/vuetify/src/components/VAlert/VAlert.ts @@ -90,7 +90,7 @@ export default mixins(Colorable, Toggleable, Transitionable).extend({ directives: [{ name: 'show', value: this.isActive - }] as any, + }], on: this.$listeners }), children) diff --git a/packages/vuetify/src/components/VBadge/VBadge.ts b/packages/vuetify/src/components/VBadge/VBadge.ts index 0b66dd74b61..e706499e1eb 100644 --- a/packages/vuetify/src/components/VBadge/VBadge.ts +++ b/packages/vuetify/src/components/VBadge/VBadge.ts @@ -46,14 +46,14 @@ export default mixins( }, render (h): VNode { - const badge = this.$slots.badge ? [h('span', this.setBackgroundColor(this.color, { + const badge = this.$slots.badge && [h('span', this.setBackgroundColor(this.color, { staticClass: 'v-badge__badge', attrs: this.$attrs, directives: [{ name: 'show', value: this.isActive - }] as any - }), this.$slots.badge)] as any : null + }] + }), this.$slots.badge)] return h('span', { staticClass: 'v-badge', diff --git a/packages/vuetify/src/components/VBreadcrumbs/VBreadcrumbs.ts b/packages/vuetify/src/components/VBreadcrumbs/VBreadcrumbs.ts index 4336b1bd216..49d8b201cf0 100644 --- a/packages/vuetify/src/components/VBreadcrumbs/VBreadcrumbs.ts +++ b/packages/vuetify/src/components/VBreadcrumbs/VBreadcrumbs.ts @@ -89,7 +89,7 @@ export default mixins( for (let i = 0; i < this.items.length; i++) { const item = this.items[i] - if (hasSlot) items.push(this.$scopedSlots.item({ item })) + if (hasSlot) items.push(this.$scopedSlots.item!({ item })) else items.push(this.$createElement(VBreadcrumbsItem, { key: item.text, props: item }, [item.text])) if (i < this.items.length - 1) items.push(this.genDivider()) diff --git a/packages/vuetify/src/components/VBtn/VBtn.ts b/packages/vuetify/src/components/VBtn/VBtn.ts index d28655d14d8..2db9e543aba 100644 --- a/packages/vuetify/src/components/VBtn/VBtn.ts +++ b/packages/vuetify/src/components/VBtn/VBtn.ts @@ -2,9 +2,9 @@ import '../../stylus/components/_buttons.styl' // Types -import { VNode, VNodeChildren } from 'vue' +import { VNode } from 'vue' import { PropValidator } from 'vue/types/options' -import mixins from '../../util/mixins' +import mixins, { ExtractVue } from '../../util/mixins' import { RippleOptions } from '../../directives/ripple' // Components @@ -21,7 +21,7 @@ import { factory as ToggleableFactory } from '../../mixins/toggleable' // Utilities import { getObjectValueByPath } from '../../util/helpers' -export default mixins( +const baseMixins = mixins( Colorable, Routable, Positionable, @@ -29,7 +29,12 @@ export default mixins( GroupableFactory('btnToggle'), ToggleableFactory('inputValue') /* @vue/component */ -).extend({ +) +interface options extends ExtractVue { + $el: HTMLElement +} + +export default baseMixins.extend().extend({ name: 'v-btn', props: { @@ -114,25 +119,19 @@ export default mixins( return this.$createElement( 'div', { 'class': 'v-btn__content' }, - [this.$slots.default] + this.$slots.default ) }, genLoader (): VNode { - const children: VNodeChildren = [] - - if (!this.$slots.loader) { - children.push(this.$createElement(VProgressCircular, { - props: { - indeterminate: true, - size: 23, - width: 2 - } - })) - } else { - children.push(this.$slots.loader) - } - - return this.$createElement('span', { 'class': 'v-btn__loading' }, children) + return this.$createElement('span', { + class: 'v-btn__loading' + }, this.$slots.loader || [this.$createElement(VProgressCircular, { + props: { + indeterminate: true, + size: 23, + width: 2 + } + })]) }, onRouteChange () { if (!this.to || !this.$refs.link) return @@ -150,10 +149,12 @@ export default mixins( render (h): VNode { const setColor = (!this.outline && !this.flat && !this.disabled) ? this.setBackgroundColor : this.setTextColor const { tag, data } = this.generateRouteLink(this.classes) - const children = [this.genContent()] + const children = [ + this.genContent(), + this.loading && this.genLoader() + ] - tag === 'button' && (data.attrs!.type = this.type) - this.loading && children.push(this.genLoader()) + if (tag === 'button') data.attrs!.type = this.type data.attrs!.value = ['string', 'number'].includes(typeof this.value) ? this.value diff --git a/packages/vuetify/src/components/VCard/index.ts b/packages/vuetify/src/components/VCard/index.ts index 5a865335f11..ed174f4dd10 100644 --- a/packages/vuetify/src/components/VCard/index.ts +++ b/packages/vuetify/src/components/VCard/index.ts @@ -2,10 +2,9 @@ import { createSimpleFunctional } from '../../util/helpers' import VCard from './VCard' import VCardMedia from './VCardMedia' import VCardTitle from './VCardTitle' -import Vue from 'vue' -const VCardActions = Vue.extend(createSimpleFunctional('v-card__actions')) -const VCardText = Vue.extend(createSimpleFunctional('v-card__text')) +const VCardActions = createSimpleFunctional('v-card__actions') +const VCardText = createSimpleFunctional('v-card__text') export { VCard, VCardMedia, VCardTitle, VCardActions, VCardText } diff --git a/packages/vuetify/src/components/VChip/VChip.ts b/packages/vuetify/src/components/VChip/VChip.ts index 3d24b7a02c6..0babba1eb45 100644 --- a/packages/vuetify/src/components/VChip/VChip.ts +++ b/packages/vuetify/src/components/VChip/VChip.ts @@ -1,7 +1,7 @@ import '../../stylus/components/_chips.styl' // Types -import { CreateElement, VNode, VNodeChildren } from 'vue' +import { CreateElement, VNode } from 'vue' import mixins from '../../util/mixins' // Components @@ -63,13 +63,12 @@ export default mixins(Colorable, Themeable, Toggleable).extend({ ]) }, genContent (h: CreateElement): VNode { - const children: VNodeChildren = [this.$slots.default] - - this.close && children.push(this.genClose(h)) - return h('span', { staticClass: 'v-chip__content' - }, children) + }, [ + this.$slots.default, + this.close && this.genClose(h) + ]) } }, @@ -81,7 +80,7 @@ export default mixins(Colorable, Themeable, Toggleable).extend({ directives: [{ name: 'show', value: this.isActive - }] as any, + }], on: this.$listeners }) diff --git a/packages/vuetify/src/components/VExpansionPanel/VExpansionPanelContent.ts b/packages/vuetify/src/components/VExpansionPanel/VExpansionPanelContent.ts index 29e071beef6..11c45f2e839 100644 --- a/packages/vuetify/src/components/VExpansionPanel/VExpansionPanelContent.ts +++ b/packages/vuetify/src/components/VExpansionPanel/VExpansionPanelContent.ts @@ -99,7 +99,7 @@ export default mixins (this.hoverIndex = -1)) }, - genItem (i: number): VNode | VNodeChildrenArrayContents | string { + genItem (i: number): VNode | VNodeChildren | string { const props = this.createProps(i) if (this.$scopedSlots.item) return this.$scopedSlots.item(props) diff --git a/packages/vuetify/src/components/VSnackbar/VSnackbar.ts b/packages/vuetify/src/components/VSnackbar/VSnackbar.ts index e31b1cc61d8..5ac691e6528 100644 --- a/packages/vuetify/src/components/VSnackbar/VSnackbar.ts +++ b/packages/vuetify/src/components/VSnackbar/VSnackbar.ts @@ -5,7 +5,7 @@ import Toggleable from '../../mixins/toggleable' import { factory as PositionableFactory } from '../../mixins/positionable' import mixins from '../../util/mixins' -import { VNode, VNodeChildrenArrayContents } from 'vue' +import { VNode } from 'vue' export default mixins( Colorable, @@ -71,28 +71,22 @@ export default mixins( }, render (h): VNode { - const children: VNodeChildrenArrayContents = [] - - if (this.isActive) { - children.push( - h('div', { - staticClass: 'v-snack', - class: this.classes, - on: this.$listeners - }, [ - h('div', this.setBackgroundColor(this.color, { - staticClass: 'v-snack__wrapper' - }), [ - h('div', { - staticClass: 'v-snack__content' - }, this.$slots.default) - ]) - ]) - ) - } - return h('transition', { attrs: { name: 'v-snack-transition' } - }, children) + }, this.isActive && [ + h('div', { + staticClass: 'v-snack', + class: this.classes, + on: this.$listeners + }, [ + h('div', this.setBackgroundColor(this.color, { + staticClass: 'v-snack__wrapper' + }), [ + h('div', { + staticClass: 'v-snack__content' + }, this.$slots.default) + ]) + ]) + ]) } }) diff --git a/packages/vuetify/src/components/VTimeline/VTimelineItem.ts b/packages/vuetify/src/components/VTimeline/VTimelineItem.ts index 9ea58718e65..47907561e50 100644 --- a/packages/vuetify/src/components/VTimeline/VTimelineItem.ts +++ b/packages/vuetify/src/components/VTimeline/VTimelineItem.ts @@ -57,16 +57,12 @@ export default mixins( }, this.icon) }, genInnerDot () { - const children = [] - - this.hasIcon && children.push(this.genIcon()) - const data: VNodeData = this.setBackgroundColor(this.color) return this.$createElement('div', { staticClass: 'v-timeline-item__inner-dot', ...data - }, children) + }, [this.hasIcon && this.genIcon()]) }, genDot () { return this.$createElement('div', { @@ -80,7 +76,7 @@ export default mixins( genOpposite () { return this.$createElement('div', { staticClass: 'v-timeline-item__opposite' - }, [this.$slots.opposite]) + }, this.$slots.opposite) } }, diff --git a/packages/vuetify/src/components/VTreeview/VTreeview.ts b/packages/vuetify/src/components/VTreeview/VTreeview.ts index 204bdf79dc0..cb1e69e394d 100644 --- a/packages/vuetify/src/components/VTreeview/VTreeview.ts +++ b/packages/vuetify/src/components/VTreeview/VTreeview.ts @@ -327,7 +327,7 @@ export default mixins( const children: VNodeChildrenArrayContents = this.items.length ? this.items.map(VTreeviewNode.options.methods.genChild.bind(this)) /* istanbul ignore next */ - : this.$slots.default + : this.$slots.default! // TODO: remove type annotation with TS 3.2 return h('div', { staticClass: 'v-treeview', diff --git a/packages/vuetify/src/components/VWindow/VWindow.ts b/packages/vuetify/src/components/VWindow/VWindow.ts index 930a7fd35d6..30ce6e55c47 100644 --- a/packages/vuetify/src/components/VWindow/VWindow.ts +++ b/packages/vuetify/src/components/VWindow/VWindow.ts @@ -125,7 +125,7 @@ export default BaseItemGroup.extend({ data.directives.push({ name: 'touch', value - } as VNodeDirective) + }) } return h('div', data, [this.genContainer()]) diff --git a/packages/vuetify/src/components/VWindow/VWindowItem.ts b/packages/vuetify/src/components/VWindow/VWindowItem.ts index b6eed8f54d3..63cc760c8d6 100644 --- a/packages/vuetify/src/components/VWindow/VWindowItem.ts +++ b/packages/vuetify/src/components/VWindow/VWindowItem.ts @@ -14,12 +14,12 @@ import { ExtractVue } from './../../util/mixins' import mixins from '../../util/mixins' // Types -import Vue from 'vue' -import { VNode, VNodeDirective } from 'vue/types' +import Vue, { VNode } from 'vue' type VBaseWindow = InstanceType interface options extends Vue { + $el: HTMLElement windowGroup: VBaseWindow } @@ -139,7 +139,7 @@ export default mixins>( directives: [{ name: 'show', value: this.isActive - }] as VNodeDirective[], + }], on: this.$listeners }, this.showLazyContent(this.genDefaultSlot())) diff --git a/packages/vuetify/src/directives/resize.ts b/packages/vuetify/src/directives/resize.ts index 8fb816b1938..192ba51f45e 100644 --- a/packages/vuetify/src/directives/resize.ts +++ b/packages/vuetify/src/directives/resize.ts @@ -1,12 +1,12 @@ import { VNodeDirective } from 'vue/types/vnode' interface ResizeVNodeDirective extends VNodeDirective { - value: () => void + value?: () => void options?: boolean | AddEventListenerOptions } function inserted (el: HTMLElement, binding: ResizeVNodeDirective) { - const callback = binding.value + const callback = binding.value! const options = binding.options || { passive: true } window.addEventListener('resize', callback, options) diff --git a/packages/vuetify/src/directives/touch.ts b/packages/vuetify/src/directives/touch.ts index bac3c93d61c..4af105fd516 100644 --- a/packages/vuetify/src/directives/touch.ts +++ b/packages/vuetify/src/directives/touch.ts @@ -29,7 +29,7 @@ interface TouchWrapper extends TouchHandlers { } interface TouchVNodeDirective extends VNodeDirective { - value: TouchHandlers & { + value?: TouchHandlers & { parent?: boolean options?: AddEventListenerOptions } @@ -108,14 +108,14 @@ function createHandlers (value: TouchHandlers): TouchStoredHandlers { } function inserted (el: HTMLElement, binding: TouchVNodeDirective, vnode: VNode) { - const value = binding.value + const value = binding.value! const target = value.parent ? el.parentElement : el const options = value.options || { passive: true } // Needed to pass unit tests if (!target) return - const handlers = createHandlers(binding.value) + const handlers = createHandlers(binding.value!) target._touchHandlers = Object(target._touchHandlers) target._touchHandlers![vnode.context!._uid] = handlers @@ -125,7 +125,7 @@ function inserted (el: HTMLElement, binding: TouchVNodeDirective, vnode: VNode) } function unbind (el: HTMLElement, binding: TouchVNodeDirective, vnode: VNode) { - const target = binding.value.parent ? el.parentElement : el + const target = binding.value!.parent ? el.parentElement : el if (!target || !target._touchHandlers) return const handlers = target._touchHandlers[vnode.context!._uid] diff --git a/packages/vuetify/src/mixins/bootable.ts b/packages/vuetify/src/mixins/bootable.ts index ed03bc96b3a..d412057e8d3 100644 --- a/packages/vuetify/src/mixins/bootable.ts +++ b/packages/vuetify/src/mixins/bootable.ts @@ -37,7 +37,7 @@ export default Vue.extend().extend({ }, methods: { - showLazyContent (content: VNode[]): VNode[] | undefined { + showLazyContent (content?: VNode[]): VNode[] | undefined { return this.hasContent ? content : undefined } } diff --git a/packages/vuetify/src/mixins/dependent.ts b/packages/vuetify/src/mixins/dependent.ts index ca8a8bc7061..7bd75aa14ed 100644 --- a/packages/vuetify/src/mixins/dependent.ts +++ b/packages/vuetify/src/mixins/dependent.ts @@ -3,6 +3,7 @@ import Vue from 'vue' import mixins from '../util/mixins' interface options extends Vue { + $el: HTMLElement $refs: { content: HTMLElement } diff --git a/packages/vuetify/src/mixins/routable.ts b/packages/vuetify/src/mixins/routable.ts index 1d9d2105538..72119c84f38 100644 --- a/packages/vuetify/src/mixins/routable.ts +++ b/packages/vuetify/src/mixins/routable.ts @@ -49,7 +49,7 @@ export default Vue.extend({ directives: [{ name: 'ripple', value: this.computedRipple - }] as any, // TODO + }], [this.to ? 'nativeOn' : 'on']: { ...this.$listeners, click: this.click diff --git a/packages/vuetify/src/util/ThemeProvider.ts b/packages/vuetify/src/util/ThemeProvider.ts index 18c9866f325..0d6ca7d81a1 100644 --- a/packages/vuetify/src/util/ThemeProvider.ts +++ b/packages/vuetify/src/util/ThemeProvider.ts @@ -17,6 +17,6 @@ export default mixins(Themeable).extend({ }, render (): VNode { - return this.$slots.default! && this.$slots.default.find(node => !node.isComment && node.text !== ' ')! + return this.$slots.default! && this.$slots.default!.find(node => !node.isComment && node.text !== ' ')! } }) diff --git a/packages/vuetify/src/util/helpers.ts b/packages/vuetify/src/util/helpers.ts index b3f98434387..53023a646fc 100644 --- a/packages/vuetify/src/util/helpers.ts +++ b/packages/vuetify/src/util/helpers.ts @@ -1,12 +1,12 @@ -import { Vue } from 'vue/types/vue' +import Vue from 'vue' import { VNode, VNodeDirective, FunctionalComponentOptions } from 'vue/types' export function createSimpleFunctional ( c: string, el = 'div', name?: string -): FunctionalComponentOptions { - return { +) { + return Vue.extend({ name: name || c.replace(/__/g, '-'), functional: true, @@ -16,7 +16,7 @@ export function createSimpleFunctional ( return h(el, data, children) } - } + }) } function mergeTransitions ( diff --git a/packages/vuetify/test/unit/components/VMessages/VMessages.spec.js b/packages/vuetify/test/unit/components/VMessages/VMessages.spec.js index 4dc3ebe26e8..5faf33c0d04 100644 --- a/packages/vuetify/test/unit/components/VMessages/VMessages.spec.js +++ b/packages/vuetify/test/unit/components/VMessages/VMessages.spec.js @@ -21,7 +21,6 @@ test('VMessages.js', ({ mount }) => { await wrapper.vm.$nextTick() expect(wrapper.html()).toMatchSnapshot() - expect('Cannot read property \'split\' of undefined').toHaveBeenWarned() }) it('should allow HTML', () => { diff --git a/packages/vuetify/test/unit/components/VMessages/__snapshots__/VMessages.spec.js.snap b/packages/vuetify/test/unit/components/VMessages/__snapshots__/VMessages.spec.js.snap index 80846537cec..929aa0bc7d1 100644 --- a/packages/vuetify/test/unit/components/VMessages/__snapshots__/VMessages.spec.js.snap +++ b/packages/vuetify/test/unit/components/VMessages/__snapshots__/VMessages.spec.js.snap @@ -39,10 +39,6 @@ exports[`VMessages.js should show messages 2`] = `
bar
- diff --git a/packages/vuetifyjs.com/build/webpack.server.config.js b/packages/vuetifyjs.com/build/webpack.server.config.js index 28bbd8cc65c..a23a11aca8c 100644 --- a/packages/vuetifyjs.com/build/webpack.server.config.js +++ b/packages/vuetifyjs.com/build/webpack.server.config.js @@ -1,3 +1,4 @@ +const path = require('path') const webpack = require('webpack') const merge = require('webpack-merge') const base = require('./webpack.base.config') @@ -24,7 +25,7 @@ module.exports = merge(base, { externals: nodeExternals({ // do not externalize CSS files in case we need to import it from a dep whitelist: isProd ? undefined : /^vuetify/, - modulesFromFile: true + modulesDir: path.resolve(__dirname, '../../../node_modules') }), module: { rules: [ diff --git a/packages/vuetifyjs.com/package.json b/packages/vuetifyjs.com/package.json index 4af93cddd97..48ead6a3076 100755 --- a/packages/vuetifyjs.com/package.json +++ b/packages/vuetifyjs.com/package.json @@ -36,12 +36,11 @@ "serve-favicon": "^2.5.0", "shopify-buy": "^1.4.0", "vee-validate": "^2.1.1", - "vue": "^2.5.17", "vue-analytics": "^5.16.0", "vue-i18n": "^7.8.1", "vue-no-ssr": "^0.2.2", "vue-router": "^3.0.1", - "vue-server-renderer": "^2.5.17", + "vue-server-renderer": "^2.5.21", "vuelidate": "^0.6.2", "vuetify": "^1.3.13", "vuex": "^3.0.1", @@ -94,7 +93,6 @@ "vue-loader": "^15.4.2", "vue-prism-component": "^1.1.1", "vue-style-loader": "^4.1.2", - "vue-template-compiler": "^2.5.17", "webpack": "^4.23.1", "webpack-bundle-analyzer": "^2.13.1", "webpack-cli": "^3.1.2", diff --git a/packages/vuetifyjs.com/src/components/core/TableOfContents.vue b/packages/vuetifyjs.com/src/components/core/TableOfContents.vue index c9db1bff59c..6b29779c502 100644 --- a/packages/vuetifyjs.com/src/components/core/TableOfContents.vue +++ b/packages/vuetifyjs.com/src/components/core/TableOfContents.vue @@ -2,7 +2,7 @@ // Utilities import { goTo } from '@/util/helpers' import { mapState } from 'vuex' - import { getObjectValueByPath } from 'vuetify/es5/util/helpers' + import { getObjectValueByPath } from 'vuetify/lib/util/helpers' import upperFirst from 'lodash/upperFirst' import camelCase from 'lodash/camelCase' diff --git a/packages/vuetifyjs.com/src/components/helpers/Parameters.vue b/packages/vuetifyjs.com/src/components/helpers/Parameters.vue index 11225e32e30..f04fbf34f64 100644 --- a/packages/vuetifyjs.com/src/components/helpers/Parameters.vue +++ b/packages/vuetifyjs.com/src/components/helpers/Parameters.vue @@ -68,7 +68,7 @@ import { mapState } from 'vuex' import { capitalize, camel } from '@/util/helpers' import componentNameMap from '@/data/i18n/componentNameMap' - import { getObjectValueByPath } from 'vuetify/es5/util/helpers' + import { getObjectValueByPath } from 'vuetify/lib/util/helpers' export default { props: { diff --git a/packages/vuetifyjs.com/src/examples/scrolling/usage.vue b/packages/vuetifyjs.com/src/examples/scrolling/usage.vue index dac7c94eb39..42b27573f87 100644 --- a/packages/vuetifyjs.com/src/examples/scrolling/usage.vue +++ b/packages/vuetifyjs.com/src/examples/scrolling/usage.vue @@ -26,7 +26,7 @@