38 lines
887 B
Vue
38 lines
887 B
Vue
|
import { Transition } from 'vue';
|
||
|
import type { TransitionNameType, AnimationType } from '../interface';
|
||
|
import { getMotion } from '../utils/motionUtil';
|
||
|
|
||
|
export interface MaskProps {
|
||
|
prefixCls: string;
|
||
|
visible?: boolean;
|
||
|
zIndex?: number;
|
||
|
mask?: boolean;
|
||
|
maskAnimation?: AnimationType;
|
||
|
maskTransitionName?: TransitionNameType;
|
||
|
}
|
||
|
|
||
|
export default function Mask(props: MaskProps) {
|
||
|
const { prefixCls, visible, zIndex, mask, maskAnimation, maskTransitionName } = props;
|
||
|
|
||
|
if (!mask) {
|
||
|
return null;
|
||
|
}
|
||
|
|
||
|
let motion = {};
|
||
|
|
||
|
if (maskTransitionName || maskAnimation) {
|
||
|
motion = getMotion({
|
||
|
prefixCls,
|
||
|
transitionName: maskTransitionName,
|
||
|
animation: maskAnimation,
|
||
|
});
|
||
|
}
|
||
|
|
||
|
return (
|
||
|
<Transition appear {...motion}>
|
||
|
<div v-if={visible} style={{ zIndex }} class={`${prefixCls}-mask`} />
|
||
|
</Transition>
|
||
|
);
|
||
|
}
|
||
|
Mask.displayName = 'Mask';
|