( function( $ ) {
	'use strict';

	/** Pro profile body widget — click-to-open style sections (shared with Pro build). */
	const PROFILE_ELEMENT_MAP = [
		{ selector: '.um-cover, .um-cover-e', section: 'section_cover' },
		{ selector: '.um-profile-photo', section: 'section_avatar' },
		{ selector: '.um-name', section: 'section_name' },
		{ selector: '.um-profile-navbar, .um-profile-nav', section: 'section_tabs' },
		{ selector: '.um-field-label, .um-field-area', section: 'section_fields' },
		{ selector: '.um-button, .um-edit-profile-btn', section: 'section_buttons' },
	];

	/** Free UM Login & Register Styler — maps DOM regions to Elementor section IDs (see um-login-register-styler.php). */
	const LOGIN_REGISTER_MAP = [
		{ selector: 'input.um-button[type="submit"], input[name="um-submit"][type="submit"]', section: 'section_button_style' },
		{ selector: 'a.um-button.um-alt', section: 'section_secondary_button_style' },
		{ selector: '.um-field-label label', section: 'section_labels_style' },
		{
			selector: '.um-field input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]), .um-field textarea, .um-field select',
			section: 'section_inputs_style',
		},
		{ selector: '.um-notice, .um-field-error', section: 'section_notices_style' },
		{ selector: 'a.um-forgot-pass, a.um-link-alt, .um-login-fields .um-link a, .um-register-fields .um-link a', section: 'section_links_style' },
		{ selector: '.um.um-login, .um.um-register', section: 'section_wrapper_style' },
	];

	/** Free Password Reset Styler — maps to section IDs in um-password-reset-styler.php. */
	const PASSWORD_RESET_MAP = [
		{ selector: '.um-password-reset input.um-button[type="submit"], .um-password-reset input[name="um-submit"][type="submit"]', section: 'section_button_style' },
		{ selector: '.um-password-reset .um-field input[type="text"], .um-password-reset .um-field input[type="email"]', section: 'section_input_style' },
		{ selector: '.um-password-reset .um-notice', section: 'section_notice_style' },
		{ selector: '.um-password-reset .um-link a, .um-password-reset .um-link', section: 'section_link_style' },
		{ selector: '.um.um-password-reset', section: 'section_wrapper_style' },
	];

	const activateSection = function( sectionId, tab ) {
		if ( ! window.elementor || ! elementor.getPanelView ) {
			return;
		}

		const panelView = elementor.getPanelView();
		if ( ! panelView || ! panelView.currentPageView ) {
			return;
		}

		const targetTab = tab || 'style';

		panelView.setPage( 'widget' );
		if ( panelView.currentPageView.ui && panelView.currentPageView.ui.tabs ) {
			panelView.currentPageView.ui.tabs.filter( '[data-tab="' + targetTab + '"]' ).trigger( 'click' );
		}
		if ( panelView.currentPageView.activateSection ) {
			panelView.currentPageView.activateSection( sectionId );
		}
	};

	const bindHints = function( $scope, map ) {
		const root = $scope && $scope[0];
		if ( ! root ) {
			return;
		}

		map.forEach( function( entry ) {
			root.querySelectorAll( entry.selector ).forEach( function( el ) {
				if ( el.dataset.umStylerBound === '1' ) {
					return;
				}

				el.dataset.umStylerBound = '1';
				el.style.cursor = 'pointer';
				el.title = 'Click to style in panel';

				el.addEventListener( 'click', function( event ) {
					event.preventDefault();
					event.stopPropagation();
					activateSection( entry.section, entry.tab );
				} );
			} );
		} );
	};

	const reflowUmInScope = function( $scope ) {
		const $directories = $scope.find( '.um-directory' );

		$directories.each( function() {
			const $directory = $( this );
			const hash = typeof um_members_get_hash === 'function' ? um_members_get_hash( $directory ) : '';

			if ( hash && Array.isArray( window.um_member_directories ) && window.um_member_directories.indexOf( hash ) === -1 ) {
				window.um_member_directories.push( hash );
			}

			if ( typeof um_slider_filter_init === 'function' ) {
				um_slider_filter_init( $directory );
			}
			if ( typeof um_datepicker_filter_init === 'function' ) {
				um_datepicker_filter_init( $directory );
			}
			if ( typeof um_timepicker_filter_init === 'function' ) {
				um_timepicker_filter_init( $directory );
			}

			if ( window.wp && wp.hooks && typeof wp.hooks.doAction === 'function' && hash ) {
				wp.hooks.doAction( 'um_member_directory_on_init', $directory, hash );
			}

			if ( typeof um_members_show_preloader === 'function' ) {
				um_members_show_preloader( $directory );
			}
			if ( typeof um_ajax_get_members === 'function' ) {
				um_ajax_get_members( $directory, { first_load: true } );
			}
			if ( typeof um_change_tag === 'function' ) {
				um_change_tag( $directory );
			}
		} );

		if ( typeof um_init_new_dropdown === 'function' ) {
			um_init_new_dropdown();
		}
		jQuery( window ).trigger( 'resize' );
		if ( window.wp && wp.hooks && typeof wp.hooks.doAction === 'function' ) {
			wp.hooks.doAction( 'um_window_resize' );
		}
	};

	$( window ).on( 'elementor/frontend/init', function() {
		if ( ! window.elementorFrontend || ! elementorFrontend.hooks ) {
			return;
		}

		elementorFrontend.hooks.addAction( 'frontend/element_ready/umep-profile-body.default', function( $scope ) {
			bindHints( $scope, PROFILE_ELEMENT_MAP );
		} );
		elementorFrontend.hooks.addAction( 'frontend/element_ready/umep-member-directory-styler.default', reflowUmInScope );
		elementorFrontend.hooks.addAction( 'frontend/element_ready/um-login-register-styler.default', function( $scope ) {
			bindHints( $scope, LOGIN_REGISTER_MAP );
		} );
		elementorFrontend.hooks.addAction( 'frontend/element_ready/um-password-reset-styler.default', function( $scope ) {
			bindHints( $scope, PASSWORD_RESET_MAP );
		} );
	} );
}( jQuery ) );
