Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

flowtype refactoring #4945

Merged
merged 1 commit into from
Feb 16, 2017
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
16 changes: 9 additions & 7 deletions src/core/components/keep-alive.js
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,8 @@
import { callHook } from 'core/instance/lifecycle'
import { getFirstComponentChild } from 'core/vdom/helpers/index'

type VNodeCache = { [key: string]: ?VNode };

const patternTypes: Array<Function> = [String, RegExp]

function getComponentName (opts: ?VNodeComponentOptions): ?string {
Expand All @@ -19,11 +21,11 @@ function matches (pattern: string | RegExp, name: string): boolean {
return false
}

function pruneCache (cache, filter) {
function pruneCache (cache: VNodeCache, filter: Function) {
for (const key in cache) {
const cachedNode = cache[key]
const cachedNode: ?VNode = cache[key]
if (cachedNode) {
const name = getComponentName(cachedNode.componentOptions)
const name: ?string = getComponentName(cachedNode.componentOptions)
if (name && !filter(name)) {
pruneCacheEntry(cachedNode)
cache[key] = null
Expand All @@ -32,7 +34,7 @@ function pruneCache (cache, filter) {
}
}

function pruneCacheEntry (vnode: ?MountedComponentVNode) {
function pruneCacheEntry (vnode: ?VNode) {
if (vnode) {
if (!vnode.componentInstance._inactive) {
callHook(vnode.componentInstance, 'deactivated')
Expand Down Expand Up @@ -71,17 +73,17 @@ export default {

render () {
const vnode: VNode = getFirstComponentChild(this.$slots.default)
const componentOptions = vnode && vnode.componentOptions
const componentOptions: ?VNodeComponentOptions = vnode && vnode.componentOptions
if (componentOptions) {
// check pattern
const name = getComponentName(componentOptions)
const name: ?string = getComponentName(componentOptions)
if (name && (
(this.include && !matches(this.include, name)) ||
(this.exclude && matches(this.exclude, name))
)) {
return vnode
}
const key = vnode.key == null
const key: ?string = vnode.key == null
// same constructor may get registered as different local components
// so cid alone is not enough (#3269)
? componentOptions.Ctor.cid + (componentOptions.tag ? `::${componentOptions.tag}` : '')
Expand Down
4 changes: 2 additions & 2 deletions src/core/vdom/helpers/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,6 @@ export * from './merge-hook'
export * from './update-listeners'
export * from './normalize-children'

export function getFirstComponentChild (children: ?Array<any>): ?VNodeWithData {
return children && children.filter(c => c && c.componentOptions)[0]
export function getFirstComponentChild (children: ?Array<VNode>): ?VNode {
return children && children.filter((c: VNode) => c && c.componentOptions)[0]
}
4 changes: 2 additions & 2 deletions src/core/vdom/helpers/merge-hook.js
Original file line number Diff line number Diff line change
Expand Up @@ -2,10 +2,10 @@

export function mergeVNodeHook (def: Object, hookKey: string, hook: Function, key: string) {
key = key + hookKey
const injectedHash = def.__injected || (def.__injected = {})
const injectedHash: Object = def.__injected || (def.__injected = {})
if (!injectedHash[key]) {
injectedHash[key] = true
const oldHook = def[hookKey]
const oldHook: ?Function = def[hookKey]
if (oldHook) {
def[hookKey] = function () {
oldHook.apply(this, arguments)
Expand Down
50 changes: 24 additions & 26 deletions src/platforms/web/runtime/components/transition-group.js
Original file line number Diff line number Diff line change
Expand Up @@ -34,35 +34,33 @@ export default {
props,

render (h: Function) {
const tag = this.tag || this.$vnode.data.tag || 'span'
const map = Object.create(null)
const prevChildren = this.prevChildren = this.children
const rawChildren = this.$slots.default || []
const children = this.children = []
const transitionData = extractTransitionData(this)
const tag: string = this.tag || this.$vnode.data.tag || 'span'
const map: Object = Object.create(null)
const prevChildren: Array<VNode> = this.prevChildren = this.children
const rawChildren: Array<VNode> = this.$slots.default || []
const children: Array<VNode> = this.children = []
const transitionData: Object = extractTransitionData(this)

for (let i = 0; i < rawChildren.length; i++) {
const c = rawChildren[i]
const c: VNode = rawChildren[i]
if (c.tag) {
if (c.key != null && String(c.key).indexOf('__vlist') !== 0) {
children.push(c)
map[c.key] = c
;(c.data || (c.data = {})).transition = transitionData
} else if (process.env.NODE_ENV !== 'production') {
const opts = c.componentOptions
const name = opts
? (opts.Ctor.options.name || opts.tag)
: c.tag
const opts: ?VNodeComponentOptions = c.componentOptions
const name: string = opts ? (opts.Ctor.options.name || opts.tag || '') : c.tag
warn(`<transition-group> children must be keyed: <${name}>`)
}
}
}

if (prevChildren) {
const kept = []
const removed = []
const kept: Array<VNode> = []
const removed: Array<VNode> = []
for (let i = 0; i < prevChildren.length; i++) {
const c = prevChildren[i]
const c: VNode = prevChildren[i]
c.data.transition = transitionData
c.data.pos = c.elm.getBoundingClientRect()
if (map[c.key]) {
Expand Down Expand Up @@ -90,8 +88,8 @@ export default {
},

updated () {
const children = this.prevChildren
const moveClass = this.moveClass || ((this.name || 'v') + '-move')
const children: Array<VNode> = this.prevChildren
const moveClass: string = this.moveClass || ((this.name || 'v') + '-move')
if (!children.length || !this.hasMove(children[0].elm, moveClass)) {
return
}
Expand All @@ -104,12 +102,12 @@ export default {

// force reflow to put everything in position
const body: any = document.body
const f = body.offsetHeight // eslint-disable-line
const f: number = body.offsetHeight // eslint-disable-line

children.forEach(c => {
children.forEach((c: VNode) => {
if (c.data.moved) {
var el = c.elm
var s = el.style
var el: any = c.elm
var s: any = el.style
addTransitionClass(el, moveClass)
s.transform = s.WebkitTransform = s.transitionDuration = ''
el.addEventListener(transitionEndEvent, el._moveCb = function cb (e) {
Expand Down Expand Up @@ -137,21 +135,21 @@ export default {
// transition at this very moment, we make a clone of it and remove
// all other transition classes applied to ensure only the move class
// is applied.
const clone = el.cloneNode()
const clone: HTMLElement = el.cloneNode()
if (el._transitionClasses) {
el._transitionClasses.forEach(cls => { removeClass(clone, cls) })
el._transitionClasses.forEach((cls: string) => { removeClass(clone, cls) })
}
addClass(clone, moveClass)
clone.style.display = 'none'
this.$el.appendChild(clone)
const info = getTransitionInfo(clone)
const info: Object = getTransitionInfo(clone)
this.$el.removeChild(clone)
return (this._hasMove = info.hasTransform)
}
}
}

function callPendingCbs (c) {
function callPendingCbs (c: VNode) {
/* istanbul ignore if */
if (c.elm._moveCb) {
c.elm._moveCb()
Expand All @@ -162,11 +160,11 @@ function callPendingCbs (c) {
}
}

function recordPosition (c) {
function recordPosition (c: VNode) {
c.data.newPos = c.elm.getBoundingClientRect()
}

function applyTranslation (c) {
function applyTranslation (c: VNode) {
const oldPos = c.data.pos
const newPos = c.data.newPos
const dx = oldPos.left - newPos.left
Expand Down
38 changes: 19 additions & 19 deletions src/platforms/web/runtime/components/transition.js
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@ export const transitionProps = {
// in case the child is also an abstract component, e.g. <keep-alive>
// we want to recursively retrieve the real component to be rendered
function getRealChild (vnode: ?VNode): ?VNode {
const compOptions = vnode && vnode.componentOptions
const compOptions: ?VNodeComponentOptions = vnode && vnode.componentOptions
if (compOptions && compOptions.Ctor.options.abstract) {
return getRealChild(getFirstComponentChild(compOptions.children))
} else {
Expand All @@ -38,35 +38,35 @@ function getRealChild (vnode: ?VNode): ?VNode {

export function extractTransitionData (comp: Component): Object {
const data = {}
const options = comp.$options
const options: ComponentOptions = comp.$options
// props
for (const key in options.propsData) {
data[key] = comp[key]
}
// events.
// extract listeners and pass them directly to the transition methods
const listeners = options._parentListeners
const listeners: ?Object = options._parentListeners
for (const key in listeners) {
data[camelize(key)] = listeners[key].fn
}
return data
}

function placeholder (h, rawChild) {
function placeholder (h: Function, rawChild: VNode): ?VNode {
return /\d-keep-alive$/.test(rawChild.tag)
? h('keep-alive')
: null
}

function hasParentTransition (vnode) {
function hasParentTransition (vnode: VNode): ?boolean {
while ((vnode = vnode.parent)) {
if (vnode.data.transition) {
return true
}
}
}

function isSameChild (child, oldChild) {
function isSameChild (child: VNode, oldChild: VNode): boolean {
return oldChild.key === child.key && oldChild.tag === child.tag
}

Expand All @@ -76,13 +76,13 @@ export default {
abstract: true,

render (h: Function) {
let children = this.$slots.default
let children: ?Array<VNode> = this.$slots.default
if (!children) {
return
}

// filter out text nodes (possible whitespaces)
children = children.filter(c => c.tag)
children = children.filter((c: VNode) => c.tag)
/* istanbul ignore if */
if (!children.length) {
return
Expand All @@ -97,7 +97,7 @@ export default {
)
}

const mode = this.mode
const mode: string = this.mode

// warn invalid mode
if (process.env.NODE_ENV !== 'production' &&
Expand All @@ -108,7 +108,7 @@ export default {
)
}

const rawChild = children[0]
const rawChild: VNode = children[0]

// if this is a component root node and the component's
// parent container node also has transition, skip.
Expand All @@ -118,7 +118,7 @@ export default {

// apply transition data to child
// use getRealChild() to ignore abstract components e.g. keep-alive
const child = getRealChild(rawChild)
const child: ?VNode = getRealChild(rawChild)
/* istanbul ignore if */
if (!child) {
return rawChild
Expand All @@ -131,15 +131,15 @@ export default {
// ensure a key that is unique to the vnode type and to this transition
// component instance. This key will be used to remove pending leaving nodes
// during entering.
const id = `__transition-${this._uid}-`
const key = child.key = child.key == null
const id: string = `__transition-${this._uid}-`
const key: string = child.key = child.key == null
? id + child.tag
: isPrimitive(child.key)
? (String(child.key).indexOf(id) === 0 ? child.key : id + child.key)
: child.key
const data = (child.data || (child.data = {})).transition = extractTransitionData(this)
const oldRawChild = this._vnode
const oldChild: any = getRealChild(oldRawChild)
const data: Object = (child.data || (child.data = {})).transition = extractTransitionData(this)
const oldRawChild: VNode = this._vnode
const oldChild: VNode = getRealChild(oldRawChild)

// mark v-show
// so that the transition module can hand over the control to the directive
Expand All @@ -150,7 +150,7 @@ export default {
if (oldChild && oldChild.data && !isSameChild(child, oldChild)) {
// replace old child transition data with fresh one
// important for dynamic transitions!
const oldData = oldChild && (oldChild.data.transition = extend({}, data))
const oldData: Object = oldChild && (oldChild.data.transition = extend({}, data))
// handle transition mode
if (mode === 'out-in') {
// return placeholder node and queue update when leave finishes
Expand All @@ -161,8 +161,8 @@ export default {
}, key)
return placeholder(h, rawChild)
} else if (mode === 'in-out') {
var delayedLeave
var performLeave = () => { delayedLeave() }
let delayedLeave
const performLeave = () => { delayedLeave() }
mergeVNodeHook(data, 'afterEnter', performLeave, key)
mergeVNodeHook(data, 'enterCancelled', performLeave, key)
mergeVNodeHook(oldData, 'delayLeave', leave => {
Expand Down
22 changes: 11 additions & 11 deletions src/platforms/web/runtime/transition-util.js
Original file line number Diff line number Diff line change
Expand Up @@ -88,7 +88,7 @@ export function whenTransitionEnds (
) {
const { type, timeout, propCount } = getTransitionInfo(el, expectedType)
if (!type) return cb()
const event = type === TRANSITION ? transitionEndEvent : animationEndEvent
const event: string = type === TRANSITION ? transitionEndEvent : animationEndEvent
let ended = 0
const end = () => {
el.removeEventListener(event, onEnd)
Expand Down Expand Up @@ -117,15 +117,15 @@ export function getTransitionInfo (el: Element, expectedType?: ?string): {
timeout: number;
hasTransform: boolean;
} {
const styles = window.getComputedStyle(el)
const transitioneDelays = styles[transitionProp + 'Delay'].split(', ')
const transitionDurations = styles[transitionProp + 'Duration'].split(', ')
const transitionTimeout = getTimeout(transitioneDelays, transitionDurations)
const animationDelays = styles[animationProp + 'Delay'].split(', ')
const animationDurations = styles[animationProp + 'Duration'].split(', ')
const animationTimeout = getTimeout(animationDelays, animationDurations)

let type
const styles: any = window.getComputedStyle(el)
const transitioneDelays: Array<string> = styles[transitionProp + 'Delay'].split(', ')
const transitionDurations: Array<string> = styles[transitionProp + 'Duration'].split(', ')
const transitionTimeout: number = getTimeout(transitioneDelays, transitionDurations)
const animationDelays: Array<string> = styles[animationProp + 'Delay'].split(', ')
const animationDurations: Array<string> = styles[animationProp + 'Duration'].split(', ')
const animationTimeout: number = getTimeout(animationDelays, animationDurations)

let type: ?string
let timeout = 0
let propCount = 0
/* istanbul ignore if */
Expand Down Expand Up @@ -154,7 +154,7 @@ export function getTransitionInfo (el: Element, expectedType?: ?string): {
: animationDurations.length
: 0
}
const hasTransform =
const hasTransform: boolean =
type === TRANSITION &&
transformRE.test(styles[transitionProp + 'Property'])
return {
Expand Down