uicore-elements / includes / widgets / contact-form.php

contact-form.php in UiCore Elements – Free widgets and templates for Elementor 1.0.11, at includes/widgets/contact-form.php

2,463 lines 92.7 KB

Raw Download Zip

1	<?php
2	namespace UiCoreElements;
3
4	use UiCoreElements\Helper;
5	use UiCoreElements\Utils\Contact_Form_Service;
6	use UiCoreElements\Utils\Form_Component;
7	use Elementor\Controls_Manager;
8	use Elementor\Icons_Manager;
9	use Elementor\Utils;
10	use Elementor\Repeater;
11	use Elementor\Group_Control_Typography;
12	use Elementor\Group_Control_Border;
13	use Elementor\Core\Kits\Documents\Tabs\Global_Colors;
14	use Elementor\Core\Kits\Documents\Tabs\Global_Typography;
15
16
17	defined('ABSPATH') \|\| exit();
18
19	/**
20	* Contact Form
21	*
22	* @author Lucas Marini Falbo <[email protected]>
23	* @since 1.0.5
24	*/
25
26	class ContactForm extends UiCoreWidget {
27
28	use Form_Component;
29
30	public function get_name() {
31	return 'uicore-contact-form';
32	}
33
34	public function get_title() {
35	return __( 'Contact Form', 'uicore-elements' );
36	}
37
38	public function get_icon() {
39	return 'eicon-form-horizontal ui-e-widget';
40	}
41	public function get_categories()
42	{
43	return ['uicore'];
44	}
45	public function get_keywords() {
46	return [ 'form', 'forms', 'contact', 'mail', 'send', 'field', 'button', 'recaptcha', ];
47	}
48	public function get_styles()
49	{
50	return ['contact-form'];
51	}
52	public function get_scripts()
53	{
54	return [
55	'contact-form',
56	'recaptcha' => [
57	'custom_condition' => $this->check_recaptcha_version('v2')
58	],
59	'recaptcha-v3' => [
60	'custom_condition' => $this->check_recaptcha_version('v3')
61	],
62	'repeater-custom-key' => [
63	'custom_condition' => $this->is_edit_mode()
64	]
65	];
66	}
67	function check_recaptcha_version($version)
68	{
69
70	if($this->is_edit_mode()){
71	return true;
72	}
73	$settings = $this->get_settings_for_display();
74	foreach ($settings['form_fields'] as $field) {
75	$version_to_check = $version === 'v2' ? 'recaptcha' : 'recaptcha_v3';
76	if($field['field_type'] === $version_to_check){
77	return true;
78	}
79	}
80	return false;
81	}
82
83	// Helper Functions
84	function get_field_types()
85	{
86	return [
87	'text' => esc_html__( 'Text', 'uicore-elements' ),
88	'email' => esc_html__( 'Email', 'uicore-elements' ),
89	'textarea' => esc_html__( 'Textarea', 'uicore-elements' ),
90	'url' => esc_html__( 'URL', 'uicore-elements' ),
91	'tel' => esc_html__( 'Tel', 'uicore-elements' ),
92	'radio' => esc_html__( 'Radio', 'uicore-elements' ),
93	'select' => esc_html__( 'Select', 'uicore-elements' ),
94	'checkbox' => esc_html__( 'Checkbox', 'uicore-elements' ),
95	'acceptance' => esc_html__( 'Acceptance', 'uicore-elements' ),
96	'number' => esc_html__( 'Number', 'uicore-elements' ),
97	'date' => esc_html__( 'Date', 'uicore-elements' ),
98	'time' => esc_html__( 'Time', 'uicore-elements' ),
99	'file' => esc_html__( 'File Upload', 'uicore-elements' ),
100	'password' => esc_html__( 'Password', 'uicore-elements' ),
101	'address' => esc_html__( 'Honeypot', 'uicore-elements' ),
102	'recaptcha' => esc_html__( 'reCAPTCHA', 'uicore-elements' ),
103	'recaptcha_v3' => esc_html__( 'reCAPTCHA V3', 'uicore-elements' ),
104	'html' => esc_html__( 'HTML', 'uicore-elements' ),
105	'hidden' => esc_html__( 'Hidden', 'uicore-elements' ),
106	];
107	}
108
109	function get_attribute_name( $item ) {
110	return "form_fields[{$item['custom_id']}]";
111	}
112	function get_attribute_id( $item ) {
113	return 'form-field-' . $item['custom_id'];
114	}
115	function add_required_attribute( $element ) {
116	$this->add_render_attribute( $element, 'required', 'required' );
117	$this->add_render_attribute( $element, 'aria-required', 'true' );
118	}
119
120	// Control Render Functions
121	function register_submit_email_controls($instance, $slug = '') {
122	$instance->add_control(
123	'email_to' . $slug,
124	[
125	'label' => esc_html__( 'To', 'uicore-elements' ),
126	'type' => Controls_Manager::TEXT,
127	'default' => get_option( 'admin_email' ),
128	'ai' => [
129	'active' => false,
130	],
131	'placeholder' => get_option( 'admin_email' ),
132	'label_block' => true,
133	'title' => esc_html__( 'Separate emails with commas', 'uicore-elements' ),
134	'render_type' => 'none',
135	'dynamic' => [
136	'active' => true,
137	],
138	]
139	);
140
141	/* translators: %s: Site title. */
142	$default_message = sprintf( html_entity_decode( esc_html__( 'New message from "%s"', 'uicore-elements' ) ), get_option( 'blogname' ) );
143
144	$instance->add_control(
145	'email_subject' . $slug,
146	[
147	'label' => esc_html__( 'Subject', 'uicore-elements' ),
148	'type' => Controls_Manager::TEXT,
149	'default' => $default_message,
150	'ai' => [
151	'active' => false,
152	],
153	'placeholder' => $default_message,
154	'label_block' => true,
155	'render_type' => 'none',
156	'dynamic' => [
157	'active' => true,
158	],
159	]
160	);
161
162	$instance->add_control(
163	'email_content' . $slug,
164	[
165	'label' => esc_html__( 'Message', 'uicore-elements' ),
166	'type' => Controls_Manager::TEXTAREA,
167	'default' => '[all-fields]',
168	'ai' => [
169	'active' => false,
170	],
171	'placeholder' => '[all-fields]',
172	'description' => sprintf(
173	/* translators: %s: The [all-fields] shortcode. */
174	esc_html__( 'By default, all form fields are sent via %s shortcode. To customize sent fields, copy the shortcode that appears inside each field and paste it above.', 'uicore-elements' ),
175	'<code>[all-fields]</code>'
176	),
177	'render_type' => 'none',
178	'dynamic' => [
179	'active' => true,
180	],
181	]
182	);
183
184	$site_domain = Helper::get_site_domain();
185
186	$instance->add_control(
187	'email_from' . $slug,
188	[
189	'label' => esc_html__( 'From Email', 'uicore-elements' ),
190	'type' => Controls_Manager::TEXT,
191	'default' => 'email@' . $site_domain,
192	'ai' => [
193	'active' => false,
194	],
195	'render_type' => 'none',
196	'dynamic' => [
197	'active' => true,
198	],
199	]
200	);
201
202	$instance->add_control(
203	'email_from_name' . $slug,
204	[
205	'label' => esc_html__( 'From Name', 'uicore-elements' ),
206	'type' => Controls_Manager::TEXT,
207	'default' => get_bloginfo( 'name' ),
208	'ai' => [
209	'active' => false,
210	],
211	'render_type' => 'none',
212	'dynamic' => [
213	'active' => true,
214	],
215	]
216	);
217
218	$instance->add_control(
219	'email_reply_to' . $slug,
220	[
221	'label' => esc_html__( 'Reply-To', 'uicore-elements' ),
222	'type' => Controls_Manager::TEXT,
223	'options' => [
224	'' => '',
225	],
226	'default' => 'noreply@' . Helper::get_site_domain(),
227	'render_type' => 'none',
228	]
229	);
230
231	$instance->add_control(
232	'email_to_cc' . $slug,
233	[
234	'label' => esc_html__( 'Cc', 'uicore-elements' ),
235	'type' => Controls_Manager::TEXT,
236	'default' => '',
237	'ai' => [
238	'active' => false,
239	],
240	'title' => esc_html__( 'Separate emails with commas', 'uicore-elements' ),
241	'render_type' => 'none',
242	'dynamic' => [
243	'active' => true,
244	],
245	]
246	);
247
248	$instance->add_control(
249	'email_to_bcc' . $slug,
250	[
251	'label' => esc_html__( 'Bcc', 'uicore-elements' ),
252	'type' => Controls_Manager::TEXT,
253	'default' => '',
254	'ai' => [
255	'active' => false,
256	],
257	'title' => esc_html__( 'Separate emails with commas', 'uicore-elements' ),
258	'render_type' => 'none',
259	'dynamic' => [
260	'active' => true,
261	],
262	]
263	);
264
265	$instance->add_control(
266	'form_metadata' . $slug,
267	[
268	'label' => esc_html__( 'Meta Data', 'uicore-elements' ),
269	'type' => Controls_Manager::SELECT2,
270	'multiple' => true,
271	'label_block' => true,
272	'separator' => 'before',
273	'default' => [
274	'date',
275	'time',
276	'page_url',
277	'user_agent',
278	'remote_ip',
279	],
280	'options' => [
281	'date' => esc_html__( 'Date', 'uicore-elements' ),
282	'time' => esc_html__( 'Time', 'uicore-elements' ),
283	'page_url' => esc_html__( 'Page URL', 'uicore-elements' ),
284	'user_agent' => esc_html__( 'User Agent', 'uicore-elements' ),
285	'remote_ip' => esc_html__( 'Remote IP', 'uicore-elements' ),
286	],
287	'render_type' => 'none',
288	]
289	);
290
291	$instance->add_control(
292	'email_content_type' . $slug,
293	[
294	'label' => esc_html__( 'Send As', 'uicore-elements' ),
295	'type' => Controls_Manager::SELECT,
296	'default' => 'html',
297	'render_type' => 'none',
298	'options' => [
299	'html' => esc_html__( 'HTML', 'uicore-elements' ),
300	'plain' => esc_html__( 'Plain', 'uicore-elements' ),
301	],
302	]
303	);
304	}
305
306	// Field Render Functions
307	function build_honeypot_field( $item, $item_index ) {
308	$this->add_render_attribute( 'honeypot' . $item_index, [
309	'class' => [
310	'ui-e-field',
311	'ui-e-h-p',
312	esc_attr( $item['css_classes'] ),
313	],
314	'name' => 'ui-e-h-p',
315	'id' => 'ui-e-h-p',
316	'autocomplete' => 'off',
317	] );
318
319	if ( $item['placeholder'] ) {
320	$this->add_render_attribute( 'honeypot' . $item_index, 'placeholder', $item['placeholder'] );
321	}
322
323	if ( $item['required'] ) {
324	$this->add_required_attribute( 'honeypot' . $item_index );
325	}
326
327	$value = empty( $item['field_value'] ) ? '' : $item['field_value'];
328
329	return '<input ' . $this->get_render_attribute_string( 'honeypot' . $item_index ) . ' tabindex="-1">' . $value . '</input>';
330	}
331	function build_textarea_field( $item, $item_index ) {
332	$this->add_render_attribute( 'textarea' . $item_index, [
333	'class' => [
334	'ui-e-field',
335	esc_attr( $item['css_classes'] ),
336	],
337	'name' => $this->get_attribute_name( $item ),
338	'id' => $this->get_attribute_id( $item ),
339	'rows' => $item['rows'],
340	] );
341
342	if ( $item['placeholder'] ) {
343	$this->add_render_attribute( 'textarea' . $item_index, 'placeholder', $item['placeholder'] );
344	}
345
346	if ( $item['required'] ) {
347	$this->add_required_attribute( 'textarea' . $item_index );
348	}
349
350	$value = empty( $item['field_value'] ) ? '' : $item['field_value'];
351
352	return '<textarea ' . $this->get_render_attribute_string( 'textarea' . $item_index ) . '>' . $value . '</textarea>';
353	}
354	function build_select_field( $item, $i ) {
355	$this->add_render_attribute(
356	[
357	'select-wrapper' . $i => [
358	'class' => [
359	'ui-e-field',
360	'ui-e-field-select',
361	'ui-e-field-subgroup',
362	esc_attr( $item['css_classes'] ),
363	],
364	],
365	'select' . $i => [
366	'name' => $this->get_attribute_name( $item ) . ( ! empty( $item['allow_multiple'] ) ? '[]' : '' ),
367	'id' => $this->get_attribute_id( $item ),
368	'class' => [
369	'ui-e-field-textual',
370	],
371	],
372	]
373	);
374
375	if ( $item['required'] ) {
376	$this->add_required_attribute( 'select' . $i );
377	}
378
379	if ( $item['allow_multiple'] ) {
380	$this->add_render_attribute( 'select' . $i, 'multiple' );
381	if ( ! empty( $item['select_size'] ) ) {
382	$this->add_render_attribute( 'select' . $i, 'size', $item['select_size'] );
383	}
384	}
385
386	$options = preg_split( "/\\r\\n\|\\r\|\\n/", $item['field_options'] );
387
388	if ( ! $options ) {
389	return '';
390	}
391
392	ob_start();
393	?>
394	<div <?php $this->print_render_attribute_string( 'select-wrapper' . $i ); ?>>
395	<select <?php $this->print_render_attribute_string( 'select' . $i ); ?>>
396	<?php
397	foreach ( $options as $key => $option ) {
398	$option_id = $item['custom_id'] . $key;
399	$option_value = esc_attr( $option );
400	$option_label = esc_html( $option );
401
402	if ( false !== strpos( $option, '\|' ) ) {
403	list( $label, $value ) = explode( '\|', $option );
404	$option_value = esc_attr( $value );
405	$option_label = esc_html( $label );
406	}
407
408	$this->add_render_attribute( $option_id, 'value', $option_value );
409
410	// Support multiple selected values
411	if ( ! empty( $item['field_value'] ) && in_array( $option_value, explode( ',', $item['field_value'] ) ) ) {
412	$this->add_render_attribute( $option_id, 'selected', 'selected' );
413	} ?>
414	<option <?php $this->print_render_attribute_string( $option_id ); ?>><?php
415	// PHPCS - $option_label is already escaped
416	echo $option_label; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?></option>
417	<?php } ?>
418	</select>
419	</div>
420	<?php
421
422	$select = ob_get_clean();
423	return $select;
424	}
425	function build_radio_checkbox_field( $item, $item_index, $type ) {
426	$options = preg_split( "/\\r\\n\|\\r\|\\n/", $item['field_options'] );
427	$html = '';
428	if ( $options ) {
429	$html .= '<div class="ui-e-field-subgroup ' . esc_attr( $item['css_classes'] ) . ' ' . $item['inline_list'] . '">';
430	foreach ( $options as $key => $option ) {
431	$element_id = $item['custom_id'] . $key;
432	$html_id = $this->get_attribute_id( $item ) . '-' . $key;
433	$option_label = $option;
434	$option_value = $option;
435	if ( false !== strpos( $option, '\|' ) ) {
436	list( $option_label, $option_value ) = explode( '\|', $option );
437	}
438
439	$this->add_render_attribute(
440	$element_id,
441	[
442	'type' => $type,
443	'value' => $option_value,
444	'id' => $html_id,
445	'name' => $this->get_attribute_name( $item ) . ( ( 'checkbox' === $type && count( $options ) > 1 ) ? '[]' : '' ),
446	]
447	);
448
449	if ( ! empty( $item['field_value'] ) && $option_value === $item['field_value'] ) {
450	$this->add_render_attribute( $element_id, 'checked', 'checked' );
451	}
452
453	if ( $item['required'] && 'radio' === $type ) {
454	$this->add_required_attribute( $element_id );
455	}
456
457	$html .= '<span class="ui-e-field-option"><input ' . $this->get_render_attribute_string( $element_id ) . '> <label for="' . $html_id . '">' . $option_label . '</label></span>';
458	}
459	$html .= '</div>';
460	}
461
462	return $html;
463	}
464	function build_acceptance_field($item, $item_index) {
465	$text = '';
466	$this->add_render_attribute( 'input' . $item_index, 'class', 'ui-e-acceptance-field' );
467	$this->add_render_attribute( 'input' . $item_index, 'type', 'checkbox', true );
468
469	if ( ! empty( $item['acceptance_text'] ) ) {
470	$text = '<label for="' . $this->get_attribute_id( $item ) . '">' . $item['acceptance_text'] . '</label>';
471	}
472
473	if ( ! empty( $item['checked_by_default'] ) ) {
474	$this->add_render_attribute( 'input' . $item_index, 'checked', 'checked' );
475	}
476
477	?>
478	<div class="ui-e-field-subgroup <?php echo esc_attr( $item['css_classes'] );?>">
479	<input <?php $this->print_render_attribute_string( 'input' . $item_index ); ?>>
480	<?php // PHPCS - the variables $text is safe.
481	echo $text; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
482	</div>
483	<?php
484	}
485	function form_fields_render_attributes( $i, $instance, $item ) {
486	$this->add_render_attribute(
487	[
488	'field-group' . $i => [
489	'class' => [
490	'ui-e-field-type-' . $item['field_type'],
491	'ui-e-field-group',
492	'elementor-column',
493	'ui-e-field-group-' . $item['custom_id'],
494	],
495	],
496	'input' . $i => [
497	'type' => $item['field_type'],
498	'name' => $this->get_attribute_name( $item ),
499	'id' => $this->get_attribute_id( $item ),
500	'class' => [
501	'ui-e-field',
502	empty( $item['css_classes'] ) ? '' : esc_attr( $item['css_classes'] ),
503	],
504	],
505	'label' . $i => [
506	'for' => $this->get_attribute_id( $item ),
507	'class' => 'ui-e-label',
508	],
509	]
510	);
511
512	if ( empty( $item['width'] ) ) {
513	$item['width'] = '100';
514	}
515
516	$this->add_render_attribute( 'field-group' . $i, 'class', 'elementor-col-' . $item['width'] );
517
518	if ( ! empty( $item['width_tablet'] ) ) {
519	$this->add_render_attribute( 'field-group' . $i, 'class', 'elementor-md-' . $item['width_tablet'] );
520	}
521
522	if ( $item['allow_multiple'] ) {
523	$this->add_render_attribute( 'field-group' . $i, 'class', 'ui-e-field-type-' . $item['field_type'] . '-multiple' );
524	}
525
526	if ( ! empty( $item['width_mobile'] ) ) {
527	$this->add_render_attribute( 'field-group' . $i, 'class', 'elementor-sm-' . $item['width_mobile'] );
528	}
529
530	// Allow zero as placeholder.
531	if ( ! Utils::is_empty( $item['placeholder'] ) ) {
532	$this->add_render_attribute( 'input' . $i, 'placeholder', $item['placeholder'] );
533	}
534
535	if ( ! empty( $item['field_value'] ) ) {
536	$this->add_render_attribute( 'input' . $i, 'value', $item['field_value'] );
537	}
538
539	if ( ! $instance['show_labels'] ) {
540	$this->add_render_attribute( 'label' . $i, 'class', 'elementor-screen-only' );
541	}
542
543	if ( ! empty( $item['required'] ) ) {
544	$class = '';
545	if ( ! empty( $instance['mark_required'] ) ) {
546	$class .= ' ui-e-required';
547	}
548	$this->add_render_attribute( 'field-group' . $i, 'class', $class );
549	$this->add_required_attribute( 'input' . $i );
550	}
551	}
552
553	protected function register_controls() {
554
555	// Content Controls
556	// Repeater Controls used by `form_fields` control
557	$repeater = new Repeater();
558	$repeater->start_controls_tabs( 'form_fields_tabs' );
559
560	$repeater->start_controls_tab(
561	'form_fields_content_tab',
562	[
563	'label' => esc_html__( 'Content', 'uicore-elements' ),
564	]
565	);
566
567	$repeater->add_control(
568	'field_type',
569	[
570	'label' => esc_html__( 'Type', 'uicore-elements' ),
571	'type' => Controls_Manager::SELECT,
572	'options' => $this->get_field_types(),
573	'default' => 'text',
574	]
575	);
576	$repeater->add_control(
577	'field_label',
578	[
579	'label' => esc_html__( 'Label', 'uicore-elements' ),
580	'type' => Controls_Manager::TEXT,
581	'default' => '',
582	'dynamic' => [
583	'active' => true,
584	],
585	]
586	);
587	$repeater->add_control(
588	'placeholder',
589	[
590	'label' => esc_html__( 'Placeholder', 'uicore-elements' ),
591	'type' => Controls_Manager::TEXT,
592	'default' => '',
593	'conditions' => [
594	'terms' => [
595	[
596	'name' => 'field_type',
597	'operator' => 'in',
598	'value' => [
599	'tel',
600	'text',
601	'email',
602	'textarea',
603	'number',
604	'url',
605	'password',
606	],
607	],
608	],
609	],
610	'dynamic' => [
611	'active' => true,
612	],
613	]
614	);
615	$repeater->add_control(
616	'required',
617	[
618	'label' => esc_html__( 'Required', 'uicore-elements' ),
619	'type' => Controls_Manager::SWITCHER,
620	'return_value' => 'true',
621	'default' => '',
622	'conditions' => [
623	'terms' => [
624	[
625	'name' => 'field_type',
626	'operator' => '!in',
627	'value' => [
628	'checkbox',
629	'recaptcha',
630	'recaptcha_v3',
631	'hidden',
632	'html',
633	],
634	],
635	],
636	],
637	]
638	);
639	$repeater->add_control(
640	'field_options',
641	[
642	'label' => esc_html__( 'Options', 'uicore-elements' ),
643	'type' => Controls_Manager::TEXTAREA,
644	'default' => '',
645	'description' => esc_html__( 'Enter each option in a separate line. To differentiate between label and value, separate them with a pipe char ("\|"). For example: First Name\|f_name', 'uicore-elements' ),
646	'conditions' => [
647	'terms' => [
648	[
649	'name' => 'field_type',
650	'operator' => 'in',
651	'value' => [
652	'select',
653	'checkbox',
654	'radio',
655	],
656	],
657	],
658	],
659	]
660	);
661	$repeater->add_control(
662	'allow_multiple',
663	[
664	'label' => esc_html__( 'Multiple Selection', 'uicore-elements' ),
665	'type' => Controls_Manager::SWITCHER,
666	'return_value' => 'true',
667	'conditions' => [
668	'terms' => [
669	[
670	'name' => 'field_type',
671	'value' => 'select',
672	],
673	],
674	],
675	]
676	);
677	$repeater->add_control(
678	'select_size',
679	[
680	'label' => esc_html__( 'Rows', 'uicore-elements' ),
681	'type' => Controls_Manager::NUMBER,
682	'min' => 2,
683	'step' => 1,
684	'conditions' => [
685	'terms' => [
686	[
687	'name' => 'field_type',
688	'value' => 'select',
689	],
690	[
691	'name' => 'allow_multiple',
692	'value' => 'true',
693	],
694	],
695	],
696	]
697	);
698	$repeater->add_control(
699	'inline_list',
700	[
701	'label' => esc_html__( 'Inline List', 'uicore-elements' ),
702	'type' => Controls_Manager::SWITCHER,
703	'return_value' => 'ui-e-subgroup-inline',
704	'default' => '',
705	'conditions' => [
706	'terms' => [
707	[
708	'name' => 'field_type',
709	'operator' => 'in',
710	'value' => [
711	'checkbox',
712	'radio',
713	],
714	],
715	],
716	],
717	]
718	);
719	$repeater->add_control(
720	'field_html',
721	[
722	'label' => esc_html__( 'HTML', 'uicore-elements' ),
723	'type' => Controls_Manager::TEXTAREA,
724	'dynamic' => [
725	'active' => true,
726	],
727	'conditions' => [
728	'terms' => [
729	[
730	'name' => 'field_type',
731	'value' => 'html',
732	],
733	],
734	],
735	]
736	);
737	$repeater->add_control(
738	'acceptance_text',
739	[
740	'label' => esc_html__( 'Acceptance Text', 'uicore-elements' ),
741	'type' => Controls_Manager::TEXTAREA,
742	'condition' => [
743	'field_type' => 'acceptance',
744	],
745	],
746	);
747	$repeater->add_control(
748	'checked_by_default',
749	[
750	'label' => esc_html__( 'Checked by Default', 'uicore-elements' ),
751	'type' => Controls_Manager::SWITCHER,
752	'condition' => [
753	'field_type' => 'acceptance',
754	],
755	],
756	);
757	$repeater->add_responsive_control(
758	'width',
759	[
760	'label' => esc_html__( 'Column Width', 'uicore-elements' ),
761	'type' => Controls_Manager::SELECT,
762	'options' => [
763	'' => esc_html__( 'Default', 'uicore-elements' ),
764	'100' => '100%',
765	'80' => '80%',
766	'75' => '75%',
767	'70' => '70%',
768	'66' => '66%',
769	'60' => '60%',
770	'50' => '50%',
771	'40' => '40%',
772	'33' => '33%',
773	'30' => '30%',
774	'25' => '25%',
775	'20' => '20%',
776	],
777	'default' => '100',
778	'conditions' => [
779	'terms' => [
780	[
781	'name' => 'field_type',
782	'operator' => '!in',
783	'value' => [
784	'hidden',
785	'recaptcha',
786	'recaptcha_v3'
787	],
788	],
789	],
790	],
791	]
792	);
793	$repeater->add_control(
794	'rows',
795	[
796	'label' => esc_html__( 'Rows', 'uicore-elements' ),
797	'type' => Controls_Manager::NUMBER,
798	'default' => 4,
799	'conditions' => [
800	'terms' => [
801	[
802	'name' => 'field_type',
803	'value' => 'textarea',
804	],
805	],
806	],
807	]
808	);
809	$repeater->add_control(
810	'recaptcha_hide',
811	[
812	'label' => esc_html__( 'Badge', 'uicore-elements' ),
813	'type' => Controls_Manager::SELECT,
814	'default' => 'hidden',
815	'options' => [
816	'hidden' => esc_html__( 'Hidden', 'uicore-elements' ),
817	'visible' => esc_html__( 'Visible', 'uicore-elements' )
818	],
819	'condition' => [
820	'field_type' => 'recaptcha_v3',
821	],
822	'selectors' => [
823	'.grecaptcha-badge' => 'visibility: {{VALUE}};',
824	],
825	]
826	);
827	$recaptcha_keys = (!get_option('uicore_elements_recaptcha_secret_key') && !get_option('uicore_elements_recaptcha_site_key')) ? true : false; // Check if recaptcha API keys were set
828	$repeater->add_control(
829	'recaptcha_warning',
830	[
831	'type' => Controls_Manager::ALERT,
832	'alert_type' => 'warning',
833	'dismissible' => false,
834	'heading' => esc_html__("You haven't set your reCAPTCHA API keys yet.", 'uicore-elements'),
835	'content' => Helper::get_admin_settings_url(esc_html__("Click here to configure your API keys.", 'uicore-elements' )),
836	'condition' => [
837	'field_type' => $recaptcha_keys ? ['recaptcha', 'recaptcha_v3'] : [],
838	]
839	]
840	);
841
842	$repeater->end_controls_tab();
843
844	$repeater->start_controls_tab(
845	'form_fields_advanced_tab',
846	[
847	'label' => esc_html__( 'Advanced', 'uicore-elements' ),
848	'condition' => [
849	'field_type!' => ['html', 'address' ],
850	],
851	]
852	);
853
854	$repeater->add_control(
855	'field_value',
856	[
857	'label' => esc_html__( 'Default Value', 'uicore-elements' ),
858	'type' => Controls_Manager::TEXT,
859	'default' => '',
860	'dynamic' => [
861	'active' => true,
862	],
863	'ai' => [
864	'active' => false,
865	],
866	'conditions' => [
867	'terms' => [
868	[
869	'name' => 'field_type',
870	'operator' => 'in',
871	'value' => [
872	'text',
873	'email',
874	'textarea',
875	'url',
876	'tel',
877	'radio',
878	'select',
879	'number',
880	'date',
881	'time',
882	'hidden',
883	],
884	],
885	],
886	],
887	]
888	);
889	$repeater->add_control(
890	'custom_id',
891	[
892	'label' => esc_html__( 'ID', 'uicore-elements' ),
893	'type' => Controls_Manager::TEXT,
894	'description' => esc_html__( 'Please make sure the ID is unique and not used elsewhere in this form. This field allows `A-z 0-9` & underscore chars without spaces.', 'uicore-elements' ),
895	'render_type' => 'none',
896	'required' => true,
897	'dynamic' => [
898	'active' => true,
899	],
900	'ai' => [
901	'active' => false,
902	],
903	]
904	);
905	$repeater->add_control(
906	'css_classes',
907	[
908	'label' => esc_html__( 'Custom Class', 'uicore-elements' ),
909	'type' => Controls_Manager::TEXT,
910	'default' => '',
911	'ai' => [
912	'active' => false,
913	],
914	'placeholder' => esc_html__( 'e.g: my-class', 'uicore-elements' ),
915	]
916	);
917	$shortcode_template = '{{ view.container.settings.get( \'custom_id\' ) }}';
918	$repeater->add_control(
919	'shortcode',
920	[
921	'label' => esc_html__( 'Shortcode', 'uicore-elements' ),
922	'type' => Controls_Manager::RAW_HTML,
923	'classes' => 'forms-field-shortcode',
924	'raw' => '<input class="elementor-form-field-shortcode" value=\'[field id="' . $shortcode_template . '"]\' readonly />',
925	'label_block' => false,
926	]
927	);
928
929	$repeater->end_controls_tab();
930
931	$repeater->end_controls_tabs();
932
933	$this->start_controls_section(
934	'section_form_fields',
935	[
936	'label' => esc_html__( 'Form Fields', 'uicore-elements' ),
937	]
938	);
939
940
941	$this->add_control(
942	'form_name',
943	[
944	'label' => esc_html__( 'Form Name', 'uicore-elements' ),
945	'type' => Controls_Manager::TEXT,
946	'default' => esc_html__( 'New Form', 'uicore-elements' ),
947	'placeholder' => esc_html__( 'Form Name', 'uicore-elements' ),
948	]
949	);
950	$this->add_control(
951	'form_fields',
952	[
953	'type' => Controls_Manager::REPEATER,
954	'fields' => $repeater->get_controls(),
955	'default' => [
956	[
957	'custom_id' => 'name',
958	'field_type' => 'text',
959	'field_label' => esc_html__( 'Name', 'uicore-elements' ),
960	'placeholder' => esc_html__( 'Name', 'uicore-elements' ),
961	'width' => '100',
962	'dynamic' => [
963	'active' => true,
964	],
965	],
966	[
967	'custom_id' => 'email',
968	'field_type' => 'email',
969	'required' => 'true',
970	'field_label' => esc_html__( 'Email', 'uicore-elements' ),
971	'placeholder' => esc_html__( 'Email', 'uicore-elements' ),
972	'width' => '100',
973	],
974	[
975	'custom_id' => 'address',
976	'field_type' => 'address',
977	'field_label' => esc_html__( 'address (honeypot)', 'uicore-elements' ),
978	'placeholder' => esc_html__( 'address', 'uicore-elements' ),
979	'width' => '100',
980	],
981	[
982	'custom_id' => 'message',
983	'field_type' => 'textarea',
984	'field_label' => esc_html__( 'Message', 'uicore-elements' ),
985	'placeholder' => esc_html__( 'Message', 'uicore-elements' ),
986	'width' => '100',
987	],
988	],
989	'title_field' => '{{{ field_label }}}',
990	]
991	);
992	$this->add_control(
993	'show_labels',
994	[
995	'label' => esc_html__( 'Label', 'uicore-elements' ),
996	'type' => Controls_Manager::SWITCHER,
997	'label_on' => esc_html__( 'Show', 'uicore-elements' ),
998	'label_off' => esc_html__( 'Hide', 'uicore-elements' ),
999	'return_value' => 'true',
1000	'default' => 'true',
1001	'separator' => 'before',
1002	]
1003	);
1004	$this->add_control(
1005	'mark_required',
1006	[
1007	'label' => esc_html__( 'Required Mark', 'uicore-elements' ),
1008	'type' => Controls_Manager::SWITCHER,
1009	'label_on' => esc_html__( 'Show', 'uicore-elements' ),
1010	'label_off' => esc_html__( 'Hide', 'uicore-elements' ),
1011	'default' => '',
1012	'render_type' => 'template',
1013	'condition' => [
1014	'show_labels!' => '',
1015	],
1016	]
1017	);
1018
1019	$this->end_controls_section();
1020
1021	$this->start_controls_section(
1022	'section_buttons',
1023	[
1024	'label' => esc_html__( 'Button', 'uicore-elements' ),
1025	]
1026	);
1027
1028	$this->add_responsive_control(
1029	'button_width',
1030	[
1031	'label' => esc_html__( 'Column Width', 'uicore-elements' ),
1032	'type' => Controls_Manager::SELECT,
1033	'options' => [
1034	'' => esc_html__( 'Default', 'uicore-elements' ),
1035	'100' => '100%',
1036	'80' => '80%',
1037	'75' => '75%',
1038	'70' => '70%',
1039	'66' => '66%',
1040	'60' => '60%',
1041	'50' => '50%',
1042	'40' => '40%',
1043	'33' => '33%',
1044	'30' => '30%',
1045	'25' => '25%',
1046	'20' => '20%',
1047	],
1048	'default' => '100',
1049	]
1050	);
1051	$this->add_responsive_control(
1052	'button_align',
1053	[
1054	'label' => esc_html__( 'Alignment', 'uicore-elements' ),
1055	'type' => Controls_Manager::CHOOSE,
1056	'options' => [
1057	'left' => [
1058	'title' => esc_html__( 'Left', 'uicore-elements' ),
1059	'icon' => 'eicon-text-align-left',
1060	],
1061	'center' => [
1062	'title' => esc_html__( 'Center', 'uicore-elements' ),
1063	'icon' => 'eicon-text-align-center',
1064	],
1065	'right' => [
1066	'title' => esc_html__( 'Right', 'uicore-elements' ),
1067	'icon' => 'eicon-text-align-right',
1068	],
1069	'stretch' => [
1070	'title' => esc_html__( 'Justified', 'uicore-elements' ),
1071	'icon' => 'eicon-text-align-justify',
1072	],
1073	],
1074	'default' => 'stretch',
1075	'prefix_class' => 'ui-e-submit-align-',
1076	]
1077	);
1078	$this->add_control(
1079	'button_text',
1080	[
1081	'label' => esc_html__( 'Submit', 'uicore-elements' ),
1082	'type' => Controls_Manager::TEXT,
1083	'default' => esc_html__( 'Send', 'uicore-elements' ),
1084	'placeholder' => esc_html__( 'Send', 'uicore-elements' ),
1085	'dynamic' => [
1086	'active' => true,
1087	],
1088	'ai' => [
1089	'active' => false,
1090	],
1091	]
1092	);
1093	$this->add_control(
1094	'selected_button_icon',
1095	[
1096	'label' => esc_html__( 'Icon', 'uicore-elements' ),
1097	'type' => Controls_Manager::ICONS,
1098	'skin' => 'inline',
1099	'label_block' => false,
1100	]
1101	);
1102	$this->add_control(
1103	'button_icon_align',
1104	[
1105	'label' => esc_html__( 'Icon Position', 'uicore-elements' ),
1106	'type' => Controls_Manager::SELECT,
1107	'default' => 'left',
1108	'options' => [
1109	'left' => esc_html__( 'Before', 'uicore-elements' ),
1110	'right' => esc_html__( 'After', 'uicore-elements' ),
1111	],
1112	'condition' => [
1113	'selected_button_icon[value]!' => '',
1114	],
1115	]
1116	);
1117	$this->add_control(
1118	'button_icon_indent',
1119	[
1120	'label' => esc_html__( 'Icon Spacing', 'uicore-elements' ),
1121	'type' => Controls_Manager::SLIDER,
1122	'size_units' => [ 'px', 'em', 'rem', 'custom' ],
1123	'range' => [
1124	'px' => [
1125	'max' => 100,
1126	],
1127	'em' => [
1128	'max' => 10,
1129	],
1130	'rem' => [
1131	'max' => 10,
1132	],
1133	],
1134	'condition' => [
1135	'selected_button_icon[value]!' => '',
1136	],
1137	'selectors' => [
1138	'{{WRAPPER}} .elementor-button .ui-e-align-right' => 'margin-left: {{SIZE}}{{UNIT}};',
1139	'{{WRAPPER}} .elementor-button .ui-e-align-left' => 'margin-right: {{SIZE}}{{UNIT}};',
1140	],
1141	]
1142	);
1143	$this->add_control(
1144	'button_css_id',
1145	[
1146	'label' => esc_html__( 'Button ID', 'uicore-elements' ),
1147	'type' => Controls_Manager::TEXT,
1148	'default' => '',
1149	'ai' => [
1150	'active' => false,
1151	],
1152	'title' => esc_html__( 'Add your custom id WITHOUT the Pound key. e.g: my-id', 'uicore-elements' ),
1153	'description' => esc_html__( 'Please make sure the ID is unique and not used elsewhere on the page this form is displayed. This field allows `A-z 0-9` & underscore chars without spaces.', 'uicore-elements' ),
1154	'separator' => 'before',
1155	'dynamic' => [
1156	'active' => true,
1157	],
1158	]
1159	);
1160
1161
1162	$this->end_controls_section();
1163
1164	$this->start_controls_section(
1165	'section_actions',
1166	[
1167	'label' => esc_html__( 'Actions After Submit', 'uicore-elements' ),
1168	]
1169	);
1170
1171	$this->add_control(
1172	'submit_actions',
1173	[
1174	'label' => esc_html__( 'Submit Actions', 'uicore-elements' ),
1175	'type' => Controls_Manager::SELECT2,
1176	'label_block' => true,
1177	'multiple' => true,
1178	'options' => [
1179	'email' => esc_html__( 'Email', 'uicore-elements' ),
1180	'email_2' => esc_html__( 'Email 2', 'uicore-elements' ),
1181	'redirect' => esc_html__( 'Redirect', 'uicore-elements' ),
1182	'mailchimp' => esc_html__( 'MailChimp', 'uicore-elements' ),
1183	],
1184	'default' => [ 'email' ],
1185	]
1186	);
1187
1188	$this->end_controls_section();
1189
1190	// Submit sections
1191	$this->start_controls_section(
1192	'section_email',
1193	[
1194	'label' => esc_html__( 'Email', 'uicore-elements' ),
1195	'condition' => [
1196	'submit_actions' => 'email',
1197	],
1198	]
1199	);
1200
1201	$this->register_submit_email_controls($this);
1202
1203	$this->end_controls_section();
1204
1205	$this->start_controls_section(
1206	'section_email_2',
1207	[
1208	'label' => esc_html__( 'Email 2', 'uicore-elements' ),
1209	'condition' => [
1210	'submit_actions' => 'email_2',
1211	],
1212	]
1213	);
1214
1215	$this->register_submit_email_controls($this, '_2');
1216
1217	$this->end_controls_section();
1218
1219	$this->start_controls_section(
1220	'section_redirect',
1221	[
1222	'label' => esc_html__( 'Redirect', 'uicore-elements' ),
1223	'condition' => [
1224	'submit_actions' => 'redirect',
1225	],
1226	]
1227	);
1228
1229	$this->add_control(
1230	'redirect_to',
1231	[
1232	'label' => esc_html__( 'Redirect To', 'uicore-elements' ),
1233	'type' => Controls_Manager::TEXT,
1234	'placeholder' => esc_html__( 'https://your-link.com', 'uicore-elements' ),
1235	'ai' => [
1236	'active' => false,
1237	],
1238	'dynamic' => [
1239	'active' => true,
1240	'categories' => [
1241	'url',
1242	],
1243	],
1244	'label_block' => true,
1245	'render_type' => 'none',
1246	]
1247	);
1248
1249	$this->end_controls_section();
1250
1251	$this->start_controls_section(
1252	'mailchimp_redirect',
1253	[
1254	'label' => esc_html__( 'Mailchimp', 'uicore-elements' ),
1255	'condition' => [
1256	'submit_actions' => 'mailchimp',
1257	],
1258	]
1259	);
1260
1261	$this->TRAIT_register_submit_mailchimp_controls($this, true);
1262
1263	$this->end_controls_section();
1264
1265	$default_messages = Contact_Form_Service::get_default_messages();
1266	$this->start_controls_section(
1267	'section_form_options',
1268	[
1269	'label' => esc_html__( 'Additional Options', 'uicore-elements' ),
1270	'tab' => Controls_Manager::TAB_CONTENT,
1271	]
1272	);
1273
1274	$this->add_control(
1275	'form_id',
1276	[
1277	'label' => esc_html__( 'Form ID', 'uicore-elements' ),
1278	'type' => Controls_Manager::TEXT,
1279	'ai' => [
1280	'active' => false,
1281	],
1282	'placeholder' => 'new_form_id',
1283	'description' => esc_html__( 'Please make sure the ID is unique and not used elsewhere on the page this form is displayed. This field allows `A-z 0-9` & underscore chars without spaces.', 'uicore-elements' ),
1284	'separator' => 'after',
1285	'dynamic' => [
1286	'active' => true,
1287	],
1288	]
1289	);
1290	$this->add_control(
1291	'form_validation',
1292	[
1293	'label' => esc_html__( 'Form Validation', 'uicore-elements' ),
1294	'type' => Controls_Manager::SELECT,
1295	'options' => [
1296	'' => esc_html__( 'Browser Default', 'uicore-elements' ),
1297	'no' => esc_html__( 'No validation', 'uicore-elements' ),
1298	],
1299	'default' => '',
1300	]
1301	);
1302	$this->add_control(
1303	'custom_messages',
1304	[
1305	'label' => esc_html__( 'Custom Messages', 'uicore-elements' ),
1306	'type' => Controls_Manager::SWITCHER,
1307	'default' => '',
1308	'separator' => 'before',
1309	'render_type' => 'none',
1310	]
1311	);
1312	$this->add_control(
1313	'success_message',
1314	[
1315	'label' => esc_html__( 'Success Message', 'uicore-elements' ),
1316	'type' => Controls_Manager::TEXT,
1317	'default' => $default_messages['success'],
1318	'placeholder' => $default_messages['success'],
1319	'label_block' => true,
1320	'condition' => [
1321	'custom_messages!' => '',
1322	],
1323	'render_type' => 'none',
1324	'dynamic' => [
1325	'active' => true,
1326	],
1327	]
1328	);
1329	$this->add_control(
1330	'error_message',
1331	[
1332	'label' => esc_html__( 'Form Error', 'uicore-elements' ),
1333	'type' => Controls_Manager::TEXT,
1334	'default' => $default_messages['error'],
1335	'placeholder' => $default_messages['error'],
1336	'label_block' => true,
1337	'condition' => [
1338	'custom_messages!' => '',
1339	],
1340	'render_type' => 'none',
1341	'dynamic' => [
1342	'active' => true,
1343	],
1344	]
1345	);
1346	$this->add_control(
1347	'mail_error_message',
1348	[
1349	'label' => esc_html__( 'Email Sending Error', 'uicore-elements' ),
1350	'type' => Controls_Manager::TEXT,
1351	'default' => $default_messages['mail_error'],
1352	'placeholder' => $default_messages['mail_error'],
1353	'label_block' => true,
1354	'condition' => [
1355	'custom_messages!' => '',
1356	],
1357	'render_type' => 'none',
1358	'dynamic' => [
1359	'active' => true,
1360	],
1361	]
1362	);
1363	$this->add_control(
1364	'redirect_message',
1365	[
1366	'label' => esc_html__( 'Sucessfull Redirect', 'uicore-elements' ),
1367	'type' => Controls_Manager::TEXT,
1368	'default' => $default_messages['redirect'],
1369	'placeholder' => $default_messages['redirect'],
1370	'label_block' => true,
1371	'conditions' => [
1372	'terms' => [
1373	[
1374	'name' => 'custom_messages',
1375	'operator' => '!=',
1376	'value' => '',
1377	],
1378	[
1379	'name' => 'submit_actions',
1380	'operator' => 'contains',
1381	'value' => 'redirect',
1382	]
1383	],
1384	],
1385	'render_type' => 'none',
1386	'dynamic' => [
1387	'active' => true,
1388	],
1389	]
1390	);
1391
1392	$this->end_controls_section();
1393
1394	$this->start_controls_section(
1395	'section_form_style',
1396	[
1397	'label' => esc_html__( 'Form', 'uicore-elements' ),
1398	'tab' => Controls_Manager::TAB_STYLE,
1399	]
1400	);
1401
1402	$this->add_control(
1403	'column_gap',
1404	[
1405	'label' => esc_html__( 'Columns Gap', 'uicore-elements' ),
1406	'type' => Controls_Manager::SLIDER,
1407	'size_units' => [ 'px', 'em', 'rem', 'custom' ],
1408	'default' => [
1409	'size' => 10,
1410	],
1411	'range' => [
1412	'px' => [
1413	'max' => 60,
1414	],
1415	'em' => [
1416	'max' => 6,
1417	],
1418	'rem' => [
1419	'max' => 6,
1420	],
1421	],
1422	'selectors' => [
1423	'{{WRAPPER}} .ui-e-field-group' => 'padding-right: calc( {{SIZE}}{{UNIT}}/2 ); padding-left: calc( {{SIZE}}{{UNIT}}/2 );',
1424	'{{WRAPPER}} .ui-e-fields-wrp' => 'margin-left: calc( -{{SIZE}}{{UNIT}}/2 ); margin-right: calc( -{{SIZE}}{{UNIT}}/2 );',
1425	],
1426	]
1427	);
1428	$this->add_control(
1429	'row_gap',
1430	[
1431	'label' => esc_html__( 'Rows Gap', 'uicore-elements' ),
1432	'type' => Controls_Manager::SLIDER,
1433	'size_units' => [ 'px', 'em', 'rem', 'custom' ],
1434	'default' => [
1435	'size' => 10,
1436	],
1437	'range' => [
1438	'px' => [
1439	'max' => 60,
1440	],
1441	'em' => [
1442	'max' => 6,
1443	],
1444	'rem' => [
1445	'max' => 6,
1446	],
1447	],
1448	'selectors' => [
1449	'{{WRAPPER}} .ui-e-field-group' => 'margin-bottom: {{SIZE}}{{UNIT}};',
1450	'{{WRAPPER}} .ui-e-fields-wrp' => 'margin-bottom: -{{SIZE}}{{UNIT}};',
1451	],
1452	]
1453	);
1454	$this->add_control(
1455	'heading_label',
1456	[
1457	'label' => esc_html__( 'Label', 'uicore-elements' ),
1458	'type' => Controls_Manager::HEADING,
1459	'separator' => 'before',
1460	]
1461	);
1462	$this->add_control(
1463	'label_spacing',
1464	[
1465	'label' => esc_html__( 'Spacing', 'uicore-elements' ),
1466	'type' => Controls_Manager::SLIDER,
1467	'size_units' => [ 'px', 'em', 'rem', 'custom' ],
1468	'default' => [
1469	'size' => 0,
1470	],
1471	'range' => [
1472	'px' => [
1473	'max' => 60,
1474	],
1475	'em' => [
1476	'max' => 6,
1477	],
1478	'rem' => [
1479	'max' => 6,
1480	],
1481	],
1482	'selectors' => [
1483	'body {{WRAPPER}} .ui-e-field-group > label' => 'padding-bottom: {{SIZE}}{{UNIT}};',
1484	],
1485	]
1486	);
1487	$this->add_control(
1488	'label_color',
1489	[
1490	'label' => esc_html__( 'Text Color', 'uicore-elements' ),
1491	'type' => Controls_Manager::COLOR,
1492	'selectors' => [
1493	'{{WRAPPER}} .ui-e-field-group > label, {{WRAPPER}} .ui-e-field-subgroup label' => 'color: {{VALUE}};',
1494	],
1495	'global' => [
1496	'default' => Global_Colors::COLOR_TEXT,
1497	],
1498	]
1499	);
1500	$this->add_control(
1501	'mark_required_color',
1502	[
1503	'label' => esc_html__( 'Mark Color', 'uicore-elements' ),
1504	'type' => Controls_Manager::COLOR,
1505	'default' => '',
1506	'selectors' => [
1507	'{{WRAPPER}} .ui-e-required .ui-e-label:after' => 'color: {{COLOR}};',
1508	],
1509	'condition' => [
1510	'mark_required' => 'yes',
1511	],
1512	]
1513	);
1514	$this->add_group_control(
1515	Group_Control_Typography::get_type(),
1516	[
1517	'name' => 'label_typography',
1518	'selector' => '{{WRAPPER}} .ui-e-field-group > label',
1519	'global' => [
1520	'default' => Global_Typography::TYPOGRAPHY_TEXT,
1521	],
1522	]
1523	);
1524	$this->add_control(
1525	'heading_html',
1526	[
1527	'label' => esc_html__( 'HTML Field', 'uicore-elements' ),
1528	'type' => Controls_Manager::HEADING,
1529	'separator' => 'before',
1530	]
1531	);
1532	$this->add_control(
1533	'html_spacing',
1534	[
1535	'label' => esc_html__( 'Spacing', 'uicore-elements' ),
1536	'type' => Controls_Manager::SLIDER,
1537	'size_units' => [ 'px', 'em', 'rem', 'custom' ],
1538	'default' => [
1539	'size' => 0,
1540	],
1541	'range' => [
1542	'px' => [
1543	'max' => 60,
1544	],
1545	'em' => [
1546	'max' => 6,
1547	],
1548	'rem' => [
1549	'max' => 6,
1550	],
1551	],
1552	'selectors' => [
1553	'{{WRAPPER}} .ui-e-field-type-html' => 'padding-bottom: {{SIZE}}{{UNIT}};',
1554	],
1555	]
1556	);
1557	$this->add_control(
1558	'html_color',
1559	[
1560	'label' => esc_html__( 'Color', 'uicore-elements' ),
1561	'type' => Controls_Manager::COLOR,
1562	'selectors' => [
1563	'{{WRAPPER}} .ui-e-field-type-html' => 'color: {{VALUE}};',
1564	],
1565	'global' => [
1566	'default' => Global_Colors::COLOR_TEXT,
1567	],
1568	]
1569	);
1570	$this->add_group_control(
1571	Group_Control_Typography::get_type(),
1572	[
1573	'name' => 'html_typography',
1574	'selector' => '{{WRAPPER}} .ui-e-field-type-html',
1575	'global' => [
1576	'default' => Global_Typography::TYPOGRAPHY_TEXT,
1577	],
1578	]
1579	);
1580
1581	$this->end_controls_section();
1582
1583	$this->start_controls_section(
1584	'section_field_style',
1585	[
1586	'label' => esc_html__( 'Fields', 'uicore-elements' ),
1587	'tab' => Controls_Manager::TAB_STYLE,
1588	]
1589	);
1590
1591	$this->start_controls_tabs(
1592	'field_style_tabs'
1593	);
1594
1595	$this->start_controls_tab(
1596	'field_normal_tab',
1597	[
1598	'label' => esc_html__( 'Normal', 'uicore-elements' ),
1599	]
1600	);
1601
1602	$this->add_group_control(
1603	Group_Control_Typography::get_type(),
1604	[
1605	'name' => 'field_typography',
1606	'selector' => '{{WRAPPER}} .ui-e-field-group .ui-e-field, {{WRAPPER}} .ui-e-field-subgroup label',
1607	'global' => [
1608	'default' => Global_Typography::TYPOGRAPHY_TEXT,
1609	],
1610	]
1611	);
1612	$this->add_control(
1613	'field_text_color',
1614	[
1615	'label' => esc_html__( 'Text Color', 'uicore-elements' ),
1616	'type' => Controls_Manager::COLOR,
1617	'selectors' => [
1618	'{{WRAPPER}} .ui-e-field-group .ui-e-field' => 'color: {{VALUE}};',
1619	],
1620	'global' => [
1621	'default' => Global_Colors::COLOR_TEXT,
1622	],
1623	]
1624	);
1625	$this->add_control(
1626	'field_placeholder_color',
1627	[
1628	'label' => esc_html__( 'Placeholder Color', 'uicore-elements' ),
1629	'type' => Controls_Manager::COLOR,
1630	'selectors' => [
1631	'{{WRAPPER}} .ui-e-field-group .ui-e-field::placeholder' => 'color: {{VALUE}};',
1632	],
1633	'global' => [
1634	'default' => Global_Colors::COLOR_TEXT,
1635	],
1636	]
1637	);
1638	$this->add_control(
1639	'field_background_color',
1640	[
1641	'label' => esc_html__( 'Background Color', 'uicore-elements' ),
1642	'type' => Controls_Manager::COLOR,
1643	'default' => '#ffffff',
1644	'selectors' => [
1645	'{{WRAPPER}} .ui-e-field-group:not(.ui-e-field-type-file) .ui-e-field:not(.ui-e-field-select)' => 'background-color: {{VALUE}};',
1646	'{{WRAPPER}} .ui-e-field-group .ui-e-field-select select' => 'background-color: {{VALUE}};',
1647	],
1648	]
1649	);
1650	$this->add_group_control(
1651	Group_Control_Border::get_type(),
1652	[
1653	'name' => 'field_border',
1654	'selector' =>
1655	'{{WRAPPER}} .ui-e-field-group:not(.ui-e-field-type-file) .ui-e-field:not(.ui-e-field-select),
1656	{{WRAPPER}} .ui-e-field-group .ui-e-field-select select',
1657	]
1658	);
1659
1660	$this->end_controls_tab();
1661
1662	$this->start_controls_tab(
1663	'field_hover_tab',
1664	[
1665	'label' => esc_html__( 'Hover', 'uicore-elements' ),
1666	]
1667	);
1668
1669	$this->add_control(
1670	'field_text_hover_color',
1671	[
1672	'label' => esc_html__( 'Text Color', 'uicore-elements' ),
1673	'type' => Controls_Manager::COLOR,
1674	'selectors' => [
1675	'{{WRAPPER}} .ui-e-field-group:hover .ui-e-field' => 'color: {{VALUE}};',
1676	],
1677	'global' => [
1678	'default' => Global_Colors::COLOR_TEXT,
1679	],
1680	]
1681	);
1682	$this->add_control(
1683	'field_placeholder_hover_color',
1684	[
1685	'label' => esc_html__( 'Placeholder Color', 'uicore-elements' ),
1686	'type' => Controls_Manager::COLOR,
1687	'selectors' => [
1688	'{{WRAPPER}} .ui-e-field-group:hover .ui-e-field::placeholder' => 'color: {{VALUE}};',
1689	],
1690	'global' => [
1691	'default' => Global_Colors::COLOR_TEXT,
1692	],
1693	]
1694	);
1695	$this->add_control(
1696	'field_background_hover_color',
1697	[
1698	'label' => esc_html__( 'Background Color', 'uicore-elements' ),
1699	'type' => Controls_Manager::COLOR,
1700	'default' => '#ffffff',
1701	'selectors' => [
1702	'{{WRAPPER}} .ui-e-field-group:hover:not(.ui-e-field-type-file) .ui-e-field:not(.ui-e-field-select)' => 'background-color: {{VALUE}};',
1703	'{{WRAPPER}} .ui-e-field-group:hover .ui-e-field-select select' => 'background-color: {{VALUE}};',
1704	],
1705	]
1706	);
1707	$this->add_group_control(
1708	Group_Control_Border::get_type(),
1709	[
1710	'name' => 'field_hover_border',
1711	'selector' =>
1712	'{{WRAPPER}} .ui-e-field-group:hover:not(.ui-e-field-type-file) .ui-e-field:not(.ui-e-field-select),
1713	{{WRAPPER}} .ui-e-field-group:hover .ui-e-field-select select',
1714	]
1715	);
1716
1717	$this->end_controls_tab();
1718
1719	$this->start_controls_tab(
1720	'field_active_tab',
1721	[
1722	'label' => esc_html__( 'Active', 'uicore-elements' ),
1723	]
1724	);
1725
1726	$this->add_control(
1727	'field_text_active_color',
1728	[
1729	'label' => esc_html__( 'Text Color', 'uicore-elements' ),
1730	'type' => Controls_Manager::COLOR,
1731	'selectors' => [
1732	'{{WRAPPER}} .ui-e-field-group .ui-e-field:focus' => 'color: {{VALUE}};',
1733	],
1734	'global' => [
1735	'default' => Global_Colors::COLOR_TEXT,
1736	],
1737	]
1738	);
1739	$this->add_control(
1740	'field_background_active_color',
1741	[
1742	'label' => esc_html__( 'Background Color', 'uicore-elements' ),
1743	'type' => Controls_Manager::COLOR,
1744	'default' => '#ffffff',
1745	'selectors' => [
1746	'{{WRAPPER}} .ui-e-field-group:not(.ui-e-field-type-file) .ui-e-field:focus:not(.ui-e-field-select)' => 'background-color: {{VALUE}};',
1747	'{{WRAPPER}} .ui-e-field-group .ui-e-field-select:focus select' => 'background-color: {{VALUE}};',
1748	],
1749	]
1750	);
1751	$this->add_group_control(
1752	Group_Control_Border::get_type(),
1753	[
1754	'name' => 'field_active_border',
1755	'selector' =>
1756	'{{WRAPPER}} .ui-e-field-group:not(.ui-e-field-type-file) .ui-e-field:focus:not(.ui-e-field-select),
1757	{{WRAPPER}} .ui-e-field-group .ui-e-field-select:focus select',
1758	]
1759	);
1760
1761	$this->end_controls_tab();
1762
1763	$this->end_controls_tabs();
1764
1765	$this->add_control(
1766	'field_border_radius',
1767	[
1768	'label' => esc_html__( 'Border Radius', 'uicore-elements' ),
1769	'type' => Controls_Manager::DIMENSIONS,
1770	'size_units' => [ 'px', '%', 'em', 'rem', 'custom' ],
1771	'selectors' => [
1772	'{{WRAPPER}} .ui-e-field-group:not(.ui-e-field-type-file) .ui-e-field:not(.ui-e-field-select)' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1773	'{{WRAPPER}} .ui-e-field-group .ui-e-field-select select' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1774	],
1775	'separator' => 'before'
1776	]
1777	);
1778	$this->add_control(
1779	'field_padding',
1780	[
1781	'label' => esc_html__( 'Padding', 'uicore-elements' ),
1782	'type' => Controls_Manager::DIMENSIONS,
1783	'size_units' => [ 'px', '%', 'em', 'rem', 'custom' ],
1784	'selectors' => [
1785	'{{WRAPPER}} .ui-e-field-group:not(.ui-e-field-type-file) .ui-e-field:not(.ui-e-field-select)' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1786	'{{WRAPPER}} .ui-e-field-group .ui-e-field-select select' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1787	],
1788	]
1789	);
1790
1791	$this->end_controls_section();
1792
1793	$this->start_controls_section(
1794	'section_button_style',
1795	[
1796	'label' => esc_html__( 'Button', 'uicore-elements' ),
1797	'tab' => Controls_Manager::TAB_STYLE,
1798	]
1799	);
1800
1801	$this->add_group_control(
1802	Group_Control_Typography::get_type(),
1803	[
1804	'name' => 'button_typography',
1805	'global' => [
1806	'default' => Global_Typography::TYPOGRAPHY_ACCENT,
1807	],
1808	'selector' => '{{WRAPPER}} .elementor-button',
1809	]
1810	);
1811	$this->add_group_control(
1812	Group_Control_Border::get_type(), [
1813	'name' => 'button_border',
1814	'selector' => '{{WRAPPER}} .elementor-button',
1815	'exclude' => [
1816	'color',
1817	],
1818	]
1819	);
1820
1821	$this->start_controls_tabs( 'tabs_button_style' );
1822
1823	$this->start_controls_tab(
1824	'tab_button_normal',
1825	[
1826	'label' => esc_html__( 'Normal', 'uicore-elements' ),
1827	]
1828	);
1829
1830	$this->add_control(
1831	'button_background_color',
1832	[
1833	'label' => esc_html__( 'Background Color', 'uicore-elements' ),
1834	'type' => Controls_Manager::COLOR,
1835	'global' => [
1836	'default' => Global_Colors::COLOR_ACCENT,
1837	],
1838	'selectors' => [
1839	'{{WRAPPER}} .e-form__buttons__wrapper__button-next' => 'background-color: {{VALUE}};',
1840	'{{WRAPPER}} .elementor-button[type="submit"]' => 'background-color: {{VALUE}};',
1841	],
1842	]
1843	);
1844	$this->add_control(
1845	'button_text_color',
1846	[
1847	'label' => esc_html__( 'Text Color', 'uicore-elements' ),
1848	'type' => Controls_Manager::COLOR,
1849	'default' => '#ffffff',
1850	'selectors' => [
1851	'{{WRAPPER}} .e-form__buttons__wrapper__button-next' => 'color: {{VALUE}};',
1852	'{{WRAPPER}} .elementor-button[type="submit"]' => 'color: {{VALUE}};',
1853	'{{WRAPPER}} .elementor-button[type="submit"] svg *' => 'fill: {{VALUE}};',
1854	],
1855	]
1856	);
1857	$this->add_control(
1858	'button_border_color',
1859	[
1860	'label' => esc_html__( 'Border Color', 'uicore-elements' ),
1861	'type' => Controls_Manager::COLOR,
1862	'default' => '',
1863	'selectors' => [
1864	'{{WRAPPER}} .e-form__buttons__wrapper__button-next' => 'border-color: {{VALUE}};',
1865	'{{WRAPPER}} .elementor-button[type="submit"]' => 'border-color: {{VALUE}};',
1866	],
1867	'condition' => [
1868	'button_border_border!' => '',
1869	],
1870	]
1871	);
1872
1873	$this->end_controls_tab();
1874
1875	$this->start_controls_tab(
1876	'tab_button_hover',
1877	[
1878	'label' => esc_html__( 'Hover', 'uicore-elements' ),
1879	]
1880	);
1881
1882	$this->add_control(
1883	'button_background_hover_color',
1884	[
1885	'label' => esc_html__( 'Background Color', 'uicore-elements' ),
1886	'type' => Controls_Manager::COLOR,
1887	'default' => '',
1888	'selectors' => [
1889	'{{WRAPPER}} .e-form__buttons__wrapper__button-next:hover' => 'background-color: {{VALUE}};',
1890	'{{WRAPPER}} .elementor-button[type="submit"]:hover' => 'background-color: {{VALUE}};',
1891	],
1892	]
1893	);
1894	$this->add_control(
1895	'button_hover_color',
1896	[
1897	'label' => esc_html__( 'Text Color', 'uicore-elements' ),
1898	'type' => Controls_Manager::COLOR,
1899	'default' => '#ffffff',
1900	'selectors' => [
1901	'{{WRAPPER}} .e-form__buttons__wrapper__button-next:hover' => 'color: {{VALUE}};',
1902	'{{WRAPPER}} .elementor-button[type="submit"]:hover' => 'color: {{VALUE}};',
1903	'{{WRAPPER}} .elementor-button[type="submit"]:hover svg *' => 'fill: {{VALUE}};',
1904	],
1905	]
1906	);
1907	$this->add_control(
1908	'button_hover_border_color',
1909	[
1910	'label' => esc_html__( 'Border Color', 'uicore-elements' ),
1911	'type' => Controls_Manager::COLOR,
1912	'default' => '',
1913	'selectors' => [
1914	'{{WRAPPER}} .e-form__buttons__wrapper__button-next:hover' => 'border-color: {{VALUE}};',
1915	'{{WRAPPER}} .elementor-button[type="submit"]:hover' => 'border-color: {{VALUE}};',
1916	],
1917	'condition' => [
1918	'button_border_border!' => '',
1919	],
1920	]
1921	);
1922	$this->add_control(
1923	'hover_transition_duration',
1924	[
1925	'label' => esc_html__( 'Transition Duration', 'uicore-elements' ),
1926	'type' => Controls_Manager::SLIDER,
1927	'size_units' => [ 's', 'ms', 'custom' ],
1928	'default' => [
1929	'unit' => 'ms',
1930	],
1931	'selectors' => [
1932	'{{WRAPPER}} .e-form__buttons__wrapper__button-previous' => 'transition-duration: {{SIZE}}{{UNIT}};',
1933	'{{WRAPPER}} .e-form__buttons__wrapper__button-next' => 'transition-duration: {{SIZE}}{{UNIT}};',
1934	'{{WRAPPER}} .elementor-button[type="submit"] svg *' => 'transition-duration: {{SIZE}}{{UNIT}};',
1935	'{{WRAPPER}} .elementor-button[type="submit"]' => 'transition-duration: {{SIZE}}{{UNIT}};',
1936	],
1937	]
1938	);
1939	$this->add_control(
1940	'button_hover_animation',
1941	[
1942	'label' => esc_html__( 'Animation', 'uicore-elements' ),
1943	'type' => Controls_Manager::HOVER_ANIMATION,
1944	]
1945	);
1946
1947	$this->end_controls_tab();
1948
1949	$this->end_controls_tabs();
1950
1951	$this->add_control(
1952	'button_border_radius',
1953	[
1954	'label' => esc_html__( 'Border Radius', 'uicore-elements' ),
1955	'type' => Controls_Manager::DIMENSIONS,
1956	'size_units' => [ 'px', '%', 'em', 'rem', 'custom' ],
1957	'selectors' => [
1958	'{{WRAPPER}} .elementor-button' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1959	],
1960	'separator' => 'before',
1961	]
1962	);
1963
1964	$this->add_control(
1965	'button_text_padding',
1966	[
1967	'label' => esc_html__( 'Text Padding', 'uicore-elements' ),
1968	'type' => Controls_Manager::DIMENSIONS,
1969	'size_units' => [ 'px', '%', 'em', 'rem', 'custom' ],
1970	'selectors' => [
1971	'{{WRAPPER}} .elementor-button' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1972	],
1973	]
1974	);
1975
1976	$this->end_controls_section();
1977
1978	$this->start_controls_section(
1979	'section_messages_style',
1980	[
1981	'label' => esc_html__( 'Messages', 'uicore-elements' ),
1982	'tab' => Controls_Manager::TAB_STYLE,
1983	]
1984	);
1985
1986	$this->add_control(
1987	'show_messages',
1988	[
1989	'label' => esc_html__( 'Show/Hide messages', 'uicore-elements' ),
1990	'type' => Controls_Manager::BUTTON,
1991	'separator' => 'before',
1992	'text' => esc_html__( 'Toggle', 'uicore-elements' ),
1993	'event' => 'ui-e-form-show-messages',
1994	]
1995	);
1996	$this->add_group_control(
1997	Group_Control_Typography::get_type(),
1998	[
1999	'name' => 'message_typography',
2000	'global' => [
2001	'default' => Global_Typography::TYPOGRAPHY_TEXT,
2002	],
2003	'selector' => '{{WRAPPER}} .ui-e-message',
2004	]
2005	);
2006	$this->add_control(
2007	'success_message_color',
2008	[
2009	'label' => esc_html__( 'Success Message Color', 'uicore-elements' ),
2010	'type' => Controls_Manager::COLOR,
2011	'default' => '#4CAF50',
2012	'selectors' => [
2013	'{{WRAPPER}} .ui-e-message span.success' => 'color: {{COLOR}};',
2014	],
2015	]
2016	);
2017	$this->add_control(
2018	'error_message_color',
2019	[
2020	'label' => esc_html__( 'Error Message Color', 'uicore-elements' ),
2021	'type' => Controls_Manager::COLOR,
2022	'default' => '#F44336',
2023	'selectors' => [
2024	'{{WRAPPER}} .ui-e-message span.error' => 'color: {{COLOR}};',
2025	],
2026	]
2027	);
2028
2029	$this->end_controls_section();
2030	}
2031	function recaptcha_js()
2032	{
2033	?>
2034	<script>
2035	window.uicore_elements_recaptcha = '<?php echo get_option('uicore_elements_recaptcha_site_key'); ?>';
2036	</script>
2037	<?php
2038	}
2039
2040	protected function render() {
2041
2042	$instance = $this->get_settings_for_display();
2043	$is_recaptcha_required = false;
2044
2045	// Save widget settings so form API can retrieve them
2046	set_transient('ui_e_form_widget_settings_' . $this->get_id(), $instance, DAY_IN_SECONDS);
2047
2048	// Render Form Atts
2049	$this->add_render_attribute(
2050	[
2051	'wrapper' => [
2052	'class' => [
2053	'ui-e-fields-wrp',
2054	],
2055	],
2056	'submit-group' => [
2057	'class' => [
2058	'ui-e-field-group',
2059	'elementor-column',
2060	'ui-e-field-type-submit',
2061	],
2062	],
2063	'button' => [
2064	'class' => 'elementor-button',
2065	],
2066	'icon-align' => [
2067	'class' => [
2068	empty( $instance['button_icon_align'] ) ? '' : 'ui-e-icon ui-e-align-' . $instance['button_icon_align'],
2069	],
2070	],
2071	]
2072	);
2073
2074	// Fallback for empty control values
2075	if ( empty( $instance['button_width'] ) ) {
2076	$instance['button_width'] = '100';
2077	}
2078
2079	// Button atts
2080	$this->add_render_attribute( 'submit-group', 'class', 'elementor-col-' . $instance['button_width'] . ' e-form__buttons' );
2081
2082	if ( ! empty( $instance['button_width_tablet'] ) ) {
2083	$this->add_render_attribute( 'submit-group', 'class', 'elementor-md-' . $instance['button_width_tablet'] );
2084	}
2085	if ( ! empty( $instance['button_width_mobile'] ) ) {
2086	$this->add_render_attribute( 'submit-group', 'class', 'elementor-sm-' . $instance['button_width_mobile'] );
2087	}
2088	if ( $instance['button_hover_animation'] ) {
2089	$this->add_render_attribute( 'button', 'class', 'elementor-animation-' . $instance['button_hover_animation'] );
2090	}
2091
2092	// Form atts
2093	if ( ! empty( $instance['form_id'] ) ) {
2094	$this->add_render_attribute( 'form', 'id', $instance['form_id'] );
2095	}
2096	if ( ! empty( $instance['form_name'] ) ) {
2097	$this->add_render_attribute( 'form', 'name', $instance['form_name'] );
2098	}
2099	if ( 'no' === $instance['form_validation'] ) {
2100	$this->add_render_attribute( 'form', 'novalidate' );
2101	}
2102	if ( ! empty( $instance['button_css_id'] ) ) {
2103	$this->add_render_attribute( 'button', 'id', $instance['button_css_id'] );
2104	}
2105
2106	$referer_title = trim( wp_title( '', false ) );
2107	if ( ! $referer_title && is_home() ) {
2108	$referer_title = get_option( 'blogname' );
2109	}
2110
2111	?>
2112
2113	<form class="ui-e-form" method="post" <?php $this->print_render_attribute_string( 'form' ); ?>>
2114
2115	<input type="hidden" name="post_id" value="<?php echo esc_attr( get_the_ID()); ?>"/>
2116	<input type="hidden" name="widget_type" value="contact-form">
2117
2118	<div <?php $this->print_render_attribute_string( 'wrapper' ); ?>>
2119	<?php
2120	foreach ( $instance['form_fields'] as $item_index => $item ) :
2121	$this->form_fields_render_attributes( $item_index, $instance, $item );
2122
2123	$field_type = $item['field_type'];
2124
2125	if( $field_type === 'recaptcha' \|\| $field_type === 'recaptcha_v3' ){
2126	$is_recaptcha_required = true;
2127	}
2128
2129	$print_label = ! in_array( $item['field_type'], [ 'hidden', 'html' ], true );
2130	?>
2131
2132	<div <?php $this->print_render_attribute_string( 'field-group' . $item_index ); ?>>
2133	<?php
2134	// Print label (excepts if recaptcha)
2135	if ( $print_label && $item['field_label'] && $item['field_type'] !== 'recaptcha' && $item['field_type'] !== 'recaptcha_v3' ){
2136	?>
2137	<label <?php $this->print_render_attribute_string( 'label' . $item_index ); ?>>
2138	<?php // PHPCS - the variable $item['field_label'] is safe.
2139	echo $item['field_label']; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
2140	</label>
2141	<?php
2142	}
2143
2144	// Print field
2145	switch ( $item['field_type'] ) :
2146	case 'html':
2147	echo do_shortcode( $item['field_html'] );
2148	break;
2149
2150	case 'textarea':
2151	// PHPCS - the method build_textarea_field is safe.
2152	echo $this->build_textarea_field( $item, $item_index ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
2153	break;
2154
2155	case 'select':
2156	// PHPCS - the method build_select_field is safe.
2157	echo $this->build_select_field( $item, $item_index ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
2158	break;
2159
2160	case 'acceptance':
2161	// PHPCS - the method build_select_field is safe.
2162	echo $this->build_acceptance_field( $item, $item_index); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
2163	break;
2164
2165	case 'radio':
2166	case 'checkbox':
2167	// PHPCS - the method build_radio_checkbox_field is safe.
2168	echo $this->build_radio_checkbox_field( $item, $item_index, $item['field_type'] ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
2169	break;
2170
2171	case 'address': // is actually honeypot
2172	// PHPCS - the method build_honeypot_field is safe.
2173	echo $this->build_honeypot_field( $item, $item_index ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
2174	break;
2175
2176	case 'recaptcha':
2177	// get widget ID
2178	echo '<input type="hidden" name="recaptcha"/> <div id="ui-e-recaptcha-'.esc_attr($this->get_ID()).'"></div>';
2179	break;
2180
2181	case 'recaptcha_v3':
2182	echo '<input type="hidden" name="recaptcha_v3"/>';
2183	break;
2184
2185	// All other cases are covered by the add_render_atribute()
2186	default:
2187	$this->add_render_attribute('input' . $item_index, 'class', 'ui-e-field-textual');
2188	?>
2189	<input size="1" <?php $this->print_render_attribute_string( 'input' . $item_index ); ?>>
2190	<?php
2191	break;
2192
2193	endswitch;
2194	?>
2195	</div>
2196
2197	<?php endforeach; ?>
2198
2199	<div <?php $this->print_render_attribute_string( 'submit-group' ); ?>>
2200	<button type="submit" <?php $this->print_render_attribute_string( 'button' ); ?>>
2201	<span <?php $this->print_render_attribute_string( 'content-wrapper' ); ?>>
2202	<?php if ( ! empty( $instance['button_icon'] ) \|\| ! empty( $instance['selected_button_icon'] ) ) : ?>
2203	<span <?php $this->print_render_attribute_string( 'icon-align' ); ?>>
2204	<?php Icons_Manager::render_icon( $instance['selected_button_icon'], [ 'aria-hidden' => 'true' ] ); ?>
2205	<?php if ( empty( $instance['button_text'] ) ) : ?>
2206	<span class="elementor-screen-only"><?php echo esc_html__( 'Submit', 'uicore-elements' ); ?></span>
2207	<?php endif; ?>
2208	</span>
2209	<?php endif; ?>
2210	<?php if ( ! empty( $instance['button_text'] ) ) : ?>
2211	<span class="ui-e-text"><?php $this->print_unescaped_setting( 'button_text' ); ?></span>
2212	<?php endif; ?>
2213	</span>
2214	</button>
2215	</div>
2216
2217	</div>
2218
2219	<div class="ui-e-message <?php echo $this->is_edit_mode() ? 'elementor-hidden' : ''; ?>">
2220	<?php if($this->is_edit_mode()) :
2221	// Get custom messages if set, else use default
2222	$messages = Contact_Form_Service::get_default_messages();
2223	$success = isset($instance['success_message']) ? $instance['success_message'] : $messages['success'];
2224	$error = isset($instance['error_message']) ? $instance['error_message'] : $messages['error'];
2225	?>
2226	<span class="success"> <?php echo esc_html($success);?> </span> <br>
2227	<span class="error"> <?php echo esc_html($error);?> </span>
2228	<?php endif; ?>
2229	</div>
2230	</form>
2231	<?php
2232
2233	//add js to footer if recaptcha is enabled
2234	if($is_recaptcha_required){
2235	add_action('wp_footer', [$this, 'recaptcha_js'], 999);
2236	}
2237	}
2238	protected function content_template() {
2239	?>
2240	<#
2241	view.addRenderAttribute(
2242	'form',
2243	{
2244	'id': settings.form_id,
2245	'name': settings.form_name,
2246	}
2247	);
2248	if ( 'no' === settings.form_validation ) {
2249	view.addRenderAttribute( 'form', 'novalidate' );
2250	}
2251	#>
2252	<form class="ui-e-form" {{{ view.getRenderAttributeString( 'form' ) }}}>
2253	<div class="ui-e-fields-wrp">
2254	<#
2255	for ( var i in settings.form_fields ) {
2256	var item = settings.form_fields[ i ];
2257	item.field_type = _.escape( item.field_type );
2258	item.field_value = _.escape( item.field_value );
2259
2260	var options = item.field_options ? item.field_options.split( '\n' ) : [],
2261	itemClasses = _.escape( item.css_classes ),
2262	labelVisibility = '',
2263	placeholder = '',
2264	required = '',
2265	checked_by_default = '',
2266	inputField = '',
2267	multiple = '',
2268	fieldGroupClasses = 'ui-e-field-group elementor-column ui-e-field-type-' + item.field_type,
2269	printLabel = settings.show_labels && ! [ 'hidden', 'html', 'recaptcha', 'recaptcha_v3' ].includes( item.field_type );
2270
2271	fieldGroupClasses += ' elementor-col-' + ( ( '' !== item.width ) ? item.width : '100' );
2272
2273	if ( item.width_tablet ) {
2274	fieldGroupClasses += ' elementor-md-' + item.width_tablet;
2275	}
2276
2277	if ( item.width_mobile ) {
2278	fieldGroupClasses += ' elementor-sm-' + item.width_mobile;
2279	}
2280
2281	if ( item.required ) {
2282	required = 'required';
2283	fieldGroupClasses += ' ui-e-field-required';
2284
2285	if ( settings.mark_required ) {
2286	fieldGroupClasses += ' ui-e-required';
2287	}
2288	}
2289
2290	if ( item.placeholder ) {
2291	placeholder = 'placeholder="' + _.escape( item.placeholder ) + '"';
2292	}
2293
2294	if ( item.allow_multiple ) {
2295	multiple = ' multiple';
2296	fieldGroupClasses += ' ui-e-field-type-' + item.field_type + '-multiple';
2297	}
2298
2299	switch ( item.field_type ) {
2300	case 'html':
2301	inputField = item.field_html;
2302	break;
2303
2304	case 'textarea':
2305	inputField = '<textarea class="ui-e-field ui-e-field-textual elementor-size-' + settings.input_size + ' ' + itemClasses + '" name="form_field_' + i + '" id="form_field_' + i + '" rows="' + item.rows + '" ' + required + ' ' + placeholder + '>' + item.field_value + '</textarea>';
2306	break;
2307
2308	case 'select':
2309	if ( options ) {
2310	var size = '';
2311	if ( item.allow_multiple && item.select_size ) {
2312	size = ' size="' + item.select_size + '"';
2313	}
2314	inputField = '<div class="ui-e-field ui-e-field-select ui-e-field-subgroup' + itemClasses + '">';
2315	inputField += '<select class="ui-e-field-textual" name="form_field_' + i + '" id="form_field_' + i + '" ' + required + multiple + size + ' >';
2316	for ( var x in options ) {
2317	var option_value = options[ x ];
2318	var option_label = options[ x ];
2319	var option_id = 'form_field_option' + i + x;
2320
2321	if ( options[ x ].indexOf( '\|' ) > -1 ) {
2322	var label_value = options[ x ].split( '\|' );
2323	option_label = label_value[0];
2324	option_value = label_value[1];
2325	}
2326
2327	view.addRenderAttribute( option_id, 'value', option_value );
2328	if ( item.field_value.split( ',' ) .indexOf( option_value ) ) {
2329	view.addRenderAttribute( option_id, 'selected', 'selected' );
2330	}
2331	inputField += '<option ' + view.getRenderAttributeString( option_id ) + '>' + option_label + '</option>';
2332	}
2333	inputField += '</select></div>';
2334	}
2335	break;
2336
2337	case 'radio':
2338	case 'checkbox':
2339	if ( options ) {
2340	var multiple = '';
2341
2342	if ( 'checkbox' === item.field_type && options.length > 1 ) {
2343	multiple = '[]';
2344	}
2345
2346	inputField = '<div class="ui-e-field-subgroup ' + itemClasses + ' ' + _.escape( item.inline_list ) + '">';
2347
2348	for ( var x in options ) {
2349	var option_value = options[ x ];
2350	var option_label = options[ x ];
2351	var option_id = 'form_field_' + item.field_type + i + x;
2352	if ( options[x].indexOf( '\|' ) > -1 ) {
2353	var label_value = options[x].split( '\|' );
2354	option_label = label_value[0];
2355	option_value = label_value[1];
2356	}
2357
2358	view.addRenderAttribute( option_id, {
2359	value: option_value,
2360	type: item.field_type,
2361	id: 'form_field_' + i + '-' + x,
2362	name: 'form_field_' + i + multiple
2363	} );
2364
2365	if ( option_value === item.field_value ) {
2366	view.addRenderAttribute( option_id, 'checked', 'checked' );
2367	}
2368
2369	inputField += '<span class="ui-e-field-option"><input ' + view.getRenderAttributeString( option_id ) + ' ' + required + '> ';
2370	inputField += '<label for="form_field_' + i + '-' + x + '">' + option_label + '</label></span>';
2371
2372	}
2373
2374	inputField += '</div>';
2375	}
2376	break;
2377
2378	case 'acceptance' :
2379	var checked = '';
2380	if(item.checked_by_default == 'yes') {
2381	checked = ' checked';
2382	}
2383	inputField += '<div class="ui-e-field-subgroup">';
2384	inputField += '<input type="checkbox" class="ui-e-field ui-e-acceptance-field" name="form_field_' + i + '" id="form_field_' + i + '" ' + required + checked + '>';
2385	inputField += '<label for="form_field_' + i + '">' + item.acceptance_text + '</label>';
2386	inputField += '</div>';
2387	break;
2388
2389	case 'recaptcha' :
2390	case 'recaptcha_v3' :
2391	inputField = '<input type="hidden" name="recaptcha"/> <div id="ui-e-recaptcha"></div>';
2392	break;
2393
2394	default:
2395	itemClasses = 'ui-e-field-textual ' + itemClasses;
2396	inputField = '<input size="1" type="' + item.field_type + '" value="' + item.field_value + '" class="ui-e-field elementor-size-' + settings.input_size + ' ' + itemClasses + '" name="form_field_' + i + '" id="form_field_' + i + '" ' + required + ' ' + placeholder + ' >';
2397	break;
2398	}
2399
2400	if ( inputField ) {
2401	#>
2402	<div class="{{ fieldGroupClasses }}">
2403
2404	<# if ( printLabel && item.field_label ) { #>
2405	<label class="ui-e-field-label" for="form_field_{{ i }}" {{{ labelVisibility }}}>{{{ item.field_label }}}</label>
2406	<# } #>
2407
2408	{{{ inputField }}}
2409	</div>
2410	<#
2411	}
2412	}
2413
2414
2415	var buttonClasses = 'ui-e-field-group elementor-column ui-e-field-type-submit e-form__buttons';
2416
2417	buttonClasses += ' elementor-col-' + ( ( '' !== settings.button_width ) ? settings.button_width : '100' );
2418
2419	if ( settings.button_width_tablet ) {
2420	buttonClasses += ' elementor-md-' + settings.button_width_tablet;
2421	}
2422
2423	if ( settings.button_width_mobile ) {
2424	buttonClasses += ' elementor-sm-' + settings.button_width_mobile;
2425	}
2426
2427	var iconHTML = elementor.helpers.renderIcon( view, settings.selected_button_icon, { 'aria-hidden': true }, 'i' , 'object' )
2428	#>
2429
2430	<div class="{{ buttonClasses }}">
2431	<button id="{{ settings.button_css_id }}" type="submit" class="elementor-button elementor-animation-{{ settings.button_hover_animation }}">
2432	<span>
2433	<# if ( settings.button_icon \|\| settings.selected_button_icon ) { #>
2434	<span class="ui-e-icon ui-e-align-{{ settings.button_icon_align }}">
2435	<# if ( iconHTML && iconHTML.rendered && ( ! settings.button_icon ) ) { #>
2436	{{{ iconHTML.value }}}
2437	<# } else { #>
2438	<i class="{{ settings.button_icon }}" aria-hidden="true"></i>
2439	<# } #>
2440	<span class="elementor-screen-only"><?php echo esc_html__( 'Submit', 'uicore-elements' ); ?></span>
2441	</span>
2442	<# } #>
2443
2444	<# if ( settings.button_text ) { #>
2445	<span class="ui-e-text">{{{ settings.button_text }}}</span>
2446	<# } #>
2447	</span>
2448	</button>
2449	</div>
2450	</div>
2451	<div class="ui-e-message elementor-hidden">
2452	<#
2453	const success = settings.success_message;
2454	const error = settings.error_message;
2455	#>
2456	<span class="success">{{{ success }}}</span> <br>
2457	<span class="error">{{{ error }}}</span>
2458	</div>
2459	</form>
2460	<?php
2461	}
2462	}
2463	\Elementor\Plugin::instance()->widgets_manager->register(new ContactForm());