import { AddNewButton, Heading, Grid, CardOverlay } from '@elementor/app-ui';
import { SiteParts } from '@elementor/site-editor';
import './add-new.scss';
import { Context as TemplatesContext } from '../context/templates';
import BackButton from '../molecules/back-button';
import useFeatureLock from 'elementor-pro-app/hooks/use-feature-lock';

export default function AddNew() {
	const { templates } = React.useContext( TemplatesContext ),
		hasTemplates = 1 <= Object.keys( templates ).length;

	const { isLocked, ConnectButton } = useFeatureLock( 'site-editor' );

	/**
	 * An hover element for each site part.
	 *
	 * @param {any} props
	 */
	const HoverElement = ( props ) => {
		if ( isLocked ) {
			return (
				<CardOverlay className="e-site-editor__promotion-overlay">
					<div className="e-site-editor__promotion-overlay__link">
						<i className="e-site-editor__promotion-overlay__icon eicon-lock" />
					</div>
				</CardOverlay>
			);
		}

		return (
			<a href={ props.urls.create } className="eps-card__image-overlay eps-add-new__overlay">
				<AddNewButton hideText={ true } />
			</a>
		);
	};

	HoverElement.propTypes = {
		urls: PropTypes.object.isRequired,
	};

	return (
		<section className="e-site-editor__add-new">
			<Grid container direction="column" className="e-site-editor__header">
				{ hasTemplates && <Grid item><BackButton /></Grid> }
				<Grid item container justify="space-between" alignItems="start">
					<Heading variant="h1">{ __( 'Start customizing every part of your site', 'elementor-pro' ) }</Heading>
					{ isLocked && <ConnectButton /> }
				</Grid>
			</Grid>
			<SiteParts hoverElement={ HoverElement } />
		</section>
	);
}
<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	
	>
<channel>
	<title>
	Comments on: 1. Introduction: Understanding Recognition and Its Role in Success	</title>
	<atom:link href="https://childrenwant2know.com/2025/08/23/1-introduction-understanding-recognition-and-its-role-in-success/feed/" rel="self" type="application/rss+xml" />
	<link>https://childrenwant2know.com/2025/08/23/1-introduction-understanding-recognition-and-its-role-in-success/</link>
	<description>Author</description>
	<lastBuildDate>Sat, 22 Nov 2025 01:03:36 +0000</lastBuildDate>
	<sy:updatePeriod>
	hourly	</sy:updatePeriod>
	<sy:updateFrequency>
	1	</sy:updateFrequency>
	<generator>https://wordpress.org/?v=6.9.4</generator>
</channel>
</rss>