import { React, PropTypes, classnames } from '@gravityforms/libraries';

const Layout = ( {
	children = null,
	customAttributes = {},
	customClasses = {},
	tagName = 'div',
} ) => {
	const layoutProps = {
		className: classnames( {
			'gform-layout': true,
		}, customClasses ),
		'data-testid': 'gform-layout',
		...customAttributes,
	};
	const Container = tagName;

	return <Container { ...layoutProps }>{ children }</Container>;
};

Layout.propTypes = {
	children: PropTypes.oneOfType( [
		PropTypes.arrayOf( PropTypes.node ),
		PropTypes.node,
	] ),
	customAttributes: PropTypes.object,
	customClasses: PropTypes.oneOfType( [
		PropTypes.string,
		PropTypes.array,
		PropTypes.object,
	] ),
	tagName: PropTypes.string,
};

export default Layout;
