@empathyco/x-components/js/components/animations/create-directional-animation-factory.js

Empathy X Components

import { defineComponent, h, Transition } from 'vue';

/**
 * Abstract Factory to create animations Factory. The returned animation factory uses the
 * `animationName` parameter to create a Transition Component with that name.
 *
 * @param animationName - The name to use in the Transition Component of animation.
 * @returns The animation factory configured.
 *
 * @internal
 */
function createDirectionalAnimationFactory(animationName) {
    return (animationOrigin = 'top') => defineComponent({
        name: `transition-${animationName}-${animationOrigin}`,
        setup(_, { slots }) {
            return () => h(Transition, {
                name: `x-${animationName}--${animationOrigin} x-${animationName}-`,
            }, 
            // Vue recommends using function for better performance.
            () => slots.default?.() ?? '');
        },
    });
}

export { createDirectionalAnimationFactory };
//# sourceMappingURL=create-directional-animation-factory.js.map