// Shared wrapper for a wizard step and its screens, keeping the legacy classes:
// `.ssgs-tab__pane.active` plus the bounceInRight / bounceInLeft entry animations.

export const animationClass = ( direction ) => {
	if ( direction === 'next' ) {
		return ' bounceInRight';
	}
	if ( direction === 'prev' ) {
		return ' bounceInLeft';
	}
	return '';
};

const Pane = ( { direction, children } ) => (
	<div className={ `ssgs-tab__pane active${ animationClass( direction ) }` }>{ children }</div>
);

export default Pane;