import { createNamespace , createBrandName , isDef } from '../../utils' ; import { inherit } from '../../utils/functional' ; import { preventDefault } from '../../utils/dom/event' ; import { CreateElement , RenderContext } from 'vue/types' ; import { DefaultSlots } from '../../utils/types' ; export type OverlayProps = { show ? : boolean ; zIndex ? : number | string ; duration : number | string | null ; className ? : any ; customStyle ? : any ; } ; export type OverlayEvents = { click ( event ) : void ; } ; const [ createComponent , bem ] = createNamespace ( 'overlay' ) ; function preventTouchMove ( event ) { preventDefault ( event , true ) ; } function Overlay ( h , props , _slots , ctx ) { const brandName = createBrandName ( ) ; const style = { zIndex : props . zIndex , ... props . customStyle , } ; if ( isDef ( props . duration ) ) { style . transitionDuration = `${ props . duration }s` ; } return ( < transition name = { `${ brandName }fade` } > < div vShow = { props . show } style = { style } class = { [ bem ( ) , props . className ] } onTouchmove = { preventTouchMove } { ... inherit ( ctx , true ) } /> < /transition>); } Overlay . props = { show : Boolean , duration : [ Number , String ] , className : null as any , customStyle : null as any , zIndex : { type : [ Number , String ] , default : 1 , } , } ; export default createComponent < OverlayProps , OverlayEvents > ( Overlay ) ;