PluginProbe
UiCore Elements – Free widgets and templates for Elementor / 1.0.8
UiCore Elements – Free widgets and templates for Elementor v1.0.8
1.3.17 1.3.16 trunk 1.0.0 1.0.1 1.0.10 1.0.11 1.0.12 1.0.13 1.0.14 1.0.15 1.0.16 1.0.2 1.0.3 1.0.4 1.0.5 1.0.6 1.0.7 1.0.8 1.0.9 1.2.0 1.2.1 1.2.2 1.2.3 1.2.4 All 41 releases
uicore-elements / includes / utils / form-component.php

form-component.php in UiCore Elements – Free widgets and templates for Elementor 1.0.8, at includes/utils/form-component.php

1,222 lines 43.4 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 <?php
2 namespace UiCoreElements\Utils;
3
4 use UiCoreElements\Helper;
5 use Elementor\Controls_Manager;
6 use Elementor\Group_Control_Typography;
7 use Elementor\Group_Control_Border;
8 use Elementor\Core\Kits\Documents\Tabs\Global_Colors;
9 use Elementor\Core\Kits\Documents\Tabs\Global_Typography;
10
11 defined('ABSPATH') || exit();
12
13 /**
14 * Register some Form Widgets controls and methods.
15 */
16
17 trait Form_Component {
18
19 // Submission Controls
20 function TRAIT_register_submit_email_controls($instance, $slug = '')
21 {
22 $instance->add_control(
23 'email_to' . $slug,
24 [
25 'label' => esc_html__( 'To', 'uicore-elements' ),
26 'type' => Controls_Manager::TEXT,
27 'default' => get_option( 'admin_email' ),
28 'ai' => [
29 'active' => false,
30 ],
31 'placeholder' => get_option( 'admin_email' ),
32 'label_block' => true,
33 'title' => esc_html__( 'Separate emails with commas', 'uicore-elements' ),
34 'render_type' => 'none',
35 'dynamic' => [
36 'active' => true,
37 ],
38 ]
39 );
40
41 /* translators: %s: Site title. */
42 $default_message = sprintf( html_entity_decode( esc_html__( 'New message from "%s"', 'uicore-elements' ) ), get_option( 'blogname' ) );
43
44 $instance->add_control(
45 'email_subject' . $slug,
46 [
47 'label' => esc_html__( 'Subject', 'uicore-elements' ),
48 'type' => Controls_Manager::TEXT,
49 'default' => $default_message,
50 'ai' => [
51 'active' => false,
52 ],
53 'placeholder' => $default_message,
54 'label_block' => true,
55 'render_type' => 'none',
56 'dynamic' => [
57 'active' => true,
58 ],
59 ]
60 );
61
62 $instance->add_control(
63 'email_content' . $slug,
64 [
65 'label' => esc_html__( 'Message', 'uicore-elements' ),
66 'type' => Controls_Manager::TEXTAREA,
67 'default' => '[all-fields]',
68 'ai' => [
69 'active' => false,
70 ],
71 'placeholder' => '[all-fields]',
72 'description' => sprintf(
73 /* translators: %s: The [all-fields] shortcode. */
74 esc_html__( 'By default, all form fields are sent via %s shortcode. To customize sent fields, copy the shortcode that appears inside each field and paste it above.', 'uicore-elements' ),
75 '<code>[all-fields]</code>'
76 ),
77 'render_type' => 'none',
78 'dynamic' => [
79 'active' => true,
80 ],
81 ]
82 );
83
84 $site_domain = Helper::get_site_domain();
85
86 $instance->add_control(
87 'email_from' . $slug,
88 [
89 'label' => esc_html__( 'From Email', 'uicore-elements' ),
90 'type' => Controls_Manager::TEXT,
91 'default' => 'email@' . $site_domain,
92 'ai' => [
93 'active' => false,
94 ],
95 'render_type' => 'none',
96 'dynamic' => [
97 'active' => true,
98 ],
99 ]
100 );
101
102 $instance->add_control(
103 'email_from_name' . $slug,
104 [
105 'label' => esc_html__( 'From Name', 'uicore-elements' ),
106 'type' => Controls_Manager::TEXT,
107 'default' => get_bloginfo( 'name' ),
108 'ai' => [
109 'active' => false,
110 ],
111 'render_type' => 'none',
112 'dynamic' => [
113 'active' => true,
114 ],
115 ]
116 );
117
118 $instance->add_control(
119 'email_reply_to' . $slug,
120 [
121 'label' => esc_html__( 'Reply-To', 'uicore-elements' ),
122 'type' => Controls_Manager::TEXT,
123 'options' => [
124 '' => '',
125 ],
126 'default' => 'noreply@' . Helper::get_site_domain(),
127 'render_type' => 'none',
128 ]
129 );
130
131 $instance->add_control(
132 'email_to_cc' . $slug,
133 [
134 'label' => esc_html__( 'Cc', 'uicore-elements' ),
135 'type' => Controls_Manager::TEXT,
136 'default' => '',
137 'ai' => [
138 'active' => false,
139 ],
140 'title' => esc_html__( 'Separate emails with commas', 'uicore-elements' ),
141 'render_type' => 'none',
142 'dynamic' => [
143 'active' => true,
144 ],
145 ]
146 );
147
148 $instance->add_control(
149 'email_to_bcc' . $slug,
150 [
151 'label' => esc_html__( 'Bcc', 'uicore-elements' ),
152 'type' => Controls_Manager::TEXT,
153 'default' => '',
154 'ai' => [
155 'active' => false,
156 ],
157 'title' => esc_html__( 'Separate emails with commas', 'uicore-elements' ),
158 'render_type' => 'none',
159 'dynamic' => [
160 'active' => true,
161 ],
162 ]
163 );
164
165 $instance->add_control(
166 'form_metadata' . $slug,
167 [
168 'label' => esc_html__( 'Meta Data', 'uicore-elements' ),
169 'type' => Controls_Manager::SELECT2,
170 'multiple' => true,
171 'label_block' => true,
172 'separator' => 'before',
173 'default' => [
174 'date',
175 'time',
176 'page_url',
177 'user_agent',
178 'remote_ip',
179 ],
180 'options' => [
181 'date' => esc_html__( 'Date', 'uicore-elements' ),
182 'time' => esc_html__( 'Time', 'uicore-elements' ),
183 'page_url' => esc_html__( 'Page URL', 'uicore-elements' ),
184 'user_agent' => esc_html__( 'User Agent', 'uicore-elements' ),
185 'remote_ip' => esc_html__( 'Remote IP', 'uicore-elements' ),
186 ],
187 'render_type' => 'none',
188 ]
189 );
190
191 $instance->add_control(
192 'email_content_type' . $slug,
193 [
194 'label' => esc_html__( 'Send As', 'uicore-elements' ),
195 'type' => Controls_Manager::SELECT,
196 'default' => 'html',
197 'render_type' => 'none',
198 'options' => [
199 'html' => esc_html__( 'HTML', 'uicore-elements' ),
200 'plain' => esc_html__( 'Plain', 'uicore-elements' ),
201 ],
202 ]
203 );
204 }
205 function TRAIT_register_submit_redirect_controls()
206 {
207 $this->add_control(
208 'redirect_to',
209 [
210 'label' => esc_html__( 'Redirect To', 'uicore-elements' ),
211 'type' => Controls_Manager::TEXT,
212 'placeholder' => esc_html__( 'https://your-link.com', 'uicore-elements' ),
213 'ai' => [
214 'active' => false,
215 ],
216 'dynamic' => [
217 'active' => true,
218 'categories' => [
219 'url',
220 ],
221 ],
222 'label_block' => true,
223 'render_type' => 'none',
224 ]
225 );
226 }
227 /**
228 * Register MailChimp controls for the submit action.
229 *
230 * @param $instance - The widget instance. Required if $has_repeaters is true.
231 * @param bool $has_repeaters - Enable Field Mapping control if the widget has dynamic fields widh repeaters.
232 *
233 * @return void
234 */
235 function TRAIT_register_submit_mailchimp_controls($instance = null, bool $has_repeaters = false)
236 {
237
238 if( !get_option('uicore_elements_mailchimp_secret_key') ) {
239 $this->add_control(
240 'mailchimp_warning',
241 [
242 'type' => Controls_Manager::ALERT,
243 'alert_type' => 'warning',
244 'dismissible' => false,
245 'heading' => esc_html__("You haven't set your Mailchimp API key yet.", 'uicore-elements'),
246 'content' => Helper::get_admin_settings_url(esc_html__("Click here to configure your API keys.", 'uicore-elements' )),
247 ]
248 );
249 }
250
251 $this->add_control(
252 'mailchimp_audience_id',
253 [
254 'label' => esc_html__( 'Audience ID', 'uicore-elements' ),
255 'type' => Controls_Manager::TEXT,
256 'description' => esc_html__( 'Enter the Audience ID to subscribe the user to.', 'uicore-elements' ),
257 'ai' => [
258 'active' => false,
259 ],
260 'dynamic' => [
261 'active' => true,
262 ],
263 'label_block' => true,
264 'render_type' => 'none',
265 ]
266 );
267
268 // If repeaters, than we need the field mapping controls
269 if($has_repeaters) {
270 $this->add_control(
271 'mailchimp_map_description',
272 [
273 'label' => esc_html__( 'Field Mapping', 'uicore-elements' ),
274 'type' => Controls_Manager::RAW_HTML,
275 'raw' => esc_html__( 'You need to set the "ID" of the field you want to map.', 'uicore-elements' ),
276 'content_classes' => 'elementor-control-field-description',
277 'separator' => 'before',
278 ]
279 );
280 $this->add_control(
281 'mailchimp_email_id',
282 [
283 'label' => esc_html__( 'Email*', 'uicore-elements' ),
284 'type' => Controls_Manager::TEXT,
285 'ai' => [
286 'active' => false,
287 ],
288 'render_type' => 'none',
289 ]
290 );
291 $this->add_control(
292 'mailchimp_birthday_id',
293 [
294 'label' => esc_html__( 'Birthday', 'uicore-elements' ),
295 'type' => Controls_Manager::TEXT,
296 'description' => esc_html__( 'Expects the format MM/DD.', 'uicore-elements' ),
297 'ai' => [
298 'active' => false,
299 ],
300 'render_type' => 'none',
301 ]
302 );
303 $this->add_control(
304 'mailchimp_fname_id',
305 [
306 'label' => esc_html__( 'First Name', 'uicore-elements' ),
307 'type' => Controls_Manager::TEXT,
308 'ai' => [
309 'active' => false,
310 ],
311 'render_type' => 'none',
312 ]
313 );
314 $this->add_control(
315 'mailchimp_lname_id',
316 [
317 'label' => esc_html__( 'Last Name', 'uicore-elements' ),
318 'type' => Controls_Manager::TEXT,
319 'ai' => [
320 'active' => false,
321 ],
322 'render_type' => 'none',
323 ]
324 );
325 $this->add_control(
326 'mailchimp_phone_id',
327 [
328 'label' => esc_html__( 'Phone', 'uicore-elements' ),
329 'type' => Controls_Manager::TEXT,
330 'ai' => [
331 'active' => false,
332 ],
333 'render_type' => 'none',
334 ]
335 );
336
337 }
338 }
339
340 // Settings and Content Controls
341 function TRAIT_register_additional_controls($messages)
342 {
343 $this->add_control(
344 'form_id',
345 [
346 'label' => esc_html__( 'Form ID', 'uicore-elements' ),
347 'type' => Controls_Manager::TEXT,
348 'ai' => [
349 'active' => false,
350 ],
351 'placeholder' => 'new_form_id',
352 'description' => esc_html__( 'Please make sure the ID is unique and not used elsewhere on the page this form is displayed. This field allows `A-z 0-9` & underscore chars without spaces.', 'uicore-elements' ),
353 'separator' => 'after',
354 'dynamic' => [
355 'active' => true,
356 ],
357 ]
358 );
359 $this->add_control(
360 'form_validation',
361 [
362 'label' => esc_html__( 'Form Validation', 'uicore-elements' ),
363 'type' => Controls_Manager::SELECT,
364 'options' => [
365 '' => esc_html__( 'Browser Default', 'uicore-elements' ),
366 'no' => esc_html__( 'No validation', 'uicore-elements' ),
367 ],
368 'default' => '',
369 ]
370 );
371 $this->add_control(
372 'custom_messages',
373 [
374 'label' => esc_html__( 'Custom Messages', 'uicore-elements' ),
375 'type' => Controls_Manager::SWITCHER,
376 'default' => '',
377 'separator' => 'before',
378 'render_type' => 'none',
379 ]
380 );
381 $this->add_control(
382 'success_message',
383 [
384 'label' => esc_html__( 'Success Message', 'uicore-elements' ),
385 'type' => Controls_Manager::TEXT,
386 'default' => $messages['success'],
387 'placeholder' => $messages['success'],
388 'label_block' => true,
389 'condition' => [
390 'custom_messages!' => '',
391 ],
392 'render_type' => 'none',
393 'dynamic' => [
394 'active' => true,
395 ],
396 ]
397 );
398 $this->add_control(
399 'error_message',
400 [
401 'label' => esc_html__( 'Form Error', 'uicore-elements' ),
402 'type' => Controls_Manager::TEXT,
403 'default' => $messages['error'],
404 'placeholder' => $messages['error'],
405 'label_block' => true,
406 'condition' => [
407 'custom_messages!' => '',
408 ],
409 'render_type' => 'none',
410 'dynamic' => [
411 'active' => true,
412 ],
413 ]
414 );
415 $this->add_control(
416 'mail_error_message',
417 [
418 'label' => esc_html__( 'Email Sending Error', 'uicore-elements' ),
419 'type' => Controls_Manager::TEXT,
420 'default' => $messages['mail_error'],
421 'placeholder' => $messages['mail_error'],
422 'label_block' => true,
423 'condition' => [
424 'custom_messages!' => '',
425 ],
426 'render_type' => 'none',
427 'dynamic' => [
428 'active' => true,
429 ],
430 ]
431 );
432 $this->add_control(
433 'redirect_message',
434 [
435 'label' => esc_html__( 'Sucessfull Redirect', 'uicore-elements' ),
436 'type' => Controls_Manager::TEXT,
437 'default' => $messages['redirect'],
438 'placeholder' => $messages['redirect'],
439 'label_block' => true,
440 'conditions' => [
441 'terms' => [
442 [
443 'name' => 'custom_messages',
444 'operator' => '!=',
445 'value' => '',
446 ],
447 [
448 'name' => 'submit_actions',
449 'operator' => 'contains',
450 'value' => 'redirect',
451 ]
452 ],
453 ],
454 'render_type' => 'none',
455 'dynamic' => [
456 'active' => true,
457 ],
458 ]
459 );
460 }
461 function TRAIT_register_button_controls(string $submit_text = 'send')
462 {
463 $this->add_responsive_control(
464 'button_width',
465 [
466 'label' => esc_html__( 'Column Width', 'uicore-elements' ),
467 'type' => Controls_Manager::SELECT,
468 'options' => $this->TRAIT_get_width_values(),
469 'default' => '20',
470 ]
471 );
472 $this->add_responsive_control(
473 'button_align',
474 [
475 'label' => esc_html__( 'Alignment', 'uicore-elements' ),
476 'type' => Controls_Manager::CHOOSE,
477 'options' => [
478 'left' => [
479 'title' => esc_html__( 'Left', 'uicore-elements' ),
480 'icon' => 'eicon-text-align-left',
481 ],
482 'center' => [
483 'title' => esc_html__( 'Center', 'uicore-elements' ),
484 'icon' => 'eicon-text-align-center',
485 ],
486 'right' => [
487 'title' => esc_html__( 'Right', 'uicore-elements' ),
488 'icon' => 'eicon-text-align-right',
489 ],
490 'stretch' => [
491 'title' => esc_html__( 'Justified', 'uicore-elements' ),
492 'icon' => 'eicon-text-align-justify',
493 ],
494 ],
495 'default' => 'stretch',
496 'prefix_class' => 'ui-e-submit-align-',
497 ]
498 );
499 $this->add_control(
500 'button_text',
501 [
502 'label' => esc_html__( 'Submit', 'uicore-elements' ),
503 'type' => Controls_Manager::TEXT,
504 'default' => esc_html__( $submit_text, 'uicore-elements' ),
505 'placeholder' => esc_html__( $submit_text, 'uicore-elements' ),
506 'dynamic' => [
507 'active' => true,
508 ],
509 'ai' => [
510 'active' => false,
511 ],
512 ]
513 );
514 $this->add_control(
515 'selected_button_icon',
516 [
517 'label' => esc_html__( 'Icon', 'uicore-elements' ),
518 'type' => Controls_Manager::ICONS,
519 'skin' => 'inline',
520 'label_block' => false,
521 ]
522 );
523 $this->add_control(
524 'button_icon_align',
525 [
526 'label' => esc_html__( 'Icon Position', 'uicore-elements' ),
527 'type' => Controls_Manager::SELECT,
528 'default' => 'left',
529 'options' => [
530 'left' => esc_html__( 'Before', 'uicore-elements' ),
531 'right' => esc_html__( 'After', 'uicore-elements' ),
532 ],
533 'condition' => [
534 'selected_button_icon[value]!' => '',
535 ],
536 ]
537 );
538 $this->add_control(
539 'button_icon_indent',
540 [
541 'label' => esc_html__( 'Icon Spacing', 'uicore-elements' ),
542 'type' => Controls_Manager::SLIDER,
543 'size_units' => [ 'px', 'em', 'rem', 'custom' ],
544 'range' => [
545 'px' => [
546 'max' => 100,
547 ],
548 'em' => [
549 'max' => 10,
550 ],
551 'rem' => [
552 'max' => 10,
553 ],
554 ],
555 'condition' => [
556 'selected_button_icon[value]!' => '',
557 ],
558 'selectors' => [
559 '{{WRAPPER}} .elementor-button .ui-e-align-right' => 'margin-left: {{SIZE}}{{UNIT}};',
560 '{{WRAPPER}} .elementor-button .ui-e-align-left' => 'margin-right: {{SIZE}}{{UNIT}};',
561 ],
562 ]
563 );
564 $this->add_control(
565 'button_css_id',
566 [
567 'label' => esc_html__( 'Button ID', 'uicore-elements' ),
568 'type' => Controls_Manager::TEXT,
569 'default' => '',
570 'ai' => [
571 'active' => false,
572 ],
573 'title' => esc_html__( 'Add your custom id WITHOUT the Pound key. e.g: my-id', 'uicore-elements' ),
574 'description' => esc_html__( 'Please make sure the ID is unique and not used elsewhere on the page this form is displayed. This field allows `A-z 0-9` & underscore chars without spaces.', 'uicore-elements' ),
575 'separator' => 'before',
576 'dynamic' => [
577 'active' => true,
578 ],
579 ]
580 );
581 }
582
583 // TODO: this style controls were copied from newsletter, not contact form. Carefull when updating contact form with this functions
584 // Style Controls
585 function TRAIT_register_form_style_controls($section = true)
586 {
587 if($section){
588 $this->start_controls_section(
589 'section_form_style',
590 [
591 'label' => esc_html__( 'Form', 'uicore-elements' ),
592 'tab' => Controls_Manager::TAB_STYLE,
593 ]
594 );
595 }
596 $this->add_control(
597 'column_gap',
598 [
599 'label' => esc_html__( 'Columns Gap', 'uicore-elements' ),
600 'type' => Controls_Manager::SLIDER,
601 'size_units' => [ 'px', 'em', 'rem', 'custom' ],
602 'default' => [
603 'size' => 10,
604 ],
605 'range' => [
606 'px' => [
607 'max' => 60,
608 ],
609 'em' => [
610 'max' => 6,
611 ],
612 'rem' => [
613 'max' => 6,
614 ],
615 ],
616 'selectors' => [
617 '{{WRAPPER}} .ui-e-field-group' => 'padding-right: calc( {{SIZE}}{{UNIT}}/2 ); padding-left: calc( {{SIZE}}{{UNIT}}/2 );',
618 '{{WRAPPER}} .ui-e-fields-wrp' => 'margin-left: calc( -{{SIZE}}{{UNIT}}/2 ); margin-right: calc( -{{SIZE}}{{UNIT}}/2 );',
619 ],
620 ]
621 );
622 $this->add_control(
623 'row_gap',
624 [
625 'label' => esc_html__( 'Rows Gap', 'uicore-elements' ),
626 'type' => Controls_Manager::SLIDER,
627 'size_units' => [ 'px', 'em', 'rem', 'custom' ],
628 'default' => [
629 'size' => 10,
630 ],
631 'range' => [
632 'px' => [
633 'max' => 60,
634 ],
635 'em' => [
636 'max' => 6,
637 ],
638 'rem' => [
639 'max' => 6,
640 ],
641 ],
642 'selectors' => [
643 '{{WRAPPER}} .ui-e-field-group' => 'margin-bottom: {{SIZE}}{{UNIT}};',
644 '{{WRAPPER}} .ui-e-fields-wrp' => 'margin-bottom: -{{SIZE}}{{UNIT}};',
645 ],
646 ]
647 );
648 $this->add_control(
649 'heading_label',
650 [
651 'label' => esc_html__( 'Label', 'uicore-elements' ),
652 'type' => Controls_Manager::HEADING,
653 'separator' => 'before',
654 ]
655 );
656 $this->add_control(
657 'label_spacing',
658 [
659 'label' => esc_html__( 'Spacing', 'uicore-elements' ),
660 'type' => Controls_Manager::SLIDER,
661 'size_units' => [ 'px', 'em', 'rem', 'custom' ],
662 'default' => [
663 'size' => 0,
664 ],
665 'range' => [
666 'px' => [
667 'max' => 60,
668 ],
669 'em' => [
670 'max' => 6,
671 ],
672 'rem' => [
673 'max' => 6,
674 ],
675 ],
676 'selectors' => [
677 'body {{WRAPPER}} .ui-e-field-group > label' => 'padding-bottom: {{SIZE}}{{UNIT}};',
678 ],
679 ]
680 );
681 $this->add_control(
682 'label_color',
683 [
684 'label' => esc_html__( 'Text Color', 'uicore-elements' ),
685 'type' => Controls_Manager::COLOR,
686 'selectors' => [
687 '{{WRAPPER}} .ui-e-field-group > label, {{WRAPPER}} .ui-e-field-subgroup label' => 'color: {{VALUE}};',
688 ],
689 'global' => [
690 'default' => Global_Colors::COLOR_TEXT,
691 ],
692 ]
693 );
694 $this->add_control(
695 'mark_required_color',
696 [
697 'label' => esc_html__( 'Mark Color', 'uicore-elements' ),
698 'type' => Controls_Manager::COLOR,
699 'default' => '',
700 'selectors' => [
701 '{{WRAPPER}} .ui-e-required .ui-e-label:after' => 'color: {{COLOR}};',
702 ],
703 'condition' => [
704 'mark_required' => 'yes',
705 ],
706 ]
707 );
708 $this->add_group_control(
709 Group_Control_Typography::get_type(),
710 [
711 'name' => 'label_typography',
712 'selector' => '{{WRAPPER}} .ui-e-field-group > label',
713 'global' => [
714 'default' => Global_Typography::TYPOGRAPHY_TEXT,
715 ],
716 ]
717 );
718 if($section){
719 $this->end_controls_section();
720 }
721 }
722 function TRAIT_register_fields_style_controls($section = true)
723 {
724 if($section){
725 $this->start_controls_section(
726 'section_field_style',
727 [
728 'label' => esc_html__( 'Fields', 'uicore-elements' ),
729 'tab' => Controls_Manager::TAB_STYLE,
730 ]
731 );
732 }
733
734 $this->start_controls_tabs(
735 'field_style_tabs'
736 );
737
738 $this->start_controls_tab(
739 'field_normal_tab',
740 [
741 'label' => esc_html__( 'Normal', 'uicore-elements' ),
742 ]
743 );
744
745 $this->add_group_control(
746 Group_Control_Typography::get_type(),
747 [
748 'name' => 'field_typography',
749 'selector' => '{{WRAPPER}} .ui-e-field-group .ui-e-field, {{WRAPPER}} .ui-e-field-subgroup label',
750 'global' => [
751 'default' => Global_Typography::TYPOGRAPHY_TEXT,
752 ],
753 ]
754 );
755 $this->add_control(
756 'field_text_color',
757 [
758 'label' => esc_html__( 'Text Color', 'uicore-elements' ),
759 'type' => Controls_Manager::COLOR,
760 'selectors' => [
761 '{{WRAPPER}} .ui-e-field-group .ui-e-field' => 'color: {{VALUE}};',
762 ],
763 'global' => [
764 'default' => Global_Colors::COLOR_TEXT,
765 ],
766 ]
767 );
768 $this->add_control(
769 'field_placeholder_color',
770 [
771 'label' => esc_html__( 'Placeholder Color', 'uicore-elements' ),
772 'type' => Controls_Manager::COLOR,
773 'selectors' => [
774 '{{WRAPPER}} .ui-e-field-group .ui-e-field::placeholder' => 'color: {{VALUE}};',
775 ],
776 'global' => [
777 'default' => Global_Colors::COLOR_TEXT,
778 ],
779 ]
780 );
781 $this->add_control(
782 'field_background_color',
783 [
784 'label' => esc_html__( 'Background Color', 'uicore-elements' ),
785 'type' => Controls_Manager::COLOR,
786 'default' => '#ffffff',
787 'selectors' => [
788 '{{WRAPPER}} .ui-e-field-group:not(.ui-e-field-type-file) .ui-e-field:not(.ui-e-field-select)' => 'background-color: {{VALUE}};',
789 '{{WRAPPER}} .ui-e-field-group .ui-e-field-select select' => 'background-color: {{VALUE}};',
790 ],
791 ]
792 );
793 $this->add_group_control(
794 Group_Control_Border::get_type(),
795 [
796 'name' => 'field_border',
797 'selector' =>
798 '{{WRAPPER}} .ui-e-field-group:not(.ui-e-field-type-file) .ui-e-field:not(.ui-e-field-select),
799 {{WRAPPER}} .ui-e-field-group .ui-e-field-select select',
800 ]
801 );
802
803 $this->end_controls_tab();
804
805 $this->start_controls_tab(
806 'field_hover_tab',
807 [
808 'label' => esc_html__( 'Hover', 'uicore-elements' ),
809 ]
810 );
811
812 $this->add_control(
813 'field_text_hover_color',
814 [
815 'label' => esc_html__( 'Text Color', 'uicore-elements' ),
816 'type' => Controls_Manager::COLOR,
817 'selectors' => [
818 '{{WRAPPER}} .ui-e-field-group:hover .ui-e-field' => 'color: {{VALUE}};',
819 ],
820 'global' => [
821 'default' => Global_Colors::COLOR_TEXT,
822 ],
823 ]
824 );
825 $this->add_control(
826 'field_placeholder_hover_color',
827 [
828 'label' => esc_html__( 'Placeholder Color', 'uicore-elements' ),
829 'type' => Controls_Manager::COLOR,
830 'selectors' => [
831 '{{WRAPPER}} .ui-e-field-group:hover .ui-e-field::placeholder' => 'color: {{VALUE}};',
832 ],
833 'global' => [
834 'default' => Global_Colors::COLOR_TEXT,
835 ],
836 ]
837 );
838 $this->add_control(
839 'field_background_hover_color',
840 [
841 'label' => esc_html__( 'Background Color', 'uicore-elements' ),
842 'type' => Controls_Manager::COLOR,
843 'default' => '#ffffff',
844 'selectors' => [
845 '{{WRAPPER}} .ui-e-field-group:hover:not(.ui-e-field-type-file) .ui-e-field:not(.ui-e-field-select)' => 'background-color: {{VALUE}};',
846 '{{WRAPPER}} .ui-e-field-group:hover .ui-e-field-select select' => 'background-color: {{VALUE}};',
847 ],
848 ]
849 );
850 $this->add_group_control(
851 Group_Control_Border::get_type(),
852 [
853 'name' => 'field_hover_border',
854 'selector' =>
855 '{{WRAPPER}} .ui-e-field-group:hover:not(.ui-e-field-type-file) .ui-e-field:not(.ui-e-field-select),
856 {{WRAPPER}} .ui-e-field-group:hover .ui-e-field-select select',
857 ]
858 );
859
860 $this->end_controls_tab();
861
862 $this->start_controls_tab(
863 'field_active_tab',
864 [
865 'label' => esc_html__( 'Active', 'uicore-elements' ),
866 ]
867 );
868
869 $this->add_control(
870 'field_text_active_color',
871 [
872 'label' => esc_html__( 'Text Color', 'uicore-elements' ),
873 'type' => Controls_Manager::COLOR,
874 'selectors' => [
875 '{{WRAPPER}} .ui-e-field-group .ui-e-field:focus' => 'color: {{VALUE}};',
876 ],
877 'global' => [
878 'default' => Global_Colors::COLOR_TEXT,
879 ],
880 ]
881 );
882 $this->add_control(
883 'field_background_active_color',
884 [
885 'label' => esc_html__( 'Background Color', 'uicore-elements' ),
886 'type' => Controls_Manager::COLOR,
887 'default' => '#ffffff',
888 'selectors' => [
889 '{{WRAPPER}} .ui-e-field-group:not(.ui-e-field-type-file) .ui-e-field:focus:not(.ui-e-field-select)' => 'background-color: {{VALUE}};',
890 '{{WRAPPER}} .ui-e-field-group .ui-e-field-select:focus select' => 'background-color: {{VALUE}};',
891 ],
892 ]
893 );
894 $this->add_group_control(
895 Group_Control_Border::get_type(),
896 [
897 'name' => 'field_active_border',
898 'selector' =>
899 '{{WRAPPER}} .ui-e-field-group:not(.ui-e-field-type-file) .ui-e-field:focus:not(.ui-e-field-select),
900 {{WRAPPER}} .ui-e-field-group .ui-e-field-select:focus select',
901 ]
902 );
903
904 $this->end_controls_tab();
905
906 $this->end_controls_tabs();
907
908 $this->add_control(
909 'field_border_radius',
910 [
911 'label' => esc_html__( 'Border Radius', 'uicore-elements' ),
912 'type' => Controls_Manager::DIMENSIONS,
913 'size_units' => [ 'px', '%', 'em', 'rem', 'custom' ],
914 'selectors' => [
915 '{{WRAPPER}} .ui-e-field-group:not(.ui-e-field-type-file) .ui-e-field:not(.ui-e-field-select)' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
916 '{{WRAPPER}} .ui-e-field-group .ui-e-field-select select' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
917 ],
918 'separator' => 'before'
919 ]
920 );
921 $this->add_control(
922 'field_padding',
923 [
924 'label' => esc_html__( 'Padding', 'uicore-elements' ),
925 'type' => Controls_Manager::DIMENSIONS,
926 'size_units' => [ 'px', '%', 'em', 'rem', 'custom' ],
927 'selectors' => [
928 '{{WRAPPER}} .ui-e-field-group:not(.ui-e-field-type-file) .ui-e-field:not(.ui-e-field-select)' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
929 '{{WRAPPER}} .ui-e-field-group .ui-e-field-select select' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
930 ],
931 ]
932 );
933 if($section){
934 $this->end_controls_section();
935 }
936 }
937 function TRAIT_register_button_style_controls($section = true)
938 {
939 if($section){
940 $this->start_controls_section(
941 'section_button_style',
942 [
943 'label' => esc_html__( 'Button', 'uicore-elements' ),
944 'tab' => Controls_Manager::TAB_STYLE,
945 ]
946 );
947 }
948
949 $this->add_group_control(
950 Group_Control_Typography::get_type(),
951 [
952 'name' => 'button_typography',
953 'global' => [
954 'default' => Global_Typography::TYPOGRAPHY_ACCENT,
955 ],
956 'selector' => '{{WRAPPER}} .elementor-button',
957 ]
958 );
959 $this->add_group_control(
960 Group_Control_Border::get_type(), [
961 'name' => 'button_border',
962 'selector' => '{{WRAPPER}} .elementor-button',
963 'exclude' => [
964 'color',
965 ],
966 ]
967 );
968
969 $this->start_controls_tabs( 'tabs_button_style' );
970
971 $this->start_controls_tab(
972 'tab_button_normal',
973 [
974 'label' => esc_html__( 'Normal', 'uicore-elements' ),
975 ]
976 );
977
978 $this->add_control(
979 'button_background_color',
980 [
981 'label' => esc_html__( 'Background Color', 'uicore-elements' ),
982 'type' => Controls_Manager::COLOR,
983 'global' => [
984 'default' => Global_Colors::COLOR_ACCENT,
985 ],
986 'selectors' => [
987 '{{WRAPPER}} .e-form__buttons__wrapper__button-next' => 'background-color: {{VALUE}};',
988 '{{WRAPPER}} .elementor-button[type="submit"]' => 'background-color: {{VALUE}};',
989 ],
990 ]
991 );
992 $this->add_control(
993 'button_text_color',
994 [
995 'label' => esc_html__( 'Text Color', 'uicore-elements' ),
996 'type' => Controls_Manager::COLOR,
997 'default' => '#ffffff',
998 'selectors' => [
999 '{{WRAPPER}} .e-form__buttons__wrapper__button-next' => 'color: {{VALUE}};',
1000 '{{WRAPPER}} .elementor-button[type="submit"]' => 'color: {{VALUE}};',
1001 '{{WRAPPER}} .elementor-button[type="submit"] svg *' => 'fill: {{VALUE}};',
1002 ],
1003 ]
1004 );
1005 $this->add_control(
1006 'button_border_color',
1007 [
1008 'label' => esc_html__( 'Border Color', 'uicore-elements' ),
1009 'type' => Controls_Manager::COLOR,
1010 'default' => '',
1011 'selectors' => [
1012 '{{WRAPPER}} .e-form__buttons__wrapper__button-next' => 'border-color: {{VALUE}};',
1013 '{{WRAPPER}} .elementor-button[type="submit"]' => 'border-color: {{VALUE}};',
1014 ],
1015 'condition' => [
1016 'button_border_border!' => '',
1017 ],
1018 ]
1019 );
1020
1021 $this->end_controls_tab();
1022
1023 $this->start_controls_tab(
1024 'tab_button_hover',
1025 [
1026 'label' => esc_html__( 'Hover', 'uicore-elements' ),
1027 ]
1028 );
1029
1030 $this->add_control(
1031 'button_background_hover_color',
1032 [
1033 'label' => esc_html__( 'Background Color', 'uicore-elements' ),
1034 'type' => Controls_Manager::COLOR,
1035 'default' => '',
1036 'selectors' => [
1037 '{{WRAPPER}} .e-form__buttons__wrapper__button-next:hover' => 'background-color: {{VALUE}};',
1038 '{{WRAPPER}} .elementor-button[type="submit"]:hover' => 'background-color: {{VALUE}};',
1039 ],
1040 ]
1041 );
1042 $this->add_control(
1043 'button_hover_color',
1044 [
1045 'label' => esc_html__( 'Text Color', 'uicore-elements' ),
1046 'type' => Controls_Manager::COLOR,
1047 'default' => '#ffffff',
1048 'selectors' => [
1049 '{{WRAPPER}} .e-form__buttons__wrapper__button-next:hover' => 'color: {{VALUE}};',
1050 '{{WRAPPER}} .elementor-button[type="submit"]:hover' => 'color: {{VALUE}};',
1051 '{{WRAPPER}} .elementor-button[type="submit"]:hover svg *' => 'fill: {{VALUE}};',
1052 ],
1053 ]
1054 );
1055 $this->add_control(
1056 'button_hover_border_color',
1057 [
1058 'label' => esc_html__( 'Border Color', 'uicore-elements' ),
1059 'type' => Controls_Manager::COLOR,
1060 'default' => '',
1061 'selectors' => [
1062 '{{WRAPPER}} .e-form__buttons__wrapper__button-next:hover' => 'border-color: {{VALUE}};',
1063 '{{WRAPPER}} .elementor-button[type="submit"]:hover' => 'border-color: {{VALUE}};',
1064 ],
1065 'condition' => [
1066 'button_border_border!' => '',
1067 ],
1068 ]
1069 );
1070 $this->add_control(
1071 'hover_transition_duration',
1072 [
1073 'label' => esc_html__( 'Transition Duration', 'uicore-elements' ),
1074 'type' => Controls_Manager::SLIDER,
1075 'size_units' => [ 's', 'ms', 'custom' ],
1076 'default' => [
1077 'unit' => 'ms',
1078 ],
1079 'selectors' => [
1080 '{{WRAPPER}} .e-form__buttons__wrapper__button-previous' => 'transition-duration: {{SIZE}}{{UNIT}};',
1081 '{{WRAPPER}} .e-form__buttons__wrapper__button-next' => 'transition-duration: {{SIZE}}{{UNIT}};',
1082 '{{WRAPPER}} .elementor-button[type="submit"] svg *' => 'transition-duration: {{SIZE}}{{UNIT}};',
1083 '{{WRAPPER}} .elementor-button[type="submit"]' => 'transition-duration: {{SIZE}}{{UNIT}};',
1084 ],
1085 ]
1086 );
1087 $this->add_control(
1088 'button_hover_animation',
1089 [
1090 'label' => esc_html__( 'Animation', 'uicore-elements' ),
1091 'type' => Controls_Manager::HOVER_ANIMATION,
1092 ]
1093 );
1094
1095 $this->end_controls_tab();
1096
1097 $this->end_controls_tabs();
1098
1099 $this->add_control(
1100 'button_border_radius',
1101 [
1102 'label' => esc_html__( 'Border Radius', 'uicore-elements' ),
1103 'type' => Controls_Manager::DIMENSIONS,
1104 'size_units' => [ 'px', '%', 'em', 'rem', 'custom' ],
1105 'selectors' => [
1106 '{{WRAPPER}} .elementor-button' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1107 ],
1108 'separator' => 'before',
1109 ]
1110 );
1111
1112 $this->add_control(
1113 'button_text_padding',
1114 [
1115 'label' => esc_html__( 'Text Padding', 'uicore-elements' ),
1116 'type' => Controls_Manager::DIMENSIONS,
1117 'size_units' => [ 'px', '%', 'em', 'rem', 'custom' ],
1118 'selectors' => [
1119 '{{WRAPPER}} .elementor-button' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1120 ],
1121 ]
1122 );
1123
1124 if($section){
1125 $this->end_controls_section();
1126 }
1127 }
1128 function TRAIT_register_messages_style_controls($section = true)
1129 {
1130 if($section){
1131 $this->start_controls_section(
1132 'section_messages_style',
1133 [
1134 'label' => esc_html__( 'Messages', 'uicore-elements' ),
1135 'tab' => Controls_Manager::TAB_STYLE,
1136 ]
1137 );
1138 }
1139
1140 $this->add_control(
1141 'show_messages',
1142 [
1143 'label' => esc_html__( 'Show/Hide messages', 'uicore-elements' ),
1144 'type' => Controls_Manager::BUTTON,
1145 'separator' => 'before',
1146 'text' => esc_html__( 'Toggle', 'uicore-elements' ),
1147 'event' => 'ui-e-form-show-messages',
1148 ]
1149 );
1150 $this->add_group_control(
1151 Group_Control_Typography::get_type(),
1152 [
1153 'name' => 'message_typography',
1154 'global' => [
1155 'default' => Global_Typography::TYPOGRAPHY_TEXT,
1156 ],
1157 'selector' => '{{WRAPPER}} .ui-e-message',
1158 ]
1159 );
1160 $this->add_control(
1161 'success_message_color',
1162 [
1163 'label' => esc_html__( 'Success Message Color', 'uicore-elements' ),
1164 'type' => Controls_Manager::COLOR,
1165 'default' => '#4CAF50',
1166 'selectors' => [
1167 '{{WRAPPER}} .ui-e-message span.success' => 'color: {{COLOR}};',
1168 ],
1169 ]
1170 );
1171 $this->add_control(
1172 'error_message_color',
1173 [
1174 'label' => esc_html__( 'Error Message Color', 'uicore-elements' ),
1175 'type' => Controls_Manager::COLOR,
1176 'default' => '#F44336',
1177 'selectors' => [
1178 '{{WRAPPER}} .ui-e-message span.error' => 'color: {{COLOR}};',
1179 ],
1180 ]
1181 );
1182
1183 if($section){
1184 $this->end_controls_section();
1185 }
1186 }
1187 function TRAIT_register_all_form_style_controls()
1188 {
1189 $this->TRAIT_register_form_style_controls();
1190 $this->TRAIT_register_fields_style_controls();
1191 $this->TRAIT_register_button_style_controls();
1192 $this->TRAIT_register_messages_style_controls();
1193 }
1194
1195 // Helper and Utility Functions
1196 function TRAIT_get_width_values()
1197 {
1198 return [
1199 '' => esc_html__( 'Default', 'uicore-elements' ),
1200 '100' => '100%',
1201 '80' => '80%',
1202 '75' => '75%',
1203 '70' => '70%',
1204 '66' => '66%',
1205 '60' => '60%',
1206 '50' => '50%',
1207 '40' => '40%',
1208 '33' => '33%',
1209 '30' => '30%',
1210 '25' => '25%',
1211 '20' => '20%',
1212 ];
1213 }
1214 function TRAIT_recaptcha_key_js()
1215 {
1216 ?>
1217 <script>
1218 window.uicore_elements_recaptcha = '<?php echo get_option('uicore_elements_recaptcha_site_key'); ?>';
1219 </script>
1220 <?php
1221 }
1222 }