UNPKG

tdesign-vue-next

Version:
1 lines 7.79 kB
{"version":3,"file":"animation.mjs","sources":["../../../../components/message/utils/animation.ts"],"sourcesContent":["import { PLACEMENT_LIST } from '../consts';\n\ninterface Keyframe {\n composite?: CompositeOperationOrAuto;\n easing?: string;\n offset?: number | null;\n [property: string]: string | number | null | undefined;\n}\ntype CompositeOperationOrAuto = 'accumulate' | 'add' | 'auto' | 'replace';\n\nconst ANIMATION_OPTION = {\n duration: 200,\n easing: 'linear',\n};\n\nfunction fadeIn(dom: HTMLElement, placement: string) {\n if (!dom) return;\n const offsetWidth = dom?.offsetWidth || 0;\n const offsetHeight = dom?.offsetHeight || 0;\n const fadeInKeyframes: Array<Keyframe> | null = getFadeInKeyframes(placement, offsetWidth, offsetHeight);\n if (!fadeInKeyframes) return;\n const styleAfterFadeIn = fadeInKeyframes[fadeInKeyframes.length - 1];\n setDomStyleAfterAnimation(dom, styleAfterFadeIn);\n dom.animate && dom.animate(fadeInKeyframes, ANIMATION_OPTION);\n}\n\nfunction fadeOut(dom: HTMLElement, placement: string, onFinish: Function) {\n if (!dom) return;\n const offsetHeight = dom?.offsetHeight || 0;\n const fadeOutKeyframes: Array<Keyframe> | null = getFadeOutKeyframes(placement, offsetHeight);\n if (!fadeOutKeyframes) return onFinish();\n const styleAfterFadeOut = fadeOutKeyframes[fadeOutKeyframes.length - 1];\n setDomStyleAfterAnimation(dom, styleAfterFadeOut);\n\n const animation = dom.animate && dom.animate(fadeOutKeyframes, ANIMATION_OPTION);\n if (animation) {\n animation.onfinish = () => {\n // eslint-disable-next-line no-param-reassign\n dom.style.display = 'none';\n onFinish();\n };\n } else {\n // eslint-disable-next-line no-param-reassign\n dom.style.display = 'none';\n onFinish();\n }\n}\n\nfunction setDomStyleAfterAnimation(dom: HTMLElement, styleAfterAnimation: Keyframe) {\n const keys = Object.keys(styleAfterAnimation);\n for (let i = 0; i < keys.length; i += 1) {\n const key = keys[i];\n // @ts-ignore\n // TODO: CSSStyleDeclaration\n dom.style[key] = styleAfterAnimation[key];\n }\n}\n\nfunction getFadeInKeyframes(placement: string, offsetWidth: Number, offsetHeight: Number): Array<Keyframe> | null {\n if (!PLACEMENT_LIST.includes(placement)) return null;\n if (['top-left', 'left', 'bottom-left'].includes(placement)) {\n return [\n { opacity: 0, marginLeft: `-${offsetWidth}px` },\n { opacity: 1, marginLeft: '0' },\n ];\n }\n if (['top-right', 'right', 'bottom-right'].includes(placement)) {\n return [\n { opacity: 0, marginRight: `-${offsetWidth}px` },\n { opacity: 1, marginRight: '0' },\n ];\n }\n if (['top', 'center'].includes(placement)) {\n return [\n { opacity: 0, marginTop: `-${offsetHeight}px` },\n { opacity: 1, marginTop: '0' },\n ];\n }\n if (['bottom'].includes(placement)) {\n return [\n { opacity: 0, transform: `translate3d(0, ${offsetHeight}px, 0)` },\n { opacity: 1, transform: 'translate3d(0, 0, 0)' },\n ];\n }\n}\n\nfunction getFadeOutKeyframes(placement: string, offsetHeight: Number): Array<Keyframe> | null {\n if (!PLACEMENT_LIST.includes(placement)) return null;\n if (['bottom-left', 'bottom', 'bottom-right'].includes(placement)) {\n const marginOffset = `${offsetHeight}px`;\n return [\n { opacity: 1, marginTop: '0px' },\n { opacity: 0, marginTop: marginOffset },\n ];\n }\n const marginOffset = `-${offsetHeight}px`;\n return [\n { opacity: 1, marginTop: '0px' },\n { opacity: 0, marginTop: marginOffset },\n ];\n}\n\nexport { fadeIn, fadeOut };\n"],"names":["ANIMATION_OPTION","duration","easing","fadeIn","dom","placement","offsetWidth","offsetHeight","fadeInKeyframes","getFadeInKeyframes","styleAfterFadeIn","length","setDomStyleAfterAnimation","animate","fadeOut","onFinish","fadeOutKeyframes","getFadeOutKeyframes","styleAfterFadeOut","animation","onfinish","style","display","styleAfterAnimation","keys","Object","i","key","PLACEMENT_LIST","includes","opacity","marginLeft","concat","marginRight","marginTop","transform","marginOffset"],"mappings":"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"}