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

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

1,564 lines 59.5 KB

Raw Download Zip

1	<?php
2
3	namespace King_Addons;
4
5	use Elementor;
6	use Elementor\Controls_Manager;
7	use Elementor\Group_Control_Typography;
8	use Elementor\Group_Control_Image_Size;
9	use Elementor\Group_Control_Box_Shadow;
10	use Elementor\Plugin;
11	use Elementor\Repeater;
12	use Elementor\Widget_Base;
13
14	if (!defined('ABSPATH')) {
15	exit;
16	}
17
18	class Tabs extends Widget_Base
19	{
20
21
22
23	public function get_name()
24	{
25	return 'king-addons-tabs';
26	}
27
28	public function get_title()
29	{
30	return esc_html__('Tabs', 'king-addons');
31	}
32
33	public function get_icon()
34	{
35	return 'king-addons-icon king-addons-tabs';
36	}
37
38	public function get_categories()
39	{
40	return ['king-addons'];
41	}
42
43	public function get_keywords()
44	{
45	return ['king addons', 'king', 'addons', 'kingaddons', 'king-addons', 'vertical',
46	'horizontal', 'accor', 'tab', 'tabs', 'vertical tabs', 'horizontal tabs', 'accordion'];
47	}
48
49	public function get_script_depends()
50	{
51	return [
52	KING_ADDONS_ASSETS_UNIQUE_KEY . '-tabs-script'
53	];
54	}
55
56	public function get_style_depends()
57	{
58	return [
59	KING_ADDONS_ASSETS_UNIQUE_KEY . '-animation-button',
60	KING_ADDONS_ASSETS_UNIQUE_KEY . '-animation-general',
61	KING_ADDONS_ASSETS_UNIQUE_KEY . '-animation-timing',
62	KING_ADDONS_ASSETS_UNIQUE_KEY . '-animation-loading',
63	KING_ADDONS_ASSETS_UNIQUE_KEY . '-tabs-style'
64	];
65	}
66
67	public function get_custom_help_url()
68	{
69	return 'mailto:bug@kingaddons.com?subject=Bug Report - King Addons&body=Please describe the issue';
70	}
71
72	public function has_widget_inner_wrapper(): bool {
73	return true;
74	}
75
76	public function add_repeater_args_tab_custom_color()
77	{
78	return [
79	'label' => sprintf(__('Use custom colors for this tab %s', 'king-addons'), '<i class="eicon-pro-icon"></i>'),
80	'type' => Controls_Manager::SWITCHER,
81	'separator' => 'before',
82	'classes' => 'king-addons-pro-control'
83	];
84	}
85
86	public function add_repeater_args_tab_content_type()
87	{
88	return [
89	'label' => esc_html__('Content Type', 'king-addons'),
90	'type' => Controls_Manager::SELECT,
91	'default' => 'editor',
92	'options' => [
93	'editor' => esc_html__('Editor', 'king-addons'),
94	'pro-cf' => esc_html__('Custom Field (Pro)', 'king-addons'),
95	'pro-tmp' => esc_html__('Elementor Template (Pro)', 'king-addons'),
96	],
97	'separator' => 'before',
98	];
99	}
100
101	public function add_control_tabs_hr_position()
102	{
103	$this->add_control(
104	'tabs_hr_position',
105	[
106	'label' => esc_html__('Horizontal Align', 'king-addons'),
107	'type' => Controls_Manager::CHOOSE,
108	'label_block' => false,
109	'default' => 'justify',
110	'options' => [
111	'pro-lt' => [
112	'title' => esc_html__('Left (Pro)', 'king-addons'),
113	'icon' => 'eicon-h-align-left',
114	],
115	'pro-ct' => [
116	'title' => esc_html__('Center (Pro)', 'king-addons'),
117	'icon' => 'eicon-h-align-center',
118	],
119	'pro-rt' => [
120	'title' => esc_html__('Right (Pro)', 'king-addons'),
121	'icon' => 'eicon-h-align-right',
122	],
123	'justify' => [
124	'title' => esc_html__('Stretch', 'king-addons'),
125	'icon' => 'eicon-h-align-stretch',
126	],
127	],
128	'prefix_class' => 'king-addons-tabs-hr-position-',
129	'render_type' => 'template',
130	'condition' => [
131	'tabs_position' => 'above',
132	],
133	]
134	);
135	}
136
137	public function add_section_settings()
138	{
139	}
140
141	protected function register_controls()
142	{
143
144
145	$css_selector = [
146	'general' => '> .elementor-widget-container > .king-addons-tabs',
147	'control_list' => '> .elementor-widget-container > .king-addons-tabs > .king-addons-tabs-wrap > .king-addons-tab',
148	'content_wrap' => '> .elementor-widget-container > .king-addons-tabs > .king-addons-tabs-content-wrap',
149	'content_list' => '> .elementor-widget-container > .king-addons-tabs > .king-addons-tabs-content-wrap > .king-addons-tab-content',
150	'control_icon' => '.king-addons-tab-icon',
151	'control_image' => '.king-addons-tab-image',
152	];
153
154
155	$this->start_controls_section(
156	'section_tabs',
157	[
158	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Tabs', 'king-addons'),
159	]
160	);
161
162
163	$repeater = new Repeater();
164
165	$repeater->add_control(
166	'tab_title',
167	[
168	'label' => esc_html__('Label', 'king-addons'),
169	'type' => Controls_Manager::TEXT,
170	'dynamic' => [
171	'active' => true,
172	],
173	'default' => 'Tab 1',
174	]
175	);
176
177	$repeater->add_control(
178	'tab_icon_type',
179	[
180	'label' => esc_html__('Icon Type', 'king-addons'),
181	'type' => Controls_Manager::SELECT,
182	'default' => 'none',
183	'options' => [
184	'none' => esc_html__('None', 'king-addons'),
185	'icon' => esc_html__('Icon', 'king-addons'),
186	'image' => esc_html__('Image', 'king-addons'),
187	],
188	'separator' => 'before',
189	]
190	);
191
192	$repeater->add_control(
193	'tab_image',
194	[
195	'label' => esc_html__('Upload Image', 'king-addons'),
196	'type' => Controls_Manager::MEDIA,
197	'dynamic' => [
198	'active' => true,
199	],
200	'condition' => [
201	'tab_icon_type' => 'image',
202	],
203	]
204	);
205
206	$repeater->add_control(
207	'tab_icon',
208	[
209	'label' => esc_html__('Select Icon', 'king-addons'),
210	'type' => Controls_Manager::ICONS,
211	'skin' => 'inline',
212	'label_block' => false,
213	'default' => [
214	'value' => 'far fa-star',
215	'library' => 'fa-regular',
216	],
217	'condition' => [
218	'tab_icon_type' => 'icon',
219	],
220	]
221	);
222
223	$repeater->add_control('tab_content_type', $this->add_repeater_args_tab_content_type());
224
225	Core::renderUpgradeProNotice($repeater, Controls_Manager::RAW_HTML, 'tabs', 'tab_content_type', ['pro-tmp', 'pro-cf']);
226
227	if (king_addons_freemius()->can_use_premium_code__premium_only()) {
228	$repeater->add_control(
229	'tab_custom_field',
230	[
231	'label' => esc_html__('Select Custom Field', 'king-addons'),
232	'type' => 'king-addons-ajax-select2',
233	'label_block' => true,
234	'default' => 'default',
235	'description' => '<strong>Note:</strong> This option only accepts String(Text) or Numeric Custom Field Values.',
236	'options' => 'ajaxselect2/getCustomMetaKeys',
237	'condition' => [
238	'tab_content_type' => 'acf'
239	],
240	]
241	);
242	}
243
244	$repeater->add_control(
245	'select_template',
246	[
247	'label' => esc_html__('Select Template', 'king-addons'),
248	'type' => 'king-addons-ajax-select2',
249	'options' => 'ajaxselect2/getElementorTemplates',
250	'label_block' => true,
251	'condition' => [
252	'tab_content_type' => 'template',
253	],
254	]
255	);
256
257	$repeater->add_control('tab_custom_color', $this->add_repeater_args_tab_custom_color());
258
259	$repeater->add_control(
260	'tab_custom_text_color',
261	[
262	'label' => esc_html__('Text Color', 'king-addons'),
263	'type' => Controls_Manager::COLOR,
264	'default' => '#ffffff',
265	'selectors' => [
266	'{{WRAPPER}} ' . $css_selector['control_list'] . '{{CURRENT_ITEM}} .king-addons-tab-title' => 'color: {{VALUE}} !important;',
267	'{{WRAPPER}} ' . $css_selector['control_list'] . '{{CURRENT_ITEM}} .king-addons-tab-icon' => 'color: {{VALUE}} !important;',
268	'{{WRAPPER}} ' . $css_selector['content_list'] . '{{CURRENT_ITEM}}' => 'color: {{VALUE}} !important;',
269	'{{WRAPPER}} ' . $css_selector['control_list'] . '{{CURRENT_ITEM}}:before' => 'display: none !important;',
270	],
271	'condition' => [
272	'tab_custom_color' => 'yes',
273	],
274	]
275	);
276
277	$repeater->add_control(
278	'tab_custom_bg_color',
279	[
280	'label' => esc_html__('Background Color', 'king-addons'),
281	'type' => Controls_Manager::COLOR,
282	'default' => '#61ce70',
283	'selectors' => [
284	'{{WRAPPER}} ' . $css_selector['control_list'] . '{{CURRENT_ITEM}}' => 'background-color: {{VALUE}} !important;',
285	'{{WRAPPER}} ' . $css_selector['content_list'] . '{{CURRENT_ITEM}}' => 'background-color: {{VALUE}} !important;',
286	],
287	'condition' => [
288	'tab_custom_color' => 'yes',
289	],
290	]
291	);
292
293	$repeater->add_control(
294	'tab_content',
295	[
296	'label' => esc_html__('Content', 'king-addons'),
297	'type' => Controls_Manager::WYSIWYG,
298	'placeholder' => esc_html__('Tab Content', 'king-addons'),
299	'separator' => 'before',
300	'default' => 'Lorem ipsum dolor sit amet, consectetur adipisicing elit. Minima incidunt voluptates nemo, dolor optio quia architecto quis delectus perspiciatis. Nobis atque id hic neque possimus voluptatum voluptatibus tenetur, perspiciatis consequuntur.',
301	'condition' => [
302	'tab_content_type' => 'editor',
303	],
304	]
305	);
306
307	$this->add_control(
308	'tabs',
309	[
310	'type' => Controls_Manager::REPEATER,
311	'fields' => $repeater->get_controls(),
312	'default' => [
313	[
314	'tab_title' => 'Tab 1',
315	'tab_custom_bg_color' => '#000000',
316	'tab_content' => 'Tab 1 content. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Minima incidunt voluptates nemo, dolor optio quia architecto quis delectus perspiciatis. Nobis atque id hic neque possimus voluptatum voluptatibus tenetur, perspiciatis consequuntur.',
317	],
318	[
319	'tab_title' => 'Tab 2',
320	'tab_custom_bg_color' => '#FF3F62',
321	'tab_content' => 'Tab two. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Minima incidunt voluptates nemo, dolor optio quia architecto quis delectus perspiciatis. Nobis atque id hic neque possimus voluptatum voluptatibus tenetur, perspiciatis consequuntur.',
322	],
323	[
324	'tab_title' => 'Tab 3',
325	'tab_custom_bg_color' => '#384FFF',
326	'tab_content' => 'Tab three content. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Minima incidunt voluptates nemo, dolor optio quia architecto quis delectus perspiciatis. Nobis atque id hic neque possimus voluptatum voluptatibus tenetur, perspiciatis consequuntur.',
327	]
328	],
329	'title_field' => '{{ tab_title }}',
330	]
331	);
332
333
334	if (!king_addons_freemius()->can_use_premium_code__premium_only()) {
335	$this->add_control(
336	'tabs_repeater_pro_notice',
337	[
338	'type' => Controls_Manager::RAW_HTML,
339	'raw' => 'More than 3 Tabs are available<br> in the <strong><a href="https://kingaddons.com/pricing/?utm_source=kng-module-tabs-settings-upgrade-pro&utm_medium=plugin&utm_campaign=kng" target="_blank">Pro version</a></strong>',
340
341	'content_classes' => 'king-addons-pro-notice',
342	]
343	);
344	}
345
346	$this->add_control(
347	'tabs_position',
348	[
349	'type' => Controls_Manager::SELECT,
350	'label' => esc_html__('Label Position', 'king-addons'),
351	'default' => 'above',
352	'options' => [
353	'above' => esc_html__('Default', 'king-addons'),
354	'left' => esc_html__('Left', 'king-addons'),
355	'right' => esc_html__('Right', 'king-addons'),
356	],
357	'prefix_class' => 'king-addons-tabs-position-',
358	'separator' => 'before',
359	]
360	);
361
362	$this->add_control(
363	'tabs_invert_responsive',
364	[
365	'label' => esc_html__('Invert on Mobile', 'king-addons'),
366	'type' => Controls_Manager::SWITCHER,
367	'prefix_class' => 'king-addons-tabs-responsive-',
368	]
369	);
370
371	$this->add_control_tabs_hr_position();
372
373	if (!king_addons_freemius()->can_use_premium_code__premium_only()) {
374	$this->add_control(
375	'tabs_align_pro_notice',
376	[
377	'raw' => 'Horizontal Align option is fully supported in the <strong><a href="https://kingaddons.com/pricing/?utm_source=kng-module-tabs-settings-upgrade-pro&utm_medium=plugin&utm_campaign=kng" target="_blank">Pro version</a></strong>',
378	'type' => Controls_Manager::RAW_HTML,
379	'content_classes' => 'king-addons-pro-notice',
380	'condition' => [
381	'tabs_hr_position!' => 'justify',
382	],
383	]
384	);
385	}
386
387	$this->add_control(
388	'tabs_vr_position',
389	[
390	'label' => esc_html__('Vertical Align', 'king-addons'),
391	'type' => Controls_Manager::CHOOSE,
392	'label_block' => false,
393	'default' => 'top',
394	'options' => [
395	'top' => [
396	'title' => esc_html__('Top', 'king-addons'),
397	'icon' => 'eicon-v-align-top',
398	],
399	'middle' => [
400	'title' => esc_html__('Middle', 'king-addons'),
401	'icon' => 'eicon-v-align-middle',
402	],
403	'bottom' => [
404	'title' => esc_html__('Bottom', 'king-addons'),
405	'icon' => 'eicon-v-align-bottom',
406	],
407	],
408	'selectors_dictionary' => [
409	'top' => 'flex-start',
410	'middle' => 'center',
411	'bottom' => 'flex-end'
412	],
413	'selectors' => [
414	'{{WRAPPER}} ' . $css_selector['general'] => '-webkit-align-items: {{VALUE}};align-items: {{VALUE}};',
415	],
416	'condition' => [
417	'tabs_position!' => 'above',
418	],
419	]
420	);
421
422	$this->add_control(
423	'text_align',
424	[
425	'label' => esc_html__('Label Alignment', 'king-addons'),
426	'type' => Controls_Manager::CHOOSE,
427	'default' => 'center',
428	'label_block' => false,
429	'options' => [
430	'left' => [
431	'title' => esc_html__('Left', 'king-addons'),
432	'icon' => 'eicon-text-align-left',
433	],
434	'center' => [
435	'title' => esc_html__('Center', 'king-addons'),
436	'icon' => 'eicon-text-align-center',
437	],
438	'right' => [
439	'title' => esc_html__('Right', 'king-addons'),
440	'icon' => 'eicon-text-align-right',
441	],
442	],
443	'selectors_dictionary' => [
444	'left' => 'flex-start',
445	'center' => 'center',
446	'right' => 'flex-end'
447	],
448	'selectors' => [
449	'{{WRAPPER}}.king-addons-tabs-icon-position-left ' . $css_selector['control_list'] => '-webkit-justify-content: {{VALUE}};justify-content: {{VALUE}};',
450	'{{WRAPPER}}.king-addons-tabs-icon-position-center ' . $css_selector['control_list'] => '-webkit-align-items: {{VALUE}};align-items: {{VALUE}};',
451	'{{WRAPPER}}.king-addons-tabs-icon-position-right ' . $css_selector['control_list'] => '-webkit-justify-content: {{VALUE}};justify-content: {{VALUE}};',
452	],
453	'separator' => 'before',
454	]
455	);
456
457	$this->add_responsive_control(
458	'tabs_width',
459	[
460	'label' => esc_html__('Label Width', 'king-addons'),
461	'type' => Controls_Manager::SLIDER,
462	'size_units' => ['px', '%'],
463	'range' => [
464	'px' => [
465	'min' => 0,
466	'max' => 600,
467	],
468	'%' => [
469	'min' => 10,
470	'max' => 100
471	]
472	],
473	'default' => [
474	'unit' => 'px',
475	'size' => 70,
476	],
477	'selectors' => [
478	'{{WRAPPER}} ' . $css_selector['control_list'] => 'min-width: {{SIZE}}{{UNIT}};',
479	],
480	'separator' => 'before'
481	]
482	);
483
484	$this->add_control(
485	'tabs_icon_section',
486	[
487	'label' => esc_html__('Icon', 'king-addons'),
488	'type' => Controls_Manager::HEADING,
489	'separator' => 'before',
490	]
491	);
492
493	$this->add_control(
494	'tabs_icon_position',
495	[
496	'label' => esc_html__('Position', 'king-addons'),
497	'type' => Controls_Manager::CHOOSE,
498	'label_block' => false,
499	'default' => 'left',
500	'options' => [
501	'left' => [
502	'title' => esc_html__('Left', 'king-addons'),
503	'icon' => 'eicon-h-align-left',
504	],
505	'center' => [
506	'title' => esc_html__('Center', 'king-addons'),
507	'icon' => 'eicon-h-align-center',
508	],
509	'right' => [
510	'title' => esc_html__('Right', 'king-addons'),
511	'icon' => 'eicon-h-align-right',
512	],
513	],
514	'prefix_class' => 'king-addons-tabs-icon-position-',
515	]
516	);
517
518	$this->add_responsive_control(
519	'tabs_icon_distance',
520	[
521	'label' => esc_html__('Distance', 'king-addons'),
522	'type' => Controls_Manager::SLIDER,
523	'size_units' => ['px'],
524	'range' => [
525	'px' => [
526	'min' => 0,
527	'max' => 100,
528	],
529	],
530	'default' => [
531	'unit' => 'px',
532	'size' => 5,
533	],
534	'selectors' => [
535	'{{WRAPPER}}.king-addons-tabs-icon-position-left ' . $css_selector['control_list'] . ' ' . $css_selector['control_icon'] => 'margin-right: {{SIZE}}{{UNIT}};',
536	'{{WRAPPER}}.king-addons-tabs-icon-position-right ' . $css_selector['control_list'] . ' ' . $css_selector['control_icon'] => 'margin-left: {{SIZE}}{{UNIT}};',
537	'{{WRAPPER}}.king-addons-tabs-icon-position-center ' . $css_selector['control_list'] . ' ' . $css_selector['control_icon'] => 'margin-bottom: {{SIZE}}{{UNIT}};',
538	'{{WRAPPER}}.king-addons-tabs-icon-position-left ' . $css_selector['control_list'] . ' ' . $css_selector['control_image'] => 'margin-right: {{SIZE}}{{UNIT}};',
539	'{{WRAPPER}}.king-addons-tabs-icon-position-right ' . $css_selector['control_list'] . ' ' . $css_selector['control_image'] => 'margin-left: {{SIZE}}{{UNIT}};',
540	'{{WRAPPER}}.king-addons-tabs-icon-position-center ' . $css_selector['control_list'] . ' ' . $css_selector['control_image'] => 'margin-bottom: {{SIZE}}{{UNIT}};',
541	],
542	]
543	);
544
545	$this->add_group_control(
546	Group_Control_Image_Size::get_type(),
547	[
548	'name' => 'tabs_image_size',
549	'default' => 'full',
550	'separator' => 'before'
551	]
552	);
553
554	$this->end_controls_section();
555
556
557	$this->add_section_settings();
558
559
560	Core::renderProFeaturesSection($this, '', Controls_Manager::RAW_HTML, 'tabs', [
561	'Add Unlimited Tabs',
562	'Tab Content Type - Elementor Template',
563	'Tab Content Type - Custom Fields',
564	'Set Active Tab by Default',
565	'Switch Tabs on Hover Option',
566	'Tabs Autoplay Option',
567	'Custom Tab Colors',
568	'Tab Label Align',
569	'Advanced Tab Content Animations'
570	]);
571
572
573	$this->start_controls_section(
574	'section_style_tabs',
575	[
576	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Labels', 'king-addons'),
577	'tab' => Controls_Manager::TAB_STYLE,
578	]
579	);
580
581	$this->start_controls_tabs('tab_style');
582
583	$this->start_controls_tab(
584	'tab_normal_style',
585	[
586	'label' => esc_html__('Normal', 'king-addons'),
587	]
588	);
589
590	$this->add_control(
591	'tab_color',
592	[
593	'label' => esc_html__('Color', 'king-addons'),
594	'type' => Controls_Manager::COLOR,
595	'default' => '#7a7a7a',
596	'selectors' => [
597	'{{WRAPPER}} ' . $css_selector['control_list'] . ' .king-addons-tab-title' => 'color: {{VALUE}}',
598	],
599	]
600	);
601
602	$this->add_control(
603	'tab_icon_color',
604	[
605	'label' => esc_html__('Icon Color', 'king-addons'),
606	'type' => Controls_Manager::COLOR,
607	'default' => '#7a7a7a',
608	'selectors' => [
609	'{{WRAPPER}} ' . $css_selector['control_list'] . ' ' . $css_selector['control_icon'] => 'color: {{VALUE}}',
610	],
611	]
612	);
613
614	$this->add_control(
615	'tab_bg_color',
616	[
617	'label' => esc_html__('Background Color', 'king-addons'),
618	'type' => Controls_Manager::COLOR,
619	'default' => '#ffffff',
620	'selectors' => [
621	'{{WRAPPER}} ' . $css_selector['control_list'] => 'background-color: {{VALUE}}',
622	],
623	]
624	);
625
626	$this->add_control(
627	'tab_border_color',
628	[
629	'label' => esc_html__('Border Color', 'king-addons'),
630	'type' => Controls_Manager::COLOR,
631	'default' => '#ffffff',
632	'selectors' => [
633	'{{WRAPPER}} ' . $css_selector['control_list'] => 'border-color: {{VALUE}}',
634	],
635	]
636	);
637
638	$this->add_group_control(
639	Group_Control_Box_Shadow::get_type(),
640	[
641	'name' => 'tab_box_shadow',
642	'selector' => '{{WRAPPER}} ' . $css_selector['control_list'],
643	]
644	);
645
646	$this->add_control(
647	'tab_typography_divider',
648	[
649	'type' => Controls_Manager::DIVIDER,
650	'style' => 'thick',
651	]
652	);
653
654	$this->add_group_control(
655	Group_Control_Typography::get_type(),
656	[
657	'name' => 'tab_typography',
658	'selector' => '{{WRAPPER}} ' . $css_selector['control_list'] . ' .king-addons-tab-title',
659	]
660	);
661
662	$this->add_responsive_control(
663	'tab_icon_size',
664	[
665	'label' => esc_html__('Icon Size', 'king-addons'),
666	'type' => Controls_Manager::SLIDER,
667	'size_units' => ['px'],
668	'range' => [
669	'px' => [
670	'min' => 0,
671	'max' => 100,
672	],
673	],
674	'default' => [
675	'unit' => 'px',
676	'size' => 15,
677	],
678	'selectors' => [
679	'{{WRAPPER}} ' . $css_selector['control_list'] . ' .king-addons-tab-icon i' => 'font-size: {{SIZE}}{{UNIT}};',
680	'{{WRAPPER}} ' . $css_selector['control_list'] . ' .king-addons-tab-icon svg' => 'width: {{SIZE}}{{UNIT}}; height: {{SIZE}}{{UNIT}};',
681	'{{WRAPPER}} ' . $css_selector['control_list'] . ' .king-addons-tab-image' => 'width: {{SIZE}}{{UNIT}};',
682	],
683	'separator' => 'before',
684	]
685	);
686
687	$this->add_responsive_control(
688	'tab_padding',
689	[
690	'label' => esc_html__('Padding', 'king-addons'),
691	'type' => Controls_Manager::DIMENSIONS,
692	'size_units' => ['px'],
693	'default' => [
694	'top' => 10,
695	'right' => 10,
696	'bottom' => 10,
697	'left' => 10,
698	],
699	'selectors' => [
700	'{{WRAPPER}} ' . $css_selector['control_list'] => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
701	],
702	'separator' => 'before',
703	]
704	);
705
706	$this->add_responsive_control(
707	'tab_margin',
708	[
709	'label' => esc_html__('Margin', 'king-addons'),
710	'type' => Controls_Manager::DIMENSIONS,
711	'size_units' => ['px',],
712	'default' => [
713	'top' => 0,
714	'right' => 0,
715	'bottom' => 0,
716	'left' => 0,
717	],
718	'selectors' => [
719	'{{WRAPPER}} ' . $css_selector['control_list'] => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
720	],
721	'separator' => 'before',
722	]
723	);
724
725	$this->add_control(
726	'tab_border_type',
727	[
728	'label' => esc_html__('Border Type', 'king-addons'),
729	'type' => Controls_Manager::SELECT,
730	'options' => [
731	'none' => esc_html__('None', 'king-addons'),
732	'solid' => esc_html__('Solid', 'king-addons'),
733	'double' => esc_html__('Double', 'king-addons'),
734	'dotted' => esc_html__('Dotted', 'king-addons'),
735	'dashed' => esc_html__('Dashed', 'king-addons'),
736	'groove' => esc_html__('Groove', 'king-addons'),
737	],
738	'default' => 'solid',
739	'selectors' => [
740	'{{WRAPPER}} ' . $css_selector['control_list'] => 'border-style: {{VALUE}};',
741	],
742	'separator' => 'before',
743	]
744	);
745
746	$this->add_responsive_control(
747	'tab_border_width',
748	[
749	'label' => esc_html__('Border Width', 'king-addons'),
750	'type' => Controls_Manager::DIMENSIONS,
751	'size_units' => ['px'],
752	'default' => [
753	'top' => 1,
754	'right' => 1,
755	'bottom' => 0,
756	'left' => 1,
757	],
758	'selectors' => [
759	'{{WRAPPER}} ' . $css_selector['control_list'] => 'border-width: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
760	],
761	'condition' => [
762	'tab_border_type!' => 'none',
763	],
764	]
765	);
766
767	$this->add_responsive_control(
768	'tab_border_radius',
769	[
770	'label' => esc_html__('Border Radius', 'king-addons'),
771	'type' => Controls_Manager::DIMENSIONS,
772	'size_units' => ['px', '%'],
773	'default' => [
774	'top' => 0,
775	'right' => 0,
776	'bottom' => 0,
777	'left' => 0,
778	],
779	'selectors' => [
780	'{{WRAPPER}} ' . $css_selector['control_list'] => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
781	],
782	'separator' => 'before',
783	]
784	);
785
786	$this->end_controls_tab();
787
788	$this->start_controls_tab(
789	'tab_hover_style',
790	[
791	'label' => esc_html__('Hover', 'king-addons'),
792	]
793	);
794
795	$this->add_control(
796	'tab_hover_color',
797	[
798	'label' => esc_html__('Color', 'king-addons'),
799	'type' => Controls_Manager::COLOR,
800	'default' => '#333333',
801	'selectors' => [
802	'{{WRAPPER}} ' . $css_selector['control_list'] . ':hover .king-addons-tab-title' => 'color: {{VALUE}}',
803	],
804	]
805	);
806
807	$this->add_control(
808	'tab_hover_icon_color',
809	[
810	'label' => esc_html__('Icon Color', 'king-addons'),
811	'type' => Controls_Manager::COLOR,
812	'default' => '#333333',
813	'selectors' => [
814	'{{WRAPPER}} ' . $css_selector['control_list'] . ':hover .king-addons-tab-icon' => 'color: {{VALUE}}',
815	],
816	]
817	);
818
819	$this->add_control(
820	'tab_hover_bg_color',
821	[
822	'label' => esc_html__('Background Color', 'king-addons'),
823	'type' => Controls_Manager::COLOR,
824	'default' => '#ffffff',
825	'selectors' => [
826	'{{WRAPPER}} ' . $css_selector['control_list'] . ':hover' => 'background-color: {{VALUE}}',
827	],
828	]
829	);
830
831	$this->add_control(
832	'tab_hover_border_color',
833	[
834	'label' => esc_html__('Border Color', 'king-addons'),
835	'type' => Controls_Manager::COLOR,
836	'default' => '#ffffff',
837	'selectors' => [
838	'{{WRAPPER}} ' . $css_selector['control_list'] . ':hover' => 'border-color: {{VALUE}}',
839	],
840	]
841	);
842
843	$this->add_group_control(
844	Group_Control_Box_Shadow::get_type(),
845	[
846	'name' => 'tab_hover_box_shadow',
847	'selector' => '{{WRAPPER}} ' . $css_selector['control_list'] . ':hover',
848	]
849	);
850
851	$this->add_control(
852	'tab_hover_typography_divider',
853	[
854	'type' => Controls_Manager::DIVIDER,
855	'style' => 'thick',
856	]
857	);
858
859	$this->add_group_control(
860	Group_Control_Typography::get_type(),
861	[
862	'name' => 'tab_hover_typography',
863	'selector' => '{{WRAPPER}} ' . $css_selector['control_list'] . ':hover .king-addons-tab-title',
864	]
865	);
866
867	$this->add_responsive_control(
868	'tab_hover_icon_size',
869	[
870	'label' => esc_html__('Icon Size', 'king-addons'),
871	'type' => Controls_Manager::SLIDER,
872	'size_units' => ['px'],
873	'range' => [
874	'px' => [
875	'min' => 0,
876	'max' => 100,
877	],
878	],
879	'default' => [
880	'unit' => 'px',
881	'size' => 15,
882	],
883	'selectors' => [
884	'{{WRAPPER}} ' . $css_selector['control_list'] . ':hover .king-addons-tab-icon i' => 'font-size: {{SIZE}}{{UNIT}};',
885	'{{WRAPPER}} ' . $css_selector['control_list'] . ':hover .king-addons-tab-icon svg' => 'width: {{SIZE}}{{UNIT}}; height: {{SIZE}}{{UNIT}};',
886	'{{WRAPPER}} ' . $css_selector['control_list'] . ':hover .king-addons-tab-image' => 'width: {{SIZE}}{{UNIT}};',
887	],
888	'separator' => 'before',
889	]
890	);
891
892	$this->add_responsive_control(
893	'tab_hover_padding',
894	[
895	'label' => esc_html__('Padding', 'king-addons'),
896	'type' => Controls_Manager::DIMENSIONS,
897	'size_units' => ['px',],
898	'default' => [
899	'top' => 10,
900	'right' => 10,
901	'bottom' => 10,
902	'left' => 10,
903	],
904	'selectors' => [
905	'{{WRAPPER}} ' . $css_selector['control_list'] . ':hover' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
906	],
907	'separator' => 'before',
908	]
909	);
910
911	$this->add_responsive_control(
912	'tab_hover_margin',
913	[
914	'label' => esc_html__('Margin', 'king-addons'),
915	'type' => Controls_Manager::DIMENSIONS,
916	'size_units' => ['px',],
917	'default' => [
918	'top' => 0,
919	'right' => 0,
920	'bottom' => 0,
921	'left' => 0,
922	],
923	'selectors' => [
924	'{{WRAPPER}} ' . $css_selector['control_list'] . ':hover' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
925	],
926	'separator' => 'before',
927	]
928	);
929
930	$this->add_control(
931	'tab_hover_border_type',
932	[
933	'label' => esc_html__('Border Type', 'king-addons'),
934	'type' => Controls_Manager::SELECT,
935	'options' => [
936	'none' => esc_html__('None', 'king-addons'),
937	'solid' => esc_html__('Solid', 'king-addons'),
938	'double' => esc_html__('Double', 'king-addons'),
939	'dotted' => esc_html__('Dotted', 'king-addons'),
940	'dashed' => esc_html__('Dashed', 'king-addons'),
941	'groove' => esc_html__('Groove', 'king-addons'),
942	],
943	'default' => 'solid',
944	'selectors' => [
945	'{{WRAPPER}} ' . $css_selector['control_list'] . ':hover' => 'border-style: {{VALUE}};',
946	],
947	'separator' => 'before',
948	]
949	);
950
951	$this->add_responsive_control(
952	'tab_hover_border_width',
953	[
954	'label' => esc_html__('Border Width', 'king-addons'),
955	'type' => Controls_Manager::DIMENSIONS,
956	'size_units' => ['px'],
957	'default' => [
958	'top' => 1,
959	'right' => 1,
960	'bottom' => 0,
961	'left' => 1,
962	],
963	'selectors' => [
964	'{{WRAPPER}} ' . $css_selector['control_list'] . ':hover' => 'border-width: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
965	],
966	'condition' => [
967	'tab_hover_border_type!' => 'none',
968	],
969	]
970	);
971
972	$this->add_responsive_control(
973	'tab_hover_border_radius',
974	[
975	'label' => esc_html__('Border Radius', 'king-addons'),
976	'type' => Controls_Manager::DIMENSIONS,
977	'size_units' => ['px', '%'],
978	'default' => [
979	'top' => 0,
980	'right' => 0,
981	'bottom' => 0,
982	'left' => 0,
983	],
984	'selectors' => [
985	'{{WRAPPER}} ' . $css_selector['control_list'] . ':hover' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
986	],
987	'separator' => 'before',
988	]
989	);
990
991	$this->end_controls_tab();
992
993	$this->start_controls_tab(
994	'tab_active_style',
995	[
996	'label' => esc_html__('Active', 'king-addons'),
997	]
998	);
999
1000	$this->add_control(
1001	'tab_active_color',
1002	[
1003	'label' => esc_html__('Color', 'king-addons'),
1004	'type' => Controls_Manager::COLOR,
1005	'default' => '#5B03FF',
1006	'selectors' => [
1007	'{{WRAPPER}} ' . $css_selector['control_list'] . '.king-addons-tab-active .king-addons-tab-title' => 'color: {{VALUE}}',
1008	],
1009	]
1010	);
1011
1012	$this->add_control(
1013	'tab_active_icon_color',
1014	[
1015	'label' => esc_html__('Icon Color', 'king-addons'),
1016	'type' => Controls_Manager::COLOR,
1017	'default' => '#333333',
1018	'selectors' => [
1019	'{{WRAPPER}} ' . $css_selector['control_list'] . '.king-addons-tab-active .king-addons-tab-icon' => 'color: {{VALUE}}',
1020	],
1021	]
1022	);
1023
1024	$this->add_control(
1025	'tab_active_bg_color',
1026	[
1027	'label' => esc_html__('Background Color', 'king-addons'),
1028	'type' => Controls_Manager::COLOR,
1029	'default' => '#ffffff',
1030	'selectors' => [
1031	'{{WRAPPER}} ' . $css_selector['control_list'] . '.king-addons-tab-active' => 'background-color: {{VALUE}}',
1032	'{{WRAPPER}}.king-addons-tabs-position-above.king-addons-tabs-triangle-type-outer ' . $css_selector['control_list'] . ':before' => 'border-top-color: {{VALUE}}',
1033
1034
1035	],
1036	]
1037	);
1038
1039	$this->add_control(
1040	'tab_active_border_color',
1041	[
1042	'label' => esc_html__('Border Color', 'king-addons'),
1043	'type' => Controls_Manager::COLOR,
1044	'default' => '#e5e5e5',
1045	'selectors' => [
1046	'{{WRAPPER}} ' . $css_selector['control_list'] . '.king-addons-tab-active' => 'border-color: {{VALUE}}',
1047	],
1048	]
1049	);
1050
1051	$this->add_group_control(
1052	Group_Control_Box_Shadow::get_type(),
1053	[
1054	'name' => 'tab_active_box_shadow',
1055	'selector' => '{{WRAPPER}} ' . $css_selector['control_list'] . '.king-addons-tab-active',
1056	]
1057	);
1058
1059	$this->add_control(
1060	'tab_active_typography_divider',
1061	[
1062	'type' => Controls_Manager::DIVIDER,
1063	'style' => 'thick',
1064	]
1065	);
1066
1067	$this->add_group_control(
1068	Group_Control_Typography::get_type(),
1069	[
1070	'name' => 'tab_active_typography',
1071	'selector' => '{{WRAPPER}} ' . $css_selector['control_list'] . '.king-addons-tab-active .king-addons-tab-title',
1072	]
1073	);
1074
1075	$this->add_responsive_control(
1076	'tab_active_icon_size',
1077	[
1078	'label' => esc_html__('Icon Size', 'king-addons'),
1079	'type' => Controls_Manager::SLIDER,
1080	'size_units' => ['px'],
1081	'range' => [
1082	'px' => [
1083	'min' => 0,
1084	'max' => 100,
1085	],
1086	],
1087	'default' => [
1088	'unit' => 'px',
1089	'size' => 15,
1090	],
1091	'selectors' => [
1092	'{{WRAPPER}} ' . $css_selector['control_list'] . '.king-addons-tab-active .king-addons-tab-icon i' => 'font-size: {{SIZE}}{{UNIT}};',
1093	'{{WRAPPER}} ' . $css_selector['control_list'] . '.king-addons-tab-active .king-addons-tab-icon svg' => 'width: {{SIZE}}{{UNIT}}; height: {{SIZE}}{{UNIT}};',
1094	'{{WRAPPER}} ' . $css_selector['control_list'] . '.king-addons-tab-active .king-addons-tab-image' => 'width: {{SIZE}}{{UNIT}};',
1095	],
1096	'separator' => 'before',
1097	]
1098	);
1099
1100	$this->add_responsive_control(
1101	'tab_active_padding',
1102	[
1103	'label' => esc_html__('Padding', 'king-addons'),
1104	'type' => Controls_Manager::DIMENSIONS,
1105	'size_units' => ['px',],
1106	'default' => [
1107	'top' => 10,
1108	'right' => 10,
1109	'bottom' => 10,
1110	'left' => 10,
1111	],
1112	'selectors' => [
1113	'{{WRAPPER}} ' . $css_selector['control_list'] . '.king-addons-tab-active' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1114	],
1115	'separator' => 'before',
1116	]
1117	);
1118
1119	$this->add_responsive_control(
1120	'tab_active_margin',
1121	[
1122	'label' => esc_html__('Margin', 'king-addons'),
1123	'type' => Controls_Manager::DIMENSIONS,
1124	'size_units' => ['px',],
1125	'default' => [
1126	'top' => 0,
1127	'right' => 0,
1128	'bottom' => -1,
1129	'left' => 0,
1130	],
1131	'selectors' => [
1132	'{{WRAPPER}} ' . $css_selector['control_list'] . '.king-addons-tab-active' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1133	],
1134	'separator' => 'before',
1135	]
1136	);
1137
1138	$this->add_control(
1139	'tab_active_border_type',
1140	[
1141	'label' => esc_html__('Border Type', 'king-addons'),
1142	'type' => Controls_Manager::SELECT,
1143	'options' => [
1144	'none' => esc_html__('None', 'king-addons'),
1145	'solid' => esc_html__('Solid', 'king-addons'),
1146	'double' => esc_html__('Double', 'king-addons'),
1147	'dotted' => esc_html__('Dotted', 'king-addons'),
1148	'dashed' => esc_html__('Dashed', 'king-addons'),
1149	'groove' => esc_html__('Groove', 'king-addons'),
1150	],
1151	'default' => 'solid',
1152	'selectors' => [
1153	'{{WRAPPER}} ' . $css_selector['control_list'] . '.king-addons-tab-active' => 'border-style: {{VALUE}};',
1154	],
1155	'separator' => 'before',
1156	]
1157	);
1158
1159	$this->add_responsive_control(
1160	'tab_active_border_width',
1161	[
1162	'label' => esc_html__('Border Width', 'king-addons'),
1163	'type' => Controls_Manager::DIMENSIONS,
1164	'size_units' => ['px',],
1165	'default' => [
1166	'top' => 1,
1167	'right' => 1,
1168	'bottom' => 0,
1169	'left' => 1,
1170	],
1171	'selectors' => [
1172	'{{WRAPPER}} ' . $css_selector['control_list'] . '.king-addons-tab-active' => 'border-width: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1173	],
1174	'condition' => [
1175	'tab_active_border_type!' => 'none',
1176	],
1177	]
1178	);
1179
1180	$this->add_responsive_control(
1181	'tab_active_border_radius',
1182	[
1183	'label' => esc_html__('Border Radius', 'king-addons'),
1184	'type' => Controls_Manager::DIMENSIONS,
1185	'size_units' => ['px', '%'],
1186	'default' => [
1187	'top' => 0,
1188	'right' => 0,
1189	'bottom' => 0,
1190	'left' => 0,
1191	],
1192	'selectors' => [
1193	'{{WRAPPER}} ' . $css_selector['control_list'] . '.king-addons-tab-active' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1194	],
1195	'separator' => 'before',
1196	]
1197	);
1198
1199	$this->end_controls_tab();
1200
1201	$this->end_controls_tabs();
1202
1203	$this->add_control(
1204	'tab_transition_duration',
1205	[
1206	'label' => esc_html__('Transition Duration (seconds)', 'king-addons'),
1207	'type' => Controls_Manager::NUMBER,
1208	'default' => 0.1,
1209	'min' => 0,
1210	'max' => 5,
1211	'step' => 0.1,
1212	'frontend_available' => true,
1213	'selectors' => [
1214	'{{WRAPPER}} ' . $css_selector['control_list'] => '-webkit-transition-duration: {{VALUE}}s; transition-duration: {{VALUE}}s',
1215	'{{WRAPPER}}.king-addons-tabs-triangle-type-outer ' . $css_selector['control_list'] . ':before' => '-webkit-transition-duration: {{VALUE}}s; transition-duration: {{VALUE}}s',
1216	],
1217	'separator' => 'after',
1218	]
1219	);
1220
1221
1222	$this->end_controls_section();
1223
1224
1225	$this->start_controls_section(
1226	'section_style_content',
1227	[
1228	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Content', 'king-addons'),
1229	'tab' => Controls_Manager::TAB_STYLE,
1230	]
1231	);
1232
1233	$this->add_control(
1234	'content_color',
1235	[
1236	'label' => esc_html__('Color', 'king-addons'),
1237	'type' => Controls_Manager::COLOR,
1238	'default' => '#5B03FF',
1239	'selectors' => [
1240	'{{WRAPPER}} ' . $css_selector['content_list'] => 'color: {{VALUE}};',
1241	],
1242	]
1243	);
1244
1245	$this->add_control(
1246	'content_bg_color',
1247	[
1248	'label' => esc_html__('Background Color', 'king-addons'),
1249	'type' => Controls_Manager::COLOR,
1250	'default' => '#ffffff',
1251	'selectors' => [
1252	'{{WRAPPER}} ' . $css_selector['content_wrap'] => 'background-color: {{VALUE}}',
1253	'{{WRAPPER}}.king-addons-tabs-position-above.king-addons-tabs-triangle-type-inner ' . $css_selector['control_list'] . ':before' => 'border-top-color: {{VALUE}}',
1254	'{{WRAPPER}}.king-addons-tabs-position-right.king-addons-tabs-triangle-type-inner ' . $css_selector['control_list'] . ':before' => 'border-right-color: {{VALUE}}',
1255	'{{WRAPPER}}.king-addons-tabs-position-left.king-addons-tabs-triangle-type-inner ' . $css_selector['control_list'] . ':before' => 'border-right-color: {{VALUE}}',
1256	],
1257	'separator' => 'after',
1258	]
1259	);
1260
1261	$this->add_group_control(
1262	Group_Control_Box_Shadow::get_type(),
1263	[
1264	'name' => 'content_box_shadow',
1265	'selector' => '{{WRAPPER}} ' . $css_selector['content_wrap'],
1266	]
1267	);
1268
1269	$this->add_control(
1270	'content_box_shadow_divider',
1271	[
1272	'type' => Controls_Manager::DIVIDER,
1273	'style' => 'thick',
1274	]
1275	);
1276
1277	$this->add_group_control(
1278	Group_Control_Typography::get_type(),
1279	[
1280	'name' => 'content_typography',
1281	'selector' => '{{WRAPPER}} ' . $css_selector['content_list'] . ', {{WRAPPER}} ' . $css_selector['content_list'] . ' ul',
1282	]
1283	);
1284
1285	$this->add_responsive_control(
1286	'content_padding',
1287	[
1288	'label' => esc_html__('Padding', 'king-addons'),
1289	'type' => Controls_Manager::DIMENSIONS,
1290	'default' => [
1291	'top' => 25,
1292	'right' => 25,
1293	'bottom' => 25,
1294	'left' => 25,
1295	],
1296	'size_units' => ['px'],
1297	'selectors' => [
1298	'{{WRAPPER}} ' . $css_selector['content_list'] => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1299	],
1300	'separator' => 'before',
1301	]
1302	);
1303
1304	$this->add_control(
1305	'content_border_type',
1306	[
1307	'label' => esc_html__('Border Type', 'king-addons'),
1308	'type' => Controls_Manager::SELECT,
1309	'options' => [
1310	'none' => esc_html__('None', 'king-addons'),
1311	'solid' => esc_html__('Solid', 'king-addons'),
1312	'double' => esc_html__('Double', 'king-addons'),
1313	'dotted' => esc_html__('Dotted', 'king-addons'),
1314	'dashed' => esc_html__('Dashed', 'king-addons'),
1315	'groove' => esc_html__('Groove', 'king-addons'),
1316	],
1317	'default' => 'solid',
1318	'selectors' => [
1319	'{{WRAPPER}} ' . $css_selector['content_wrap'] => 'border-style: {{VALUE}};',
1320	],
1321	'separator' => 'before',
1322	]
1323	);
1324
1325	$this->add_responsive_control(
1326	'content_border_width',
1327	[
1328	'label' => esc_html__('Border Width', 'king-addons'),
1329	'type' => Controls_Manager::DIMENSIONS,
1330	'size_units' => ['px',],
1331	'default' => [
1332	'top' => 1,
1333	'right' => 1,
1334	'bottom' => 1,
1335	'left' => 1,
1336	],
1337	'selectors' => [
1338	'{{WRAPPER}} ' . $css_selector['content_wrap'] => 'border-width: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1339	],
1340	'condition' => [
1341	'content_border_type!' => 'none',
1342	],
1343	]
1344	);
1345
1346	$this->add_control(
1347	'content_border_color',
1348	[
1349	'label' => esc_html__('Border Color', 'king-addons'),
1350	'type' => Controls_Manager::COLOR,
1351	'default' => '#E8E8E8',
1352	'selectors' => [
1353	'{{WRAPPER}} ' . $css_selector['content_wrap'] => 'border-color: {{VALUE}}',
1354	],
1355	'condition' => [
1356	'content_border_type!' => 'none',
1357	],
1358	]
1359	);
1360
1361	$this->add_responsive_control(
1362	'content_border_radius',
1363	[
1364	'label' => esc_html__('Border Radius', 'king-addons'),
1365	'type' => Controls_Manager::DIMENSIONS,
1366	'size_units' => ['px', '%'],
1367	'default' => [
1368	'top' => 0,
1369	'right' => 0,
1370	'bottom' => 0,
1371	'left' => 0,
1372	],
1373	'selectors' => [
1374	'{{WRAPPER}} ' . $css_selector['content_wrap'] => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1375	],
1376	'separator' => 'before',
1377	]
1378	);
1379
1380	$this->end_controls_section();
1381
1382	$this->start_controls_section(
1383	'section_style_triangle',
1384	[
1385	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Triangle', 'king-addons'),
1386	'tab' => Controls_Manager::TAB_STYLE,
1387	]
1388	);
1389
1390	$this->add_control(
1391	'tab_triangle',
1392	[
1393	'label' => esc_html__('Triangle', 'king-addons'),
1394	'type' => Controls_Manager::SWITCHER,
1395	'default' => 'yes',
1396	'prefix_class' => 'king-addons-tabs-triangle-',
1397	'separator' => 'before',
1398	]
1399	);
1400
1401	$this->add_control(
1402	'tab_triangle_type',
1403	[
1404	'label' => esc_html__('Triangle Points to', 'king-addons'),
1405	'type' => Controls_Manager::SELECT,
1406	'default' => 'outer',
1407	'options' => [
1408	'inner' => esc_html__('Tab', 'king-addons'),
1409	'outer' => esc_html__('Content', 'king-addons'),
1410	],
1411	'prefix_class' => 'king-addons-tabs-triangle-type-',
1412	'render_type' => 'template',
1413	'condition' => [
1414	'tab_triangle' => 'yes',
1415	],
1416	]
1417	);
1418
1419	$this->add_responsive_control(
1420	'tab_triangle_size',
1421	[
1422	'type' => Controls_Manager::SLIDER,
1423	'label' => esc_html__('Size', 'king-addons'),
1424	'size_units' => ['px'],
1425	'range' => [
1426	'px' => [
1427	'min' => 0,
1428	'max' => 30,
1429	]
1430	],
1431	'default' => [
1432	'unit' => 'px',
1433	'size' => 7,
1434	],
1435	'selectors' => [
1436	'{{WRAPPER}} ' . $css_selector['control_list'] . ':before' => 'border-width: {{SIZE}}{{UNIT}};',
1437	'{{WRAPPER}}.king-addons-tabs-position-above.king-addons-tabs-triangle-type-outer ' . $css_selector['control_list'] . ':before' => 'bottom: -{{SIZE}}{{UNIT}};',
1438	'{{WRAPPER}}.king-addons-tabs-position-right.king-addons-tabs-triangle-type-outer ' . $css_selector['control_list'] . ':before' => 'left: -{{SIZE}}{{UNIT}};',
1439	'{{WRAPPER}}.king-addons-tabs-position-left.king-addons-tabs-triangle-type-outer ' . $css_selector['control_list'] . ':before' => 'right: -{{SIZE}}{{UNIT}};',
1440	],
1441	'condition' => [
1442	'tab_triangle' => 'yes',
1443	],
1444	]
1445	);
1446
1447
1448
1449
1450	$this->end_controls_section();
1451
1452
1453
1454	}
1455
1456	public function king_addons_tabs_template($id)
1457	{
1458	if (empty($id)) return '';
1459	if (defined('ICL_LANGUAGE_CODE')) {
1460	$default_language_code = apply_filters('wpml_default_language', null);
1461	/** @noinspection PhpUndefinedConstantInspection */
1462	if (ICL_LANGUAGE_CODE !== $default_language_code) {
1463	/** @noinspection PhpUndefinedConstantInspection */
1464	/** @noinspection PhpUndefinedFunctionInspection */
1465	$id = icl_object_id($id, 'elementor_library', false, ICL_LANGUAGE_CODE);
1466	}
1467	}
1468	$type = get_post_meta(get_the_ID(), '_king_addons_template_type', true);
1469	$has_css = ('internal' === get_option('elementor_css_print_method') \|\| '' !== $type);
1470	return Plugin::instance()->frontend->get_builder_content_for_display($id, $has_css);
1471	}
1472
1473	protected function render()
1474	{
1475	$settings = Core::displaySettings($this);
1476
1477	// Force fallback settings if premium code isn't available
1478	if (!king_addons_freemius()->can_use_premium_code__premium_only()) {
1479	$settings['active_tab'] = 1;
1480	$settings['tabs_trigger'] = 'click';
1481	$settings['autoplay'] = '';
1482	$settings['autoplay_duration'] = 0;
1483	$settings['content_animation'] = 'fade-in';
1484	$settings['content_anim_size'] = 'large';
1485	}
1486
1487	$tabs = $this->get_settings_for_display('tabs');
1488	$id_int = substr($this->get_id_int(), 0, 3);
1489	$options = [
1490	'activeTab' => $settings['active_tab'],
1491	'trigger' => $settings['tabs_trigger'],
1492	'autoplay' => $settings['autoplay'] ?? '',
1493	'autoplaySpeed' => absint($settings['autoplay_duration'] * 1000),
1494	];
1495
1496	$this->add_render_attribute('tabs-attribute', [
1497	'class' => 'king-addons-tabs',
1498	'data-options' => wp_json_encode($options),
1499	]);
1500
1501	echo '<div ' . $this->get_render_attribute_string('tabs-attribute') . '>';
1502	echo '<div class="king-addons-tabs-wrap">';
1503
1504	foreach ($tabs as $index => $item):
1505	if (!king_addons_freemius()->can_use_premium_code__premium_only()) {
1506	// Switch 'pro-tmp' to 'editor' in free version and limit tabs
1507	$item['tab_content_type'] = ('pro-tmp' === $item['tab_content_type']) ? 'editor' : $item['tab_content_type'];
1508	if ($index === 3) break;
1509	}
1510	$tab_count = $index + 1;
1511	$tab_setting_key = $this->get_repeater_setting_key('tab_control', 'tabs', $index);
1512	$tab_image_src = !empty($item['tab_image']['id'])
1513	? Group_Control_Image_Size::get_attachment_image_src($item['tab_image']['id'], 'tabs_image_size', $settings)
1514	: false;
1515	if (!$tab_image_src && !empty($item['tab_image']['url'])) {
1516	$tab_image_src = $item['tab_image']['url'];
1517	}
1518
1519	$this->add_render_attribute($tab_setting_key, [
1520	'id' => 'king-addons-tab-' . $id_int . $tab_count,
1521	'class' => ['king-addons-tab', 'elementor-repeater-item-' . $item['_id']],
1522	'data-tab' => $tab_count,
1523	]);
1524
1525	echo '<div ' . $this->get_render_attribute_string($tab_setting_key) . '>';
1526	if (!empty($item['tab_title'])) {
1527	echo '<div class="king-addons-tab-title">' . esc_html($item['tab_title']) . '</div>';
1528	}
1529	if ('icon' === $item['tab_icon_type'] && !empty($item['tab_icon']['value'])) {
1530	echo '<div class="king-addons-tab-icon"><i class="' . esc_attr($item['tab_icon']['value']) . '"></i></div>';
1531	} elseif ('image' === $item['tab_icon_type'] && $tab_image_src) {
1532	echo '<div class="king-addons-tab-image"><img alt="' . esc_attr($item['tab_image']['alt'] ?? '') . '" src="' . esc_url($tab_image_src) . '"></div>';
1533	}
1534	echo '</div>';
1535	endforeach;
1536
1537	echo '</div><div class="king-addons-tabs-content-wrap">';
1538
1539	foreach ($tabs as $index => $item):
1540	$tab_count = $index + 1;
1541	$content_key = $this->get_repeater_setting_key('tab_content', 'tabs', $index);
1542	$this->add_render_attribute($content_key, [
1543	'id' => 'king-addons-tab-content-' . $id_int . $tab_count,
1544	'class' => ['king-addons-tab-content', 'elementor-repeater-item-' . $item['_id']],
1545	'data-tab' => $tab_count,
1546	]);
1547
1548	echo '<div ' . $this->get_render_attribute_string($content_key) . '>';
1549	echo '<div class="king-addons-tab-content-inner elementor-clearfix king-addons-anim-size-' . esc_attr($settings['content_anim_size']) . ' king-addons-overlay-' . esc_attr($settings['content_animation']) . '">';
1550
1551	if ('template' === $item['tab_content_type']) {
1552	echo $this->king_addons_tabs_template($item['select_template']);
1553	} elseif ('editor' === $item['tab_content_type']) {
1554	echo wp_kses_post($item['tab_content']);
1555	} elseif ('acf' === $item['tab_content_type']) {
1556	echo wp_kses_post(get_post_meta(get_the_ID(), $item['tab_custom_field'], true));
1557	}
1558
1559	echo '</div></div>';
1560	endforeach;
1561
1562	echo '</div></div>';
1563	}
1564	}