king-addons / includes / widgets / Mega_Menu / Mega_Menu.php

Mega_Menu.php in King Addons for Elementor – 80+ Elementor Widgets, 4 000+ Elementor Templates, WooCommerce, Mega Menu, Popup Builder 51.1.36, at includes/widgets/Mega_Menu/Mega_Menu.php

1,357 lines 50.9 KB

Raw Download Zip

1	<?php
2
3	namespace King_Addons;
4
5	use Elementor\Widget_Base;
6	use Elementor\Controls_Manager;
7	use Elementor\Group_Control_Typography;
8	use Elementor\Group_Control_Border;
9	use Elementor\Group_Control_Box_Shadow;
10
11	if (!defined('ABSPATH')) {
12	exit; // Exit if accessed directly.
13	}
14
15
16
17	/**
18	* Class Mega_Menu
19	*
20	* Elementor Mega Menu widget for King Addons plugin.
21	*
22	* Provides a flexible, customizable mega menu for Elementor, supporting WordPress menus and (in Pro) custom menu items, advanced dropdowns, and mobile layouts.
23	*
24	* @package King_Addons
25	*/
26	class Mega_Menu extends Widget_Base
27	{
28
29
30	/**
31	* Get widget unique name.
32	*
33	* @return string Widget name.
34	*/
35	public function get_name(): string
36	{
37	return 'king-addons-mega-menu';
38	}
39
40	/**
41	* Get widget display title.
42	*
43	* @return string Widget title.
44	*/
45	public function get_title(): string
46	{
47	return esc_html__('Mega Menu', 'king-addons');
48	}
49
50	/**
51	* Get widget icon for Elementor panel.
52	*
53	* @return string Icon class.
54	*/
55	public function get_icon(): string
56	{
57	return 'king-addons-icon king-addons-mega-menu';
58	}
59
60	/**
61	* Get style dependencies for the widget.
62	*
63	* @return array List of style handles.
64	*/
65	public function get_style_depends(): array
66	{
67	return [KING_ADDONS_ASSETS_UNIQUE_KEY . '-mega-menu-style'];
68	}
69
70	/**
71	* Get script dependencies for the widget.
72	*
73	* @return array List of script handles.
74	*/
75	public function get_script_depends(): array
76	{
77	return [KING_ADDONS_ASSETS_UNIQUE_KEY . '-mega-menu-script'];
78	}
79
80	/**
81	* Get widget categories for Elementor panel.
82	*
83	* @return array List of categories.
84	*/
85	public function get_categories(): array
86	{
87	return ['king-addons'];
88	}
89
90	/**
91	* Get widget keywords for Elementor search.
92	*
93	* @return array List of keywords.
94	*/
95	public function get_keywords(): array
96	{
97	return ['menu', 'nav', 'navigation', 'header', 'navbar', 'mega', 'dropdown', 'king', 'addons', 'kingaddons', 'king-addons'];
98	}
99
100	/**
101	* Get custom help URL for the widget.
102	*
103	* @return string Help URL.
104	*/
105	public function get_custom_help_url()
106	{
107	return 'mailto:bug@kingaddons.com?subject=Bug Report - King Addons&body=Please describe the issue';
108	}
109
110	/**
111	* Get available WordPress navigation menus.
112	*
113	* @return array Associative array of menu slugs => names.
114	*/
115	public function get_wp_nav_menus(): array
116	{
117	$menus = wp_get_nav_menus();
118	$options = [];
119
120	foreach ($menus as $menu) {
121	$options[$menu->slug] = $menu->name;
122	}
123
124	return $options;
125	}
126
127	/**
128	* Placeholder for Pro: Add controls for custom menu items.
129	*
130	* In Free, shows Pro upgrade notice if 'custom' menu source is selected.
131	*
132	* @return void
133	*/
134	public function add_custom_menu_items_controls()
135	{
136
137	$this->add_control(
138	'menu_source_pro_notice',
139	[
140	'raw' => 'Custom Menu Items and Elementor Templates as dropdown content are available in the <strong><a href="https://kingaddons.com/pricing/?utm_source=kng-module-mega-menu-settings-upgrade-pro&utm_medium=plugin&utm_campaign=kng" target="_blank">Pro version</a></strong>',
141	'type' => Controls_Manager::RAW_HTML,
142	'content_classes' => 'king-addons-pro-notice',
143	'condition' => [
144	'menu_source' => 'custom',
145	]
146	]
147	);
148	}
149
150	/**
151	* Placeholder for Pro: Add controls for mobile menu layout.
152	*
153	* @return void
154	*/
155	public function add_mobile_menu_layout_controls() {}
156
157	/**
158	* Placeholder for Pro: Add advanced dropdown controls.
159	*
160	* @return void
161	*/
162	public function add_advanced_dropdown_controls() {}
163
164	public function add_advanced_dropdown_animation() {
165	// Dropdown Animation Control
166	$this->add_control(
167	'dropdown_animation',
168	[
169	'label' => esc_html__('Dropdown Animation', 'king-addons'),
170	'type' => Controls_Manager::SELECT,
171	'default' => 'fade',
172	'options' => [
173	'fade' => esc_html__('Fade', 'king-addons'),
174	'slide' => esc_html__('Slide', 'king-addons'),
175	'none' => esc_html__('None', 'king-addons'),
176	'pro-fade-up' => esc_html__('Fade Up (Pro)', 'king-addons'),
177	'pro-fade-down' => esc_html__('Fade Down (Pro)', 'king-addons'),
178	'pro-fade-left' => esc_html__('Fade Left (Pro)', 'king-addons'),
179	'pro-fade-right' => esc_html__('Fade Right (Pro)', 'king-addons'),
180	'pro-zoom-in' => esc_html__('Zoom In (Pro)', 'king-addons'),
181	'pro-zoom-out' => esc_html__('Zoom Out (Pro)', 'king-addons'),
182	],
183	]
184	);
185	}
186
187	/**
188	* Register Elementor controls for the widget.
189	*
190	* Defines all settings and style controls for the Mega Menu widget, including menu source, layout, logo, menu items, dropdown, and style options.
191	*
192	* @return void
193	*/
194	protected function register_controls()
195	{
196	$this->start_controls_section(
197	'section_mega_menu_general',
198	[
199	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('General', 'king-addons'),
200	'tab' => Controls_Manager::TAB_CONTENT,
201	]
202	);
203
204	$this->add_control(
205	'menu_source',
206	[
207	'label' => esc_html__('Menu Source', 'king-addons'),
208	'type' => Controls_Manager::SELECT,
209	'default' => 'wordpress',
210	'options' => [
211	'wordpress' => esc_html__('WordPress Menu', 'king-addons'),
212	'custom' => esc_html__('Custom Elementor Menu', 'king-addons'),
213	],
214	]
215	);
216
217	$this->add_control(
218	'wp_menu',
219	[
220	'label' => esc_html__('Select Menu', 'king-addons'),
221	'type' => Controls_Manager::SELECT,
222	'default' => array_keys($this->get_wp_nav_menus())[0] ?? '',
223	'options' => $this->get_wp_nav_menus(),
224	'condition' => [
225	'menu_source' => 'wordpress',
226	],
227	]
228	);
229
230	$this->add_control(
231	'show_logo',
232	[
233	'label' => esc_html__('Show Logo', 'king-addons'),
234	'type' => Controls_Manager::SWITCHER,
235	'default' => 'yes',
236	'label_on' => esc_html__('Yes', 'king-addons'),
237	'label_off' => esc_html__('No', 'king-addons'),
238	]
239	);
240
241	$this->add_control(
242	'logo_position',
243	[
244	'label' => esc_html__('Logo Position (Desktop)', 'king-addons'),
245	'type' => Controls_Manager::SELECT,
246	'default' => 'left',
247	'options' => [
248	'left' => esc_html__('Left', 'king-addons'),
249	'center' => esc_html__('Center Between', 'king-addons'),
250	'right' => esc_html__('Right', 'king-addons'),
251	],
252	'condition' => [
253	'show_logo' => 'yes',
254	],
255	]
256	);
257
258	$this->add_control(
259	'logo_position_tablet',
260	[
261	'label' => esc_html__('Logo Position (Tablet)', 'king-addons'),
262	'type' => Controls_Manager::SELECT,
263	'default' => 'left',
264	'options' => [
265	'left' => esc_html__('Left', 'king-addons'),
266	'center' => esc_html__('Center', 'king-addons'),
267	'right' => esc_html__('Right', 'king-addons'),
268	],
269	'condition' => [
270	'show_logo' => 'yes',
271	],
272	]
273	);
274
275	$this->add_control(
276	'logo_position_mobile',
277	[
278	'label' => esc_html__('Logo Position (Mobile)', 'king-addons'),
279	'type' => Controls_Manager::SELECT,
280	'default' => 'left',
281	'options' => [
282	'left' => esc_html__('Left', 'king-addons'),
283	'center' => esc_html__('Center', 'king-addons'),
284	'right' => esc_html__('Right', 'king-addons'),
285	],
286	'condition' => [
287	'show_logo' => 'yes',
288	],
289	]
290	);
291
292	$this->add_control(
293	'custom_logo',
294	[
295	'label' => esc_html__('Custom Logo', 'king-addons'),
296	'type' => Controls_Manager::MEDIA,
297	'default' => [
298	'url' => '',
299	],
300	'condition' => [
301	'show_logo' => 'yes',
302	],
303	]
304	);
305
306	$this->add_control(
307	'center_logo_split_at',
308	[
309	'label' => esc_html__('Split Menu After Item', 'king-addons'),
310	'type' => Controls_Manager::NUMBER,
311	'default' => 2,
312	'min' => 1,
313	'max' => 10,
314	'description' => esc_html__('Logo will be placed after this menu item number (e.g., 2 = after 2nd menu item)', 'king-addons'),
315	'condition' => [
316	'show_logo' => 'yes',
317	'logo_position' => 'center',
318	],
319	]
320	);
321
322	$this->add_control(
323	'center_logo_menu_alignment',
324	[
325	'label' => esc_html__('Menu Items Vertical Alignment', 'king-addons'),
326	'type' => Controls_Manager::SELECT,
327	'default' => 'center',
328	'options' => [
329	'start' => esc_html__('Top', 'king-addons'),
330	'center' => esc_html__('Center', 'king-addons'),
331	'end' => esc_html__('Bottom', 'king-addons'),
332	],
333	'selectors' => [
334	'{{WRAPPER}} .king-addons-logo-position-center.king-addons-mega-menu-horizontal .king-addons-menu-items' => 'align-items: {{VALUE}};',
335	],
336	'condition' => [
337	'show_logo' => 'yes',
338	'logo_position' => 'center',
339	],
340	]
341	);
342
343	$this->add_responsive_control(
344	'logo_size',
345	[
346	'label' => esc_html__('Logo Size', 'king-addons'),
347	'type' => Controls_Manager::SLIDER,
348	'size_units' => ['px', '%'],
349	'range' => [
350	'px' => [
351	'min' => 10,
352	'max' => 500,
353	],
354	'%' => [
355	'min' => 1,
356	'max' => 100,
357	],
358	],
359	'default' => [
360	'unit' => 'px',
361	'size' => 150,
362	],
363	'selectors' => [
364	'{{WRAPPER}} .king-addons-mega-menu-logo img' => 'max-width: {{SIZE}}{{UNIT}};',
365	'{{WRAPPER}} .king-addons-mega-menu-logo .king-addons-lottie-animations' => 'width: {{SIZE}}{{UNIT}}; height: {{SIZE}}{{UNIT}};',
366	'{{WRAPPER}} .king-addons-mega-menu-logo .king-addons-lottie-animations svg' => 'width: 100% !important; height: 100% !important;',
367	'{{WRAPPER}} .king-addons-mega-menu-logo .king-addons-lottie-animations canvas' => 'width: 100% !important; height: 100% !important;',
368	],
369	'condition' => [
370	'show_logo' => 'yes',
371	],
372	]
373	);
374
375	$this->add_control(
376	'menu_layout',
377	[
378	'label' => esc_html__('Menu Layout', 'king-addons'),
379	'type' => Controls_Manager::SELECT,
380	'default' => 'horizontal',
381	'options' => [
382	'horizontal' => esc_html__('Horizontal', 'king-addons'),
383	'vertical' => esc_html__('Vertical', 'king-addons'),
384	],
385	]
386	);
387
388	$this->add_control(
389	'horizontal_alignment',
390	[
391	'label' => esc_html__('Menu Alignment', 'king-addons'),
392	'type' => Controls_Manager::CHOOSE,
393	'options' => [
394	'flex-start' => [
395	'title' => esc_html__('Left', 'king-addons'),
396	'icon' => 'eicon-text-align-left',
397	],
398	'center' => [
399	'title' => esc_html__('Center', 'king-addons'),
400	'icon' => 'eicon-text-align-center',
401	],
402	'flex-end' => [
403	'title' => esc_html__('Right', 'king-addons'),
404	'icon' => 'eicon-text-align-right',
405	],
406	'space-between' => [
407	'title' => esc_html__('Justify', 'king-addons'),
408	'icon' => 'eicon-text-align-justify',
409	],
410	],
411	'default' => 'flex-end',
412	'selectors' => [
413	'{{WRAPPER}} .king-addons-mega-menu.king-addons-mega-menu-horizontal' => 'justify-content: {{VALUE}};',
414	],
415	'condition' => [
416	'menu_layout' => 'horizontal',
417	],
418	'render_type' => 'template',
419	]
420	);
421
422	$this->add_control(
423	'vertical_alignment',
424	[
425	'label' => esc_html__('Menu Alignment', 'king-addons'),
426	'type' => Controls_Manager::CHOOSE,
427	'options' => [
428	'flex-start' => [
429	'title' => esc_html__('Left', 'king-addons'),
430	'icon' => 'eicon-text-align-left',
431	],
432	'center' => [
433	'title' => esc_html__('Center', 'king-addons'),
434	'icon' => 'eicon-text-align-center',
435	],
436	'flex-end' => [
437	'title' => esc_html__('Right', 'king-addons'),
438	'icon' => 'eicon-text-align-right',
439	],
440	],
441	'default' => 'flex-start',
442	'selectors' => [
443	'{{WRAPPER}} .king-addons-mega-menu.king-addons-mega-menu-vertical .king-addons-menu-items' => 'align-items: {{VALUE}};',
444	],
445	'condition' => [
446	'menu_layout' => 'vertical',
447	],
448	'render_type' => 'template',
449	]
450	);
451
452	$this->add_mobile_menu_layout_controls();
453
454	$this->end_controls_section();
455
456	// Add Custom Menu Items Section - Only in Pro
457	$this->start_controls_section(
458	'section_mega_menu_custom_items',
459	[
460	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Custom Elementor Menu', 'king-addons'),
461	'tab' => Controls_Manager::TAB_CONTENT,
462	'condition' => [
463	'menu_source' => 'custom',
464	],
465	]
466	);
467
468	$this->add_custom_menu_items_controls();
469
470	$this->end_controls_section();
471
472	// TODO: Add dropdown settings
473	// Advanced Dropdown Settings - Only in Pro
474	$this->start_controls_section(
475	'section_mega_menu_dropdown',
476	[
477	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Dropdown Settings', 'king-addons'),
478	'tab' => Controls_Manager::TAB_CONTENT,
479	]
480	);
481
482	// TODO: Add dropdown width control
483	// $this->add_control(
484	// 'dropdown_width',
485	// [
486	// 'label' => sprintf(__('Dropdown Width %s', 'king-addons'), '<i class="eicon-pro-icon"></i>'),
487	// 'type' => Controls_Manager::SELECT,
488	// 'default' => 'default',
489	// 'options' => [
490	// 'default' => esc_html__('Default', 'king-addons'),
491	// 'custom' => esc_html__('Custom', 'king-addons'),
492	// 'full-width' => esc_html__('Full Width', 'king-addons'),
493	// ],
494	// 'classes' => 'king-addons-pro-control',
495	// ]
496	// );
497
498	$this->add_advanced_dropdown_animation();
499	$this->add_control(
500	'dropdown_animation_duration',
501	[
502	'label' => esc_html__('Animation Duration (ms)', 'king-addons'),
503	'type' => Controls_Manager::NUMBER,
504	'default' => 300,
505	'selectors' => [
506	'{{WRAPPER}} .king-addons-mega-menu .king-addons-menu-items ul.sub-menu' => 'transition-duration: {{VALUE}}ms;',
507	],
508	'condition' => [
509	'dropdown_animation!' => 'none',
510	],
511	]
512	);
513
514	$this->add_advanced_dropdown_controls();
515
516	$this->end_controls_section();
517
518	Core::renderProFeaturesSection(
519	$this,
520	Controls_Manager::TAB_CONTENT,
521	Controls_Manager::RAW_HTML,
522	'mega-menu',
523	[
524	esc_html__('Add Elementor templates as dropdown content', 'king-addons'),
525	esc_html__('Create custom menu items with icons', 'king-addons'),
526	esc_html__('Build nested dropdown menus with unlimited levels', 'king-addons'),
527	esc_html__('Advanced mobile menu layouts', 'king-addons'),
528	esc_html__('Set megamenu width and position', 'king-addons'),
529	esc_html__('Advanced transitions and animations', 'king-addons'),
530	]
531	);
532
533	// Style Sections
534	$this->start_controls_section(
535	'section_mega_menu_style',
536	[
537	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Menu Style', 'king-addons'),
538	'tab' => Controls_Manager::TAB_STYLE,
539	]
540	);
541
542	$this->add_control(
543	'menu_background',
544	[
545	'label' => esc_html__('Background (Desktop)', 'king-addons'),
546	'type' => Controls_Manager::COLOR,
547	'selectors' => [
548	'{{WRAPPER}} .king-addons-mega-menu' => 'background-color: {{VALUE}};',
549	],
550	]
551	);
552
553	$this->add_control(
554	'menu_background_tablet',
555	[
556	'label' => esc_html__('Background (Tablet)', 'king-addons'),
557	'type' => Controls_Manager::COLOR,
558	'selectors' => [
559	'(tablet){{WRAPPER}} .king-addons-mega-menu' => 'background-color: {{VALUE}};',
560	],
561	]
562	);
563
564	$this->add_control(
565	'menu_background_mobile',
566	[
567	'label' => esc_html__('Background (Mobile)', 'king-addons'),
568	'type' => Controls_Manager::COLOR,
569	'selectors' => [
570	'(mobile){{WRAPPER}} .king-addons-mega-menu' => 'background-color: {{VALUE}};',
571	],
572	]
573	);
574
575	$this->add_group_control(
576	Group_Control_Border::get_type(),
577	[
578	'name' => 'menu_border',
579	'selector' => '{{WRAPPER}} .king-addons-mega-menu',
580	]
581	);
582
583	$this->add_responsive_control(
584	'menu_border_radius',
585	[
586	'label' => esc_html__('Border Radius', 'king-addons'),
587	'type' => Controls_Manager::DIMENSIONS,
588	'size_units' => ['px', '%', 'em'],
589	'selectors' => [
590	'{{WRAPPER}} .king-addons-mega-menu' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
591	],
592	]
593	);
594
595	$this->add_responsive_control(
596	'menu_padding',
597	[
598	'label' => esc_html__('Padding', 'king-addons'),
599	'type' => Controls_Manager::DIMENSIONS,
600	'size_units' => ['px', '%', 'em'],
601	'selectors' => [
602	'{{WRAPPER}} .king-addons-mega-menu' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
603	],
604	]
605	);
606
607	$this->add_group_control(
608	Group_Control_Box_Shadow::get_type(),
609	[
610	'name' => 'menu_box_shadow',
611	'selector' => '{{WRAPPER}} .king-addons-mega-menu',
612	]
613	);
614
615
616
617
618	$this->end_controls_section();
619
620
621
622
623	// Menu Items Style
624	$this->start_controls_section(
625	'section_mega_menu_items_style',
626	[
627	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Menu Items', 'king-addons'),
628	'tab' => Controls_Manager::TAB_STYLE,
629	]
630	);
631
632	$this->add_group_control(
633	Group_Control_Typography::get_type(),
634	[
635	'name' => 'menu_item_typography',
636	'selector' => '{{WRAPPER}} .king-addons-menu-item > a, {{WRAPPER}} .king-addons-menu-items > li > a',
637	]
638	);
639
640	$this->add_responsive_control(
641	'menu_item_spacing',
642	[
643	'label' => esc_html__('Items Spacing', 'king-addons'),
644	'type' => Controls_Manager::SLIDER,
645	'range' => [
646	'px' => [
647	'min' => 0,
648	'max' => 100,
649	],
650	],
651	'selectors' => [
652	'{{WRAPPER}} .king-addons-mega-menu-horizontal .king-addons-menu-item' => 'margin-right: {{SIZE}}{{UNIT}};',
653	'{{WRAPPER}} .king-addons-mega-menu-vertical .king-addons-menu-item' => 'margin-bottom: {{SIZE}}{{UNIT}};',
654	'{{WRAPPER}} .king-addons-mega-menu-horizontal .king-addons-menu-items > li' => 'margin-right: {{SIZE}}{{UNIT}};',
655	'{{WRAPPER}} .king-addons-mega-menu-vertical .king-addons-menu-items > li' => 'margin-bottom: {{SIZE}}{{UNIT}};',
656	],
657	]
658	);
659
660	$this->add_responsive_control(
661	'menu_item_padding',
662	[
663	'label' => esc_html__('Item Padding', 'king-addons'),
664	'type' => Controls_Manager::DIMENSIONS,
665	'size_units' => ['px', 'em', '%'],
666	'selectors' => [
667	'{{WRAPPER}} .king-addons-menu-item > a' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
668	'{{WRAPPER}} .king-addons-menu-items > li > a' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
669	],
670	]
671	);
672
673	$this->start_controls_tabs('menu_item_style_tabs');
674
675	// Normal State
676	$this->start_controls_tab(
677	'menu_item_style_normal',
678	[
679	'label' => esc_html__('Normal', 'king-addons'),
680	]
681	);
682
683	$this->add_control(
684	'menu_item_text_color',
685	[
686	'label' => esc_html__('Text Color', 'king-addons'),
687	'type' => Controls_Manager::COLOR,
688	'default' => '',
689	'selectors' => [
690	'{{WRAPPER}} .king-addons-menu-item > a' => 'color: {{VALUE}};',
691	'{{WRAPPER}} .king-addons-menu-items > li > a' => 'color: {{VALUE}};',
692	],
693	]
694	);
695
696	$this->add_control(
697	'menu_item_background_color',
698	[
699	'label' => esc_html__('Background Color', 'king-addons'),
700	'type' => Controls_Manager::COLOR,
701	'selectors' => [
702	'{{WRAPPER}} .king-addons-menu-item > a' => 'background-color: {{VALUE}};',
703	'{{WRAPPER}} .king-addons-menu-items > li > a' => 'background-color: {{VALUE}};',
704	],
705	]
706	);
707
708	$this->add_group_control(
709	Group_Control_Border::get_type(),
710	[
711	'name' => 'menu_item_border',
712	'selector' => '{{WRAPPER}} .king-addons-menu-item > a, {{WRAPPER}} .king-addons-menu-items > li > a',
713	]
714	);
715
716	$this->add_responsive_control(
717	'menu_item_border_radius',
718	[
719	'label' => esc_html__('Border Radius', 'king-addons'),
720	'type' => Controls_Manager::DIMENSIONS,
721	'size_units' => ['px', '%', 'em'],
722	'selectors' => [
723	'{{WRAPPER}} .king-addons-menu-item > a' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
724	'{{WRAPPER}} .king-addons-menu-items > li > a' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
725	],
726	]
727	);
728
729	$this->end_controls_tab();
730
731	// Hover State
732	$this->start_controls_tab(
733	'menu_item_style_hover',
734	[
735	'label' => esc_html__('Hover', 'king-addons'),
736	]
737	);
738
739	$this->add_control(
740	'menu_item_text_color_hover',
741	[
742	'label' => esc_html__('Text Color', 'king-addons'),
743	'type' => Controls_Manager::COLOR,
744	'selectors' => [
745	'{{WRAPPER}} .king-addons-menu-item > a:hover' => 'color: {{VALUE}};',
746	'{{WRAPPER}} .king-addons-menu-item:hover > a' => 'color: {{VALUE}};',
747	'{{WRAPPER}} .king-addons-menu-items > li > a:hover' => 'color: {{VALUE}};',
748	'{{WRAPPER}} .king-addons-menu-items > li:hover > a' => 'color: {{VALUE}};',
749	],
750	]
751	);
752
753	$this->add_control(
754	'menu_item_background_color_hover',
755	[
756	'label' => esc_html__('Background Color', 'king-addons'),
757	'type' => Controls_Manager::COLOR,
758	'selectors' => [
759	'{{WRAPPER}} .king-addons-menu-item > a:hover' => 'background-color: {{VALUE}};',
760	'{{WRAPPER}} .king-addons-menu-item:hover > a' => 'background-color: {{VALUE}};',
761	'{{WRAPPER}} .king-addons-menu-items > li > a:hover' => 'background-color: {{VALUE}};',
762	'{{WRAPPER}} .king-addons-menu-items > li:hover > a' => 'background-color: {{VALUE}};',
763	],
764	]
765	);
766
767	$this->add_control(
768	'menu_item_border_color_hover',
769	[
770	'label' => esc_html__('Border Color', 'king-addons'),
771	'type' => Controls_Manager::COLOR,
772	'selectors' => [
773	'{{WRAPPER}} .king-addons-menu-item > a:hover' => 'border-color: {{VALUE}};',
774	'{{WRAPPER}} .king-addons-menu-item:hover > a' => 'border-color: {{VALUE}};',
775	'{{WRAPPER}} .king-addons-menu-items > li > a:hover' => 'border-color: {{VALUE}};',
776	'{{WRAPPER}} .king-addons-menu-items > li:hover > a' => 'border-color: {{VALUE}};',
777	],
778	'condition' => [
779	'menu_item_border_border!' => '',
780	],
781	]
782	);
783
784	$this->end_controls_tab();
785
786	// Active State
787	$this->start_controls_tab(
788	'menu_item_style_active',
789	[
790	'label' => esc_html__('Active', 'king-addons'),
791	]
792	);
793
794	$this->add_control(
795	'menu_item_text_color_active',
796	[
797	'label' => esc_html__('Text Color', 'king-addons'),
798	'type' => Controls_Manager::COLOR,
799	'selectors' => [
800	'{{WRAPPER}} .king-addons-menu-item.current-menu-item > a' => 'color: {{VALUE}};',
801	'{{WRAPPER}} .king-addons-menu-item.current-menu-ancestor > a' => 'color: {{VALUE}};',
802	'{{WRAPPER}} .king-addons-menu-items > li.current-menu-item > a' => 'color: {{VALUE}};',
803	'{{WRAPPER}} .king-addons-menu-items > li.current-menu-ancestor > a' => 'color: {{VALUE}};',
804	],
805	]
806	);
807
808	$this->add_control(
809	'menu_item_background_color_active',
810	[
811	'label' => esc_html__('Background Color', 'king-addons'),
812	'type' => Controls_Manager::COLOR,
813	'selectors' => [
814	'{{WRAPPER}} .king-addons-menu-item.current-menu-item > a' => 'background-color: {{VALUE}};',
815	'{{WRAPPER}} .king-addons-menu-item.current-menu-ancestor > a' => 'background-color: {{VALUE}};',
816	'{{WRAPPER}} .king-addons-menu-items > li.current-menu-item > a' => 'background-color: {{VALUE}};',
817	'{{WRAPPER}} .king-addons-menu-items > li.current-menu-ancestor > a' => 'background-color: {{VALUE}};',
818	],
819	]
820	);
821
822	$this->add_control(
823	'menu_item_border_color_active',
824	[
825	'label' => esc_html__('Border Color', 'king-addons'),
826	'type' => Controls_Manager::COLOR,
827	'selectors' => [
828	'{{WRAPPER}} .king-addons-menu-item.current-menu-item > a' => 'border-color: {{VALUE}};',
829	'{{WRAPPER}} .king-addons-menu-item.current-menu-ancestor > a' => 'border-color: {{VALUE}};',
830	'{{WRAPPER}} .king-addons-menu-items > li.current-menu-item > a' => 'border-color: {{VALUE}};',
831	'{{WRAPPER}} .king-addons-menu-items > li.current-menu-ancestor > a' => 'border-color: {{VALUE}};',
832	],
833	'condition' => [
834	'menu_item_border_border!' => '',
835	],
836	]
837	);
838
839	$this->end_controls_tab();
840
841	$this->end_controls_tabs();
842
843	$this->end_controls_section();
844
845	// Dropdown Style
846	$this->start_controls_section(
847	'section_mega_menu_dropdown_style',
848	[
849	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Dropdown Style', 'king-addons'),
850	'tab' => Controls_Manager::TAB_STYLE,
851	]
852	);
853
854	$this->add_control(
855	'dropdown_background',
856	[
857	'label' => esc_html__('Background', 'king-addons'),
858	'type' => Controls_Manager::COLOR,
859	'default' => '#fff',
860	'selectors' => [
861	'{{WRAPPER}} .king-addons-menu-items ul.sub-menu' => 'background-color: {{VALUE}};',
862	'{{WRAPPER}} .king-addons-submenu' => 'background-color: {{VALUE}};',
863	],
864	]
865	);
866
867	$this->add_group_control(
868	Group_Control_Typography::get_type(),
869	[
870	'name' => 'dropdown_typography',
871	'selector' => '{{WRAPPER}} .king-addons-menu-items ul.sub-menu li a, {{WRAPPER}} .king-addons-submenu li a',
872	]
873	);
874
875	$this->add_control(
876	'dropdown_text_color',
877	[
878	'label' => esc_html__('Text Color', 'king-addons'),
879	'type' => Controls_Manager::COLOR,
880	'selectors' => [
881	'{{WRAPPER}} .king-addons-menu-items ul.sub-menu li a' => 'color: {{VALUE}};',
882	'{{WRAPPER}} .king-addons-submenu li a' => 'color: {{VALUE}};',
883	],
884	]
885	);
886
887	$this->add_control(
888	'dropdown_text_hover_color',
889	[
890	'label' => esc_html__('Text Hover Color', 'king-addons'),
891	'type' => Controls_Manager::COLOR,
892	'selectors' => [
893	'{{WRAPPER}} .king-addons-menu-items ul.sub-menu li a:hover' => 'color: {{VALUE}};',
894	'{{WRAPPER}} .king-addons-submenu li a:hover' => 'color: {{VALUE}};',
895	],
896	]
897	);
898
899	$this->add_control(
900	'dropdown_item_hover_background',
901	[
902	'label' => esc_html__('Item Hover Background', 'king-addons'),
903	'type' => Controls_Manager::COLOR,
904	'selectors' => [
905	'{{WRAPPER}} .king-addons-menu-items ul.sub-menu li a:hover' => 'background-color: {{VALUE}};',
906	'{{WRAPPER}} .king-addons-submenu li a:hover' => 'background-color: {{VALUE}};',
907	],
908	]
909	);
910
911	$this->add_group_control(
912	Group_Control_Border::get_type(),
913	[
914	'name' => 'dropdown_border',
915	'selector' => '{{WRAPPER}} .king-addons-menu-items ul.sub-menu, {{WRAPPER}} .king-addons-submenu',
916	]
917	);
918
919	$this->add_responsive_control(
920	'dropdown_border_radius',
921	[
922	'label' => esc_html__('Border Radius', 'king-addons'),
923	'type' => Controls_Manager::DIMENSIONS,
924	'size_units' => ['px', '%', 'em'],
925	'selectors' => [
926	'{{WRAPPER}} .king-addons-menu-items ul.sub-menu' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
927	'{{WRAPPER}} .king-addons-submenu' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
928	],
929	]
930	);
931
932	$this->add_responsive_control(
933	'dropdown_padding',
934	[
935	'label' => esc_html__('Padding', 'king-addons'),
936	'type' => Controls_Manager::DIMENSIONS,
937	'size_units' => ['px', '%', 'em'],
938	'selectors' => [
939	'{{WRAPPER}} .king-addons-menu-items ul.sub-menu' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
940	'{{WRAPPER}} .king-addons-submenu' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
941	],
942	]
943	);
944
945	$this->add_group_control(
946	Group_Control_Box_Shadow::get_type(),
947	[
948	'name' => 'dropdown_box_shadow',
949	'selector' => '{{WRAPPER}} .king-addons-menu-items ul.sub-menu, {{WRAPPER}} .king-addons-submenu',
950	]
951	);
952
953	$this->end_controls_section();
954
955	// Mobile Menu Style
956	$this->start_controls_section(
957	'section_mega_menu_mobile_style',
958	[
959	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Mobile Menu', 'king-addons'),
960	'tab' => Controls_Manager::TAB_STYLE,
961	]
962	);
963
964	$this->add_control(
965	'mobile_toggle_color',
966	[
967	'label' => esc_html__('Toggle Button Color', 'king-addons'),
968	'type' => Controls_Manager::COLOR,
969	'selectors' => [
970	'{{WRAPPER}} .king-addons-mobile-menu-toggle' => 'color: {{VALUE}};',
971	],
972	]
973	);
974
975	$this->add_control(
976	'mobile_toggle_background',
977	[
978	'label' => esc_html__('Toggle Button Background', 'king-addons'),
979	'type' => Controls_Manager::COLOR,
980	'selectors' => [
981	'{{WRAPPER}} .king-addons-mobile-menu-toggle' => 'background-color: {{VALUE}};',
982	],
983	]
984	);
985
986	$this->add_control(
987	'mobile_toggle_hover_color',
988	[
989	'label' => esc_html__('Toggle Button Hover Color', 'king-addons'),
990	'type' => Controls_Manager::COLOR,
991	'selectors' => [
992	'{{WRAPPER}} .king-addons-mobile-menu-toggle:hover' => 'color: {{VALUE}};',
993	],
994	]
995	);
996
997	$this->add_control(
998	'mobile_toggle_hover_background',
999	[
1000	'label' => esc_html__('Toggle Button Hover Background', 'king-addons'),
1001	'type' => Controls_Manager::COLOR,
1002	'selectors' => [
1003	'{{WRAPPER}} .king-addons-mobile-menu-toggle:hover' => 'background-color: {{VALUE}};',
1004	],
1005	]
1006	);
1007
1008	$this->add_control(
1009	'mobile_toggle_active_color',
1010	[
1011	'label' => esc_html__('Toggle Button Active Color', 'king-addons'),
1012	'type' => Controls_Manager::COLOR,
1013	'selectors' => [
1014	'{{WRAPPER}} .king-addons-mobile-menu-toggle.active' => 'color: {{VALUE}};',
1015	],
1016	]
1017	);
1018
1019	$this->add_control(
1020	'mobile_toggle_active_background',
1021	[
1022	'label' => esc_html__('Toggle Button Active Background', 'king-addons'),
1023	'type' => Controls_Manager::COLOR,
1024	'selectors' => [
1025	'{{WRAPPER}} .king-addons-mobile-menu-toggle.active' => 'background-color: {{VALUE}};',
1026	],
1027	]
1028	);
1029
1030	$this->add_control(
1031	'mobile_menu_background',
1032	[
1033	'label' => esc_html__('Menu Background', 'king-addons'),
1034	'type' => Controls_Manager::COLOR,
1035	'selectors' => [
1036	'{{WRAPPER}} .king-addons-mobile-menu' => 'background-color: {{VALUE}};',
1037	],
1038	]
1039	);
1040
1041	$this->add_control(
1042	'mobile_menu_text_color',
1043	[
1044	'label' => esc_html__('Text Color', 'king-addons'),
1045	'type' => Controls_Manager::COLOR,
1046	'selectors' => [
1047	'{{WRAPPER}} .king-addons-mobile-menu .king-addons-menu-items a' => 'color: {{VALUE}} !important;',
1048	'{{WRAPPER}} .king-addons-mobile-menu .king-addons-menu-items li a' => 'color: {{VALUE}} !important;',
1049	],
1050	]
1051	);
1052
1053	$this->add_control(
1054	'mobile_menu_text_hover_color',
1055	[
1056	'label' => esc_html__('Text Hover Color', 'king-addons'),
1057	'type' => Controls_Manager::COLOR,
1058	'selectors' => [
1059	'{{WRAPPER}} .king-addons-mobile-menu .king-addons-menu-items a:hover' => 'color: {{VALUE}} !important;',
1060	'{{WRAPPER}} .king-addons-mobile-menu .king-addons-menu-items li a:hover' => 'color: {{VALUE}} !important;',
1061	],
1062	]
1063	);
1064
1065	$this->add_group_control(
1066	Group_Control_Typography::get_type(),
1067	[
1068	'name' => 'mobile_menu_typography',
1069	'selector' => '{{WRAPPER}} .king-addons-mobile-menu a',
1070	]
1071	);
1072
1073	$this->add_group_control(
1074	Group_Control_Border::get_type(),
1075	[
1076	'name' => 'mobile_menu_border',
1077	'selector' => '{{WRAPPER}} .king-addons-mobile-menu',
1078	]
1079	);
1080
1081	$this->add_group_control(
1082	Group_Control_Box_Shadow::get_type(),
1083	[
1084	'name' => 'mobile_menu_shadow',
1085	'selector' => '{{WRAPPER}} .king-addons-mobile-menu',
1086	]
1087	);
1088
1089	$this->end_controls_section();
1090
1091	// Logo Style
1092	$this->start_controls_section(
1093	'section_mega_menu_logo_style',
1094	[
1095	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Logo Style', 'king-addons'),
1096	'tab' => Controls_Manager::TAB_STYLE,
1097	'condition' => [
1098	'show_logo' => 'yes',
1099	],
1100	]
1101	);
1102
1103	$this->add_responsive_control(
1104	'logo_margin',
1105	[
1106	'label' => esc_html__('Margin', 'king-addons'),
1107	'type' => Controls_Manager::DIMENSIONS,
1108	'size_units' => ['px', '%', 'em'],
1109	'default' => [
1110	'top' => 0,
1111	'right' => 0,
1112	'bottom' => 0,
1113	'left' => 0,
1114	],
1115	'selectors' => [
1116	'{{WRAPPER}} .king-addons-mega-menu-logo' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1117	],
1118	]
1119	);
1120
1121	$this->add_responsive_control(
1122	'logo_padding',
1123	[
1124	'label' => esc_html__('Padding', 'king-addons'),
1125	'type' => Controls_Manager::DIMENSIONS,
1126	'size_units' => ['px', '%', 'em'],
1127	'default' => [
1128	'top' => 0,
1129	'right' => 0,
1130	'bottom' => 0,
1131	'left' => 0,
1132	],
1133	'selectors' => [
1134	'{{WRAPPER}} .king-addons-mega-menu-logo' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1135	],
1136	]
1137	);
1138
1139	$this->add_group_control(
1140	Group_Control_Border::get_type(),
1141	[
1142	'name' => 'logo_border',
1143	'selector' => '{{WRAPPER}} .king-addons-mega-menu-logo',
1144	]
1145	);
1146
1147	$this->add_responsive_control(
1148	'logo_border_radius',
1149	[
1150	'label' => esc_html__('Border Radius', 'king-addons'),
1151	'type' => Controls_Manager::DIMENSIONS,
1152	'size_units' => ['px', '%', 'em'],
1153	'selectors' => [
1154	'{{WRAPPER}} .king-addons-mega-menu-logo' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1155	],
1156	]
1157	);
1158
1159	$this->end_controls_section();
1160
1161	$this->add_menu_items_hover_effects_controls();
1162	}
1163
1164	/**
1165	* Render the widget output on the frontend.
1166	*
1167	* Outputs the Mega Menu HTML structure, including logo, menu, and mobile menu toggle. Handles both horizontal and vertical layouts, logo position, and menu source.
1168	*
1169	* @return void
1170	*/
1171	protected function render()
1172	{
1173	$settings = $this->get_settings_for_display();
1174	$menu_layout = $settings['menu_layout'];
1175	$logo_position = $settings['logo_position'];
1176	$logo_position_tablet = !empty($settings['logo_position_tablet']) ? $settings['logo_position_tablet'] : $logo_position;
1177	$logo_position_mobile = !empty($settings['logo_position_mobile']) ? $settings['logo_position_mobile'] : $logo_position;
1178	$logo_html = '';
1179
1180	if ($settings['show_logo'] === 'yes') {
1181	$site_url = get_home_url();
1182	$logo_content = '';
1183
1184	// Generate logo content
1185	if (!empty($settings['custom_logo']['url'])) {
1186	// Custom logo uploaded via Elementor
1187	$logo_content = '<img src="' . esc_url($settings['custom_logo']['url']) . '" alt="' . esc_attr(get_bloginfo('name')) . '">';
1188	} else {
1189	// Use WordPress theme logo
1190	$custom_logo_id = get_theme_mod('custom_logo');
1191	if ($custom_logo_id) {
1192	$logo_content = wp_get_attachment_image($custom_logo_id, 'full');
1193	} else {
1194	$logo_content = '<span class="site-title">' . esc_html(get_bloginfo('name')) . '</span>';
1195	}
1196	}
1197
1198	if (!empty($logo_content)) {
1199	$logo_classes = 'king-addons-mega-menu-logo';
1200	$logo_classes .= ' king-addons-logo-position-' . esc_attr($logo_position);
1201	$logo_classes .= ' king-addons-logo-position-tablet-' . esc_attr($logo_position_tablet);
1202	$logo_classes .= ' king-addons-logo-position-mobile-' . esc_attr($logo_position_mobile);
1203
1204	$logo_html = '<div class="' . esc_attr($logo_classes) . '">';
1205	$logo_html .= '<a href="' . esc_url($site_url) . '">';
1206	$logo_html .= $logo_content;
1207	$logo_html .= '</a>';
1208	$logo_html .= '</div>';
1209	}
1210	}
1211
1212	$menu_source = $settings['menu_source'];
1213	$menu_html = '';
1214	$menu_html_left = '';
1215	$menu_html_right = '';
1216
1217	if ($menu_source === 'wordpress' && !empty($settings['wp_menu'])) {
1218	$args = [
1219	'menu' => $settings['wp_menu'],
1220	'container' => false,
1221	'menu_class' => 'king-addons-menu-items',
1222	'echo' => false,
1223	'fallback_cb' => '__return_empty_string',
1224	'items_wrap' => '<ul id="%1$s" class="%2$s">%3$s</ul>',
1225	'depth' => 3,
1226	'walker' => new King_Addons_Mega_Menu_Walker_Free(),
1227	];
1228
1229	$menu_html = wp_nav_menu($args);
1230
1231	// Store split position for center logo (will be handled by JavaScript)
1232	if ($logo_position === 'center' && !empty($logo_html)) {
1233	$split_at = isset($settings['center_logo_split_at']) ? (int)$settings['center_logo_split_at'] : 2;
1234	// We'll let JavaScript handle the splitting for more reliable results
1235	}
1236	}
1237
1238	// Mobile menu toggle button
1239	$mobile_toggle = '<button class="king-addons-mobile-menu-toggle"><i class="fas fa-bars"></i></button>';
1240
1241	// Applying styles for vertical alignment
1242	$vertical_alignment_style = '';
1243	$vertical_alignment_attr = '';
1244	if ($menu_layout === 'vertical' && !empty($settings['vertical_alignment'])) {
1245	$vertical_alignment_style = ' style="align-items: ' . esc_attr($settings['vertical_alignment']) . ';"';
1246	$vertical_alignment_attr = ' data-vertical-align="' . esc_attr($settings['vertical_alignment']) . '"';
1247	}
1248
1249	// Applying styles for horizontal alignment
1250	$horizontal_alignment_attr = '';
1251	if ($menu_layout === 'horizontal' && !empty($settings['horizontal_alignment'])) {
1252	$horizontal_alignment_attr = ' data-horizontal-align="' . esc_attr($settings['horizontal_alignment']) . '"';
1253	}
1254
1255	// Add data attributes to main menu wrapper
1256	$dropdown_animation = !empty($settings['dropdown_animation']) ? $settings['dropdown_animation'] : 'fade';
1257	$dropdown_animation_attr = ' data-dropdown-animation="' . esc_attr($dropdown_animation) . '"';
1258
1259	// Add center logo data attributes for responsive positions
1260	$center_logo_attrs = '';
1261	$has_center_logo = ($logo_position === 'center' \|\| $logo_position_tablet === 'center' \|\| $logo_position_mobile === 'center');
1262
1263	if ($has_center_logo && !empty($logo_html)) {
1264	$split_at = isset($settings['center_logo_split_at']) ? (int)$settings['center_logo_split_at'] : 2;
1265	$center_logo_attrs = ' data-center-logo="true" data-split-at="' . esc_attr($split_at) . '"';
1266	$center_logo_attrs .= ' data-logo-position-desktop="' . esc_attr($logo_position) . '"';
1267	$center_logo_attrs .= ' data-logo-position-tablet="' . esc_attr($logo_position_tablet) . '"';
1268	$center_logo_attrs .= ' data-logo-position-mobile="' . esc_attr($logo_position_mobile) . '"';
1269	}
1270
1271	?>
1272	<div class="king-addons-mega-menu king-addons-mega-menu-<?php echo esc_attr($menu_layout); ?> king-addons-logo-position-<?php echo esc_attr($logo_position); ?> king-addons-logo-position-tablet-<?php echo esc_attr($logo_position_tablet); ?> king-addons-logo-position-mobile-<?php echo esc_attr($logo_position_mobile); ?>" <?php echo $vertical_alignment_attr . $horizontal_alignment_attr . $dropdown_animation_attr . $center_logo_attrs; ?>>
1273
1274	<?php if ($logo_position === 'left' && !empty($logo_html)) : ?>
1275	<?php echo $logo_html; ?>
1276	<?php endif; ?>
1277
1278	<?php if (!empty($logo_html) && ($logo_position === 'center' \|\| $logo_position_tablet === 'center' \|\| $logo_position_mobile === 'center')) : ?>
1279	<!-- Center logo will be positioned by JavaScript -->
1280	<div class="king-addons-center-logo-placeholder">
1281	<?php echo $logo_html; ?>
1282	</div>
1283	<?php endif; ?>
1284
1285	<nav class="king-addons-menu-container" <?php echo $vertical_alignment_style; ?>>
1286	<?php echo $menu_html; ?>
1287	</nav>
1288
1289	<?php if ($logo_position === 'right' && !empty($logo_html)) : ?>
1290	<?php echo $logo_html; ?>
1291	<?php endif; ?>
1292
1293	<?php echo $mobile_toggle; ?>
1294	<div class="king-addons-mobile-menu">
1295	<?php echo $menu_html; ?>
1296	</div>
1297	</div>
1298	<?php
1299	}
1300
1301	public function add_menu_items_hover_effects_controls()
1302	{
1303	$this->start_controls_section(
1304	'section_menu_items_hover_effects',
1305	[
1306	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Menu Items Hover Effects', 'king-addons'),
1307	'tab' => Controls_Manager::TAB_STYLE,
1308	]
1309	);
1310	$this->add_control(
1311	'dropdown_icon_heading',
1312	[
1313	'label' => esc_html__('Dropdown Icon', 'king-addons'),
1314	'type' => Controls_Manager::HEADING,
1315	'separator' => 'before',
1316	]
1317	);
1318	$this->add_control(
1319	'dropdown_icon_pro_notice',
1320	[
1321	'type' => Controls_Manager::RAW_HTML,
1322	'raw' => 'Dropdown icon customization is available in the <strong><a href="https://kingaddons.com/pricing/?utm_source=kng-module-mega-menu-settings-upgrade-pro&utm_medium=plugin&utm_campaign=kng" target="_blank">Pro version</a></strong>',
1323	'content_classes' => 'king-addons-pro-notice',
1324	]
1325	);
1326	$this->end_controls_section();
1327	}
1328	}
1329
1330	class King_Addons_Mega_Menu_Walker_Free extends \Walker_Nav_Menu {
1331	public function start_el( &$output, $item, $depth = 0, $args = [], $id = 0 ) {
1332	$classes = empty($item->classes) ? [] : (array) $item->classes;
1333	$is_dropdown = in_array('menu-item-has-children', $classes);
1334	$output .= '<li class="' . esc_attr(implode(' ', $classes)) . '">';
1335	$atts = [];
1336	$atts['href'] = !empty($item->url) ? $item->url : '';
1337	$atts['title'] = !empty($item->attr_title) ? $item->attr_title : '';
1338	$atts['target'] = !empty($item->target) ? $item->target : '';
1339	$atts['rel'] = !empty($item->xfn) ? $item->xfn : '';
1340	$attributes = '';
1341	foreach ($atts as $attr => $value) {
1342	if (!empty($value)) {
1343	$attributes .= ' ' . $attr . '="' . esc_attr($value) . '"';
1344	}
1345	}
1346	$output .= '<a' . $attributes . '>';
1347	$output .= '<span class="menu-item-text">' . apply_filters('the_title', $item->title, $item->ID) . '</span>';
1348	if ($is_dropdown) {
1349	$output .= '<span class="king-addons-dropdown-icon" style="margin-left:8px;"><i class="fas fa-angle-down"></i></span>';
1350	}
1351	$output .= '</a>';
1352	}
1353	public function end_el( &$output, $item, $depth = 0, $args = [] ) {
1354	$output .= '</li>';
1355	}
1356	}
1357