import {
    createElement, //keep this createElement even we dont use it directly. bundler need it to bundle at run time
    Fragment, //keep this Fragment even we dont use it directly. bundler need it to bundle at run time
} from "@wordpress/element";
import { __ } from "@wordpress/i18n";

const ProPopup = ({ onClose }) => {
    return (
        <div className="etafe-popup-overlay">
            <div className="etafe-popup">
                <button className="etafe-btn-close" onClick={onClose}>X</button>
                <h3>{__('Unlock the PRO Features', 'elentix-addons-for-elementor')}</h3>
                <p>{__('Upgrade to Elentix Addons PRO and gain access to advanced elements and functionalities to build websites more efficiently.', 'elentix-addons-for-elementor')}</p>

                <div className="etafe-popup-actions">
                    <a
                        href="https://rstheme.com"
                        className="etafe-btn-upgrade"
                        target="_blank"
                    >
                        {__('Upgrade to Pro', 'elentix-addons-for-elementor')}
                    </a>
                </div>
            </div>
        </div>
    );
};

export default ProPopup;