Server IP : 104.21.14.103 / Your IP : 3.145.106.127 Web Server : LiteSpeed System : Linux business53.web-hosting.com 4.18.0-553.lve.el8.x86_64 #1 SMP Mon May 27 15:27:34 UTC 2024 x86_64 User : giankuin ( 1871) PHP Version : 7.4.33 Disable Function : NONE MySQL : OFF | cURL : ON | WGET : ON | Perl : ON | Python : ON | Sudo : OFF | Pkexec : OFF Directory : /var/softaculous/sitepad/editor/site-data/plugins/pagelayer/js/react/src/components/ |
Upload File : |
import { LabelControl } from './label'; import { useState, useRef, useEffect } from '@wordpress/element'; import { ColorPicker } from '@wordpress/components'; export const AccessControl = (props) => { const { children } = props; const [isAccessVisible, setIsAccessVisible] = useState(false); const accessRef = useRef(null); useEffect(() => { const handleDocumentClick = (e) => { // Access Modal Handler if ( accessRef.current && !accessRef.current.contains(e.target) ) { setIsAccessVisible(false); } }; document.addEventListener('click', handleDocumentClick); return () => { document.removeEventListener('click', handleDocumentClick); }; }, []); const openCaret = isAccessVisible ? 'pli-caret-open': ''; return ( <div className="components-base-control pagelayer-base-control"> <LabelControl {...props} /> <div className="pagelayer-elp-access-div" ref={accessRef}> <span className="pagelayer-elp-access" onClick={() => setIsAccessVisible(!isAccessVisible)} > <i className={`pli pli-caret-right ${openCaret}`}></i> </span> {isAccessVisible && <div className="pagelayer-elp-access-holder"> { children } </div> } </div> </div> ) }