Eael_NinjaForms.php — Essential Addons for Elementor – Popular Elementor Templates & Widgets 2.10.0

essential-addons-for-elementor-lite / elements / Eael_NinjaForms.php

essential-addons-for-elementor-lite / elements Last commit date

Eael_NinjaForms.php

1594 lines

1	<?php
2	namespace Essential_Addons_Elementor\Elements;
3
4	// If this file is called directly, abort.
5	if (!defined('ABSPATH')) {
6	exit;
7	}
8
9	use \Elementor\Controls_Manager as Controls_Manager;
10	use \Elementor\Group_Control_Border as Group_Control_Border;
11	use \Elementor\Group_Control_Box_Shadow as Group_Control_Box_Shadow;
12	use \Elementor\Group_Control_Typography as Group_Control_Typography;
13	use \Elementor\Scheme_Typography as Scheme_Typography;
14	use \Elementor\Widget_Base as Widget_Base;
15
16	class Eael_NinjaForms extends Widget_Base {
17	use \Essential_Addons_Elementor\Traits\Helper;
18
19	public function get_name() {
20	return 'eael-ninja';
21	}
22
23	public function get_title() {
24	return __( 'EA Ninja Forms', 'essential-addons-elementor' );
25	}
26
27	public function get_categories() {
28	return [ 'essential-addons-elementor' ];
29	}
30
31	public function get_icon() {
32	return 'fa fa-envelope-o';
33	}
34
35	protected function _register_controls() {
36
37	/-----------------------------------------------------------------------------------/
38	/* CONTENT TAB
39	/-----------------------------------------------------------------------------------/
40
41	/**
42	* Content Tab: Ninja Forms
43	* -------------------------------------------------
44	*/
45	$this->start_controls_section(
46	'section_info_box',
47	[
48	'label' => __( 'Ninja Forms', 'essential-addons-elementor' ),
49	]
50	);
51
52	$this->add_control(
53	'contact_form_list',
54	[
55	'label' => esc_html__( 'Select Form', 'essential-addons-elementor' ),
56	'type' => Controls_Manager::SELECT,
57	'label_block' => true,
58	'options' => $this->eael_select_ninja_form(),
59	'default' => '0',
60	]
61	);
62
63	$this->add_control(
64	'custom_title_description',
65	[
66	'label' => __( 'Custom Title & Description', 'essential-addons-elementor' ),
67	'type' => Controls_Manager::SWITCHER,
68	'label_on' => __( 'Yes', 'essential-addons-elementor' ),
69	'label_off' => __( 'No', 'essential-addons-elementor' ),
70	'return_value' => 'yes',
71	]
72	);
73
74	$this->add_control(
75	'form_title',
76	[
77	'label' => __( 'Title', 'essential-addons-elementor' ),
78	'type' => Controls_Manager::SWITCHER,
79	'default' => 'yes',
80	'label_on' => __( 'Show', 'essential-addons-elementor' ),
81	'label_off' => __( 'Hide', 'essential-addons-elementor' ),
82	'return_value' => 'yes',
83	'prefix_class' => 'eael-ninja-form-title-',
84	'condition' => [
85	'custom_title_description!' => 'yes',
86	],
87	]
88	);
89
90	$this->add_control(
91	'form_title_custom',
92	[
93	'label' => esc_html__( 'Title', 'essential-addons-elementor' ),
94	'type' => Controls_Manager::TEXT,
95	'label_block' => true,
96	'default' => '',
97	'condition' => [
98	'custom_title_description' => 'yes',
99	],
100	]
101	);
102
103	$this->add_control(
104	'form_description_custom',
105	[
106	'label' => esc_html__( 'Description', 'essential-addons-elementor' ),
107	'type' => Controls_Manager::TEXTAREA,
108	'default' => '',
109	'condition' => [
110	'custom_title_description' => 'yes',
111	],
112	]
113	);
114
115	$this->add_control(
116	'labels_switch',
117	[
118	'label' => __( 'Labels', 'essential-addons-elementor' ),
119	'type' => Controls_Manager::SWITCHER,
120	'default' => 'yes',
121	'label_on' => __( 'Show', 'essential-addons-elementor' ),
122	'label_off' => __( 'Hide', 'essential-addons-elementor' ),
123	'return_value' => 'yes',
124	'prefix_class' => 'eael-ninja-form-labels-',
125	]
126	);
127
128	$this->add_control(
129	'placeholder_switch',
130	[
131	'label' => __( 'Placeholder', 'essential-addons-elementor' ),
132	'type' => Controls_Manager::SWITCHER,
133	'default' => 'yes',
134	'label_on' => __( 'Show', 'essential-addons-elementor' ),
135	'label_off' => __( 'Hide', 'essential-addons-elementor' ),
136	'return_value' => 'yes',
137	]
138	);
139
140	$this->end_controls_section();
141
142	/**
143	* Content Tab: Errors
144	* -------------------------------------------------
145	*/
146	$this->start_controls_section(
147	'section_errors',
148	[
149	'label' => __( 'Errors', 'essential-addons-elementor' ),
150	]
151	);
152
153	$this->add_control(
154	'error_messages',
155	[
156	'label' => __( 'Error Messages', 'essential-addons-elementor' ),
157	'type' => Controls_Manager::SELECT,
158	'default' => 'show',
159	'options' => [
160	'show' => __( 'Show', 'essential-addons-elementor' ),
161	'hide' => __( 'Hide', 'essential-addons-elementor' ),
162	],
163	'selectors_dictionary' => [
164	'show' => 'block',
165	'hide' => 'none',
166	],
167	'selectors' => [
168	'{{WRAPPER}} .eael-ninja-form .nf-error-wrap .nf-error-required-error' => 'display: {{VALUE}} !important;',
169	],
170	]
171	);
172
173	$this->add_control(
174	'validation_errors',
175	[
176	'label' => __( 'Validation Errors', 'essential-addons-elementor' ),
177	'type' => Controls_Manager::SELECT,
178	'default' => 'show',
179	'options' => [
180	'show' => __( 'Show', 'essential-addons-elementor' ),
181	'hide' => __( 'Hide', 'essential-addons-elementor' ),
182	],
183	'selectors_dictionary' => [
184	'show' => 'block',
185	'hide' => 'none',
186	],
187	'selectors' => [
188	'{{WRAPPER}} .eael-ninja-form .nf-form-errors .nf-error-field-errors' => 'display: {{VALUE}} !important;',
189	],
190	]
191	);
192
193	$this->end_controls_section();
194
195	/**
196	* Style Tab: Form Container
197	* -------------------------------------------------
198	*/
199	$this->start_controls_section(
200	'section_container_style',
201	[
202	'label' => __( 'Form Container', 'essential-addons-elementor' ),
203	'tab' => Controls_Manager::TAB_STYLE,
204	]
205	);
206
207	$this->add_control(
208	'eael_contact_form_background',
209	[
210	'label' => esc_html__( 'Form Background Color', 'essential-addons-elementor' ),
211	'type' => Controls_Manager::COLOR,
212	'selectors' => [
213	'{{WRAPPER}} .eael-contact-form' => 'background: {{VALUE}};',
214	],
215	]
216	);
217
218	$this->add_responsive_control(
219	'eael_contact_form_alignment',
220	[
221	'label' => esc_html__( 'Form Alignment', 'essential-addons-elementor' ),
222	'type' => Controls_Manager::CHOOSE,
223	'label_block' => true,
224	'options' => [
225	'default' => [
226	'title' => __( 'Default', 'essential-addons-elementor' ),
227	'icon' => 'fa fa-ban',
228	],
229	'left' => [
230	'title' => esc_html__( 'Left', 'essential-addons-elementor' ),
231	'icon' => 'eicon-h-align-left',
232	],
233	'center' => [
234	'title' => esc_html__( 'Center', 'essential-addons-elementor' ),
235	'icon' => 'eicon-h-align-center',
236	],
237	'right' => [
238	'title' => esc_html__( 'Right', 'essential-addons-elementor' ),
239	'icon' => 'eicon-h-align-right',
240	],
241	],
242	'default' => 'default',
243	]
244	);
245
246	$this->add_responsive_control(
247	'eael_contact_form_width',
248	[
249	'label' => esc_html__( 'Form Width', 'essential-addons-elementor' ),
250	'type' => Controls_Manager::SLIDER,
251	'size_units' => [ 'px', 'em', '%' ],
252	'range' => [
253	'px' => [
254	'min' => 10,
255	'max' => 1500,
256	],
257	'em' => [
258	'min' => 1,
259	'max' => 80,
260	],
261	],
262	'selectors' => [
263	'{{WRAPPER}} .eael-contact-form' => 'width: {{SIZE}}{{UNIT}};',
264	],
265	]
266	);
267
268	$this->add_responsive_control(
269	'eael_contact_form_max_width',
270	[
271	'label' => esc_html__( 'Form Max Width', 'essential-addons-elementor' ),
272	'type' => Controls_Manager::SLIDER,
273	'size_units' => [ 'px', 'em', '%' ],
274	'range' => [
275	'px' => [
276	'min' => 10,
277	'max' => 1500,
278	],
279	'em' => [
280	'min' => 1,
281	'max' => 80,
282	],
283	],
284	'selectors' => [
285	'{{WRAPPER}} .eael-contact-form' => 'max-width: {{SIZE}}{{UNIT}};',
286	],
287	]
288	);
289
290
291	$this->add_responsive_control(
292	'eael_contact_form_margin',
293	[
294	'label' => esc_html__( 'Form Margin', 'essential-addons-elementor' ),
295	'type' => Controls_Manager::DIMENSIONS,
296	'size_units' => [ 'px', 'em', '%' ],
297	'selectors' => [
298	'{{WRAPPER}} .eael-contact-form' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
299	],
300	]
301	);
302
303	$this->add_responsive_control(
304	'eael_contact_form_padding',
305	[
306	'label' => esc_html__( 'Form Padding', 'essential-addons-elementor' ),
307	'type' => Controls_Manager::DIMENSIONS,
308	'size_units' => [ 'px', 'em', '%' ],
309	'selectors' => [
310	'{{WRAPPER}} .eael-contact-form' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
311	],
312	]
313	);
314
315
316	$this->add_control(
317	'eael_contact_form_border_radius',
318	[
319	'label' => esc_html__( 'Border Radius', 'essential-addons-elementor' ),
320	'type' => Controls_Manager::DIMENSIONS,
321	'separator' => 'before',
322	'size_units' => [ 'px' ],
323	'selectors' => [
324	'{{WRAPPER}} .eael-contact-form' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
325	],
326	]
327	);
328
329
330	$this->add_group_control(
331	Group_Control_Border::get_type(),
332	[
333	'name' => 'eael_contact_form_border',
334	'selector' => '{{WRAPPER}} .eael-contact-form',
335	]
336	);
337
338
339	$this->add_group_control(
340	Group_Control_Box_Shadow::get_type(),
341	[
342	'name' => 'eael_contact_form_box_shadow',
343	'selector' => '{{WRAPPER}} .eael-contact-form',
344	]
345	);
346
347	$this->end_controls_section();
348
349	/-----------------------------------------------------------------------------------/
350	/* STYLE TAB
351	/-----------------------------------------------------------------------------------/
352
353	/**
354	* Style Tab: Form Title & Description
355	* -------------------------------------------------
356	*/
357	$this->start_controls_section(
358	'section_form_title_style',
359	[
360	'label' => __( 'Title & Description', 'essential-addons-elementor' ),
361	'tab' => Controls_Manager::TAB_STYLE,
362	]
363	);
364
365	$this->add_responsive_control(
366	'heading_alignment',
367	[
368	'label' => __( 'Alignment', 'essential-addons-elementor' ),
369	'type' => Controls_Manager::CHOOSE,
370	'options' => [
371	'left' => [
372	'title' => __( 'Left', 'essential-addons-elementor' ),
373	'icon' => 'fa fa-align-left',
374	],
375	'center' => [
376	'title' => __( 'Center', 'essential-addons-elementor' ),
377	'icon' => 'fa fa-align-center',
378	],
379	'right' => [
380	'title' => __( 'Right', 'essential-addons-elementor' ),
381	'icon' => 'fa fa-align-right',
382	],
383	],
384	'default' => '',
385	'selectors' => [
386	'{{WRAPPER}} .eael-ninja-form .nf-form-title h3, {{WRAPPER}} .eael-ninja-form-heading' => 'text-align: {{VALUE}};',
387	],
388	]
389	);
390
391	$this->add_control(
392	'title_heading',
393	[
394	'label' => __( 'Title', 'essential-addons-elementor' ),
395	'type' => Controls_Manager::HEADING,
396	'separator' => 'before',
397	]
398	);
399
400	$this->add_control(
401	'form_title_text_color',
402	[
403	'label' => __( 'Text Color', 'essential-addons-elementor' ),
404	'type' => Controls_Manager::COLOR,
405	'default' => '',
406	'selectors' => [
407	'{{WRAPPER}} .eael-ninja-form .nf-form-title h3, {{WRAPPER}} .eael-contact-form-title' => 'color: {{VALUE}}',
408	],
409	]
410	);
411
412	$this->add_group_control(
413	Group_Control_Typography::get_type(),
414	[
415	'name' => 'form_title_typography',
416	'label' => __( 'Typography', 'essential-addons-elementor' ),
417	'selector' => '{{WRAPPER}} .eael-ninja-form .nf-form-title h3, {{WRAPPER}} .eael-contact-form-title',
418	]
419	);
420
421	$this->add_responsive_control(
422	'form_title_margin',
423	[
424	'label' => __( 'Margin', 'essential-addons-elementor' ),
425	'type' => Controls_Manager::DIMENSIONS,
426	'size_units' => [ 'px', 'em', '%' ],
427	'allowed_dimensions' => 'vertical',
428	'placeholder' => [
429	'top' => '',
430	'right' => 'auto',
431	'bottom' => '',
432	'left' => 'auto',
433	],
434	'selectors' => [
435	'{{WRAPPER}} .eael-ninja-form .nf-form-title h3, {{WRAPPER}} .eael-contact-form-title' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
436	],
437	]
438	);
439
440	$this->add_control(
441	'description_heading',
442	[
443	'label' => __( 'Description', 'essential-addons-elementor' ),
444	'type' => Controls_Manager::HEADING,
445	'separator' => 'before',
446	]
447	);
448
449	$this->add_control(
450	'form_description_text_color',
451	[
452	'label' => __( 'Text Color', 'essential-addons-elementor' ),
453	'type' => Controls_Manager::COLOR,
454	'default' => '',
455	'selectors' => [
456	'{{WRAPPER}} .eael-ninja-form .eael-contact-form-description' => 'color: {{VALUE}}',
457	],
458	]
459	);
460
461	$this->add_group_control(
462	Group_Control_Typography::get_type(),
463	[
464	'name' => 'form_description_typography',
465	'label' => __( 'Typography', 'essential-addons-elementor' ),
466	'scheme' => Scheme_Typography::TYPOGRAPHY_4,
467	'selector' => '{{WRAPPER}} .eael-ninja-form .eael-contact-form-description',
468	]
469	);
470
471	$this->add_responsive_control(
472	'form_description_margin',
473	[
474	'label' => __( 'Margin', 'essential-addons-elementor' ),
475	'type' => Controls_Manager::DIMENSIONS,
476	'size_units' => [ 'px', 'em', '%' ],
477	'allowed_dimensions' => 'vertical',
478	'placeholder' => [
479	'top' => '',
480	'right' => 'auto',
481	'bottom' => '',
482	'left' => 'auto',
483	],
484	'selectors' => [
485	'{{WRAPPER}} .eael-contact-form-description' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
486	],
487	]
488	);
489
490	$this->end_controls_section();
491
492	/**
493	* Style Tab: Labels
494	* -------------------------------------------------
495	*/
496	$this->start_controls_section(
497	'section_label_style',
498	[
499	'label' => __( 'Labels', 'essential-addons-elementor' ),
500	'tab' => Controls_Manager::TAB_STYLE,
501	'condition' => [
502	'labels_switch' => 'yes',
503	],
504	]
505	);
506
507	$this->add_control(
508	'text_color_label',
509	[
510	'label' => __( 'Text Color', 'essential-addons-elementor' ),
511	'type' => Controls_Manager::COLOR,
512	'selectors' => [
513	'{{WRAPPER}} .eael-ninja-form .nf-field-label label' => 'color: {{VALUE}}',
514	],
515	'condition' => [
516	'labels_switch' => 'yes',
517	],
518	]
519	);
520
521	$this->add_group_control(
522	Group_Control_Typography::get_type(),
523	[
524	'name' => 'typography_label',
525	'label' => __( 'Typography', 'essential-addons-elementor' ),
526	'selector' => '{{WRAPPER}} .eael-ninja-form .nf-field-label label',
527	'condition' => [
528	'labels_switch' => 'yes',
529	],
530	]
531	);
532
533	$this->end_controls_section();
534
535	/**
536	* Style Tab: Input & Textarea
537	* -------------------------------------------------
538	*/
539	$this->start_controls_section(
540	'section_fields_style',
541	[
542	'label' => __( 'Input & Textarea', 'essential-addons-elementor' ),
543	'tab' => Controls_Manager::TAB_STYLE,
544	]
545	);
546
547	$this->add_responsive_control(
548	'input_alignment',
549	[
550	'label' => __( 'Alignment', 'essential-addons-elementor' ),
551	'type' => Controls_Manager::CHOOSE,
552	'options' => [
553	'left' => [
554	'title' => __( 'Left', 'essential-addons-elementor' ),
555	'icon' => 'fa fa-align-left',
556	],
557	'center' => [
558	'title' => __( 'Center', 'essential-addons-elementor' ),
559	'icon' => 'fa fa-align-center',
560	],
561	'right' => [
562	'title' => __( 'Right', 'essential-addons-elementor' ),
563	'icon' => 'fa fa-align-right',
564	],
565	],
566	'default' => '',
567	'selectors' => [
568	'{{WRAPPER}} .eael-ninja-form .nf-field input[type="text"], {{WRAPPER}} .eael-ninja-form .nf-field input[type="email"], {{WRAPPER}} .eael-ninja-form .nf-field input[type="tel"], {{WRAPPER}} .eael-ninja-form .nf-field textarea, {{WRAPPER}} .eael-ninja-form .nf-field select' => 'text-align: {{VALUE}};',
569	],
570	]
571	);
572
573	$this->start_controls_tabs( 'tabs_fields_style' );
574
575	$this->start_controls_tab(
576	'tab_fields_normal',
577	[
578	'label' => __( 'Normal', 'essential-addons-elementor' ),
579	]
580	);
581
582	$this->add_control(
583	'field_bg_color',
584	[
585	'label' => __( 'Background Color', 'essential-addons-elementor' ),
586	'type' => Controls_Manager::COLOR,
587	'default' => '',
588	'selectors' => [
589	'{{WRAPPER}} .eael-ninja-form .nf-field input[type="text"], {{WRAPPER}} .eael-ninja-form .nf-field input[type="email"], {{WRAPPER}} .eael-ninja-form .nf-field input[type="tel"], {{WRAPPER}} .eael-ninja-form .nf-field textarea, {{WRAPPER}} .eael-ninja-form .nf-field select' => 'background-color: {{VALUE}}',
590	],
591	]
592	);
593
594	$this->add_control(
595	'field_text_color',
596	[
597	'label' => __( 'Text Color', 'essential-addons-elementor' ),
598	'type' => Controls_Manager::COLOR,
599	'default' => '',
600	'selectors' => [
601	'{{WRAPPER}} .eael-ninja-form .nf-field input[type="text"], {{WRAPPER}} .eael-ninja-form .nf-field input[type="email"], {{WRAPPER}} .eael-ninja-form .nf-field input[type="tel"], {{WRAPPER}} .eael-ninja-form .nf-field textarea, {{WRAPPER}} .eael-ninja-form .nf-field select' => 'color: {{VALUE}}',
602	],
603	]
604	);
605
606	$this->add_group_control(
607	Group_Control_Border::get_type(),
608	[
609	'name' => 'field_border',
610	'label' => __( 'Border', 'essential-addons-elementor' ),
611	'placeholder' => '1px',
612	'default' => '1px',
613	'selector' => '{{WRAPPER}} .eael-ninja-form .nf-field input[type="text"], {{WRAPPER}} .eael-ninja-form .nf-field input[type="email"], {{WRAPPER}} .eael-ninja-form .nf-field input[type="tel"], {{WRAPPER}} .eael-ninja-form .nf-field textarea, {{WRAPPER}} .eael-ninja-form .nf-field select',
614	'separator' => 'before',
615	]
616	);
617
618	$this->add_control(
619	'field_radius',
620	[
621	'label' => __( 'Border Radius', 'essential-addons-elementor' ),
622	'type' => Controls_Manager::DIMENSIONS,
623	'size_units' => [ 'px', 'em', '%' ],
624	'selectors' => [
625	'{{WRAPPER}} .eael-ninja-form .nf-field input[type="text"], {{WRAPPER}} .eael-ninja-form .nf-field input[type="email"], {{WRAPPER}} .eael-ninja-form .nf-field input[type="tel"], {{WRAPPER}} .eael-ninja-form .nf-field textarea, {{WRAPPER}} .eael-ninja-form .nf-field select' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
626	],
627	]
628	);
629
630	$this->add_responsive_control(
631	'text_indent',
632	[
633	'label' => __( 'Text Indent', 'essential-addons-elementor' ),
634	'type' => Controls_Manager::SLIDER,
635	'range' => [
636	'px' => [
637	'min' => 0,
638	'max' => 60,
639	'step' => 1,
640	],
641	'%' => [
642	'min' => 0,
643	'max' => 30,
644	'step' => 1,
645	],
646	],
647	'size_units' => [ 'px', 'em', '%' ],
648	'selectors' => [
649	'{{WRAPPER}} .eael-ninja-form .nf-field input[type="text"], {{WRAPPER}} .eael-ninja-form .nf-field input[type="email"], {{WRAPPER}} .eael-ninja-form .nf-field input[type="tel"], {{WRAPPER}} .eael-ninja-form .nf-field textarea, {{WRAPPER}} .eael-ninja-form .nf-field select' => 'text-indent: {{SIZE}}{{UNIT}}',
650	],
651	'separator' => 'before',
652	]
653	);
654
655	$this->add_responsive_control(
656	'input_width',
657	[
658	'label' => __( 'Input Width', 'essential-addons-elementor' ),
659	'type' => Controls_Manager::SLIDER,
660	'range' => [
661	'px' => [
662	'min' => 0,
663	'max' => 1200,
664	'step' => 1,
665	],
666	],
667	'size_units' => [ 'px', 'em', '%' ],
668	'selectors' => [
669	'{{WRAPPER}} .eael-ninja-form .nf-field input[type="text"], {{WRAPPER}} .eael-ninja-form .nf-field input[type="email"], {{WRAPPER}} .eael-ninja-form .nf-field input[type="tel"], {{WRAPPER}} .eael-ninja-form .nf-field select' => 'width: {{SIZE}}{{UNIT}}',
670	],
671	'separator' => 'before',
672	]
673	);
674
675	$this->add_responsive_control(
676	'input_height',
677	[
678	'label' => __( 'Input Height', 'essential-addons-elementor' ),
679	'type' => Controls_Manager::SLIDER,
680	'range' => [
681	'px' => [
682	'min' => 0,
683	'max' => 80,
684	'step' => 1,
685	],
686	],
687	'size_units' => [ 'px', 'em', '%' ],
688	'selectors' => [
689	'{{WRAPPER}} .eael-ninja-form .nf-field input[type="text"], {{WRAPPER}} .eael-ninja-form .nf-field input[type="email"], {{WRAPPER}} .eael-ninja-form .nf-field input[type="tel"], {{WRAPPER}} .eael-ninja-form .nf-field select' => 'height: {{SIZE}}{{UNIT}}',
690	],
691	]
692	);
693
694	$this->add_responsive_control(
695	'textarea_width',
696	[
697	'label' => __( 'Textarea Width', 'essential-addons-elementor' ),
698	'type' => Controls_Manager::SLIDER,
699	'range' => [
700	'px' => [
701	'min' => 0,
702	'max' => 1200,
703	'step' => 1,
704	],
705	],
706	'size_units' => [ 'px', 'em', '%' ],
707	'selectors' => [
708	'{{WRAPPER}} .eael-ninja-form .nf-field textarea' => 'width: {{SIZE}}{{UNIT}}',
709	],
710	]
711	);
712
713	$this->add_responsive_control(
714	'textarea_height',
715	[
716	'label' => __( 'Textarea Height', 'essential-addons-elementor' ),
717	'type' => Controls_Manager::SLIDER,
718	'range' => [
719	'px' => [
720	'min' => 0,
721	'max' => 400,
722	'step' => 1,
723	],
724	],
725	'size_units' => [ 'px', 'em', '%' ],
726	'selectors' => [
727	'{{WRAPPER}} .eael-ninja-form .nf-field textarea' => 'height: {{SIZE}}{{UNIT}}',
728	],
729	]
730	);
731
732	$this->add_responsive_control(
733	'field_padding',
734	[
735	'label' => __( 'Padding', 'essential-addons-elementor' ),
736	'type' => Controls_Manager::DIMENSIONS,
737	'size_units' => [ 'px', 'em', '%' ],
738	'selectors' => [
739	'{{WRAPPER}} .eael-ninja-form .nf-field input[type="text"], {{WRAPPER}} .eael-ninja-form .nf-field input[type="email"], {{WRAPPER}} .eael-ninja-form .nf-field input[type="tel"], {{WRAPPER}} .eael-ninja-form .nf-field textarea, {{WRAPPER}} .eael-ninja-form .nf-field select' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
740	],
741	'separator' => 'before',
742	]
743	);
744
745	$this->add_responsive_control(
746	'field_spacing',
747	[
748	'label' => __( 'Spacing', 'essential-addons-elementor' ),
749	'type' => Controls_Manager::SLIDER,
750	'range' => [
751	'px' => [
752	'min' => 0,
753	'max' => 100,
754	'step' => 1,
755	],
756	],
757	'size_units' => [ 'px', 'em', '%' ],
758	'selectors' => [
759	'{{WRAPPER}} .eael-ninja-form .nf-field-container' => 'margin-bottom: {{SIZE}}{{UNIT}}',
760	],
761	]
762	);
763
764	$this->add_group_control(
765	Group_Control_Typography::get_type(),
766	[
767	'name' => 'field_typography',
768	'label' => __( 'Typography', 'essential-addons-elementor' ),
769	'selector' => '{{WRAPPER}} .eael-ninja-form .nf-field input[type="text"], {{WRAPPER}} .eael-ninja-form .nf-field input[type="email"], {{WRAPPER}} .eael-ninja-form .nf-field input[type="tel"], {{WRAPPER}} .eael-ninja-form .nf-field textarea, {{WRAPPER}} .eael-ninja-form .nf-field select',
770	'separator' => 'before',
771	]
772	);
773
774	$this->add_group_control(
775	Group_Control_Box_Shadow::get_type(),
776	[
777	'name' => 'field_box_shadow',
778	'selector' => '{{WRAPPER}} .eael-ninja-form .nf-field input[type="text"], {{WRAPPER}} .eael-ninja-form .nf-field input[type="email"], {{WRAPPER}} .eael-ninja-form .nf-field input[type="tel"], {{WRAPPER}} .eael-ninja-form .nf-field textarea, {{WRAPPER}} .eael-ninja-form .nf-field select',
779	'separator' => 'before',
780	]
781	);
782
783	$this->end_controls_tab();
784
785	$this->start_controls_tab(
786	'tab_fields_focus',
787	[
788	'label' => __( 'Focus', 'essential-addons-elementor' ),
789	]
790	);
791
792	$this->add_control(
793	'field_bg_color_focus',
794	[
795	'label' => __( 'Background Color', 'essential-addons-elementor' ),
796	'type' => Controls_Manager::COLOR,
797	'default' => '',
798	'selectors' => [
799	'{{WRAPPER}} .eael-ninja-form .nf-field input:focus, {{WRAPPER}} .eael-ninja-form .nf-field textarea:focus' => 'background-color: {{VALUE}}',
800	],
801	]
802	);
803
804	$this->add_group_control(
805	Group_Control_Border::get_type(),
806	[
807	'name' => 'focus_input_border',
808	'label' => __( 'Border', 'essential-addons-elementor' ),
809	'placeholder' => '1px',
810	'default' => '1px',
811	'selector' => '{{WRAPPER}} .eael-ninja-form .nf-field input:focus, {{WRAPPER}} .eael-ninja-form .nf-field textarea:focus',
812	]
813	);
814
815	$this->add_group_control(
816	Group_Control_Box_Shadow::get_type(),
817	[
818	'name' => 'focus_box_shadow',
819	'selector' => '{{WRAPPER}} .eael-ninja-form .nf-field input:focus, {{WRAPPER}} .eael-ninja-form .nf-field textarea:focus',
820	'separator' => 'before',
821	]
822	);
823
824	$this->end_controls_tab();
825
826	$this->end_controls_tabs();
827
828	$this->end_controls_section();
829
830	/**
831	* Style Tab: Field Description
832	* -------------------------------------------------
833	*/
834	$this->start_controls_section(
835	'section_field_description_style',
836	[
837	'label' => __( 'Field Description', 'essential-addons-elementor' ),
838	'tab' => Controls_Manager::TAB_STYLE,
839	]
840	);
841
842	$this->add_control(
843	'field_description_text_color',
844	[
845	'label' => __( 'Text Color', 'essential-addons-elementor' ),
846	'type' => Controls_Manager::COLOR,
847	'selectors' => [
848	'{{WRAPPER}} .eael-ninja-form .nf-field .nf-field-description' => 'color: {{VALUE}}',
849	],
850	]
851	);
852
853	$this->add_group_control(
854	Group_Control_Typography::get_type(),
855	[
856	'name' => 'field_description_typography',
857	'label' => __( 'Typography', 'essential-addons-elementor' ),
858	'selector' => '{{WRAPPER}} .eael-ninja-form .nf-field .nf-field-description',
859	]
860	);
861
862	$this->add_responsive_control(
863	'field_description_spacing',
864	[
865	'label' => __( 'Spacing', 'essential-addons-elementor' ),
866	'type' => Controls_Manager::SLIDER,
867	'range' => [
868	'px' => [
869	'min' => 0,
870	'max' => 100,
871	'step' => 1,
872	],
873	],
874	'size_units' => [ 'px', 'em', '%' ],
875	'selectors' => [
876	'{{WRAPPER}} .eael-ninja-form .nf-field .nf-field-description' => 'margin-bottom: {{SIZE}}{{UNIT}}',
877	],
878	]
879	);
880
881	$this->end_controls_section();
882
883	/**
884	* Style Tab: Placeholder
885	* -------------------------------------------------
886	*/
887	$this->start_controls_section(
888	'section_placeholder_style',
889	[
890	'label' => __( 'Placeholder', 'essential-addons-elementor' ),
891	'tab' => Controls_Manager::TAB_STYLE,
892	'condition' => [
893	'placeholder_switch' => 'yes',
894	],
895	]
896	);
897
898	$this->add_control(
899	'text_color_placeholder',
900	[
901	'label' => __( 'Text Color', 'essential-addons-elementor' ),
902	'type' => Controls_Manager::COLOR,
903	'selectors' => [
904	'{{WRAPPER}} .eael-ninja-form .nf-field input::-webkit-input-placeholder, {{WRAPPER}} .eael-ninja-form .nf-field textarea::-webkit-input-placeholder' => 'color: {{VALUE}}',
905	'{{WRAPPER}} .eael-ninja-form .nf-field input::-moz-input-placeholder, {{WRAPPER}} .eael-ninja-form .nf-field textarea::-moz-input-placeholder' => 'color: {{VALUE}}',
906	'{{WRAPPER}} .eael-ninja-form .nf-field input:-ms-input-placeholder, {{WRAPPER}} .eael-ninja-form .nf-field textarea:-ms-input-placeholder' => 'color: {{VALUE}}',
907	'{{WRAPPER}} .eael-ninja-form .nf-field input:-moz-placeholder, {{WRAPPER}} .eael-ninja-form .nf-field textarea:-moz-placeholder' => 'color: {{VALUE}}',
908	],
909	'condition' => [
910	'placeholder_switch' => 'yes',
911	],
912	]
913	);
914
915	$this->end_controls_section();
916
917	/**
918	* Style Tab: Radio & Checkbox
919	* -------------------------------------------------
920	*/
921	$this->start_controls_section(
922	'section_radio_checkbox_style',
923	[
924	'label' => __( 'Radio & Checkbox', 'essential-addons-elementor' ),
925	'tab' => Controls_Manager::TAB_STYLE,
926	]
927	);
928
929	$this->add_control(
930	'custom_radio_checkbox',
931	[
932	'label' => __( 'Custom Styles', 'essential-addons-elementor' ),
933	'type' => Controls_Manager::SWITCHER,
934	'label_on' => __( 'Yes', 'essential-addons-elementor' ),
935	'label_off' => __( 'No', 'essential-addons-elementor' ),
936	'return_value' => 'yes',
937	]
938	);
939
940	$this->add_responsive_control(
941	'radio_checkbox_size',
942	[
943	'label' => __( 'Size', 'essential-addons-elementor' ),
944	'type' => Controls_Manager::SLIDER,
945	'default' => [
946	'size' => '15',
947	'unit' => 'px'
948	],
949	'range' => [
950	'px' => [
951	'min' => 0,
952	'max' => 80,
953	'step' => 1,
954	],
955	],
956	'size_units' => [ 'px', 'em', '%' ],
957	'selectors' => [
958	'{{WRAPPER}} .eael-custom-radio-checkbox input[type="checkbox"], {{WRAPPER}} .eael-custom-radio-checkbox input[type="radio"]' => 'width: {{SIZE}}{{UNIT}} !important; height: {{SIZE}}{{UNIT}}',
959	],
960	'condition' => [
961	'custom_radio_checkbox' => 'yes',
962	],
963	]
964	);
965
966	$this->start_controls_tabs( 'tabs_radio_checkbox_style' );
967
968	$this->start_controls_tab(
969	'radio_checkbox_normal',
970	[
971	'label' => __( 'Normal', 'essential-addons-elementor' ),
972	'condition' => [
973	'custom_radio_checkbox' => 'yes',
974	],
975	]
976	);
977
978	$this->add_control(
979	'radio_checkbox_color',
980	[
981	'label' => __( 'Color', 'essential-addons-elementor' ),
982	'type' => Controls_Manager::COLOR,
983	'default' => '',
984	'selectors' => [
985	'{{WRAPPER}} .eael-custom-radio-checkbox input[type="checkbox"], {{WRAPPER}} .eael-custom-radio-checkbox input[type="radio"]' => 'background: {{VALUE}}',
986	],
987	'condition' => [
988	'custom_radio_checkbox' => 'yes',
989	],
990	]
991	);
992
993	$this->add_responsive_control(
994	'radio_checkbox_border_width',
995	[
996	'label' => __( 'Border Width', 'essential-addons-elementor' ),
997	'type' => Controls_Manager::SLIDER,
998	'range' => [
999	'px' => [
1000	'min' => 0,
1001	'max' => 15,
1002	'step' => 1,
1003	],
1004	],
1005	'size_units' => [ 'px' ],
1006	'selectors' => [
1007	'{{WRAPPER}} .eael-custom-radio-checkbox input[type="checkbox"], {{WRAPPER}} .eael-custom-radio-checkbox input[type="radio"]' => 'border-width: {{SIZE}}{{UNIT}}',
1008	],
1009	'condition' => [
1010	'custom_radio_checkbox' => 'yes',
1011	],
1012	]
1013	);
1014
1015	$this->add_control(
1016	'radio_checkbox_border_color',
1017	[
1018	'label' => __( 'Border Color', 'essential-addons-elementor' ),
1019	'type' => Controls_Manager::COLOR,
1020	'default' => '',
1021	'selectors' => [
1022	'{{WRAPPER}} .eael-custom-radio-checkbox input[type="checkbox"], {{WRAPPER}} .eael-custom-radio-checkbox input[type="radio"]' => 'border-color: {{VALUE}}',
1023	],
1024	'condition' => [
1025	'custom_radio_checkbox' => 'yes',
1026	],
1027	]
1028	);
1029
1030	$this->add_control(
1031	'checkbox_heading',
1032	[
1033	'label' => __( 'Checkbox', 'essential-addons-elementor' ),
1034	'type' => Controls_Manager::HEADING,
1035	'condition' => [
1036	'custom_radio_checkbox' => 'yes',
1037	],
1038	]
1039	);
1040
1041	$this->add_control(
1042	'checkbox_border_radius',
1043	[
1044	'label' => __( 'Border Radius', 'essential-addons-elementor' ),
1045	'type' => Controls_Manager::DIMENSIONS,
1046	'size_units' => [ 'px', 'em', '%' ],
1047	'selectors' => [
1048	'{{WRAPPER}} .eael-custom-radio-checkbox input[type="checkbox"], {{WRAPPER}} .eael-custom-radio-checkbox input[type="checkbox"]:before' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1049	],
1050	'condition' => [
1051	'custom_radio_checkbox' => 'yes',
1052	],
1053	]
1054	);
1055
1056	$this->add_control(
1057	'radio_heading',
1058	[
1059	'label' => __( 'Radio Buttons', 'essential-addons-elementor' ),
1060	'type' => Controls_Manager::HEADING,
1061	'condition' => [
1062	'custom_radio_checkbox' => 'yes',
1063	],
1064	]
1065	);
1066
1067	$this->add_control(
1068	'radio_border_radius',
1069	[
1070	'label' => __( 'Border Radius', 'essential-addons-elementor' ),
1071	'type' => Controls_Manager::DIMENSIONS,
1072	'size_units' => [ 'px', 'em', '%' ],
1073	'selectors' => [
1074	'{{WRAPPER}} .eael-custom-radio-checkbox input[type="radio"], {{WRAPPER}} .eael-custom-radio-checkbox input[type="radio"]:before' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1075	],
1076	'condition' => [
1077	'custom_radio_checkbox' => 'yes',
1078	],
1079	]
1080	);
1081
1082	$this->end_controls_tab();
1083
1084	$this->start_controls_tab(
1085	'radio_checkbox_checked',
1086	[
1087	'label' => __( 'Checked', 'essential-addons-elementor' ),
1088	'condition' => [
1089	'custom_radio_checkbox' => 'yes',
1090	],
1091	]
1092	);
1093
1094	$this->add_control(
1095	'radio_checkbox_color_checked',
1096	[
1097	'label' => __( 'Color', 'essential-addons-elementor' ),
1098	'type' => Controls_Manager::COLOR,
1099	'default' => '',
1100	'selectors' => [
1101	'{{WRAPPER}} .eael-custom-radio-checkbox input[type="checkbox"]:checked:before, {{WRAPPER}} .eael-custom-radio-checkbox input[type="radio"]:checked:before' => 'background: {{VALUE}}',
1102	],
1103	'condition' => [
1104	'custom_radio_checkbox' => 'yes',
1105	],
1106	]
1107	);
1108
1109	$this->end_controls_tab();
1110
1111	$this->end_controls_tabs();
1112
1113	$this->end_controls_section();
1114
1115	/**
1116	* Style Tab: Submit Button
1117	* -------------------------------------------------
1118	*/
1119	$this->start_controls_section(
1120	'section_submit_button_style',
1121	[
1122	'label' => __( 'Submit Button', 'essential-addons-elementor' ),
1123	'tab' => Controls_Manager::TAB_STYLE,
1124	]
1125	);
1126
1127	$this->add_responsive_control(
1128	'button_align',
1129	[
1130	'label' => __( 'Alignment', 'essential-addons-elementor' ),
1131	'type' => Controls_Manager::CHOOSE,
1132	'options' => [
1133	'left' => [
1134	'title' => __( 'Left', 'essential-addons-elementor' ),
1135	'icon' => 'eicon-h-align-left',
1136	],
1137	'center' => [
1138	'title' => __( 'Center', 'essential-addons-elementor' ),
1139	'icon' => 'eicon-h-align-center',
1140	],
1141	'right' => [
1142	'title' => __( 'Right', 'essential-addons-elementor' ),
1143	'icon' => 'eicon-h-align-right',
1144	],
1145	],
1146	'default' => '',
1147	'selectors' => [
1148	'{{WRAPPER}} .eael-ninja-form .submit-container' => 'text-align: {{VALUE}};',
1149	],
1150	'condition' => [
1151	'button_width_type' => 'custom',
1152	],
1153	]
1154	);
1155
1156	$this->add_control(
1157	'button_width_type',
1158	[
1159	'label' => __( 'Width', 'essential-addons-elementor' ),
1160	'type' => Controls_Manager::SELECT,
1161	'default' => 'custom',
1162	'options' => [
1163	'full-width' => __( 'Full Width', 'essential-addons-elementor' ),
1164	'custom' => __( 'Custom', 'essential-addons-elementor' ),
1165	],
1166	'prefix_class' => 'eael-ninja-form-button-',
1167	]
1168	);
1169
1170	$this->add_responsive_control(
1171	'button_width',
1172	[
1173	'label' => __( 'Width', 'essential-addons-elementor' ),
1174	'type' => Controls_Manager::SLIDER,
1175	'default' => [
1176	'size' => '130',
1177	'unit' => 'px'
1178	],
1179	'range' => [
1180	'px' => [
1181	'min' => 0,
1182	'max' => 1200,
1183	'step' => 1,
1184	],
1185	],
1186	'size_units' => [ 'px', '%' ],
1187	'selectors' => [
1188	'{{WRAPPER}} .eael-ninja-form .submit-container input[type="button"]' => 'width: {{SIZE}}{{UNIT}}',
1189	],
1190	'condition' => [
1191	'button_width_type' => 'custom',
1192	],
1193	]
1194	);
1195
1196	$this->start_controls_tabs( 'tabs_button_style' );
1197
1198	$this->start_controls_tab(
1199	'tab_button_normal',
1200	[
1201	'label' => __( 'Normal', 'essential-addons-elementor' ),
1202	]
1203	);
1204
1205	$this->add_control(
1206	'button_bg_color_normal',
1207	[
1208	'label' => __( 'Background Color', 'essential-addons-elementor' ),
1209	'type' => Controls_Manager::COLOR,
1210	'default' => '',
1211	'selectors' => [
1212	'{{WRAPPER}} .eael-ninja-form .submit-container input[type="button"]' => 'background-color: {{VALUE}}',
1213	],
1214	]
1215	);
1216
1217	$this->add_control(
1218	'button_text_color_normal',
1219	[
1220	'label' => __( 'Text Color', 'essential-addons-elementor' ),
1221	'type' => Controls_Manager::COLOR,
1222	'default' => '',
1223	'selectors' => [
1224	'{{WRAPPER}} .eael-ninja-form .submit-container input[type="button"]' => 'color: {{VALUE}}',
1225	],
1226	]
1227	);
1228
1229	$this->add_group_control(
1230	Group_Control_Border::get_type(),
1231	[
1232	'name' => 'button_border_normal',
1233	'label' => __( 'Border', 'essential-addons-elementor' ),
1234	'placeholder' => '1px',
1235	'default' => '1px',
1236	'selector' => '{{WRAPPER}} .eael-ninja-form .submit-container input[type="button"]',
1237	]
1238	);
1239
1240	$this->add_control(
1241	'button_border_radius',
1242	[
1243	'label' => __( 'Border Radius', 'essential-addons-elementor' ),
1244	'type' => Controls_Manager::DIMENSIONS,
1245	'size_units' => [ 'px', 'em', '%' ],
1246	'selectors' => [
1247	'{{WRAPPER}} .eael-ninja-form .submit-container input[type="button"]' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1248	],
1249	]
1250	);
1251
1252	$this->add_responsive_control(
1253	'button_padding',
1254	[
1255	'label' => __( 'Padding', 'essential-addons-elementor' ),
1256	'type' => Controls_Manager::DIMENSIONS,
1257	'size_units' => [ 'px', 'em', '%' ],
1258	'selectors' => [
1259	'{{WRAPPER}} .eael-ninja-form .submit-container input[type="button"]' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1260	],
1261	]
1262	);
1263
1264	$this->add_responsive_control(
1265	'button_margin',
1266	[
1267	'label' => __( 'Margin Top', 'essential-addons-elementor' ),
1268	'type' => Controls_Manager::SLIDER,
1269	'range' => [
1270	'px' => [
1271	'min' => 0,
1272	'max' => 100,
1273	'step' => 1,
1274	],
1275	],
1276	'size_units' => [ 'px', 'em', '%' ],
1277	'selectors' => [
1278	'{{WRAPPER}} .eael-ninja-form .submit-container input[type="button"]' => 'margin-top: {{SIZE}}{{UNIT}}',
1279	],
1280	]
1281	);
1282
1283	$this->end_controls_tab();
1284
1285	$this->start_controls_tab(
1286	'tab_button_hover',
1287	[
1288	'label' => __( 'Hover', 'essential-addons-elementor' ),
1289	]
1290	);
1291
1292	$this->add_control(
1293	'button_bg_color_hover',
1294	[
1295	'label' => __( 'Background Color', 'essential-addons-elementor' ),
1296	'type' => Controls_Manager::COLOR,
1297	'default' => '',
1298	'selectors' => [
1299	'{{WRAPPER}} .eael-ninja-form .submit-container input[type="button"]:hover' => 'background-color: {{VALUE}}',
1300	],
1301	]
1302	);
1303
1304	$this->add_control(
1305	'button_text_color_hover',
1306	[
1307	'label' => __( 'Text Color', 'essential-addons-elementor' ),
1308	'type' => Controls_Manager::COLOR,
1309	'default' => '',
1310	'selectors' => [
1311	'{{WRAPPER}} .eael-ninja-form .submit-container input[type="button"]:hover' => 'color: {{VALUE}}',
1312	],
1313	]
1314	);
1315
1316	$this->add_control(
1317	'button_border_color_hover',
1318	[
1319	'label' => __( 'Border Color', 'essential-addons-elementor' ),
1320	'type' => Controls_Manager::COLOR,
1321	'default' => '',
1322	'selectors' => [
1323	'{{WRAPPER}} .eael-ninja-form .submit-container input[type="button"]:hover' => 'border-color: {{VALUE}}',
1324	],
1325	]
1326	);
1327
1328	$this->end_controls_tab();
1329
1330	$this->end_controls_tabs();
1331
1332	$this->add_group_control(
1333	Group_Control_Typography::get_type(),
1334	[
1335	'name' => 'button_typography',
1336	'label' => __( 'Typography', 'essential-addons-elementor' ),
1337	'scheme' => Scheme_Typography::TYPOGRAPHY_4,
1338	'selector' => '{{WRAPPER}} .eael-ninja-form .submit-container input[type="button"]',
1339	'separator' => 'before',
1340	]
1341	);
1342
1343	$this->add_group_control(
1344	Group_Control_Box_Shadow::get_type(),
1345	[
1346	'name' => 'button_box_shadow',
1347	'selector' => '{{WRAPPER}} .eael-ninja-form .submit-container input[type="button"]',
1348	'separator' => 'before',
1349	]
1350	);
1351
1352	$this->end_controls_section();
1353
1354	/**
1355	* Style Tab: Success Message
1356	* -------------------------------------------------
1357	*/
1358	$this->start_controls_section(
1359	'section_success_message_style',
1360	[
1361	'label' => __( 'Success Message', 'essential-addons-elementor' ),
1362	'tab' => Controls_Manager::TAB_STYLE,
1363	]
1364	);
1365
1366	$this->add_control(
1367	'success_message_text_color',
1368	[
1369	'label' => __( 'Text Color', 'essential-addons-elementor' ),
1370	'type' => Controls_Manager::COLOR,
1371	'selectors' => [
1372	'{{WRAPPER}} .eael-ninja-form .nf-response-msg' => 'color: {{VALUE}}',
1373	],
1374	]
1375	);
1376
1377	$this->add_group_control(
1378	Group_Control_Typography::get_type(),
1379	[
1380	'name' => 'success_message_typography',
1381	'label' => __( 'Typography', 'essential-addons-elementor' ),
1382	'selector' => '{{WRAPPER}} .eael-ninja-form .nf-response-msg',
1383	]
1384	);
1385
1386	$this->end_controls_section();
1387
1388	/**
1389	* Style Tab: Required Fields Notice
1390	* -------------------------------------------------
1391	*/
1392	$this->start_controls_section(
1393	'section_required_notice_style',
1394	[
1395	'label' => __( 'Required Fields Notice', 'essential-addons-elementor' ),
1396	'tab' => Controls_Manager::TAB_STYLE,
1397	]
1398	);
1399
1400	$this->add_control(
1401	'required_notice_text_color',
1402	[
1403	'label' => __( 'Color', 'essential-addons-elementor' ),
1404	'type' => Controls_Manager::COLOR,
1405	'default' => '',
1406	'selectors' => [
1407	'{{WRAPPER}} .eael-ninja-form .nf-form-fields-required' => 'color: {{VALUE}}',
1408	],
1409	]
1410	);
1411
1412	$this->add_responsive_control(
1413	'required_notice_spacing',
1414	[
1415	'label' => __( 'Spacing', 'essential-addons-elementor' ),
1416	'type' => Controls_Manager::SLIDER,
1417	'range' => [
1418	'px' => [
1419	'min' => 0,
1420	'max' => 100,
1421	'step' => 1,
1422	],
1423	],
1424	'size_units' => [ 'px', 'em', '%' ],
1425	'selectors' => [
1426	'{{WRAPPER}} .eael-ninja-form .nf-form-fields-required' => 'margin-bottom: {{SIZE}}{{UNIT}}',
1427	],
1428	]
1429	);
1430
1431	$this->add_group_control(
1432	Group_Control_Typography::get_type(),
1433	[
1434	'name' => 'required_notice_typography',
1435	'label' => __( 'Typography', 'essential-addons-elementor' ),
1436	'scheme' => Scheme_Typography::TYPOGRAPHY_4,
1437	'selector' => '{{WRAPPER}} .eael-ninja-form .nf-form-fields-required',
1438	]
1439	);
1440
1441	$this->end_controls_section();
1442
1443	/**
1444	* Style Tab: Errors
1445	* -------------------------------------------------
1446	*/
1447	$this->start_controls_section(
1448	'section_error_style',
1449	[
1450	'label' => __( 'Errors', 'essential-addons-elementor' ),
1451	'tab' => Controls_Manager::TAB_STYLE,
1452	]
1453	);
1454
1455	$this->add_control(
1456	'error_messages_heading',
1457	[
1458	'label' => __( 'Error Messages', 'essential-addons-elementor' ),
1459	'type' => Controls_Manager::HEADING,
1460	'condition' => [
1461	'error_messages' => 'show',
1462	],
1463	]
1464	);
1465
1466	$this->add_control(
1467	'error_message_text_color',
1468	[
1469	'label' => __( 'Text Color', 'essential-addons-elementor' ),
1470	'type' => Controls_Manager::COLOR,
1471	'default' => '',
1472	'selectors' => [
1473	'{{WRAPPER}} .eael-ninja-form .nf-error-wrap .nf-error-required-error' => 'color: {{VALUE}}',
1474	],
1475	'condition' => [
1476	'error_messages' => 'show',
1477	],
1478	]
1479	);
1480
1481	$this->add_control(
1482	'validation_errors_heading',
1483	[
1484	'label' => __( 'Validation Errors', 'essential-addons-elementor' ),
1485	'type' => Controls_Manager::HEADING,
1486	'separator' => 'before',
1487	'condition' => [
1488	'validation_errors' => 'show',
1489	],
1490	]
1491	);
1492
1493	$this->add_control(
1494	'validation_error_description_color',
1495	[
1496	'label' => __( 'Error Description Color', 'essential-addons-elementor' ),
1497	'type' => Controls_Manager::COLOR,
1498	'default' => '',
1499	'selectors' => [
1500	'{{WRAPPER}} .eael-ninja-form .nf-form-errors .nf-error-field-errors' => 'color: {{VALUE}}',
1501	],
1502	'condition' => [
1503	'validation_errors' => 'show',
1504	],
1505	]
1506	);
1507
1508	$this->add_control(
1509	'validation_error_field_input_border_color',
1510	[
1511	'label' => __( 'Error Field Input Border Color', 'essential-addons-elementor' ),
1512	'type' => Controls_Manager::COLOR,
1513	'default' => '',
1514	'selectors' => [
1515	'{{WRAPPER}} .eael-ninja-form .nf-error .ninja-forms-field' => 'border-color: {{VALUE}}',
1516	],
1517	'condition' => [
1518	'validation_errors' => 'show',
1519	],
1520	]
1521	);
1522
1523	$this->end_controls_section();
1524
1525	}
1526
1527	protected function render() {
1528	$settings = $this->get_settings();
1529
1530	$this->add_render_attribute( 'contact-form', 'class', [
1531	'eael-contact-form',
1532	'eael-ninja-form',
1533	]
1534	);
1535
1536	$this->add_render_attribute( 'contact-form', 'id', [
1537	'eael-ninja-form-' . get_the_ID(),
1538	]
1539	);
1540
1541	if ( $settings['placeholder_switch'] != 'yes' ) {
1542	$this->add_render_attribute( 'contact-form', 'class', 'placeholder-hide' );
1543	}
1544
1545	if ( $settings['custom_title_description'] == 'yes' ) {
1546	$this->add_render_attribute( 'contact-form', 'class', 'title-description-hide' );
1547	}
1548
1549	if ( $settings['custom_radio_checkbox'] == 'yes' ) {
1550	$this->add_render_attribute( 'contact-form', 'class', 'eael-custom-radio-checkbox' );
1551	}
1552	if ( $settings['eael_contact_form_alignment'] == 'left' ) {
1553	$this->add_render_attribute( 'contact-form', 'class', 'eael-contact-form-align-left' );
1554	}
1555	elseif ( $settings['eael_contact_form_alignment'] == 'center' ) {
1556	$this->add_render_attribute( 'contact-form', 'class', 'eael-contact-form-align-center' );
1557	}
1558	elseif ( $settings['eael_contact_form_alignment'] == 'right' ) {
1559	$this->add_render_attribute( 'contact-form', 'class', 'eael-contact-form-align-right' );
1560	}
1561	else {
1562	$this->add_render_attribute( 'contact-form', 'class', 'eael-contact-form-align-default' );
1563	}
1564	if ( class_exists( 'Ninja_Forms' ) ) {
1565	if ( ! empty( $settings['contact_form_list'] ) ) { ?>
1566	<div <?php echo $this->get_render_attribute_string( 'contact-form' ); ?>>
1567	<?php if ( $settings['custom_title_description'] == 'yes' ) { ?>
1568	<div class="eael-ninja-form-heading">
1569	<?php if ( $settings['form_title_custom'] != '' ) { ?>
1570	<h3 class="eael-contact-form-title eael-ninja-form-title">
1571	<?php echo esc_attr( $settings['form_title_custom'] ); ?>
1572	</h3>
1573	<?php } ?>
1574	<?php if ( $settings['form_description_custom'] != '' ) { ?>
1575	<div class="eael-contact-form-description eael-ninja-form-description">
1576	<?php echo $this->parse_text_editor( $settings['form_description_custom'] ); ?>
1577	</div>
1578	<?php } ?>
1579	</div>
1580	<?php } ?>
1581	<?php
1582	$eael_form_id = $settings['contact_form_list'];
1583
1584	echo do_shortcode( '[ninja_form id="' . $eael_form_id . '" ]' );
1585	?>
1586	</div>
1587	<?php
1588	}
1589	}
1590	}
1591
1592	protected function _content_template() {}
1593
1594	}