form-break.php — JetFormBuilder — Dynamic Blocks Form Builder 3.2.3

jetformbuilder / compatibility / jet-style-manager / blocks / form-break.php

jetformbuilder / compatibility / jet-style-manager / blocks Last commit date

interfaces 2 years ago traits 2 years ago form-break.php 2 years ago form.php 2 years ago range-field.php 2 years ago

form-break.php

1007 lines

1	<?php
2
3
4	namespace JFB_Compatibility\Jet_Style_Manager\Blocks;
5
6	use Jet_Form_Builder\Exceptions\Repository_Exception;
7	use JFB_Compatibility\Jet_Style_Manager\Blocks\Interfaces\Style_Block_It;
8	use JFB_Compatibility\Jet_Style_Manager\Blocks\Traits\Style_Block_Trait;
9	use JFB_Compatibility\Jet_Style_Manager\Jet_Style_Manager;
10
11	// If this file is called directly, abort.
12	if ( ! defined( 'WPINC' ) ) {
13	die;
14	}
15
16	class Form_Break implements Style_Block_It {
17
18	use Style_Block_Trait;
19
20	public function __construct() {
21	$wrapper = '-progress-pages__item--wrapper';
22	$item = '-progress-pages__item';
23
24	$this->set_css_scheme(
25	array(
26	'next-button' => '__next-page',
27	'prev-button' => '__prev-page',
28	'disabled-message' => '__next-page-msg',
29	'break-wrap' => '__next-page-wrap',
30
31	'active-wrapper' => "$wrapper.active-page",
32	'active-item' => "$wrapper.active-page .%s$item",
33	'active-separator' => "$wrapper.active-page .%s-progress-pages__separator",
34	'active-circle' => "$wrapper.active-page .%s$item--circle",
35
36	'next-wrapper' => "$wrapper:not(.passed-page):not(.active-page)",
37	'next-item' => "$wrapper:not(.passed-page):not(.active-page) .%s$item",
38	'next-separator' => "$wrapper:not(.passed-page):not(.active-page) .%s-progress-pages__separator",
39	'next-circle' => "$wrapper:not(.passed-page):not(.active-page) .%s$item--circle",
40
41	'prev-wrapper' => "$wrapper.passed-page",
42	'prev-item' => "$wrapper.passed-page .%s$item",
43	'prev-separator' => "$wrapper.passed-page .%s-progress-pages__separator",
44	'prev-circle' => "$wrapper.passed-page .%s$item--circle",
45	)
46	);
47	}
48
49	/**
50	* Not used
51	*
52	* @return string
53	*/
54	public function rep_item_id() {
55	return '';
56	}
57
58	/**
59	* @throws Repository_Exception
60	*/
61	public function process_controls() {
62	/** @var Jet_Style_Manager $module */
63	$module = jet_form_builder()->compat( 'jet-style-manager' );
64
65	$this->get_manager()->start_section(
66	'style_controls',
67	array(
68	'id' => 'break_buttons_style',
69	'title' => __( 'Form Break Row', 'jet-form-builder' ),
70	)
71	);
72
73	$this->get_manager()->add_control(
74	$module->create_padding(
75	$this->selector( 'break-wrap' ),
76	array(
77	'id' => 'break_buttons_padding',
78	'separator' => 'after',
79	)
80	)
81	);
82
83	$this->get_manager()->add_control(
84	array(
85	'id' => 'break_buttons_alignment',
86	'type' => 'choose',
87	'separator' => 'after',
88	'label' => __( 'Alignment', 'jet-form-builder' ),
89	'options' => array(
90	'left' => array(
91	'shortcut' => __( 'Left', 'jet-form-builder' ),
92	'icon' => 'dashicons-editor-alignleft',
93	),
94	'center' => array(
95	'shortcut' => __( 'Center', 'jet-form-builder' ),
96	'icon' => 'dashicons-editor-aligncenter',
97	),
98	'right' => array(
99	'shortcut' => __( 'Right', 'jet-form-builder' ),
100	'icon' => 'dashicons-editor-alignright',
101	),
102	),
103	'css_selector' => array(
104	$this->selector( 'break-wrap' ) => 'text-align: {{VALUE}};',
105	),
106	'attributes' => array(
107	'default' => array(
108	'value' => 'left',
109	),
110	),
111	)
112	);
113
114	$this->get_manager()->add_control(
115	array(
116	'id' => 'break_buttons_border',
117	'type' => 'border',
118	'label' => __( 'Border', 'jet-form-builder' ),
119	'css_selector' => array(
120	$this->selector( 'break-wrap' ) => 'border-style:{{STYLE}};border-width:{{WIDTH}};border-radius:{{RADIUS}};border-color:{{COLOR}};',
121	),
122	)
123	);
124
125	$this->get_manager()->end_section();
126
127	$this->get_manager()->start_section(
128	'style_controls',
129	array(
130	'id' => 'next_button_style',
131	'title' => __( 'Form Break Next Button', 'jet-form-builder' ),
132
133	)
134	);
135
136	$this->get_manager()->add_control(
137	$module->create_margin(
138	$this->selector( 'next-button' ),
139	'next_button_margin'
140	)
141	);
142
143	$this->get_manager()->add_control(
144	$module->create_padding(
145	$this->selector( 'next-button' ),
146	'next_button_margin'
147	)
148	);
149
150	$this->get_manager()->add_control(
151	array(
152	'id' => 'next_button_typography',
153	'type' => 'typography',
154	'separator' => 'after',
155	'css_selector' => array(
156	$this->selector( 'next-button' ) => 'font-family: {{FAMILY}}; font-weight: {{WEIGHT}}; text-transform: {{TRANSFORM}}; font-style: {{STYLE}}; text-decoration: {{DECORATION}}; line-height: {{LINEHEIGHT}}{{LH_UNIT}}; letter-spacing: {{LETTERSPACING}}{{LS_UNIT}}; font-size: {{SIZE}}{{S_UNIT}};',
157	),
158	)
159	);
160	$this->get_manager()->add_control(
161	array(
162	'id' => 'next_button_border',
163	'type' => 'border',
164	'separator' => 'after',
165	'label' => __( 'Border', 'jet-form-builder' ),
166	'css_selector' => array(
167	$this->selector( 'next-button' ) => 'border-style:{{STYLE}};border-width:{{WIDTH}};border-radius:{{RADIUS}};border-color:{{COLOR}};',
168	),
169	)
170	);
171
172	$this->get_manager()->start_tabs(
173	'style_controls',
174	array(
175	'id' => 'next_button_style_tabs',
176	)
177	);
178
179	$this->get_manager()->start_tab(
180	'style_controls',
181	array(
182	'id' => 'next_button_normal_styles',
183	'title' => __( 'Normal', 'jet-form-builder' ),
184	)
185	);
186
187	$this->get_manager()->add_control(
188	array(
189	'id' => 'next_button_typography_color',
190	'type' => 'color-picker',
191	'label' => __( 'Text Color', 'jet-form-builder' ),
192	'separator' => 'after',
193	'css_selector' => array(
194	$this->selector( 'next-button' ) => 'color: {{VALUE}}',
195	),
196	)
197	);
198	$this->get_manager()->add_control(
199	array(
200	'id' => 'next_button_background_color',
201	'type' => 'color-picker',
202	'label' => __( 'Background Color', 'jet-form-builder' ),
203	'css_selector' => array(
204	$this->selector( 'next-button' ) => 'background-color: {{VALUE}}',
205	),
206	)
207	);
208
209	$this->get_manager()->end_tab();
210
211	$this->get_manager()->start_tab(
212	'style_controls',
213	array(
214	'id' => 'next_button_hover_styles',
215	'title' => __( 'Hover', 'jet-form-builder' ),
216	)
217	);
218
219	$this->get_manager()->add_control(
220	array(
221	'id' => 'next_button_hover_typography_color',
222	'type' => 'color-picker',
223	'label' => __( 'Text Color', 'jet-form-builder' ),
224	'separator' => 'after',
225	'css_selector' => array(
226	$this->selector( 'next-button' ) . ':hover:not(:disabled)' => 'color: {{VALUE}}',
227	),
228	)
229	);
230
231	$this->get_manager()->add_control(
232	array(
233	'id' => 'next_button_hover_background_color',
234	'type' => 'color-picker',
235	'label' => __( 'Background Color', 'jet-form-builder' ),
236	'css_selector' => array(
237	$this->selector( 'next-button' ) . ':hover:not(:disabled)' => 'background-color: {{VALUE}}',
238	),
239	)
240	);
241
242	$this->get_manager()->end_tab();
243	$this->get_manager()->end_tabs();
244	$this->get_manager()->end_section();
245
246	/**
247	* Prev button
248	*/
249	$this->get_manager()->start_section(
250	'style_controls',
251	array(
252	'id' => 'prev_button_style',
253	'title' => __( 'Form Break Prev Button', 'jet-form-builder' ),
254	)
255	);
256
257	$this->get_manager()->add_control(
258	$module->create_margin(
259	$this->selector( 'prev-button' ),
260	'prev_button_margin'
261	)
262	);
263
264	$this->get_manager()->add_control(
265	$module->create_padding(
266	$this->selector( 'prev-button' ),
267	'prev_button_padding'
268	)
269	);
270
271	$this->get_manager()->add_control(
272	array(
273	'id' => 'prev_button_typography',
274	'type' => 'typography',
275	'separator' => 'after',
276	'css_selector' => array(
277	$this->selector( 'prev-button' ) => 'font-family: {{FAMILY}}; font-weight: {{WEIGHT}}; text-transform: {{TRANSFORM}}; font-style: {{STYLE}}; text-decoration: {{DECORATION}}; line-height: {{LINEHEIGHT}}{{LH_UNIT}}; letter-spacing: {{LETTERSPACING}}{{LS_UNIT}}; font-size: {{SIZE}}{{S_UNIT}};',
278	),
279	)
280	);
281
282	$this->get_manager()->add_control(
283	array(
284	'id' => 'prev_button_border',
285	'type' => 'border',
286	'separator' => 'after',
287	'label' => __( 'Border', 'jet-form-builder' ),
288	'css_selector' => array(
289	$this->selector( 'prev-button' ) => 'border-style:{{STYLE}};border-width:{{WIDTH}};border-radius:{{RADIUS}};border-color:{{COLOR}};',
290	),
291	)
292	);
293
294	$this->get_manager()->start_tabs(
295	'style_controls',
296	array(
297	'id' => 'prev_button_style_tabs',
298	)
299	);
300
301	$this->get_manager()->start_tab(
302	'style_controls',
303	array(
304	'id' => 'prev_button_normal_styles',
305	'title' => __( 'Normal', 'jet-form-builder' ),
306	)
307	);
308
309	$this->get_manager()->add_control(
310	array(
311	'id' => 'prev_button_typography_color',
312	'type' => 'color-picker',
313	'label' => __( 'Text Color', 'jet-form-builder' ),
314	'separator' => 'after',
315	'css_selector' => array(
316	$this->selector( 'prev-button' ) => 'color: {{VALUE}}',
317	),
318	)
319	);
320	$this->get_manager()->add_control(
321	array(
322	'id' => 'prev_button_background_color',
323	'type' => 'color-picker',
324	'label' => __( 'Background Color', 'jet-form-builder' ),
325	'css_selector' => array(
326	$this->selector( 'prev-button' ) => 'background-color: {{VALUE}}',
327	),
328	)
329	);
330
331	$this->get_manager()->end_tab();
332
333	$this->get_manager()->start_tab(
334	'style_controls',
335	array(
336	'id' => 'prev_button_hover_styles',
337	'title' => __( 'Hover', 'jet-form-builder' ),
338	)
339	);
340
341	$this->get_manager()->add_control(
342	array(
343	'id' => 'prev_button_hover_typography_color',
344	'type' => 'color-picker',
345	'label' => __( 'Text Color', 'jet-form-builder' ),
346	'separator' => 'after',
347	'css_selector' => array(
348	$this->selector( 'prev-button' ) . ':hover:not(:disabled)' => 'color: {{VALUE}}',
349	),
350	)
351	);
352
353	$this->get_manager()->add_control(
354	array(
355	'id' => 'prev_button_hover_background_color',
356	'type' => 'color-picker',
357	'label' => __( 'Background Color', 'jet-form-builder' ),
358	'css_selector' => array(
359	$this->selector( 'prev-button' ) . ':hover:not(:disabled)' => 'background-color: {{VALUE}}',
360	),
361	)
362	);
363
364	$this->get_manager()->end_tab();
365	$this->get_manager()->end_tabs();
366	$this->get_manager()->end_section();
367
368	/**
369	* Disabled Message
370	*/
371	$this->get_manager()->start_section(
372	'style_controls',
373	array(
374	'id' => 'disabled_message_style',
375	'title' => __( 'Form Break Disabled Message', 'jet-form-builder' ),
376	)
377	);
378
379	$this->get_manager()->add_control(
380	$module->create_margin(
381	$this->selector( 'disabled-message' ),
382	'disabled_message_margin'
383	)
384	);
385
386	$this->get_manager()->add_control(
387	$module->create_padding(
388	$this->selector( 'disabled-message' ),
389	'disabled_message_padding'
390	)
391	);
392
393	$this->get_manager()->add_control(
394	array(
395	'id' => 'disabled_message_typography',
396	'type' => 'typography',
397	'separator' => 'after',
398	'css_selector' => array(
399	$this->selector( 'disabled-message' ) => 'font-family: {{FAMILY}}; font-weight: {{WEIGHT}}; text-transform: {{TRANSFORM}}; font-style: {{STYLE}}; text-decoration: {{DECORATION}}; line-height: {{LINEHEIGHT}}{{LH_UNIT}}; letter-spacing: {{LETTERSPACING}}{{LS_UNIT}}; font-size: {{SIZE}}{{S_UNIT}};',
400	),
401	)
402	);
403	$this->get_manager()->add_control(
404	array(
405	'id' => 'disabled_message_border',
406	'type' => 'border',
407	'label' => __( 'Border', 'jet-form-builder' ),
408	'css_selector' => array(
409	$this->selector( 'disabled-message' ) => 'border-style:{{STYLE}};border-width:{{WIDTH}};border-radius:{{RADIUS}};border-color:{{COLOR}};',
410	),
411	)
412	);
413
414	$this->get_manager()->end_section();
415
416	$this->get_manager()->start_section(
417	'style_controls',
418	array(
419	'id' => 'form_pages__wrapper',
420	'title' => __( 'Form Progress - Wrapper', 'jet-form-builder' ),
421	)
422	);
423
424	$this->get_manager()->add_control(
425	$module->create_margin(
426	$this->selector( '-progress-pages' ),
427	'field_margin'
428	)
429	);
430
431	$this->get_manager()->add_control(
432	$module->create_padding(
433	$this->selector( '-progress-pages' ),
434	'field_padding'
435	)
436	);
437
438	$this->get_manager()->add_control(
439	array(
440	'id' => 'form_progress_pages_wrapper--typography',
441	'type' => 'typography',
442	'separator' => 'after',
443	'css_selector' => array(
444	$this->selector( '-progress-pages' ) => 'font-family: {{FAMILY}}; font-weight: {{WEIGHT}}; text-transform: {{TRANSFORM}}; font-style: {{STYLE}}; text-decoration: {{DECORATION}}; line-height: {{LINEHEIGHT}}{{LH_UNIT}}; letter-spacing: {{LETTERSPACING}}{{LS_UNIT}}; font-size: {{SIZE}}{{S_UNIT}};',
445	),
446	)
447	);
448	$this->get_manager()->add_control(
449	array(
450	'id' => 'form_progress_pages_wrapper--border',
451	'type' => 'border',
452	'separator' => 'after',
453	'label' => __( 'Border', 'jet-form-builder' ),
454	'css_selector' => array(
455	$this->selector( '-progress-pages' ) => 'border-style:{{STYLE}};border-width:{{WIDTH}};border-radius:{{RADIUS}};border-color:{{COLOR}};',
456	),
457	)
458	);
459	$this->get_manager()->add_control(
460	array(
461	'id' => 'form_progress_pages_wrapper--color',
462	'type' => 'color-picker',
463	'label' => __( 'Text Color', 'jet-form-builder' ),
464	'separator' => 'after',
465	'css_selector' => array(
466	$this->selector( '-progress-pages' ) => 'color: {{VALUE}}',
467	),
468	)
469	);
470	$this->get_manager()->add_control(
471	array(
472	'id' => 'form_progress_pages_wrapper--bg_color',
473	'type' => 'color-picker',
474	'label' => __( 'Background Color', 'jet-form-builder' ),
475	'css_selector' => array(
476	$this->selector( '-progress-pages' ) => 'background-color: {{VALUE}}',
477	),
478	)
479	);
480	$this->get_manager()->end_section();
481
482	/**
483	* Progress Pages
484	*/
485	$this->get_manager()->start_section(
486	'style_controls',
487	array(
488	'id' => 'form_progress_pages_section',
489	'title' => __( 'Form Progress - Pages', 'jet-form-builder' ),
490	)
491	);
492	$this->get_manager()->start_tabs(
493	'style_controls',
494	array(
495	'id' => 'form_progress_pages_tabs',
496	)
497	);
498
499	$this->get_manager()->start_tab(
500	'style_controls',
501	array(
502	'id' => 'form_progress_pages_current_tab',
503	'title' => __( 'Current', 'jet-form-builder' ),
504	)
505	);
506
507	$this->get_manager()->add_control(
508	$module->create_margin(
509	$this->selector( 'active-item' ),
510	'form_progress_pages_item__active--margin'
511	)
512	);
513
514	$this->get_manager()->add_control(
515	$module->create_padding(
516	$this->selector( 'active-item' ),
517	'form_progress_pages_item__active--padding'
518	)
519	);
520
521	$this->get_manager()->add_control(
522	array(
523	'id' => 'form_progress_pages__current--typography',
524	'type' => 'typography',
525	'separator' => 'after',
526	'css_selector' => array(
527	$this->selector( 'active-item' ) => 'font-family: {{FAMILY}}; font-weight: {{WEIGHT}}; text-transform: {{TRANSFORM}}; font-style: {{STYLE}}; text-decoration: {{DECORATION}}; line-height: {{LINEHEIGHT}}{{LH_UNIT}}; letter-spacing: {{LETTERSPACING}}{{LS_UNIT}}; font-size: {{SIZE}}{{S_UNIT}};',
528	),
529	)
530	);
531	$this->get_manager()->add_control(
532	array(
533	'id' => 'form_progress_pages_item__active--border',
534	'type' => 'border',
535	'separator' => 'after',
536	'label' => __( 'Item Border', 'jet-form-builder' ),
537	'css_selector' => array(
538	$this->selector( 'active-item' ) => 'border-style:{{STYLE}};border-width:{{WIDTH}};border-radius:{{RADIUS}};border-color:{{COLOR}};',
539	),
540	)
541	);
542	$this->get_manager()->add_control(
543	array(
544	'id' => 'form_progress_pages_item__active--color',
545	'type' => 'color-picker',
546	'separator' => 'after',
547	'label' => __( 'Item Text Color', 'jet-form-builder' ),
548	'css_selector' => array(
549	$this->selector( 'active-item' ) => 'color: {{VALUE}};',
550	),
551	)
552	);
553	$this->get_manager()->add_control(
554	array(
555	'id' => 'form_progress_pages_item__active--bg_color',
556	'type' => 'color-picker',
557	'separator' => 'after',
558	'label' => __( 'Item Background Color', 'jet-form-builder' ),
559	'css_selector' => array(
560	$this->selector( 'active-item' ) => 'background-color: {{VALUE}};',
561	),
562	)
563	);
564	$this->get_manager()->add_control(
565	array(
566	'id' => 'form_progress_pages__current_separator--height',
567	'type' => 'range',
568	'separator' => 'after',
569	'label' => __( 'Separator Height', 'jet-form-builder' ),
570	'units' => array(
571	array(
572	'value' => 'px',
573	'intervals' => array(
574	'step' => 1,
575	'min' => 1,
576	'max' => 100,
577	),
578	),
579	),
580	'css_selector' => array(
581	$this->selector( 'active-separator' ) => 'height: {{VALUE}}px; min-height: {{VALUE}}px;',
582	),
583	'attributes' => array(
584	'default' => array(
585	'value' => 3,
586	),
587	),
588	)
589	);
590	$this->get_manager()->add_control(
591	array(
592	'id' => 'form_progress_pages__current_separator--bg_color',
593	'type' => 'color-picker',
594	'separator' => 'after',
595	'label' => __( 'Separator Color', 'jet-form-builder' ),
596	'css_selector' => array(
597	$this->selector( 'active-separator' ) => 'background-color: {{VALUE}};',
598	),
599	)
600	);
601	$this->get_manager()->end_tab();
602
603	$this->get_manager()->start_tab(
604	'style_controls',
605	array(
606	'id' => 'form_progress_pages_next_tab',
607	'title' => __( 'Next', 'jet-form-builder' ),
608	)
609	);
610
611	$this->get_manager()->add_control(
612	$module->create_margin(
613	$this->selector( 'next-item' ),
614	'form_progress_pages_item__next--margin'
615	)
616	);
617
618	$this->get_manager()->add_control(
619	$module->create_padding(
620	$this->selector( 'next-item' ),
621	'form_progress_pages_item__next--padding'
622	)
623	);
624
625	$this->get_manager()->add_control(
626	array(
627	'id' => 'form_progress_pages__next--typography',
628	'type' => 'typography',
629	'separator' => 'after',
630	'css_selector' => array(
631	$this->selector( 'next-item' ) => 'font-family: {{FAMILY}}; font-weight: {{WEIGHT}}; text-transform: {{TRANSFORM}}; font-style: {{STYLE}}; text-decoration: {{DECORATION}}; line-height: {{LINEHEIGHT}}{{LH_UNIT}}; letter-spacing: {{LETTERSPACING}}{{LS_UNIT}}; font-size: {{SIZE}}{{S_UNIT}};',
632	),
633	)
634	);
635	$this->get_manager()->add_control(
636	array(
637	'id' => 'form_progress_pages_item__next--border',
638	'type' => 'border',
639	'separator' => 'after',
640	'label' => __( 'Item Border', 'jet-form-builder' ),
641	'css_selector' => array(
642	$this->selector( 'next-item' ) => 'border-style:{{STYLE}};border-width:{{WIDTH}};border-radius:{{RADIUS}};border-color:{{COLOR}};',
643	),
644	)
645	);
646	$this->get_manager()->add_control(
647	array(
648	'id' => 'form_progress_pages_item__next--color',
649	'type' => 'color-picker',
650	'separator' => 'after',
651	'label' => __( 'Item Color', 'jet-form-builder' ),
652	'css_selector' => array(
653	$this->selector( 'next-item' ) => 'color: {{VALUE}};',
654	),
655	)
656	);
657	$this->get_manager()->add_control(
658	array(
659	'id' => 'form_progress_pages_item__next--bg_color',
660	'type' => 'color-picker',
661	'separator' => 'after',
662	'label' => __( 'Item Background Color', 'jet-form-builder' ),
663	'css_selector' => array(
664	$this->selector( 'next-item' ) => 'background-color: {{VALUE}};',
665	),
666	)
667	);
668	$this->get_manager()->add_control(
669	array(
670	'id' => 'form_progress_pages__next_separator--height',
671	'type' => 'range',
672	'separator' => 'after',
673	'label' => __( 'Separator Height', 'jet-form-builder' ),
674	'units' => array(
675	array(
676	'value' => 'px',
677	'intervals' => array(
678	'step' => 1,
679	'min' => 1,
680	'max' => 100,
681	),
682	),
683	),
684	'css_selector' => array(
685	$this->selector( 'next-separator' ) => 'height: {{VALUE}}px; min-height: {{VALUE}}px;',
686	),
687	'attributes' => array(
688	'default' => array(
689	'value' => 3,
690	),
691	),
692	)
693	);
694	$this->get_manager()->add_control(
695	array(
696	'id' => 'form_progress_pages__next_separator--bg_color',
697	'type' => 'color-picker',
698	'label' => __( 'Separator Color', 'jet-form-builder' ),
699	'css_selector' => array(
700	$this->selector( 'next-separator' ) => 'background-color: {{VALUE}};',
701	),
702	)
703	);
704	$this->get_manager()->end_tab();
705
706	$this->get_manager()->start_tab(
707	'style_controls',
708	array(
709	'id' => 'form_progress_pages_prev_tab',
710	'title' => __( 'Prev', 'jet-form-builder' ),
711	)
712	);
713
714	$this->get_manager()->add_control(
715	$module->create_margin(
716	$this->selector( 'prev-item' ),
717	'form_progress_pages_item__prev--margin'
718	)
719	);
720
721	$this->get_manager()->add_control(
722	$module->create_padding(
723	$this->selector( 'prev-item' ),
724	'form_progress_pages_item__prev--padding'
725	)
726	);
727
728	$this->get_manager()->add_control(
729	array(
730	'id' => 'form_progress_pages__prev--typography',
731	'type' => 'typography',
732	'separator' => 'after',
733	'css_selector' => array(
734	$this->selector( 'prev-item' ) => 'font-family: {{FAMILY}}; font-weight: {{WEIGHT}}; text-transform: {{TRANSFORM}}; font-style: {{STYLE}}; text-decoration: {{DECORATION}}; line-height: {{LINEHEIGHT}}{{LH_UNIT}}; letter-spacing: {{LETTERSPACING}}{{LS_UNIT}}; font-size: {{SIZE}}{{S_UNIT}};',
735	),
736	)
737	);
738	$this->get_manager()->add_control(
739	array(
740	'id' => 'form_progress_pages_item__prev--border',
741	'type' => 'border',
742	'separator' => 'after',
743	'label' => __( 'Item Border', 'jet-form-builder' ),
744	'css_selector' => array(
745	$this->selector( 'prev-item' ) => 'border-style:{{STYLE}};border-width:{{WIDTH}};border-radius:{{RADIUS}};border-color:{{COLOR}};',
746	),
747	)
748	);
749	$this->get_manager()->add_control(
750	array(
751	'id' => 'form_progress_pages_item__prev--color',
752	'type' => 'color-picker',
753	'separator' => 'after',
754	'label' => __( 'Item Color', 'jet-form-builder' ),
755	'css_selector' => array(
756	$this->selector( 'prev-item' ) => 'color: {{VALUE}};',
757	),
758	)
759	);
760	$this->get_manager()->add_control(
761	array(
762	'id' => 'form_progress_pages_item__prev--bg_color',
763	'type' => 'color-picker',
764	'separator' => 'after',
765	'label' => __( 'Item Background Color', 'jet-form-builder' ),
766	'css_selector' => array(
767	$this->selector( 'prev-item' ) => 'background-color: {{VALUE}};',
768	),
769	)
770	);
771	$this->get_manager()->add_control(
772	array(
773	'id' => 'form_progress_pages__prev_separator--height',
774	'type' => 'range',
775	'separator' => 'after',
776	'label' => __( 'Separator Height', 'jet-form-builder' ),
777	'units' => array(
778	array(
779	'value' => 'px',
780	'intervals' => array(
781	'step' => 1,
782	'min' => 1,
783	'max' => 100,
784	),
785	),
786	),
787	'css_selector' => array(
788	$this->selector( 'prev-separator' ) => 'height: {{VALUE}}px; min-height: {{VALUE}}px;',
789	),
790	'attributes' => array(
791	'default' => array(
792	'value' => 3,
793	),
794	),
795	)
796	);
797	$this->get_manager()->add_control(
798	array(
799	'id' => 'form_progress_pages__prev_separator--bg_color',
800	'type' => 'color-picker',
801	'label' => __( 'Separator Color', 'jet-form-builder' ),
802	'css_selector' => array(
803	$this->selector( 'prev-separator' ) => 'background-color: {{VALUE}};',
804	),
805	)
806	);
807	$this->get_manager()->end_tab();
808	$this->get_manager()->end_tabs();
809	$this->get_manager()->end_section();
810
811	/**
812	* <Progress Circle>
813	*/
814	$this->get_manager()->start_section(
815	'style_controls',
816	array(
817	'id' => 'form_progress_figure_section',
818	'title' => __( 'Form Progress - Figure', 'jet-form-builder' ),
819	)
820	);
821
822	$this->get_manager()->start_tabs(
823	'style_controls',
824	array(
825	'id' => 'form_progress_figure_tabs',
826	)
827	);
828
829	$this->get_manager()->start_tab(
830	'style_controls',
831	array(
832	'id' => 'form_progress_figure_tab--current',
833	'title' => __( 'Current', 'jet-form-builder' ),
834	)
835	);
836
837	$this->get_manager()->add_control(
838	$module->create_padding(
839	$this->selector( 'active-circle' ),
840	'form_progress_pages_current_circle--padding'
841	)
842	);
843
844	$this->get_manager()->add_control(
845	array(
846	'id' => 'form_progress_pages_current_circle--typography',
847	'type' => 'typography',
848	'separator' => 'after',
849	'css_selector' => array(
850	$this->selector( 'active-circle' ) => 'font-family: {{FAMILY}}; font-weight: {{WEIGHT}}; text-transform: {{TRANSFORM}}; font-style: {{STYLE}}; text-decoration: {{DECORATION}}; line-height: {{LINEHEIGHT}}{{LH_UNIT}}; letter-spacing: {{LETTERSPACING}}{{LS_UNIT}}; font-size: {{SIZE}}{{S_UNIT}};',
851	),
852	)
853	);
854	$this->get_manager()->add_control(
855	array(
856	'id' => 'form_progress_pages_current_circle--border',
857	'type' => 'border',
858	'separator' => 'after',
859	'label' => __( 'Border', 'jet-form-builder' ),
860	'css_selector' => array(
861	$this->selector( 'active-circle' ) => 'border-style:{{STYLE}};border-width:{{WIDTH}};border-radius:{{RADIUS}};border-color:{{COLOR}};',
862	),
863	)
864	);
865	$this->get_manager()->add_control(
866	array(
867	'id' => 'form_progress_pages_current_circle--color',
868	'type' => 'color-picker',
869	'label' => __( 'Text Color', 'jet-form-builder' ),
870	'css_selector' => array(
871	$this->selector( 'active-circle' ) => 'color: {{VALUE}};',
872	),
873	)
874	);
875	$this->get_manager()->add_control(
876	array(
877	'id' => 'form_progress_pages_current_circle--bg_color',
878	'type' => 'color-picker',
879	'label' => __( 'Background Color', 'jet-form-builder' ),
880	'css_selector' => array(
881	$this->selector( 'active-circle' ) => 'background-color: {{VALUE}};',
882	),
883	)
884	);
885	$this->get_manager()->end_tab();
886
887	$this->get_manager()->start_tab(
888	'style_controls',
889	array(
890	'id' => 'form_progress_figure_tab--next',
891	'title' => __( 'Next', 'jet-form-builder' ),
892	)
893	);
894
895	$this->get_manager()->add_control(
896	$module->create_padding(
897	$this->selector( 'next-circle' ),
898	'form_progress_pages_next_circle--padding'
899	)
900	);
901
902	$this->get_manager()->add_control(
903	array(
904	'id' => 'form_progress_pages_next_circle--typography',
905	'type' => 'typography',
906	'separator' => 'after',
907	'css_selector' => array(
908	$this->selector( 'next-circle' ) => 'font-family: {{FAMILY}}; font-weight: {{WEIGHT}}; text-transform: {{TRANSFORM}}; font-style: {{STYLE}}; text-decoration: {{DECORATION}}; line-height: {{LINEHEIGHT}}{{LH_UNIT}}; letter-spacing: {{LETTERSPACING}}{{LS_UNIT}}; font-size: {{SIZE}}{{S_UNIT}};',
909	),
910	)
911	);
912	$this->get_manager()->add_control(
913	array(
914	'id' => 'form_progress_pages_next_circle--border',
915	'type' => 'border',
916	'separator' => 'after',
917	'label' => __( 'Border', 'jet-form-builder' ),
918	'css_selector' => array(
919	$this->selector( 'next-circle' ) => 'border-style:{{STYLE}};border-width:{{WIDTH}};border-radius:{{RADIUS}};border-color:{{COLOR}};',
920	),
921	)
922	);
923	$this->get_manager()->add_control(
924	array(
925	'id' => 'form_progress_pages_next_circle--color',
926	'type' => 'color-picker',
927	'label' => __( 'Text Color', 'jet-form-builder' ),
928	'css_selector' => array(
929	$this->selector( 'next-circle' ) => 'color: {{VALUE}};',
930	),
931	)
932	);
933	$this->get_manager()->add_control(
934	array(
935	'id' => 'form_progress_pages_next_circle--bg_color',
936	'type' => 'color-picker',
937	'label' => __( 'Background Color', 'jet-form-builder' ),
938	'css_selector' => array(
939	$this->selector( 'next-circle' ) => 'background-color: {{VALUE}};',
940	),
941	)
942	);
943	$this->get_manager()->end_tab();
944
945	$this->get_manager()->start_tab(
946	'style_controls',
947	array(
948	'id' => 'form_progress_figure_tab--prev',
949	'title' => __( 'Prev', 'jet-form-builder' ),
950	)
951	);
952
953	$this->get_manager()->add_control(
954	$module->create_padding(
955	$this->selector( 'prev-circle' ),
956	'form_progress_pages_prev_circle--padding'
957	)
958	);
959
960	$this->get_manager()->add_control(
961	array(
962	'id' => 'form_progress_pages_prev_circle--typography',
963	'type' => 'typography',
964	'separator' => 'after',
965	'css_selector' => array(
966	$this->selector( 'prev-circle' ) => 'font-family: {{FAMILY}}; font-weight: {{WEIGHT}}; text-transform: {{TRANSFORM}}; font-style: {{STYLE}}; text-decoration: {{DECORATION}}; line-height: {{LINEHEIGHT}}{{LH_UNIT}}; letter-spacing: {{LETTERSPACING}}{{LS_UNIT}}; font-size: {{SIZE}}{{S_UNIT}};',
967	),
968	)
969	);
970	$this->get_manager()->add_control(
971	array(
972	'id' => 'form_progress_pages_prev_circle--border',
973	'type' => 'border',
974	'separator' => 'after',
975	'label' => __( 'Border', 'jet-form-builder' ),
976	'css_selector' => array(
977	$this->selector( 'prev-circle' ) => 'border-style:{{STYLE}};border-width:{{WIDTH}};border-radius:{{RADIUS}};border-color:{{COLOR}};',
978	),
979	)
980	);
981	$this->get_manager()->add_control(
982	array(
983	'id' => 'form_progress_pages_prev_circle--color',
984	'type' => 'color-picker',
985	'label' => __( 'Text Color', 'jet-form-builder' ),
986	'css_selector' => array(
987	$this->selector( 'prev-circle' ) => 'color: {{VALUE}};',
988	),
989	)
990	);
991	$this->get_manager()->add_control(
992	array(
993	'id' => 'form_progress_pages_prev_circle--bg_color',
994	'type' => 'color-picker',
995	'label' => __( 'Background Color', 'jet-form-builder' ),
996	'css_selector' => array(
997	$this->selector( 'prev-circle' ) => 'background-color: {{VALUE}};',
998	),
999	)
1000	);
1001	$this->get_manager()->end_tab();
1002
1003	$this->get_manager()->end_tabs();
1004	$this->get_manager()->end_section();
1005	}
1006	}
1007