import { Transition } from 'vue';
import { toNative } from 'vue-facing-decorator';
import TsxComponent, { Component } from '../../app/vuetsx';
import './css/transition.css';

interface TransitionArgs {}

@Component
class TransitionHolderComponent extends TsxComponent<TransitionArgs> implements TransitionArgs {
	render() {
		return (
			<Transition name="fade" mode="out-in">
				{this.$slots.default?.()}
			</Transition>
		);
	}
}

const TransitionHolder = toNative(TransitionHolderComponent);
export default TransitionHolder;