fluentform / app / Modules / Widgets / FluentFormWidget.php

FluentFormWidget.php in Fluent Forms – Customizable Contact Forms, Survey, Quiz, & Conversational Form Builder 4.3.13, at app/Modules/Widgets/FluentFormWidget.php

2,491 lines 88.4 KB

Raw Download Zip

1	<?php
2
3	namespace FluentForm\App\Modules\Widgets;
4
5	use Elementor\Widget_Base;
6	use Elementor\Controls_Manager;
7	use Elementor\Group_Control_Border;
8	use Elementor\Group_Control_Box_Shadow;
9	use Elementor\Group_Control_Typography;
10	use Elementor\Core\Schemes\Typography as Scheme_Typography;
11	use Elementor\Group_Control_Background;
12	use Elementor\Core\Schemes\Color as Scheme_Color;
13	use FluentForm\App\Helpers\Helper;
14
15	if (! defined('ABSPATH')) {
16	exit;
17	} // Exit if accessed directly
18
19	class FluentFormWidget extends Widget_Base
20	{
21	public function get_name()
22	{
23	return 'fluent-form-widget';
24	}
25
26	public function get_title()
27	{
28	return __('Fluent Forms', 'fluentform');
29	}
30
31	public function get_icon()
32	{
33	return 'eicon-form-horizontal';
34	}
35
36	public function get_keywords()
37	{
38	return [
39	'fluentform',
40	'fluentforms',
41	'fluent form',
42	'fluent forms',
43	'contact form',
44	'form',
45	'elementor form',
46	];
47	}
48
49	public function get_categories()
50	{
51	return array('general');
52	}
53
54	public function get_style_depends()
55	{
56	return [
57	'fluent-form-styles',
58	'fluentform-public-default'
59	];
60	}
61
62	public function get_script_depends()
63	{
64	return [ 'fluentform-elementor'];
65	}
66
67	protected function register_controls()
68	{
69	$this->register_general_controls();
70	$this->register_error_controls();
71	$this->register_title_description_style_controls();
72	$this->register_form_container_style_controls();
73	$this->register_label_style_controls();
74	$this->register_input_textarea_style_controls();
75	$this->register_placeholder_style_controls();
76	$this->register_radio_checkbox_style_controls();
77	$this->register_terms_gdpr_style_controls();
78	$this->register_section_break_style_controls();
79	$this->register_checkbox_grid_style_controls();
80	$this->register_address_line_style_controls();
81	$this->register_image_upload_style_controls();
82	$this->register_pagination_style_controls();
83	$this->register_submit_button_style_controls();
84	$this->register_success_message_style_controls();
85	$this->register_errors_style_controls();
86	}
87
88	protected function register_general_controls()
89	{
90	$this->start_controls_section(
91	'section_fluent_form',
92	[
93	'label' => __('Fluent Forms', 'fluentform'),
94	]
95	);
96
97
98	$this->add_control(
99	'form_list',
100	[
101	'label' => esc_html__('Fluent Forms', 'fluentform'),
102	'type' => Controls_Manager::SELECT,
103	'label_block' => true,
104	'options' => Helper::getForms(),
105	'default' => '0',
106	]
107	);
108
109	$this->add_control(
110	'custom_title_description',
111	[
112	'label' => __('Custom Title & Description', 'fluentform'),
113	'type' => Controls_Manager::SWITCHER,
114	'label_on' => __('Yes', 'fluentform'),
115	'label_off' => __('No', 'fluentform'),
116	'return_value' => 'yes',
117	]
118	);
119
120	$this->add_control(
121	'form_title_custom',
122	[
123	'label' => esc_html__('Title', 'fluentform'),
124	'type' => Controls_Manager::TEXT,
125	'label_block' => true,
126	'default' => '',
127	'condition' => [
128	'custom_title_description' => 'yes',
129	],
130	]
131	);
132
133	$this->add_control(
134	'form_description_custom',
135	[
136	'label' => esc_html__('Description', 'fluentform'),
137	'type' => Controls_Manager::TEXTAREA,
138	'default' => '',
139	'condition' => [
140	'custom_title_description' => 'yes',
141	],
142	]
143	);
144
145	$this->add_control(
146	'labels_switch',
147	[
148	'label' => __('Labels', 'fluentform'),
149	'type' => Controls_Manager::SWITCHER,
150	'default' => 'yes',
151	'label_on' => __('Show', 'fluentform'),
152	'label_off' => __('Hide', 'fluentform'),
153	'return_value' => 'yes'
154	]
155	);
156
157	$this->add_control(
158	'placeholder_switch',
159	[
160	'label' => __('Placeholder', 'fluentform'),
161	'type' => Controls_Manager::SWITCHER,
162	'default' => 'yes',
163	'label_on' => __('Show', 'fluentform'),
164	'label_off' => __('Hide', 'fluentform'),
165	'return_value' => 'yes',
166	]
167	);
168
169	$this->end_controls_section();
170	}
171
172	protected function register_error_controls()
173	{
174	$this->start_controls_section(
175	'section_errors',
176	[
177	'label' => __('Errors', 'fluentform'),
178	]
179	);
180
181	$this->add_control(
182	'error_messages',
183	[
184	'label' => __('Error Messages', 'fluentform'),
185	'type' => Controls_Manager::SWITCHER,
186	'default' => 'yes',
187	'label_on' => __('Show', 'fluentform'),
188	'label_off' => __('Hide', 'fluentform'),
189	'return_value' => 'yes',
190	]
191	);
192
193	$this->end_controls_section();
194	}
195
196	protected function register_title_description_style_controls()
197	{
198	$this->start_controls_section(
199	'section_form_title_style',
200	[
201	'label' => __('Title & Description', 'fluentform'),
202	'tab' => Controls_Manager::TAB_STYLE,
203	'condition' => [
204	'custom_title_description' => 'yes',
205	],
206	]
207	);
208
209	$this->add_responsive_control(
210	'heading_alignment',
211	[
212	'label' => __('Alignment', 'fluentform'),
213	'type' => Controls_Manager::CHOOSE,
214	'options' => [
215	'left' => [
216	'title' => __('Left', 'fluentform'),
217	'icon' => 'fa fa-align-left',
218	],
219	'center' => [
220	'title' => __('Center', 'fluentform'),
221	'icon' => 'fa fa-align-center',
222	],
223	'right' => [
224	'title' => __('Right', 'fluentform'),
225	'icon' => 'fa fa-align-right',
226	],
227	],
228	'default' => '',
229	'selectors' => [
230	'{{WRAPPER}} .fluentform-widget-title' => 'text-align: {{VALUE}};',
231	'{{WRAPPER}} .fluentform-widget-description' => 'text-align: {{VALUE}};',
232	],
233	'condition' => [
234	'custom_title_description' => 'yes',
235	],
236	]
237	);
238
239	$this->add_control(
240	'heading_title',
241	[
242	'label' => __('Title', 'fluentform'),
243	'type' => Controls_Manager::HEADING,
244	'separator' => 'before',
245	'condition' => [
246	'custom_title_description' => 'yes',
247	],
248	]
249	);
250
251	$this->add_control(
252	'form_title_text_color',
253	[
254	'label' => __('Color', 'fluentform'),
255	'type' => Controls_Manager::COLOR,
256	'default' => '',
257	'selectors' => [
258	'{{WRAPPER}} .fluentform-widget-title' => 'color: {{VALUE}}',
259	],
260	'condition' => [
261	'custom_title_description' => 'yes',
262	],
263	]
264	);
265
266	$this->add_group_control(
267	Group_Control_Typography::get_type(),
268	[
269	'name' => 'form_title_typography',
270	'label' => __('Typography', 'fluentform'),
271	'selector' => '{{WRAPPER}} .fluentform-widget-title',
272	'condition' => [
273	'custom_title_description' => 'yes',
274	],
275	]
276	);
277
278	$this->add_responsive_control(
279	'form_title_margin',
280	[
281	'label' => __('Margin', 'fluentform'),
282	'type' => Controls_Manager::DIMENSIONS,
283	'size_units' => ['px', 'em', '%'],
284	'allowed_dimensions' => 'vertical',
285	'placeholder' => [
286	'top' => '',
287	'right' => 'auto',
288	'bottom' => '',
289	'left' => 'auto',
290	],
291	'selectors' => [
292	'{{WRAPPER}} .fluentform-widget-title' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
293	],
294	'condition' => [
295	'custom_title_description' => 'yes',
296	],
297	]
298	);
299
300	$this->add_responsive_control(
301	'form_title_padding',
302	[
303	'label' => esc_html__('Padding', 'fluentform'),
304	'type' => Controls_Manager::DIMENSIONS,
305	'size_units' => ['px', 'em', '%'],
306	'selectors' => [
307	'{{WRAPPER}} .fluentform-widget-title' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
308	],
309	]
310	);
311
312
313	$this->add_control(
314	'heading_description',
315	[
316	'label' => __('Description', 'fluentform'),
317	'type' => Controls_Manager::HEADING,
318	'separator' => 'before',
319	'condition' => [
320	'custom_title_description' => 'yes',
321	],
322	]
323	);
324
325	$this->add_control(
326	'heading_description_text_color',
327	[
328	'label' => __('Color', 'fluentform'),
329	'type' => Controls_Manager::COLOR,
330	'default' => '',
331	'selectors' => [
332	'{{WRAPPER}} .fluentform-widget-description' => 'color: {{VALUE}}',
333	],
334	'condition' => [
335	'custom_title_description' => 'yes',
336	],
337	]
338	);
339
340	$this->add_group_control(
341	Group_Control_Typography::get_type(),
342	[
343	'name' => 'heading_description_typography',
344	'label' => __('Typography', 'fluentform'),
345	'scheme' => Scheme_Typography::TYPOGRAPHY_4,
346	'selector' => '{{WRAPPER}} .fluentform-widget-description',
347	'condition' => [
348	'custom_title_description' => 'yes',
349	],
350	]
351	);
352
353
354	$this->add_responsive_control(
355	'heading_description_margin',
356	[
357	'label' => __('Margin', 'fluentform'),
358	'type' => Controls_Manager::DIMENSIONS,
359	'size_units' => ['px', 'em', '%'],
360	'allowed_dimensions' => 'vertical',
361	'placeholder' => [
362	'top' => '',
363	'right' => 'auto',
364	'bottom' => '',
365	'left' => 'auto',
366	],
367	'selectors' => [
368	'{{WRAPPER}} .fluentform-widget-description' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
369	],
370	'condition' => [
371	'custom_title_description' => 'yes',
372	],
373	]
374	);
375
376	$this->add_responsive_control(
377	'heading_description_padding',
378	[
379	'label' => esc_html__('Padding', 'fluentform'),
380	'type' => Controls_Manager::DIMENSIONS,
381	'size_units' => ['px', 'em', '%'],
382	'selectors' => [
383	'{{WRAPPER}} .fluentform-widget-description' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
384	],
385	]
386	);
387
388	$this->end_controls_section();
389	}
390
391	protected function register_form_container_style_controls()
392	{
393	$this->start_controls_section(
394	'section_form_container_style',
395	[
396	'label' => __('Form Container', 'fluentform'),
397	'tab' => Controls_Manager::TAB_STYLE,
398	]
399	);
400
401
402	$this->add_group_control(
403	Group_Control_Background::get_type(),
404	[
405	'name' => 'form_container_background',
406	'label' => __('Background', 'fluentform'),
407	'types' => [ 'classic', 'gradient' ],
408	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper',
409	]
410	);
411
412
413	$this->add_control(
414	'form_container_link_color',
415	[
416	'label' => __('Link Color', 'fluentform'),
417	'type' => Controls_Manager::COLOR,
418	'default' => '',
419	'selectors' => [
420	'{{WRAPPER}} .fluentform-widget-wrapper .ff-el-group a' => 'color: {{VALUE}};',
421	],
422	]
423	);
424
425	$this->add_responsive_control(
426	'form_container_max_width',
427	[
428	'label' => esc_html__('Max Width', 'fluentform'),
429	'type' => Controls_Manager::SLIDER,
430	'size_units' => ['px', 'em', '%'],
431	'range' => [
432	'px' => [
433	'min' => 10,
434	'max' => 1500,
435	],
436	'em' => [
437	'min' => 1,
438	'max' => 80,
439	],
440	],
441	'selectors' => [
442	'{{WRAPPER}} .fluentform-widget-wrapper' => 'width: {{SIZE}}{{UNIT}};'
443	],
444	]
445	);
446
447	$this->add_responsive_control(
448	'form_container_alignment',
449	[
450	'label' => esc_html__('Alignment', 'fluentform'),
451	'type' => Controls_Manager::CHOOSE,
452	'label_block' => true,
453	'options' => [
454	'default' => [
455	'title' => __('Default', 'fluentform'),
456	'icon' => 'fa fa-ban',
457	],
458	'left' => [
459	'title' => esc_html__('Left', 'fluentform'),
460	'icon' => 'eicon-h-align-left',
461	],
462	'center' => [
463	'title' => esc_html__('Center', 'fluentform'),
464	'icon' => 'eicon-h-align-center',
465	],
466	'right' => [
467	'title' => esc_html__('Right', 'fluentform'),
468	'icon' => 'eicon-h-align-right',
469	],
470	],
471	'default' => 'default',
472	]
473	);
474
475	$this->add_responsive_control(
476	'form_container_margin',
477	[
478	'label' => esc_html__('Margin', 'fluentform'),
479	'type' => Controls_Manager::DIMENSIONS,
480	'size_units' => ['px', 'em', '%'],
481	'selectors' => [
482	'{{WRAPPER}} .fluentform-widget-wrapper' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
483	],
484	]
485	);
486
487	$this->add_responsive_control(
488	'form_container_padding',
489	[
490	'label' => esc_html__('Padding', 'fluentform'),
491	'type' => Controls_Manager::DIMENSIONS,
492	'size_units' => ['px', 'em', '%'],
493	'selectors' => [
494	'{{WRAPPER}} .fluentform-widget-wrapper' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
495	],
496	]
497	);
498
499
500	$this->add_group_control(
501	Group_Control_Border::get_type(),
502	[
503	'name' => 'form_container_border',
504	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper',
505	]
506	);
507
508	$this->add_control(
509	'form_container_border_radius',
510	[
511	'label' => esc_html__('Border Radius', 'fluentform'),
512	'type' => Controls_Manager::DIMENSIONS,
513	'separator' => 'before',
514	'size_units' => ['px'],
515	'selectors' => [
516	'{{WRAPPER}} .fluentform-widget-wrapper' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
517	],
518	]
519	);
520
521	$this->add_group_control(
522	Group_Control_Box_Shadow::get_type(),
523	[
524	'name' => 'form_container_box_shadow',
525	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper',
526	]
527	);
528
529	$this->end_controls_section();
530	}
531
532	protected function register_label_style_controls()
533	{
534	$this->start_controls_section(
535	'section_form_label_style',
536	[
537	'label' => __('Labels', 'fluentform'),
538	'tab' => Controls_Manager::TAB_STYLE,
539	]
540	);
541
542	$this->add_control(
543	'form_label_text_color',
544	[
545	'label' => __('Text Color', 'fluentform'),
546	'type' => Controls_Manager::COLOR,
547	'selectors' => [
548	'{{WRAPPER}} .fluentform-widget-wrapper .ff-el-input--label label' => 'color: {{VALUE}}',
549	],
550	]
551	);
552
553	$this->add_group_control(
554	Group_Control_Typography::get_type(),
555	[
556	'name' => 'form_label_typography',
557	'label' => __('Typography', 'fluentform'),
558	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper .ff-el-input--label label',
559	]
560	);
561
562	$this->end_controls_section();
563	}
564
565	protected function register_input_textarea_style_controls()
566	{
567	$this->start_controls_section(
568	'section_form_fields_style',
569	[
570	'label' => __('Input & Textarea', 'fluentform'),
571	'tab' => Controls_Manager::TAB_STYLE,
572	]
573	);
574
575	$this->add_responsive_control(
576	'input_alignment',
577	[
578	'label' => __('Alignment', 'fluentform'),
579	'type' => Controls_Manager::CHOOSE,
580	'options' => [
581	'left' => [
582	'title' => __('Left', 'fluentform'),
583	'icon' => 'fa fa-align-left',
584	],
585	'center' => [
586	'title' => __('Center', 'fluentform'),
587	'icon' => 'fa fa-align-center',
588	],
589	'right' => [
590	'title' => __('Right', 'fluentform'),
591	'icon' => 'fa fa-align-right',
592	],
593	],
594	'default' => '',
595	'selectors' => [
596	'{{WRAPPER}} .fluentform-widget-wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]), {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group textarea, {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group select' => 'text-align: {{VALUE}};',
597	],
598	]
599	);
600
601	$this->start_controls_tabs('tabs_form_fields_style');
602
603	$this->start_controls_tab(
604	'tab_form_fields_normal',
605	[
606	'label' => __('Normal', 'fluentform'),
607	]
608	);
609
610	$this->add_control(
611	'form_field_bg_color',
612	[
613	'label' => __('Background Color', 'fluentform'),
614	'type' => Controls_Manager::COLOR,
615	'default' => '',
616	'selectors' => [
617	'{{WRAPPER}} .fluentform-widget-wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]):not(.select2-search__field), {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group textarea, {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group select, {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group .select2-container--default .select2-selection--multiple' => 'background-color: {{VALUE}}',
618	],
619	]
620	);
621
622	$this->add_control(
623	'form_field_text_color',
624	[
625	'label' => __('Text Color', 'fluentform'),
626	'type' => Controls_Manager::COLOR,
627	'default' => '',
628	'selectors' => [
629	'{{WRAPPER}} .fluentform-widget-wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]), {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group textarea, {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group select' => 'color: {{VALUE}}',
630	],
631	]
632	);
633
634	$this->add_group_control(
635	Group_Control_Border::get_type(),
636	[
637	'name' => 'form_field_border',
638	'label' => __('Border', 'fluentform'),
639	'placeholder' => '1px',
640	'default' => '1px',
641	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]):not(.select2-search__field), {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group textarea, {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group select, {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group .select2-container--default .select2-selection--multiple',
642	'separator' => 'before',
643	]
644	);
645
646	$this->add_control(
647	'form_field_radius',
648	[
649	'label' => __('Border Radius', 'fluentform'),
650	'type' => Controls_Manager::DIMENSIONS,
651	'size_units' => ['px', 'em', '%'],
652	'selectors' => [
653	'{{WRAPPER}} .fluentform-widget-wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]), {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group textarea, {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group select, {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group .select2-container--default .select2-selection--multiple' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
654	],
655	]
656	);
657
658	$this->add_responsive_control(
659	'form_field_text_indent',
660	[
661	'label' => __('Text Indent', 'fluentform'),
662	'type' => Controls_Manager::SLIDER,
663	'range' => [
664	'px' => [
665	'min' => 0,
666	'max' => 60,
667	'step' => 1,
668	],
669	'%' => [
670	'min' => 0,
671	'max' => 30,
672	'step' => 1,
673	],
674	],
675	'size_units' => ['px', 'em', '%'],
676	'selectors' => [
677	'{{WRAPPER}} .fluentform-widget-wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]), {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group textarea, {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group select' => 'text-indent: {{SIZE}}{{UNIT}}',
678	],
679	'separator' => 'before',
680	]
681	);
682
683	$this->add_responsive_control(
684	'form_input_width',
685	[
686	'label' => __('Input Width', 'fluentform'),
687	'type' => Controls_Manager::SLIDER,
688	'range' => [
689	'px' => [
690	'min' => 0,
691	'max' => 1200,
692	'step' => 1,
693	],
694	],
695	'size_units' => ['px', 'em', '%'],
696	'selectors' => [
697	'{{WRAPPER}} .fluentform-widget-wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]), {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group select' => 'width: {{SIZE}}{{UNIT}}',
698	],
699	]
700	);
701
702	$this->add_responsive_control(
703	'form_input_height',
704	[
705	'label' => __('Input Height', 'fluentform'),
706	'type' => Controls_Manager::SLIDER,
707	'range' => [
708	'px' => [
709	'min' => 0,
710	'max' => 80,
711	'step' => 1,
712	],
713	],
714	'size_units' => ['px', 'em', '%'],
715	'selectors' => [
716	'{{WRAPPER}} .fluentform-widget-wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]), {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group select' => 'height: {{SIZE}}{{UNIT}}',
717	],
718	]
719	);
720
721	$this->add_responsive_control(
722	'form_textarea_width',
723	[
724	'label' => __('Textarea Width', 'fluentform'),
725	'type' => Controls_Manager::SLIDER,
726	'range' => [
727	'px' => [
728	'min' => 0,
729	'max' => 1200,
730	'step' => 1,
731	],
732	],
733	'size_units' => ['px', 'em', '%'],
734	'selectors' => [
735	'{{WRAPPER}} .fluentform-widget-wrapper .ff-el-group textarea' => 'width: {{SIZE}}{{UNIT}}',
736	],
737	]
738	);
739
740	$this->add_responsive_control(
741	'form_textarea_height',
742	[
743	'label' => __('Textarea Height', 'fluentform'),
744	'type' => Controls_Manager::SLIDER,
745	'range' => [
746	'px' => [
747	'min' => 0,
748	'max' => 400,
749	'step' => 1,
750	],
751	],
752	'size_units' => ['px', 'em', '%'],
753	'selectors' => [
754	'{{WRAPPER}} .fluentform-widget-wrapper .ff-el-group textarea' => 'height: {{SIZE}}{{UNIT}}',
755	],
756	]
757	);
758
759	$this->add_responsive_control(
760	'form_field_padding',
761	[
762	'label' => __('Padding', 'fluentform'),
763	'type' => Controls_Manager::DIMENSIONS,
764	'size_units' => ['px', 'em', '%'],
765	'selectors' => [
766	'{{WRAPPER}} .fluentform-widget-wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]), {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group textarea, {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group select' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
767	],
768	]
769	);
770
771	$this->add_responsive_control(
772	'form_field_spacing',
773	[
774	'label' => __('Spacing', 'fluentform'),
775	'type' => Controls_Manager::SLIDER,
776	'range' => [
777	'px' => [
778	'min' => 0,
779	'max' => 100,
780	'step' => 1,
781	],
782	],
783	'size_units' => ['px', 'em', '%'],
784	'selectors' => [
785	'{{WRAPPER}} .fluentform-widget-wrapper .ff-el-group' => 'margin-bottom: {{SIZE}}{{UNIT}}',
786	],
787	]
788	);
789
790	$this->add_group_control(
791	Group_Control_Typography::get_type(),
792	[
793	'name' => 'form_field_typography',
794	'label' => __('Typography', 'fluentform'),
795	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]), {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group textarea, {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group select',
796	'separator' => 'before',
797	]
798	);
799
800	$this->add_group_control(
801	Group_Control_Box_Shadow::get_type(),
802	[
803	'name' => 'form_field_box_shadow',
804	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]), {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group textarea, {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group select',
805	'separator' => 'before',
806	]
807	);
808
809	$this->end_controls_tab();
810
811	$this->start_controls_tab(
812	'tab_form_fields_focus',
813	[
814	'label' => __('Focus', 'fluentform'),
815	]
816	);
817
818	$this->add_control(
819	'form_field_bg_color_focus',
820	[
821	'label' => __('Background Color', 'fluentform'),
822	'type' => Controls_Manager::COLOR,
823	'default' => '',
824	'selectors' => [
825	'{{WRAPPER}} .fluentform-widget-wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]):focus, {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group textarea:focus' => 'background-color: {{VALUE}}',
826	],
827	]
828	);
829
830	$this->add_group_control(
831	Group_Control_Border::get_type(),
832	[
833	'name' => 'form_input_focus_border',
834	'label' => __('Border', 'fluentform'),
835	'placeholder' => '1px',
836	'default' => '1px',
837	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]):focus, {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group textarea:focus',
838	]
839	);
840
841	$this->add_group_control(
842	Group_Control_Box_Shadow::get_type(),
843	[
844	'name' => 'form_input_focus_box_shadow',
845	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]):focus, {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group textarea:focus',
846	'separator' => 'before',
847	]
848	);
849
850	$this->end_controls_tab();
851
852	$this->end_controls_tabs();
853
854	$this->end_controls_section();
855	}
856	protected function register_terms_gdpr_style_controls()
857	{
858	$this->start_controls_section(
859	'section_form_terms_gdpr_style',
860	[
861	'label' => __('GDPR , Terms & Condition ', 'fluentform'),
862	'tab' => Controls_Manager::TAB_STYLE,
863	]
864	);
865
866	$this->add_responsive_control(
867	'form_terms_gdpr_alignment',
868	[
869	'label' => __('Alignment', 'fluentform'),
870	'type' => Controls_Manager::CHOOSE,
871	'options' => [
872	'left' => [
873	'title' => __('Left', 'fluentform'),
874	'icon' => 'fa fa-align-left',
875	],
876	'center' => [
877	'title' => __('Center', 'fluentform'),
878	'icon' => 'fa fa-align-center',
879	],
880	'right' => [
881	'title' => __('Right', 'fluentform'),
882	'icon' => 'fa fa-align-right',
883	],
884	],
885	'default' => '',
886	'selectors' => [ '{{WRAPPER}} .fluentform-widget-wrapper .ff_t_c' => 'text-align: {{VALUE}};'],
887	]
888	);
889
890	$this->add_group_control(
891	Group_Control_Typography::get_type(),
892	[
893	'name' => 'form_terms_gdpr_typography',
894	'label' => __('Typography', 'fluentform'),
895	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper .ff_t_c ',
896
897	]
898	);
899	$this->add_control(
900	'form_terms_gdpr_color',
901	[
902	'label' => __('Color', 'fluentform'),
903	'type' => Controls_Manager::COLOR,
904	'default' => '',
905	'selectors' => ['{{WRAPPER}} .fluentform-widget-wrapper .ff_t_c ' => 'color: {{VALUE}};'],
906	]
907	);
908
909	$this->end_controls_section();
910	}
911
912	protected function register_placeholder_style_controls()
913	{
914	$this->start_controls_section(
915	'section_placeholder_style',
916	[
917	'label' => __('Placeholder', 'fluentform'),
918	'tab' => Controls_Manager::TAB_STYLE,
919	'condition' => [
920	'placeholder_switch' => 'yes',
921	],
922	]
923	);
924
925	$this->add_control(
926	'form_placeholder_text_color',
927	[
928	'label' => __('Text Color', 'fluentform'),
929	'type' => Controls_Manager::COLOR,
930	'selectors' => [
931	'{{WRAPPER}} .fluentform-widget-wrapper .ff-el-group input::-webkit-input-placeholder, {{WRAPPER}} .fluentform-widget-wrapper .ff-el-group textarea::-webkit-input-placeholder' => 'color: {{VALUE}}',
932	],
933	'condition' => [
934	'placeholder_switch' => 'yes',
935	],
936	]
937	);
938
939	$this->end_controls_section();
940	}
941
942	protected function register_radio_checkbox_style_controls()
943	{
944	$this->start_controls_section(
945	'section_form_radio_checkbox_style',
946	[
947	'label' => __('Radio & Checkbox', 'fluentform'),
948	'tab' => Controls_Manager::TAB_STYLE,
949	]
950	);
951
952	$this->add_control(
953	'form_custom_radio_checkbox',
954	[
955	'label' => __('Custom Styles', 'fluentform'),
956	'type' => Controls_Manager::SWITCHER,
957	'label_on' => __('Yes', 'fluentform'),
958	'label_off' => __('No', 'fluentform'),
959	'return_value' => 'yes',
960	]
961	);
962
963	$this->add_responsive_control(
964	'form_radio_checkbox_size',
965	[
966	'label' => __('Size', 'fluentform'),
967	'type' => Controls_Manager::SLIDER,
968	'default' => [
969	'size' => '15',
970	'unit' => 'px',
971	],
972	'range' => [
973	'px' => [
974	'min' => 0,
975	'max' => 80,
976	'step' => 1,
977	],
978	],
979	'size_units' => ['px', 'em', '%'],
980	'selectors' => [
981	'{{WRAPPER}} .fluentform-widget-custom-radio-checkbox input[type="checkbox"], {{WRAPPER}} .fluentform-widget-custom-radio-checkbox input[type="radio"]' => 'width: {{SIZE}}{{UNIT}}; height: {{SIZE}}{{UNIT}}',
982	],
983	'condition' => [
984	'form_custom_radio_checkbox' => 'yes',
985	],
986	]
987	);
988
989	$this->add_responsive_control(
990	'form_radio_checkbox_text_indent',
991	[
992	'label' => __('Text Indent', 'fluentform'),
993	'type' => Controls_Manager::SLIDER,
994	'range' => [
995	'px' => [
996	'min' => 0,
997	'max' => 60,
998	'step' => 1,
999	],
1000	'%' => [
1001	'min' => 0,
1002	'max' => 30,
1003	'step' => 1,
1004	],
1005	],
1006	'size_units' => ['px', 'em', '%'],
1007	'selectors' => [
1008	'{{WRAPPER}} .fluentform-widget-custom-radio-checkbox input[type="checkbox"], {{WRAPPER}} .fluentform-widget-custom-radio-checkbox input[type="radio"]' => 'margin-right: {{SIZE}}{{UNIT}}',
1009	],
1010	'condition' => [
1011	'form_custom_radio_checkbox' => 'yes',
1012	],
1013	]
1014	);
1015
1016	$this->start_controls_tabs('tabs_radio_checkbox_style');
1017
1018	$this->start_controls_tab(
1019	'form_radio_checkbox_normal',
1020	[
1021	'label' => __('Normal', 'fluentform'),
1022	'condition' => [
1023	'form_custom_radio_checkbox' => 'yes',
1024	],
1025	]
1026	);
1027
1028	$this->add_control(
1029	'form_radio_checkbox_bg_color',
1030	[
1031	'label' => __('Background Color', 'fluentform'),
1032	'type' => Controls_Manager::COLOR,
1033	'default' => '',
1034	'selectors' => [
1035	'{{WRAPPER}} .fluentform-widget-custom-radio-checkbox input[type="checkbox"]:after, {{WRAPPER}} .fluentform-widget-custom-radio-checkbox input[type="radio"]:after' => 'background-color: {{VALUE}}',
1036	],
1037	'condition' => [
1038	'form_custom_radio_checkbox' => 'yes',
1039	],
1040	]
1041	);
1042
1043	$this->add_responsive_control(
1044	'form_checkbox_border_width',
1045	[
1046	'label' => __('Border Width', 'fluentform'),
1047	'type' => Controls_Manager::SLIDER,
1048	'range' => [
1049	'px' => [
1050	'min' => 0,
1051	'max' => 15,
1052	'step' => 1,
1053	],
1054	],
1055	'size_units' => ['px'],
1056	'selectors' => [
1057	'{{WRAPPER}} .fluentform-widget-custom-radio-checkbox input[type="checkbox"]:after, {{WRAPPER}} .fluentform-widget-custom-radio-checkbox input[type="radio"]:after' => 'border-width: {{SIZE}}{{UNIT}}',
1058	],
1059	'condition' => [
1060	'form_custom_radio_checkbox' => 'yes',
1061	],
1062	]
1063	);
1064
1065	$this->add_control(
1066	'form_checkbox_border_color',
1067	[
1068	'label' => __('Border Color', 'fluentform'),
1069	'type' => Controls_Manager::COLOR,
1070	'default' => '',
1071	'selectors' => [
1072	'{{WRAPPER}} .fluentform-widget-custom-radio-checkbox input[type="checkbox"]:after, {{WRAPPER}} .fluentform-widget-custom-radio-checkbox input[type="radio"]:after' => 'border-color: {{VALUE}}',
1073	],
1074	'condition' => [
1075	'form_custom_radio_checkbox' => 'yes',
1076	],
1077	]
1078	);
1079
1080	$this->add_control(
1081	'form_checkbox_heading',
1082	[
1083	'label' => __('Checkbox', 'fluentform'),
1084	'type' => Controls_Manager::HEADING,
1085	'condition' => [
1086	'form_custom_radio_checkbox' => 'yes',
1087	],
1088	]
1089	);
1090
1091	$this->add_control(
1092	'form_checkbox_border_radius',
1093	[
1094	'label' => __('Border Radius', 'fluentform'),
1095	'type' => Controls_Manager::DIMENSIONS,
1096	'size_units' => ['px', 'em', '%'],
1097	'selectors' => [
1098	'{{WRAPPER}} .fluentform-widget-custom-radio-checkbox input[type="checkbox"]:after, {{WRAPPER}} .fluentform-widget-custom-radio-checkbox input[type="radio"]:after' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1099	],
1100	'condition' => [
1101	'form_custom_radio_checkbox' => 'yes',
1102	],
1103	]
1104	);
1105
1106	$this->add_control(
1107	'form_radio_heading',
1108	[
1109	'label' => __('Radio Buttons', 'fluentform'),
1110	'type' => Controls_Manager::HEADING,
1111	'condition' => [
1112	'form_custom_radio_checkbox' => 'yes',
1113	],
1114	]
1115	);
1116
1117	$this->add_control(
1118	'form_radio_border_radius',
1119	[
1120	'label' => __('Border Radius', 'fluentform'),
1121	'type' => Controls_Manager::DIMENSIONS,
1122	'size_units' => ['px', 'em', '%'],
1123	'selectors' => [
1124	'{{WRAPPER}} .fluentform-widget-custom-radio-checkbox input[type="radio"]:after, {{WRAPPER}} .fluentform-widget-custom-radio-checkbox input[type="radio"]:after' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1125	],
1126	'condition' => [
1127	'form_custom_radio_checkbox' => 'yes',
1128	],
1129	]
1130	);
1131
1132	$this->end_controls_tab();
1133
1134	$this->start_controls_tab(
1135	'form_radio_checkbox_checked',
1136	[
1137	'label' => __('Checked', 'fluentform'),
1138	'condition' => [
1139	'form_custom_radio_checkbox' => 'yes',
1140	],
1141	]
1142	);
1143
1144	$this->add_control(
1145	'form_radio_checkbox_bg_color_checked',
1146	[
1147	'label' => __('Background Color', 'fluentform'),
1148	'type' => Controls_Manager::COLOR,
1149	'default' => '',
1150	'selectors' => [
1151	'{{WRAPPER}} .fluentform-widget-custom-radio-checkbox input[type="checkbox"]:checked:after, {{WRAPPER}} .fluentform-widget-custom-radio-checkbox input[type="radio"]:checked:after' => 'background-color: {{VALUE}}',
1152	],
1153	'condition' => [
1154	'form_custom_radio_checkbox' => 'yes',
1155	],
1156	]
1157	);
1158
1159	$this->add_control(
1160	'form_radio_checkbox_border_checked',
1161	[
1162	'label' => __('Border Color', 'fluentform'),
1163	'type' => Controls_Manager::COLOR,
1164	'default' => '',
1165	'selectors' => [
1166	'{{WRAPPER}} .fluentform-widget-custom-radio-checkbox input[type="checkbox"]:checked:after, {{WRAPPER}} .fluentform-widget-custom-radio-checkbox input[type="radio"]:checked:after' => 'border-color: {{VALUE}}',
1167	],
1168	'condition' => [
1169	'form_custom_radio_checkbox' => 'yes',
1170	],
1171	]
1172	);
1173
1174	$this->end_controls_tab();
1175
1176	$this->end_controls_tabs();
1177
1178	$this->end_controls_section();
1179	}
1180
1181	protected function register_section_break_style_controls()
1182	{
1183	$this->start_controls_section(
1184	'form_section_break_style',
1185	[
1186	'label' => __('Section Break', 'fluentform'),
1187	'tab' => Controls_Manager::TAB_STYLE,
1188	]
1189	);
1190
1191	$this->add_control(
1192	'form_section_break_label',
1193	[
1194	'label' => __('Label', 'fluentform'),
1195	'type' => Controls_Manager::HEADING
1196	]
1197	);
1198
1199	$this->add_control(
1200	'form_section_break_label_color',
1201	[
1202	'label' => __('Color', 'fluentform'),
1203	'type' => Controls_Manager::COLOR,
1204	'default' => '',
1205	'selectors' => [
1206	'{{WRAPPER}} .fluentform-widget-wrapper .ff-el-section-break .ff-el-section-title' => 'color: {{VALUE}};',
1207	],
1208	]
1209	);
1210
1211	$this->add_group_control(
1212	Group_Control_Typography::get_type(),
1213	[
1214	'name' => 'form_section_break_label_typography',
1215	'label' => __('Typography', 'fluentform'),
1216	'selector' => '.fluentform-widget-wrapper .ff-el-section-break .ff-el-section-title',
1217	'separator' => 'before',
1218	]
1219	);
1220
1221	$this->add_responsive_control(
1222	'form_section_break_label_padding',
1223	[
1224	'label' => __('Padding', 'fluentform'),
1225	'type' => Controls_Manager::DIMENSIONS,
1226	'size_units' => ['px', 'em', '%'],
1227	'selectors' => [
1228	'{{WRAPPER}} .fluentform-widget-wrapper .ff-el-section-break .ff-el-section-title' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1229	],
1230	]
1231	);
1232
1233	$this->add_responsive_control(
1234	'form_section_break_label_margin',
1235	[
1236	'label' => __('Margin', 'fluentform'),
1237	'type' => Controls_Manager::DIMENSIONS,
1238	'size_units' => ['px', 'em', '%'],
1239	'selectors' => [
1240	'{{WRAPPER}} .fluentform-widget-wrapper .ff-el-section-break .ff-el-section-title' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1241	],
1242	]
1243	);
1244
1245	$this->add_control(
1246	'form_section_break_description',
1247	[
1248	'label' => __('Description', 'fluentform'),
1249	'type' => Controls_Manager::HEADING,
1250	'separator' => 'before'
1251	]
1252	);
1253
1254	$this->add_control(
1255	'form_section_break_description_color',
1256	[
1257	'label' => __('Color', 'fluentform'),
1258	'type' => Controls_Manager::COLOR,
1259	'default' => '',
1260	'selectors' => [
1261	'{{WRAPPER}} .fluentform-widget-wrapper .ff-el-section-break .ff-section_break_desk' => 'color: {{VALUE}};',
1262	],
1263	]
1264	);
1265
1266	$this->add_group_control(
1267	Group_Control_Typography::get_type(),
1268	[
1269	'name' => 'form_section_break_description_typography',
1270	'label' => __('Typography', 'fluentform'),
1271	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper .ff-el-section-break div',
1272	'separator' => 'before',
1273	]
1274	);
1275
1276	$this->add_responsive_control(
1277	'form_section_break_description_padding',
1278	[
1279	'label' => __('Padding', 'fluentform'),
1280	'type' => Controls_Manager::DIMENSIONS,
1281	'size_units' => ['px', 'em', '%'],
1282	'selectors' => [
1283	'{{WRAPPER}} .fluentform-widget-wrapper .ff-el-section-break .ff-section_break_desk' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1284	],
1285	]
1286	);
1287
1288	$this->add_responsive_control(
1289	'form_section_break_description_margin',
1290	[
1291	'label' => __('Margin', 'fluentform'),
1292	'type' => Controls_Manager::DIMENSIONS,
1293	'size_units' => ['px', 'em', '%'],
1294	'selectors' => [
1295	'{{WRAPPER}} .fluentform-widget-wrapper .ff-el-section-break .ff-section_break_desk' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1296	],
1297	]
1298	);
1299
1300	$this->add_responsive_control(
1301	'form_section_break_alignment',
1302	[
1303	'label' => __('Alignment', 'fluentform'),
1304	'type' => Controls_Manager::CHOOSE,
1305	'options' => [
1306	'left' => [
1307	'title' => __('Left', 'fluentform'),
1308	'icon' => 'eicon-h-align-left',
1309	],
1310	'center' => [
1311	'title' => __('Center', 'fluentform'),
1312	'icon' => 'eicon-h-align-center',
1313	],
1314	'right' => [
1315	'title' => __('Right', 'fluentform'),
1316	'icon' => 'eicon-h-align-right',
1317	],
1318	],
1319	'prefix_class' => 'fluentform-widget-section-break-content-'
1320	]
1321	);
1322
1323	$this->end_controls_section();
1324	}
1325
1326	protected function register_checkbox_grid_style_controls()
1327	{
1328	$this->start_controls_section(
1329	'section_form_checkbox_grid',
1330	[
1331	'label' => __('Checkbox Grid', 'fluentform'),
1332	'tab' => Controls_Manager::TAB_STYLE,
1333	]
1334	);
1335
1336	$this->add_control(
1337	'section_form_checkbox_grid_head',
1338	[
1339	'label' => __('Grid Table Head', 'fluentform'),
1340	'type' => Controls_Manager::HEADING,
1341	'separator' => 'before'
1342	]
1343	);
1344
1345	$this->add_control(
1346	'form_checkbox_grid_table_head_text_color',
1347	[
1348	'label' => __('Color', 'fluentform'),
1349	'type' => Controls_Manager::COLOR,
1350	'default' => '',
1351	'selectors' => [
1352	'{{WRAPPER}} .fluentform-widget-wrapper .ff-table thead th' => 'color: {{VALUE}};',
1353	],
1354	]
1355	);
1356
1357	$this->add_control(
1358	'form_checkbox_grid_table_head_color',
1359	[
1360	'label' => __('Background Color', 'fluentform'),
1361	'type' => Controls_Manager::COLOR,
1362	'default' => '',
1363	'selectors' => [
1364	'{{WRAPPER}} .fluentform-widget-wrapper .ff-table thead th' => 'background-color: {{VALUE}};',
1365	],
1366	]
1367	);
1368
1369	$this->add_group_control(
1370	Group_Control_Typography::get_type(),
1371	[
1372	'name' => 'form_checkbox_grid_table_head_typography',
1373	'label' => __('Typography', 'fluentform'),
1374	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper .ff-table thead th',
1375	'separator' => 'before',
1376	]
1377	);
1378
1379	$this->add_responsive_control(
1380	'form_checkbox_grid_table_head_height',
1381	[
1382	'label' => __('Height', 'fluentform'),
1383	'type' => Controls_Manager::SLIDER,
1384	'range' => [
1385	'px' => [
1386	'min' => 0,
1387	'max' => 1200,
1388	'step' => 1,
1389	],
1390	],
1391	'size_units' => ['px', '%'],
1392	'selectors' => [
1393	'{{WRAPPER}} .fluentform-widget-wrapper .ff-table thead th' => 'height: {{SIZE}}{{UNIT}}',
1394	]
1395	]
1396	);
1397
1398	$this->add_group_control(
1399	Group_Control_Border::get_type(),
1400	[
1401	'name' => 'form_checkbox_grid_table_head_border',
1402	'label' => __('Border', 'fluentform'),
1403	'default' => '',
1404	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper .ff-table thead tr',
1405	]
1406	);
1407
1408	$this->add_responsive_control(
1409	'form_checkbox_grid_table_head_padding',
1410	[
1411	'label' => __('Padding', 'fluentform'),
1412	'type' => Controls_Manager::DIMENSIONS,
1413	'size_units' => ['px', 'em', '%'],
1414	'selectors' => [
1415	'{{WRAPPER}} .fluentform-widget-wrapper .ff-table thead th' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1416	],
1417	]
1418	);
1419
1420	$this->add_control(
1421	'form_checkbox_grid_table_item',
1422	[
1423	'label' => __('Grid Table Item', 'fluentform'),
1424	'type' => Controls_Manager::HEADING,
1425	'separator' => 'before'
1426	]
1427	);
1428
1429	$this->add_control(
1430	'form_checkbox_grid_table_item_color',
1431	[
1432	'label' => __('Color', 'fluentform'),
1433	'type' => Controls_Manager::COLOR,
1434	'default' => '',
1435	'selectors' => [
1436	'{{WRAPPER}} .fluentform-widget-wrapper .ff-table tbody tr td' => 'color: {{VALUE}} !important;',
1437	],
1438	]
1439	);
1440
1441	$this->add_control(
1442	'form_checkbox_grid_table_item_bg_color',
1443	[
1444	'label' => __('Background Color', 'fluentform'),
1445	'type' => Controls_Manager::COLOR,
1446	'default' => '',
1447	'selectors' => [
1448	'{{WRAPPER}} .fluentform-widget-wrapper .ff-table tbody tr td' => 'background-color: {{VALUE}};',
1449	],
1450	]
1451	);
1452
1453	$this->add_control(
1454	'form_checkbox_grid_table_item_odd_bg_color',
1455	[
1456	'label' => __('Odd Item Background Color', 'fluentform'),
1457	'type' => Controls_Manager::COLOR,
1458	'default' => '',
1459	'selectors' => [
1460	'{{WRAPPER}} .fluentform-widget-wrapper tbody>tr:nth-child(2n)>td' => 'background-color: {{VALUE}} !important;',
1461	],
1462	]
1463	);
1464
1465	$this->add_group_control(
1466	Group_Control_Typography::get_type(),
1467	[
1468	'name' => 'form_checkbox_grid_table_item_typography',
1469	'label' => __('Typography', 'fluentform'),
1470	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper .ff-table tbody tr td',
1471	]
1472	);
1473
1474	$this->add_responsive_control(
1475	'form_checkbox_grid_table_item_height',
1476	[
1477	'label' => __('Height', 'fluentform'),
1478	'type' => Controls_Manager::SLIDER,
1479	'range' => [
1480	'px' => [
1481	'min' => 0,
1482	'max' => 1200,
1483	'step' => 1,
1484	],
1485	],
1486	'size_units' => ['px', '%'],
1487	'selectors' => [
1488	'{{WRAPPER}} .fluentform-widget-wrapper .ff-table tbody tr td' => 'height: {{SIZE}}{{UNIT}}',
1489	]
1490	]
1491	);
1492
1493	$this->add_group_control(
1494	Group_Control_Border::get_type(),
1495	[
1496	'name' => 'form_checkbox_grid_table_item_border',
1497	'label' => __('Border', 'fluentform'),
1498	'default' => '',
1499	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper .ff-table tbody tr',
1500	]
1501	);
1502
1503	$this->add_responsive_control(
1504	'form_checkbox_grid_table_item_padding',
1505	[
1506	'label' => __('Padding', 'fluentform'),
1507	'type' => Controls_Manager::DIMENSIONS,
1508	'size_units' => ['px', 'em', '%'],
1509	'selectors' => [
1510	'{{WRAPPER}} .fluentform-widget-wrapper .ff-table tbody tr td' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1511	],
1512	]
1513	);
1514
1515	$this->end_controls_section();
1516	}
1517
1518	protected function register_address_line_style_controls()
1519	{
1520	$this->start_controls_section(
1521	'section_form_address_line_style',
1522	[
1523	'label' => __('Address Line', 'fluentform'),
1524	'tab' => Controls_Manager::TAB_STYLE,
1525	]
1526	);
1527
1528	$this->add_control(
1529	'address_line_label_color',
1530	[
1531	'label' => __('Label Color', 'fluentform'),
1532	'type' => Controls_Manager::COLOR,
1533	'default' => '',
1534	'selectors' => [
1535	'{{WRAPPER}} .fluentform-widget-wrapper .fluent-address label' => 'color: {{VALUE}};',
1536	],
1537	]
1538	);
1539
1540	$this->add_group_control(
1541	Group_Control_Typography::get_type(),
1542	[
1543	'name' => 'address_line_label_typography',
1544	'label' => __('Typography', 'fluentform'),
1545	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper .fluent-address label',
1546	]
1547	);
1548
1549	$this->end_controls_section();
1550	}
1551
1552	protected function register_image_upload_style_controls()
1553	{
1554	$this->start_controls_section(
1555	'section_form_image_upload_style',
1556	[
1557	'label' => __('Image Upload', 'fluentform'),
1558	'tab' => Controls_Manager::TAB_STYLE,
1559	]
1560	);
1561
1562	$this->start_controls_tabs('tabs_form_image_upload_button_style');
1563
1564	$this->start_controls_tab(
1565	'tab_form_image_upload_button_normal',
1566	[
1567	'label' => __('Normal', 'fluentform'),
1568	]
1569	);
1570
1571	$this->add_control(
1572	'form_image_upload_bg_color',
1573	[
1574	'label' => __('Background Color', 'fluentform'),
1575	'type' => Controls_Manager::COLOR,
1576	'default' => '',
1577	'selectors' => [
1578	'{{WRAPPER}} .fluentform-widget-wrapper .ff_upload_btn.ff-btn' => 'background-color: {{VALUE}};',
1579	],
1580	]
1581	);
1582
1583	$this->add_group_control(
1584	Group_Control_Border::get_type(),
1585	[
1586	'name' => 'form_image_upload_button_border_normal',
1587	'label' => __('Border', 'fluentform'),
1588	'default' => '',
1589	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper .ff_upload_btn.ff-btn',
1590	]
1591	);
1592
1593	$this->add_control(
1594	'form_image_upload_button_border_radius',
1595	[
1596	'label' => __('Border Radius', 'fluentform'),
1597	'type' => Controls_Manager::DIMENSIONS,
1598	'size_units' => ['px', 'em', '%'],
1599	'selectors' => [
1600	'{{WRAPPER}} .fluentform-widget-wrapper .ff_upload_btn.ff-btn' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1601	],
1602	]
1603	);
1604
1605	$this->add_responsive_control(
1606	'form_image_upload_button_padding',
1607	[
1608	'label' => __('Padding', 'fluentform'),
1609	'type' => Controls_Manager::DIMENSIONS,
1610	'size_units' => ['px', 'em', '%'],
1611	'selectors' => [
1612	'{{WRAPPER}} .fluentform-widget-wrapper .ff_upload_btn.ff-btn' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1613	],
1614	]
1615	);
1616
1617	$this->add_group_control(
1618	Group_Control_Typography::get_type(),
1619	[
1620	'name' => 'form_image_upload_typography',
1621	'label' => __('Typography', 'fluentform'),
1622	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper .ff_upload_btn.ff-btn',
1623	]
1624	);
1625
1626	$this->add_group_control(
1627	Group_Control_Box_Shadow::get_type(),
1628	[
1629	'name' => 'form_image_upload_button_box_shadow',
1630	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper .ff_upload_btn.ff-btn',
1631	]
1632	);
1633
1634	$this->end_controls_tab();
1635
1636	$this->start_controls_tab(
1637	'tab_form_image_upload_button_hover',
1638	[
1639	'label' => __('Hover', 'fluentform'),
1640	]
1641	);
1642
1643	$this->add_control(
1644	'form_image_upload_button_bg_color_hover',
1645	[
1646	'label' => __('Background Color', 'fluentform'),
1647	'type' => Controls_Manager::COLOR,
1648	'default' => '',
1649	'selectors' => [
1650	'{{WRAPPER}} .fluentform-widget-wrapper .ff_upload_btn.ff-btn:hover' => 'background-color: {{VALUE}} !important;',
1651	],
1652	]
1653	);
1654
1655	$this->add_control(
1656	'form_image_upload_button_text_color_hover',
1657	[
1658	'label' => __('Text Color', 'fluentform'),
1659	'type' => Controls_Manager::COLOR,
1660	'default' => '',
1661	'selectors' => [
1662	'{{WRAPPER}} .fluentform-widget-wrapper .ff_upload_btn.ff-btn:hover' => 'color: {{VALUE}} !important;',
1663	],
1664	]
1665	);
1666
1667	$this->add_control(
1668	'form_image_upload_button_border_color_hover',
1669	[
1670	'label' => __('Border Color', 'fluentform'),
1671	'type' => Controls_Manager::COLOR,
1672	'default' => '',
1673	'selectors' => [
1674	'{{WRAPPER}} .fluentform-widget-wrapper .ff_upload_btn.ff-btn:hover' => 'border-color: {{VALUE}}',
1675	],
1676	]
1677	);
1678
1679	$this->end_controls_tab();
1680
1681	$this->end_controls_tabs();
1682	$this->end_controls_section();
1683	}
1684
1685	protected function register_pagination_style_controls()
1686	{
1687	if (defined("FLUENTFORMPRO")) {
1688	$this->start_controls_section(
1689	'section_form_pagination_style',
1690	[
1691	'label' => __('Pagination', 'fluentform'),
1692	'tab' => Controls_Manager::TAB_STYLE,
1693	]
1694	);
1695
1696	$this->add_control(
1697	'form_pagination_progressbar_label',
1698	[
1699	'label' => __('Progressbar Label', 'fluentform'),
1700	'type' => Controls_Manager::HEADING
1701	]
1702	);
1703
1704	$this->add_control(
1705	'show_label',
1706	[
1707	'label' => __('Show Label', 'fluentform'),
1708	'type' => Controls_Manager::SWITCHER,
1709	'label_on' => __('Show', 'fluentform'),
1710	'label_off' => __('Hide', 'fluentform'),
1711	'return_value' => 'yes',
1712	'default' => 'yes',
1713	'prefix_class' => 'fluent-form-widget-step-header-'
1714	]
1715	);
1716
1717	$this->add_control(
1718	'form_progressbar_label_color',
1719	[
1720	'label' => __('Label Color', 'fluentform'),
1721	'type' => Controls_Manager::COLOR,
1722	'scheme' => [
1723	'type' => Scheme_Color::get_type(),
1724	'value' => Scheme_Color::COLOR_1,
1725	],
1726	'selectors' => [
1727	'{{WRAPPER}} .ff-el-progress-status' => 'color: {{VALUE}}',
1728	],
1729	'condition' => [
1730	'show_label' => 'yes'
1731	]
1732	]
1733	);
1734
1735	$this->add_group_control(
1736	Group_Control_Typography::get_type(),
1737	[
1738	'name' => 'form_progressbar_label_typography',
1739	'label' => __('Typography', 'fluentform'),
1740	'scheme' => Scheme_Typography::TYPOGRAPHY_1,
1741	'selector' => '{{WRAPPER}} .ff-el-progress-status',
1742	'condition' => [
1743	'show_label' => 'yes'
1744	]
1745	]
1746	);
1747
1748	$this->add_control(
1749	'form_progressbar_label_space',
1750	[
1751	'label' => __('Spacing', 'fluentform'),
1752	'type' => Controls_Manager::DIMENSIONS,
1753	'size_units' => [ 'px', '%', 'em' ],
1754	'selectors' => [
1755	'{{WRAPPER}} .ff-el-progress-status' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1756	],
1757	'condition' => [
1758	'show_label' => 'yes'
1759	],
1760	'separator' => 'after'
1761	]
1762	);
1763
1764	$this->add_control(
1765	'form_pagination_progressbar',
1766	[
1767	'label' => __('Progressbar', 'fluentform'),
1768	'type' => Controls_Manager::HEADING,
1769	]
1770	);
1771
1772	$this->add_control(
1773	'show_form_progressbar',
1774	[
1775	'label' => __('Show Progressbar', 'fluentform'),
1776	'type' => Controls_Manager::SWITCHER,
1777	'label_on' => __('Show', 'fluentform'),
1778	'label_off' => __('Hide', 'fluentform'),
1779	'return_value' => 'yes',
1780	'default' => 'yes',
1781	'prefix_class' => 'fluent-form-widget-step-progressbar-'
1782	]
1783	);
1784
1785	$this->start_controls_tabs('form_progressbar_style_tabs');
1786
1787	$this->start_controls_tab(
1788	'form_progressbar_normal',
1789	[
1790	'label' => __('Normal', 'fluentform'),
1791	'condition' => [
1792	'show_form_progressbar' => 'yes'
1793	],
1794	]
1795	);
1796
1797	$this->add_group_control(
1798	Group_Control_Background::get_type(),
1799	[
1800	'name' => 'form_progressbar_bg',
1801	'label' => __('Background', 'fluentform'),
1802	'types' => [ 'classic', 'gradient' ],
1803	'selector' => '{{WRAPPER}} .ff-el-progress',
1804	'condition' => [
1805	'show_form_progressbar' => 'yes'
1806	],
1807	'exclude' => [
1808	'image'
1809	]
1810	]
1811	);
1812
1813	$this->add_control(
1814	'form_progressbar_color',
1815	[
1816	'label' => __('Text Color', 'fluentform'),
1817	'type' => Controls_Manager::COLOR,
1818	'scheme' => [
1819	'type' => Scheme_Color::get_type(),
1820	'value' => Scheme_Color::COLOR_1,
1821	],
1822	'selectors' => [
1823	'{{WRAPPER}} .ff-el-progress-bar span' => 'color: {{VALUE}};',
1824	],
1825	'condition' => [
1826	'show_form_progressbar' => 'yes'
1827	]
1828	]
1829	);
1830
1831	$this->add_control(
1832	'form_progressbar_height',
1833	[
1834	'label' => __('Height', 'fluentform'),
1835	'type' => Controls_Manager::SLIDER,
1836	'size_units' => [ 'px' ],
1837	'range' => [
1838	'px' => [
1839	'min' => 0,
1840	'max' => 100,
1841	'step' => 1,
1842	]
1843	],
1844	'selectors' => [
1845	'{{WRAPPER}} .ff-el-progress' => 'height: {{SIZE}}{{UNIT}};',
1846	],
1847	'condition' => [
1848	'show_form_progressbar' => 'yes'
1849	]
1850	]
1851	);
1852
1853	$this->add_group_control(
1854	Group_Control_Border::get_type(),
1855	[
1856	'name' => 'form_progressbar_border',
1857	'label' => __('Border', 'fluentform'),
1858	'selector' => '{{WRAPPER}} .ff-el-progress',
1859	'condition' => [
1860	'show_form_progressbar' => 'yes'
1861	]
1862	]
1863	);
1864
1865	$this->add_control(
1866	'form_progressbar_border_radius',
1867	[
1868	'label' => __('Border Radius', 'fluentform'),
1869	'type' => Controls_Manager::DIMENSIONS,
1870	'size_units' => [ 'px', '%', 'em' ],
1871	'selectors' => [
1872	'{{WRAPPER}} .ff-el-progress' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1873	],
1874	'condition' => [
1875	'show_form_progressbar' => 'yes'
1876	]
1877	]
1878	);
1879
1880	$this->end_controls_tab();
1881
1882	$this->start_controls_tab(
1883	'form_progressbar_filled',
1884	[
1885	'label' => __('Filled', 'fluentform'),
1886	'condition' => [
1887	'show_form_progressbar' => 'yes'
1888	],
1889	]
1890	);
1891
1892	$this->add_group_control(
1893	Group_Control_Background::get_type(),
1894	[
1895	'name' => 'form_progressbar_bg_filled',
1896	'label' => __('Background', 'fluentform'),
1897	'types' => [ 'classic', 'gradient' ],
1898	'selector' => '{{WRAPPER}} .ff-el-progress-bar',
1899	'condition' => [
1900	'show_form_progressbar' => 'yes'
1901	],
1902	'exclude' => [
1903	'image'
1904	]
1905	]
1906	);
1907
1908
1909	$this->end_controls_tab();
1910
1911	$this->end_controls_tabs();
1912
1913
1914
1915	$this->add_control(
1916	'form_pagination_button_style',
1917	[
1918	'label' => __('Button', 'fluentform'),
1919	'type' => Controls_Manager::HEADING,
1920	'separator' => 'before'
1921	]
1922	);
1923
1924	$this->start_controls_tabs(
1925	'form_pagination_button_style_tabs'
1926	);
1927
1928
1929	$this->start_controls_tab(
1930	'form_pagination_button',
1931	[
1932	'label' => __('Normal', 'fluentform'),
1933	]
1934	);
1935
1936
1937	$this->add_control(
1938	'form_pagination_button_color',
1939	[
1940	'label' => __('Color', 'fluentform'),
1941	'type' => Controls_Manager::COLOR,
1942	'selectors' => [
1943	'{{WRAPPER}} .step-nav button' => 'color: {{VALUE}};',
1944	]
1945	]
1946	);
1947
1948	$this->add_group_control(
1949	Group_Control_Typography::get_type(),
1950	[
1951	'name' => 'form_pagination_button_typography',
1952	'label' => __('Typography', 'fluentform'),
1953	'scheme' => Scheme_Typography::TYPOGRAPHY_1,
1954	'selector' => '{{WRAPPER}} .step-nav button',
1955	]
1956	);
1957
1958	$this->add_group_control(
1959	Group_Control_Background::get_type(),
1960	[
1961	'name' => 'form_pagination_button_bg',
1962	'label' => __('Background', 'fluentform'),
1963	'types' => [ 'classic', 'gradient' ],
1964	'selector' => '{{WRAPPER}} .step-nav button',
1965	]
1966	);
1967
1968	$this->add_group_control(
1969	Group_Control_Border::get_type(),
1970	[
1971	'name' => 'form_pagination_button_border',
1972	'label' => __('Border', 'fluentform'),
1973	'selector' => '{{WRAPPER}} .step-nav button',
1974	]
1975	);
1976
1977	$this->add_control(
1978	'form_pagination_button_border_radius',
1979	[
1980	'label' => __('Border Radius', 'fluentform'),
1981	'type' => Controls_Manager::DIMENSIONS,
1982	'size_units' => [ 'px', '%', 'em' ],
1983	'selectors' => [
1984	'{{WRAPPER}} .step-nav button' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1985	],
1986	]
1987	);
1988
1989	$this->add_control(
1990	'form_pagination_button_padding',
1991	[
1992	'label' => __('Padding', 'fluentform'),
1993	'type' => Controls_Manager::DIMENSIONS,
1994	'size_units' => [ 'px', '%', 'em' ],
1995	'selectors' => [
1996	'{{WRAPPER}} .step-nav button' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1997	],
1998	]
1999	);
2000
2001	$this->end_controls_tab();
2002
2003	$this->start_controls_tab(
2004	'form_pagination_button_hover',
2005	[
2006	'label' => __('Hover', 'fluentform'),
2007	]
2008	);
2009
2010	$this->add_control(
2011	'form_pagination_button_hover_color',
2012	[
2013	'label' => __('Color', 'fluentform'),
2014	'type' => Controls_Manager::COLOR,
2015	'selectors' => [
2016	'{{WRAPPER}} .step-nav button:hover' => 'color: {{VALUE}};',
2017	]
2018	]
2019	);
2020
2021	$this->add_group_control(
2022	Group_Control_Background::get_type(),
2023	[
2024	'name' => 'form_pagination_button_hover_bg',
2025	'label' => __('Background', 'fluentform'),
2026	'types' => [ 'classic', 'gradient' ],
2027	'selector' => '{{WRAPPER}} .step-nav button:hover',
2028	]
2029	);
2030
2031	$this->add_control(
2032	'form_pagination_button_border_hover_color',
2033	[
2034	'label' => __('Border Color', 'fluentform'),
2035	'type' => Controls_Manager::COLOR,
2036	'selectors' => [
2037	'{{WRAPPER}} .step-nav button:hover' => 'border-color: {{VALUE}};',
2038	]
2039	]
2040	);
2041
2042	$this->add_control(
2043	'form_pagination_button_border_hover_radius',
2044	[
2045	'label' => __('Border Radius', 'fluentform'),
2046	'type' => Controls_Manager::DIMENSIONS,
2047	'size_units' => [ 'px', '%', 'em' ],
2048	'selectors' => [
2049	'{{WRAPPER}} .step-nav button:hover' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
2050	],
2051	]
2052	);
2053
2054	$this->end_controls_tab();
2055
2056	$this->end_controls_tabs();
2057
2058
2059	$this->end_controls_section();
2060	}
2061	}
2062
2063	protected function register_submit_button_style_controls()
2064	{
2065	$this->start_controls_section(
2066	'section_form_submit_button_style',
2067	[
2068	'label' => __('Submit Button', 'fluentform'),
2069	'tab' => Controls_Manager::TAB_STYLE,
2070	]
2071	);
2072
2073	$this->add_responsive_control(
2074	'form_submit_button_align',
2075	[
2076	'label' => __('Alignment', 'fluentform'),
2077	'type' => Controls_Manager::CHOOSE,
2078	'options' => [
2079	'left' => [
2080	'title' => __('Left', 'fluentform'),
2081	'icon' => 'eicon-h-align-left',
2082	],
2083	'center' => [
2084	'title' => __('Center', 'fluentform'),
2085	'icon' => 'eicon-h-align-center',
2086	],
2087	'right' => [
2088	'title' => __('Right', 'fluentform'),
2089	'icon' => 'eicon-h-align-right',
2090	],
2091	],
2092	'default' => '',
2093	'prefix_class' => 'fluentform-widget-submit-button-',
2094	'condition' => [
2095	'form_submit_button_width_type' => 'custom',
2096	],
2097	]
2098	);
2099
2100	$this->add_control(
2101	'form_submit_button_width_type',
2102	[
2103	'label' => __('Width', 'fluentform'),
2104	'type' => Controls_Manager::SELECT,
2105	'default' => 'custom',
2106	'options' => [
2107	'full-width' => __('Full Width', 'fluentform'),
2108	'custom' => __('Custom', 'fluentform'),
2109	],
2110	'prefix_class' => 'fluentform-widget-submit-button-',
2111	]
2112	);
2113
2114	$this->add_responsive_control(
2115	'form_submit_button_width',
2116	[
2117	'label' => __('Width', 'fluentform'),
2118	'type' => Controls_Manager::SLIDER,
2119	'range' => [
2120	'px' => [
2121	'min' => 0,
2122	'max' => 1200,
2123	'step' => 1,
2124	],
2125	],
2126	'size_units' => ['px', '%'],
2127	'selectors' => [
2128	'{{WRAPPER}} .fluentform-widget-wrapper .ff-el-group .ff-btn-submit' => 'width: {{SIZE}}{{UNIT}}',],
2129	'condition' => [
2130	'form_submit_button_width_type' => 'custom',
2131	],
2132	]
2133	);
2134
2135	$this->start_controls_tabs('tabs_submit_button_style');
2136
2137	$this->start_controls_tab(
2138	'tab_submit_button_normal',
2139	[
2140	'label' => __('Normal', 'fluentform'),
2141	]
2142	);
2143
2144	$this->add_control(
2145	'form_submit_button_bg_color_normal',
2146	[
2147	'label' => __('Background Color', 'fluentform'),
2148	'type' => Controls_Manager::COLOR,
2149	'default' => '#409EFF',
2150	'selectors' => [
2151	'{{WRAPPER}} .fluentform-widget-wrapper .ff-el-group .ff-btn-submit' => 'background-color: {{VALUE}} !important;',
2152	],
2153	]
2154	);
2155
2156	$this->add_control(
2157	'form_submit_button_text_color_normal',
2158	[
2159	'label' => __('Text Color', 'fluentform'),
2160	'type' => Controls_Manager::COLOR,
2161	'default' => '#ffffff',
2162	'selectors' => [
2163	'{{WRAPPER}} .fluentform-widget-wrapper .ff-el-group .ff-btn-submit' => 'color: {{VALUE}} !important;',
2164	],
2165	]
2166	);
2167
2168	$this->add_group_control(
2169	Group_Control_Border::get_type(),
2170	[
2171	'name' => 'form_submit_button_border_normal',
2172	'label' => __('Border', 'fluentform'),
2173	'placeholder' => '1px',
2174	'default' => '1px',
2175	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper .ff-el-group .ff-btn-submit',
2176	]
2177	);
2178
2179	$this->add_control(
2180	'form_submit_button_border_radius',
2181	[
2182	'label' => __('Border Radius', 'fluentform'),
2183	'type' => Controls_Manager::DIMENSIONS,
2184	'size_units' => ['px', 'em', '%'],
2185	'selectors' => [
2186	'{{WRAPPER}} .fluentform-widget-wrapper .ff-el-group .ff-btn-submit' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
2187	],
2188	]
2189	);
2190
2191	$this->add_responsive_control(
2192	'form_submit_button_padding',
2193	[
2194	'label' => __('Padding', 'fluentform'),
2195	'type' => Controls_Manager::DIMENSIONS,
2196	'size_units' => ['px', 'em', '%'],
2197	'selectors' => [
2198	'{{WRAPPER}} .fluentform-widget-wrapper .ff-el-group .ff-btn-submit' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
2199	],
2200	]
2201	);
2202
2203	$this->add_responsive_control(
2204	'form_submit_button_margin',
2205	[
2206	'label' => __('Margin Top', 'fluentform'),
2207	'type' => Controls_Manager::SLIDER,
2208	'range' => [
2209	'px' => [
2210	'min' => 0,
2211	'max' => 150,
2212	'step' => 1,
2213	],
2214	],
2215	'size_units' => ['px', 'em', '%'],
2216	'selectors' => [
2217	'{{WRAPPER}} .fluentform-widget-wrapper .ff-el-group .ff-btn-submit' => 'margin-top: {{SIZE}}{{UNIT}}',
2218	],
2219	]
2220	);
2221
2222	$this->add_group_control(
2223	Group_Control_Typography::get_type(),
2224	[
2225	'name' => 'form_submit_button_typography',
2226	'label' => __('Typography', 'fluentform'),
2227	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper .ff-el-group .ff-btn-submit',
2228	'separator' => 'before',
2229	]
2230	);
2231
2232	$this->add_group_control(
2233	Group_Control_Box_Shadow::get_type(),
2234	[
2235	'name' => 'form_submit_button_box_shadow',
2236	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper .ff-el-group .ff-btn-submit',
2237	'separator' => 'before',
2238	]
2239	);
2240
2241	$this->end_controls_tab();
2242
2243	$this->start_controls_tab(
2244	'tab_submit_button_hover',
2245	[
2246	'label' => __('Hover', 'fluentform'),
2247	]
2248	);
2249
2250	$this->add_control(
2251	'form_submit_button_bg_color_hover',
2252	[
2253	'label' => __('Background Color', 'fluentform'),
2254	'type' => Controls_Manager::COLOR,
2255	'default' => '',
2256	'selectors' => [
2257	'{{WRAPPER}} .fluentform-widget-wrapper .ff-el-group .ff-btn-submit:hover' => 'background-color: {{VALUE}} !important;',
2258	],
2259	]
2260	);
2261
2262	$this->add_control(
2263	'form_submit_button_text_color_hover',
2264	[
2265	'label' => __('Text Color', 'fluentform'),
2266	'type' => Controls_Manager::COLOR,
2267	'default' => '',
2268	'selectors' => [
2269	'{{WRAPPER}} .fluentform-widget-wrapper .ff-el-group .ff-btn-submit:hover' => 'color: {{VALUE}} !important;',
2270	],
2271	]
2272	);
2273
2274	$this->add_control(
2275	'form_submit_button_border_color_hover',
2276	[
2277	'label' => __('Border Color', 'fluentform'),
2278	'type' => Controls_Manager::COLOR,
2279	'default' => '',
2280	'selectors' => [
2281	'{{WRAPPER}} .fluentform-widget-wrapper .ff-el-group .ff-btn-submit:hover' => 'border-color: {{VALUE}}',
2282	],
2283	]
2284	);
2285
2286	$this->end_controls_tab();
2287
2288	$this->end_controls_tabs();
2289
2290	$this->end_controls_section();
2291	}
2292
2293	protected function register_success_message_style_controls()
2294	{
2295	$this->start_controls_section(
2296	'section_form_success_message_style',
2297	[
2298	'label' => __('Success Message', 'fluentform'),
2299	'tab' => Controls_Manager::TAB_STYLE,
2300	]
2301	);
2302
2303	$this->add_control(
2304	'form_success_message_bg_color',
2305	[
2306	'label' => __('Background Color', 'fluentform'),
2307	'type' => Controls_Manager::COLOR,
2308	'selectors' => [
2309	'{{WRAPPER}} .fluentform-widget-wrapper .ff-message-success' => 'background-color: {{VALUE}}',
2310	],
2311	]
2312	);
2313
2314	$this->add_control(
2315	'form_success_message_text_color',
2316	[
2317	'label' => __('Text Color', 'fluentform'),
2318	'type' => Controls_Manager::COLOR,
2319	'selectors' => [
2320	'{{WRAPPER}} .fluentform-widget-wrapper .ff-message-success' => 'color: {{VALUE}}',
2321	],
2322	]
2323	);
2324
2325	$this->add_group_control(
2326	Group_Control_Border::get_type(),
2327	[
2328	'name' => 'form_success_message_border',
2329	'label' => __('Border', 'fluentform'),
2330	'placeholder' => '1px',
2331	'default' => '1px',
2332	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper .ff-message-success',
2333	]
2334	);
2335
2336	$this->add_group_control(
2337	Group_Control_Typography::get_type(),
2338	[
2339	'name' => 'form_success_message_typography',
2340	'label' => __('Typography', 'fluentform'),
2341	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper .ff-message-success',
2342	]
2343	);
2344
2345	$this->end_controls_section();
2346	}
2347
2348	protected function register_errors_style_controls()
2349	{
2350	$this->start_controls_section(
2351	'section_form_error_style',
2352	[
2353	'label' => __('Error Message', 'fluentform'),
2354	'tab' => Controls_Manager::TAB_STYLE,
2355	]
2356	);
2357
2358	$this->add_control(
2359	'form_error_message_text_color',
2360	[
2361	'label' => __('Color', 'fluentform'),
2362	'type' => Controls_Manager::COLOR,
2363	'default' => '',
2364	'selectors' => [
2365	'{{WRAPPER}} .fluentform-widget-wrapper .error.text-danger' => 'color: {{VALUE}}',
2366	],
2367	]
2368	);
2369
2370	$this->add_group_control(
2371	Group_Control_Typography::get_type(),
2372	[
2373	'name' => 'form_error_message_typography',
2374	'label' => __('Typography', 'fluentform'),
2375	'selector' => '{{WRAPPER}} .fluentform-widget-wrapper .error.text-danger',
2376	]
2377	);
2378
2379	$this->add_responsive_control(
2380	'form_error_message_padding',
2381	[
2382	'label' => __('Padding', 'fluentform'),
2383	'type' => Controls_Manager::DIMENSIONS,
2384	'size_units' => ['px', 'em', '%'],
2385	'selectors' => [
2386	'{{WRAPPER}} .fluentform-widget-wrapper .error.text-danger' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
2387	],
2388	]
2389	);
2390
2391	$this->add_responsive_control(
2392	'form_error_message_margin',
2393	[
2394	'label' => __('Margin', 'fluentform'),
2395	'type' => Controls_Manager::DIMENSIONS,
2396	'size_units' => ['px', 'em', '%'],
2397	'selectors' => [
2398	'{{WRAPPER}} .fluentform-widget-wrapper .error.text-danger' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
2399	],
2400	]
2401	);
2402
2403	$this->end_controls_section();
2404	}
2405
2406
2407	/**
2408	* Render the widget output on the frontend.
2409	*
2410	* Written in PHP and used to generate the final HTML.
2411	*
2412	* @since 1.0.0
2413	*
2414	* @access protected
2415	*/
2416	protected function render()
2417	{
2418	$settings = $this->get_settings_for_display();
2419	extract($settings);
2420
2421	$this->add_render_attribute(
2422	'fluentform_widget_wrapper',
2423	[
2424	'class' => [
2425	'fluentform-widget-wrapper',
2426	]
2427	]
2428	);
2429
2430
2431	if ($placeholder_switch != 'yes') {
2432	$this->add_render_attribute('fluentform_widget_wrapper', 'class', 'hide-placeholder');
2433	}
2434
2435	if ($labels_switch != 'yes') {
2436	$this->add_render_attribute('fluentform_widget_wrapper', 'class', 'hide-fluent-form-labels');
2437	}
2438
2439	if ($error_messages == 'no') {
2440	$this->add_render_attribute('fluentform_widget_wrapper', 'class', 'hide-error-message');
2441	}
2442
2443	if ($form_custom_radio_checkbox == 'yes') {
2444	$this->add_render_attribute('fluentform_widget_wrapper', 'class', 'fluentform-widget-custom-radio-checkbox');
2445	}
2446
2447	if ($form_container_alignment) {
2448	$this->add_render_attribute('fluentform_widget_wrapper', 'class', 'fluentform-widget-align-'.$form_container_alignment.'');
2449	}
2450
2451	if (! empty($form_list)) { ?>
2452
2453	<div <?php echo $this->get_render_attribute_string('fluentform_widget_wrapper'); ?>>
2454
2455	<?php if ($custom_title_description == 'yes') { ?>
2456	<div class="fluentform-widget-heading">
2457	<?php if ($form_title_custom != '') { ?>
2458	<h3 class="fluentform-widget-title">
2459	<?php echo esc_attr($form_title_custom); ?>
2460	</h3>
2461	<?php } ?>
2462	<?php if ($form_description_custom != '') { ?>
2463	<p class="fluentform-widget-description">
2464	<?php echo $this->parse_text_editor($form_description_custom); ?>
2465	</p>
2466	<?php } ?>
2467	</div>
2468	<?php } ?>
2469
2470	<?php echo do_shortcode('[fluentform id="' . $form_list . '"]'); ?>
2471	</div>
2472
2473	<?php
2474	}
2475	}
2476
2477
2478	/**
2479	* Render the widget output in the editor.
2480	*
2481	* Written as a Backbone JavaScript template and used to generate the live preview.
2482	*
2483	* @since 1.0.0
2484	*
2485	* @access protected
2486	*/
2487	protected function content_template()
2488	{
2489	}
2490	}
2491