£Á°èZ¨Ä…–K§‚«“ô4“ÒÙ´dîfUÙÃÅ WKbyʦ•êŽ…È®FÒ¿ÊÎóCozá¬S@6{Í:›œêZÌ:Š•_%:¢¾¾~;‘Ã~芩ÊǍí`ÔÑ©ú뙵'5I¿fš×WO%ø9¾«¾DK|€ùÍD”Ýs]nHÕ¶êםӼ㞪éUWŸÈË%DÒÕ¬ï‘]/Åcx ‰ï2ß]ä6G[]S£Ôϯrs{úëóµmÒï#UQxo·õÞCe]"±/aÙ&Eã4ú9Jé_ÞåëdãöKë)AÞ ¯¹ægƒÛowЍø^d™ý½ßB7áyMä9ÜÖUã !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! import { useState, useEffect } from '@wordpress/element'; export const SettingTabsControl = (props) =>{ const [activeTab, setActiveTab] = useState('settings'); const tabChanged = (tab) => { setActiveTab(tab); } useEffect(() => { tabChanged(activeTab); var componentsPanel = document.querySelector('.components-panel'); componentsPanel.setAttribute('pagelayer-component-tab', activeTab); return () => { componentsPanel.removeAttribute('pagelayer-component-tab'); } }, [activeTab]); // Toggle panels handler useEffect(() => { // Default open tab var tabs = document.querySelectorAll(`.pagelayer-components-tabs`); tabs.forEach((tab) =>{ var currentOpened = tab.querySelectorAll(`.pagelayer-panel__body.is-opened`); var firstChild = tab.querySelector('.pagelayer-panel__body'); if(currentOpened.length < 1 && firstChild){ firstChild.querySelector('.components-button').click(); } }); // Panels click handler jQuery(document).on('mouseup.components_toggle_panel', '.components-panel__body', function(){ var pEle = jQuery(this); var sPanel = pEle.closest('.pl-settings'); var selector = sPanel.length > 0 ? '.pl-settings' : ':not(.pl-settings)'; var openedPanels = jQuery(selector).find('.components-panel__body.is-opened').not(pEle); openedPanels.find('.components-button').click() }); return (() => { jQuery(document).unbind('mouseup.components_toggle_panel'); }) }, []); return (
); }