# elementor/3.8.0-beta1/app/assets/js/layout/page.js

Elementor Website Builder – more than just a page builder, version 3.8.0-beta1. 58 lines.

- Page: https://pluginprobe.com/plugins/elementor/3.8.0-beta1/code/app/assets/js/layout/page.js
- Raw: https://pluginprobe.com/plugins/elementor/3.8.0-beta1/raw/app/assets/js/layout/page.js
- Modified: 2022-09-19T16:26:20+00:00

Line numbers below start at 1. Link to a line or a range by appending a fragment to the
page URL, for example `https://pluginprobe.com/plugins/elementor/3.8.0-beta1/code/app/assets/js/layout/page.js#L10-L20`.

```javascript
import Header from './header';
import Sidebar from './sidebar';
import Content from './content';
import Footer from './footer';

export default function Page( props ) {
	const AppSidebar = () => {
		if ( ! props.sidebar ) {
			return;
		}
		return (
			<Sidebar>
				{ props.sidebar }
			</Sidebar>
		);
	},
	AppFooter = () => {
		if ( ! props.footer ) {
			return;
		}
		return (
			<Footer>
				{ props.footer }
			</Footer>
		);
	};

	return (
		<div className={ `eps-app__lightbox ${ props.className }` }>
			<div className="eps-app">
				<Header title={ props.title } buttons={ props.headerButtons } titleRedirectRoute={ props.titleRedirectRoute } onClose={ () => props.onClose?.() } />
				<div className="eps-app__main">
					{ AppSidebar() }
					<Content>
						{ props.content }
					</Content>
				</div>
				{ AppFooter() }
			</div>
		</div>
	);
}

Page.propTypes = {
	title: PropTypes.string,
	titleRedirectRoute: PropTypes.string,
	className: PropTypes.string,
	headerButtons: PropTypes.arrayOf( PropTypes.object ),
	sidebar: PropTypes.object,
	content: PropTypes.object.isRequired,
	footer: PropTypes.object,
	onClose: PropTypes.func,
};

Page.defaultProps = {
	className: '',
};

```