Home / File/ transition.ts — vue Source File

transition.ts — vue Source File

Architecture documentation for transition.ts, a typescript file in the vue codebase. 5 imports, 2 dependents.

File typescript WebPlatform WebRuntime 5 imports 2 dependents 8 functions

Entity Profile

Dependency Diagram

graph LR
  4092d37a_e401_1398_7538_ace18f6c50d5["transition.ts"]
  90a2398a_1498_3263_c62e_0c064dd2c9b3["index"]
  4092d37a_e401_1398_7538_ace18f6c50d5 --> 90a2398a_1498_3263_c62e_0c064dd2c9b3
  09aa5370_2caa_6b33_3f44_6ac5211bd11b["util"]
  4092d37a_e401_1398_7538_ace18f6c50d5 --> 09aa5370_2caa_6b33_3f44_6ac5211bd11b
  0b94d479_4c91_cb17_f853_bbf7580e667b["index"]
  4092d37a_e401_1398_7538_ace18f6c50d5 --> 0b94d479_4c91_cb17_f853_bbf7580e667b
  973389ac_8625_30a3_53ce_b1b48fae58c5["vnode"]
  4092d37a_e401_1398_7538_ace18f6c50d5 --> 973389ac_8625_30a3_53ce_b1b48fae58c5
  64c87498_c46a_6944_ab9d_8e45519852a8["component"]
  4092d37a_e401_1398_7538_ace18f6c50d5 --> 64c87498_c46a_6944_ab9d_8e45519852a8
  345cbf26_ec8f_2b4b_f075_66c927a0e755["index.ts"]
  345cbf26_ec8f_2b4b_f075_66c927a0e755 --> 4092d37a_e401_1398_7538_ace18f6c50d5
  f7026368_bf6f_2dd0_00ce_f887a9165898["transition-group.ts"]
  f7026368_bf6f_2dd0_00ce_f887a9165898 --> 4092d37a_e401_1398_7538_ace18f6c50d5
  style 4092d37a_e401_1398_7538_ace18f6c50d5 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

// Provides transition support for a single element/component.
// supports transition mode (out-in / in-out)

import { warn } from 'core/util/index'
import { camelize, extend, isPrimitive } from 'shared/util'
import {
  mergeVNodeHook,
  isAsyncPlaceholder,
  getFirstComponentChild
} from 'core/vdom/helpers/index'
import VNode from 'core/vdom/vnode'
import type { Component } from 'types/component'

export const transitionProps = {
  name: String,
  appear: Boolean,
  css: Boolean,
  mode: String,
  type: String,
  enterClass: String,
  leaveClass: String,
  enterToClass: String,
  leaveToClass: String,
  enterActiveClass: String,
  leaveActiveClass: String,
  appearClass: String,
  appearActiveClass: String,
  appearToClass: String,
  duration: [Number, String, Object]
}

// 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 | undefined {
  const compOptions = vnode && vnode.componentOptions
  if (compOptions && compOptions.Ctor.options.abstract) {
    return getRealChild(getFirstComponentChild(compOptions.children))
  } else {
    return vnode
  }
}

export function extractTransitionData(comp: Component): Record<string, any> {
  const data = {}
  const options = 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
  for (const key in listeners) {
    data[camelize(key)] = listeners[key]
  }
  return data
}

function placeholder(h: Function, rawChild: VNode): VNode | undefined {
  // @ts-expect-error
// ... (146 more lines)

Domain

Subdomains

Dependencies

  • component
  • index
  • index
  • util
  • vnode

Frequently Asked Questions

What does transition.ts do?
transition.ts is a source file in the vue codebase, written in typescript. It belongs to the WebPlatform domain, WebRuntime subdomain.
What functions are defined in transition.ts?
transition.ts defines 8 function(s): default.render, extractTransitionData, getRealChild, hasParentTransition, isNotTextNode, isSameChild, isVShowDirective, placeholder.
What does transition.ts depend on?
transition.ts imports 5 module(s): component, index, index, util, vnode.
What files import transition.ts?
transition.ts is imported by 2 file(s): index.ts, transition-group.ts.
Where is transition.ts in the architecture?
transition.ts is located at src/platforms/web/runtime/components/transition.ts (domain: WebPlatform, subdomain: WebRuntime, directory: src/platforms/web/runtime/components).

Analyze Your Own Codebase

Get architecture documentation, dependency graphs, and domain analysis for your codebase in minutes.

Try Supermodel Free