PluginProbe
Elementor Website Builder – more than just a page builder / 3.23.0-dev2
Elementor Website Builder – more than just a page builder v3.23.0-dev2
4.3.0-beta3 4.3.0-beta2 4.3.0-beta1 4.2.4 4.2.3 4.2.2 4.2.1 4.2.0 4.1.5 4.2.0-beta2 4.2.0-dev2 4.2.0-beta1 4.1.4 4.1.3 4.1.2 4.1.1 4.1.0 4.1.0-beta3 4.1.0-dev3 4.0.9 4.1.0-beta2 4.1.0-dev2 4.0.8 4.1.0-beta1 4.1.0-dev1 All 452 releases
elementor / modules / floating-buttons / base / widget-contact-button-base.php

widget-contact-button-base.php in Elementor Website Builder – more than just a page builder 3.23.0-dev2, at modules/floating-buttons/base/widget-contact-button-base.php

3,179 lines 83.5 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 <?php
2
3 namespace Elementor\Modules\FloatingButtons\Base;
4
5 use Elementor\Controls_Manager;
6 use Elementor\Core\Base\Providers\Social_Network_Provider;
7 use Elementor\Core\Base\Traits\Shared_Widget_Controls_Trait;
8 use Elementor\Group_Control_Box_Shadow;
9 use Elementor\Group_Control_Typography;
10 use Elementor\Modules\FloatingButtons\Classes\Render\Contact_Buttons_Core_Render;
11 use Elementor\Plugin;
12 use Elementor\Repeater;
13 use Elementor\Utils;
14 use Elementor\Widget_Base;
15
16 abstract class Widget_Contact_Button_Base extends Widget_Base {
17
18 use Shared_Widget_Controls_Trait;
19
20 const TAB_ADVANCED = 'advanced-tab-floating-buttons';
21
22 public function show_in_panel() {
23 return false;
24 }
25
26 public function hide_on_search() {
27 return true;
28 }
29
30 public static function get_configuration() {
31 return [
32 'content' => [
33 'chat_button_section' => [
34 'section_name' => esc_html__( 'Chat Button', 'elementor' ),
35 'has_platform' => true,
36 'has_icon' => false,
37 'icon_default' => [
38 'value' => 'far fa-comment-dots',
39 'library' => 'fa-regular',
40 ],
41 'icons_recommended' => [
42 'fa-regular' => [
43 'comment',
44 'comment-dots',
45 'comment-alt',
46 ],
47 'fa-solid' => [
48 'ellipsis-v',
49 ],
50 ],
51 'has_notification_dot' => true,
52 'has_notification_dot_default_enabled' => true,
53 'has_active_tab' => false,
54 'has_display_text' => false,
55 'display_text_label' => esc_html__( 'Call now', 'elementor' ),
56 'has_display_text_select' => true,
57 'platform' => [
58 'group' => [
59 Social_Network_Provider::EMAIL,
60 Social_Network_Provider::SMS,
61 Social_Network_Provider::WHATSAPP,
62 Social_Network_Provider::SKYPE,
63 Social_Network_Provider::MESSENGER,
64 Social_Network_Provider::VIBER,
65 ],
66 'default' => Social_Network_Provider::WHATSAPP,
67 ],
68 'defaults' => [
69 'mail' => null,
70 'mail_subject' => null,
71 'mail_body' => null,
72 'number' => null,
73 'username' => null,
74 'location' => [
75 'is_external' => true,
76 ],
77 'url' => [
78 'is_external' => true,
79 ],
80 ],
81 ],
82 'top_bar_section' => [
83 'section_name' => esc_html__( 'Top Bar', 'elementor' ),
84 'has_image' => true,
85 'has_active_dot' => true,
86 'has_subtitle' => true,
87 'title' => [
88 'label' => esc_html__( 'Name', 'elementor' ),
89 'default' => esc_html__( 'Rob Jones', 'elementor' ),
90 'placeholder' => esc_html__( 'Type your name here', 'elementor' ),
91 'dynamic' => false,
92 'ai' => false,
93 'label_block' => false,
94 ],
95 'subtitle' => [
96 'label' => esc_html__( 'Title', 'elementor' ),
97 'default' => esc_html__( 'Store Manager', 'elementor' ),
98 'placeholder' => esc_html__( 'Type your title here', 'elementor' ),
99 'dynamic' => false,
100 'ai' => false,
101 'label_block' => false,
102 ],
103 ],
104 'message_bubble_section' => [
105 'has_typing_animation' => true,
106 ],
107 'contact_section' => [
108 'section_name' => esc_html__( 'Contact Buttons', 'elementor' ),
109 'has_cta_text' => true,
110 'repeater' => [
111 'has_tooltip' => false,
112 'tooltip_label' => esc_html__( 'Text', 'elementor' ),
113 'tooltip_default' => esc_html__( 'Tooltip', 'elementor' ),
114 'tooltip_placeholder' => esc_html__( 'Enter icon text', 'elementor' ),
115 'has_title' => false,
116 'has_description' => false,
117 ],
118 'platform' => [
119 'group-1' => [
120 Social_Network_Provider::EMAIL,
121 Social_Network_Provider::SMS,
122 Social_Network_Provider::WHATSAPP,
123 Social_Network_Provider::SKYPE,
124 Social_Network_Provider::MESSENGER,
125 Social_Network_Provider::VIBER,
126 ],
127 'limit' => 5,
128 'min_items' => 0,
129 ],
130 'default' => [
131 [
132 'contact_icon_platform' => Social_Network_Provider::WHATSAPP,
133 ],
134 [
135 'contact_icon_platform' => Social_Network_Provider::EMAIL,
136 ],
137 [
138 'contact_icon_platform' => Social_Network_Provider::SMS,
139 ],
140 [
141 'contact_icon_platform' => Social_Network_Provider::VIBER,
142 ],
143 [
144 'contact_icon_platform' => Social_Network_Provider::MESSENGER,
145 ],
146 ],
147 ],
148 'send_button_section' => [
149 'section_name' => esc_html__( 'Send Button', 'elementor' ),
150 'has_link' => false,
151 'text' => [
152 'default' => esc_html__( 'Click to start chat', 'elementor' ),
153 ],
154 ],
155 ],
156 'style' => [
157 'has_platform_colors' => true,
158 'chat_button_section' => [
159 'has_entrance_animation' => true,
160 'has_box_shadow' => true,
161 'has_drop_shadow' => false,
162 'has_padding' => false,
163 'has_button_size' => true,
164 'button_size_default' => 'small',
165 'has_typography' => false,
166 'has_icon_position' => false,
167 'has_icon_spacing' => false,
168 'has_tabs' => true,
169 'has_platform_color_controls' => false,
170 'hover_animation_type' => 'default',
171 'icon_color_label' => esc_html__( 'Icon Color', 'elementor' ),
172 'padding_defaults' => [
173 'top' => '16',
174 'bottom' => '16',
175 'left' => '20',
176 'right' => '20',
177 'unit' => 'px',
178 'isLinked' => false,
179 ],
180 ],
181 'top_bar_section' => [
182 'has_title_heading' => true,
183 'title_heading_label' => esc_html__( 'Name', 'elementor' ),
184 'subtitle_heading_label' => esc_html__( 'Title', 'elementor' ),
185 'has_style_close_button' => true,
186 'has_close_button_heading' => false,
187 'has_background' => true,
188 'has_background_heading' => false,
189 ],
190 'message_bubble_section' => [
191 'has_chat_background' => true,
192 ],
193 'contact_section' => [
194 'has_buttons_heading' => true,
195 'buttons_heading_label' => esc_html__( 'Buttons', 'elementor' ),
196 'has_buttons_size' => true,
197 'has_box_shadow' => false,
198 'has_buttons_spacing' => false,
199 'buttons_spacing_default' => [
200 'unit' => 'px',
201 'size' => 15,
202 ],
203 'has_hover_animation' => true,
204 'has_chat_box_animation' => false,
205 'has_icon_bg_color' => true,
206 'has_button_bar' => false,
207 'has_tabs' => true,
208 'has_text_color' => false,
209 'has_bg_color' => false,
210 'has_padding' => false,
211 'has_button_corners' => false,
212 'has_typography' => false,
213 'icon_color_label' => esc_html__( 'Icon Color', 'elementor' ),
214 'has_hover_transition_duration' => false,
215 ],
216 'send_button_section' => [
217 'has_platform_colors' => true,
218 'has_icon_color' => true,
219 'has_background_color' => true,
220 'has_text_color' => false,
221 'has_typography' => false,
222 ],
223 'chat_box_section' => [
224 'section_name' => esc_html__( 'Chat Box', 'elementor' ),
225 'width' => 360,
226 'has_width' => true,
227 'has_padding' => false,
228 ],
229 ],
230 'advanced' => [
231 'has_layout_position' => true,
232 'horizontal_position_default' => 'end',
233 'horizontal_offset_default' => 25,
234 'vertical_offset_default' => 25,
235 'has_mobile_full_width' => false,
236 'has_vertical_offset' => true,
237 'has_horizontal_offset' => true,
238 ],
239 ];
240 }
241
242 public function get_icon(): string {
243 return 'eicon-commenting-o';
244 }
245
246 public function get_categories(): array {
247 return [ 'general' ];
248 }
249
250 public function get_stack( $with_common_controls = true ): array {
251 return parent::get_stack( false );
252 }
253
254 protected function register_controls(): void {
255
256 $this->add_content_tab();
257
258 $this->add_style_tab();
259
260 $this->add_advanced_tab();
261 }
262
263 const BOX_SHADOW_FIELDS_OPTIONS = [
264 'box_shadow_type' => [
265 'default' => 'yes',
266 ],
267 'box_shadow' => [
268 'default' => [
269 'horizontal' => 4,
270 'vertical' => 4,
271 'blur' => 10,
272 'spread' => 0,
273 'color' => 'rgba(0,0,0,0.15)',
274 ],
275 ],
276 ];
277
278 private function social_media_controls(): void {
279 $config = static::get_configuration();
280
281 $this->add_control(
282 'chat_button_mail',
283 [
284 'label' => esc_html__( 'Email', 'elementor' ),
285 'type' => Controls_Manager::TEXT,
286 'dynamic' => [
287 'active' => true,
288 ],
289 'ai' => [
290 'active' => false,
291 ],
292 'label_block' => true,
293 'placeholder' => esc_html__( '@', 'elementor' ),
294 'default' => $config['content']['chat_button_section']['defaults']['mail'],
295 'condition' => [
296 'chat_button_platform' => Social_Network_Provider::EMAIL,
297 ],
298 ],
299 );
300
301 $this->add_control(
302 'chat_button_mail_subject',
303 [
304 'label' => esc_html__( 'Subject', 'elementor' ),
305 'type' => Controls_Manager::TEXT,
306 'dynamic' => [
307 'active' => true,
308 ],
309 'label_block' => true,
310 'default' => $config['content']['chat_button_section']['defaults']['mail_subject'],
311 'condition' => [
312 'chat_button_platform' => Social_Network_Provider::EMAIL,
313 ],
314 ],
315 );
316
317 $this->add_control(
318 'chat_button_mail_body',
319 [
320 'label' => esc_html__( 'Message', 'elementor' ),
321 'type' => Controls_Manager::TEXTAREA,
322 'default' => $config['content']['chat_button_section']['defaults']['mail_body'],
323 'condition' => [
324 'chat_button_platform' => Social_Network_Provider::EMAIL,
325 ],
326 ]
327 );
328
329 $this->add_control(
330 'chat_button_number',
331 [
332 'label' => esc_html__( 'Number', 'elementor' ),
333 'type' => Controls_Manager::TEXT,
334 'dynamic' => [
335 'active' => true,
336 ],
337 'ai' => [
338 'active' => false,
339 ],
340 'label_block' => true,
341 'placeholder' => esc_html__( '+', 'elementor' ),
342 'default' => $config['content']['chat_button_section']['defaults']['number'],
343 'condition' => [
344 'chat_button_platform' => [
345 Social_Network_Provider::SMS,
346 Social_Network_Provider::WHATSAPP,
347 Social_Network_Provider::VIBER,
348 Social_Network_Provider::TELEPHONE,
349 ],
350 ],
351 ],
352 );
353
354 $this->add_control(
355 'chat_button_username',
356 [
357 'label' => esc_html__( 'Username', 'elementor' ),
358 'type' => Controls_Manager::TEXT,
359 'dynamic' => [
360 'active' => true,
361 ],
362 'ai' => [
363 'active' => false,
364 ],
365 'label_block' => true,
366 'default' => $config['content']['chat_button_section']['defaults']['username'],
367 'condition' => [
368 'chat_button_platform' => [
369 Social_Network_Provider::SKYPE,
370 Social_Network_Provider::MESSENGER,
371 ],
372 ],
373 ],
374 );
375
376 $this->add_control(
377 'chat_button_viber_action',
378 [
379 'label' => esc_html__( 'Action', 'elementor' ),
380 'type' => Controls_Manager::SELECT,
381 'default' => 'chat',
382 'options' => [
383 'chat' => 'Chat',
384 'contact' => 'Contact',
385 ],
386 'condition' => [
387 'chat_button_platform' => Social_Network_Provider::VIBER,
388 ],
389 ]
390 );
391
392 $this->add_control(
393 'chat_button_waze',
394 [
395 'label' => esc_html__( 'Location', 'elementor' ),
396 'type' => Controls_Manager::URL,
397 'dynamic' => [
398 'active' => true,
399 ],
400 'ai' => [
401 'active' => false,
402 ],
403 'label_block' => true,
404 'placeholder' => esc_html__( 'Paste Waze link', 'elementor' ),
405 'default' => $config['content']['chat_button_section']['defaults']['location'],
406 'condition' => [
407 'chat_button_platform' => [
408 Social_Network_Provider::WAZE,
409 ],
410 ],
411 ],
412 );
413
414 $this->add_control(
415 'chat_button_url',
416 [
417 'label' => esc_html__( 'Link', 'elementor' ),
418 'type' => Controls_Manager::URL,
419 'default' => [
420 'is_external' => true,
421 ],
422 'dynamic' => [
423 'active' => true,
424 ],
425 'ai' => [
426 'active' => false,
427 ],
428 'autocomplete' => true,
429 'label_block' => true,
430 'default' => $config['content']['chat_button_section']['defaults']['url'],
431 'condition' => [
432 'chat_button_platform' => [
433 Social_Network_Provider::URL,
434 ],
435 ],
436 ],
437 );
438 }
439
440 private function get_display_text_condition( $condition ) {
441 $config = static::get_configuration();
442
443 if ( true == $config['content']['chat_button_section']['has_display_text_select'] ) {
444 return $condition;
445 }
446
447 return null;
448 }
449
450 protected function add_chat_button_section(): void {
451 $config = static::get_configuration();
452
453 $this->start_controls_section(
454 'chat_button_section',
455 [
456 'label' => $config['content']['chat_button_section']['section_name'],
457 'tab' => Controls_Manager::TAB_CONTENT,
458 ]
459 );
460
461 if ( $config['content']['chat_button_section']['has_platform'] ) {
462
463 $this->add_control(
464 'chat_button_platform',
465 [
466 'label' => esc_html__( 'Platform', 'elementor' ),
467 'type' => Controls_Manager::SELECT,
468 'default' => $config['content']['chat_button_section']['platform']['default'],
469 'options' => Social_Network_Provider::get_social_networks_text(
470 $config['content']['chat_button_section']['platform']['group']
471 ),
472 ]
473 );
474
475 $this->social_media_controls();
476 }
477
478 if ( $config['content']['chat_button_section']['has_icon'] ) {
479 $this->add_control(
480 'chat_button_icon',
481 [
482 'label' => esc_html__( 'Icon', 'elementor' ),
483 'type' => Controls_Manager::ICONS,
484 'default' => $config['content']['chat_button_section']['icon_default'],
485 'recommended' => $config['content']['chat_button_section']['icons_recommended'],
486 ]
487 );
488 }
489
490 if ( $config['content']['chat_button_section']['has_notification_dot'] ) {
491
492 $notification_dot_return_value = 'yes';
493 $notification_dot_default = $notification_dot_return_value;
494
495 // Only clear if explicitly passed
496 if ( false === $config['content']['chat_button_section']['has_notification_dot_default_enabled'] ) {
497 $notification_dot_default = '';
498 }
499
500 $this->add_control(
501 'chat_button_show_dot',
502 [
503 'label' => esc_html__( 'Notification Dot', 'elementor' ),
504 'type' => Controls_Manager::SWITCHER,
505 'label_on' => esc_html__( 'Show', 'elementor' ),
506 'label_off' => esc_html__( 'Hide', 'elementor' ),
507 'return_value' => $notification_dot_return_value,
508 'default' => $notification_dot_default,
509 ]
510 );
511 }
512
513 if ( $config['content']['chat_button_section']['has_display_text'] ) {
514
515 if ( $config['content']['chat_button_section']['has_display_text_select'] ) {
516 $this->add_control(
517 'chat_button_display_text_select',
518 [
519 'label' => esc_html__( 'Display Text', 'elementor' ),
520 'type' => Controls_Manager::SELECT,
521 'default' => 'details',
522 'options' => [
523 'details' => esc_html__( 'Contact Details', 'elementor' ),
524 'cta' => esc_html__( 'Call to Action', 'elementor' ),
525 ],
526 ]
527 );
528 }
529
530 $this->add_control(
531 'chat_button_display_text',
532 [
533 'label' => esc_html__( 'Call to Action Text', 'elementor' ),
534 'type' => Controls_Manager::TEXT,
535 'dynamic' => [
536 'active' => true,
537 ],
538 'label_block' => true,
539 'placeholder' => esc_html__( 'Enter the text', 'elementor' ),
540 'default' => $config['content']['chat_button_section']['display_text_label'],
541 'condition' => $this->get_display_text_condition([
542 'chat_button_display_text_select' => 'cta',
543 ] ),
544 ],
545 );
546 }
547
548 $this->end_controls_section();
549 }
550
551 protected function add_top_bar_section(): void {
552 $config = static::get_configuration();
553
554 $this->start_controls_section(
555 'top_bar_section',
556 [
557 'label' => $config['content']['top_bar_section']['section_name'],
558 'tab' => Controls_Manager::TAB_CONTENT,
559 ]
560 );
561
562 $this->add_control(
563 'top_bar_title',
564 [
565 'label' => $config['content']['top_bar_section']['title']['label'],
566 'type' => Controls_Manager::TEXT,
567 'default' => $config['content']['top_bar_section']['title']['default'],
568 'placeholder' => $config['content']['top_bar_section']['title']['placeholder'],
569 'dynamic' => [
570 'active' => $config['content']['top_bar_section']['title']['dynamic'],
571 ],
572 'ai' => [
573 'active' => $config['content']['top_bar_section']['title']['ai'],
574 ],
575 'label_block' => $config['content']['top_bar_section']['title']['label_block'],
576 ]
577 );
578
579 if ( $config['content']['top_bar_section']['has_subtitle'] ) {
580 $this->add_control(
581 'top_bar_subtitle',
582 [
583 'label' => $config['content']['top_bar_section']['subtitle']['label'],
584 'type' => Controls_Manager::TEXT,
585 'default' => $config['content']['top_bar_section']['subtitle']['default'],
586 'placeholder' => $config['content']['top_bar_section']['subtitle']['placeholder'],
587 $config['content']['top_bar_section']['subtitle']['dynamic'],
588 'ai' => [
589 'active' => $config['content']['top_bar_section']['subtitle']['ai'],
590 ],
591 'label_block' => $config['content']['top_bar_section']['title']['label_block'],
592 ]
593 );
594 }
595
596 if ( $config['content']['top_bar_section']['has_image'] ) {
597 $this->add_control(
598 'top_bar_image',
599 [
600 'label' => esc_html__( 'Profile Image', 'elementor' ),
601 'type' => Controls_Manager::MEDIA,
602 'default' => [
603 'url' => Utils::get_placeholder_image_src(),
604 ],
605 ]
606 );
607 }
608
609 if ( $config['content']['top_bar_section']['has_active_dot'] ) {
610 $this->add_control(
611 'top_bar_show_dot',
612 [
613 'label' => esc_html__( 'Active Dot', 'elementor' ),
614 'type' => Controls_Manager::SWITCHER,
615 'label_on' => esc_html__( 'Show', 'elementor' ),
616 'label_off' => esc_html__( 'Hide', 'elementor' ),
617 'return_value' => 'yes',
618 'default' => 'yes',
619 ]
620 );
621 }
622
623 $this->end_controls_section();
624 }
625
626 protected function add_message_bubble_section(): void {
627 $config = static::get_configuration();
628
629 $this->start_controls_section(
630 'message_bubble_section',
631 [
632 'label' => esc_html__( 'Message Bubble', 'elementor' ),
633 'tab' => Controls_Manager::TAB_CONTENT,
634 ]
635 );
636
637 $this->add_control(
638 'message_bubble_name',
639 [
640 'label' => esc_html__( 'Name', 'elementor' ),
641 'type' => Controls_Manager::TEXT,
642 'default' => esc_html__( 'Rob', 'elementor' ),
643 'placeholder' => esc_html__( 'Type your name here', 'elementor' ),
644 ]
645 );
646
647 $this->add_control(
648 'message_bubble_body',
649 [
650 'label' => esc_html__( 'Message', 'elementor' ),
651 'type' => Controls_Manager::TEXTAREA,
652 'dynamic' => [
653 'active' => true,
654 ],
655 'label_block' => true,
656 'default' => esc_html__( 'Hey, how can I help you today?', 'elementor' ),
657 'placeholder' => esc_html__( 'Message', 'elementor' ),
658 ],
659 );
660
661 $this->add_control(
662 'chat_button_time_format',
663 [
664 'label' => esc_html__( 'Time format', 'elementor' ),
665 'type' => Controls_Manager::SELECT,
666 'default' => '12h',
667 'options' => [
668 '12h' => esc_html__( '2:20 PM', 'elementor' ),
669 '24h' => esc_html__( '14:20', 'elementor' ),
670 ],
671 ]
672 );
673
674 if ( $config['content']['message_bubble_section']['has_typing_animation'] ) {
675 $this->add_control(
676 'chat_button_show_animation',
677 [
678 'label' => esc_html__( 'Typing Animation', 'elementor' ),
679 'type' => Controls_Manager::SWITCHER,
680 'label_on' => esc_html__( 'Show', 'elementor' ),
681 'label_off' => esc_html__( 'Hide', 'elementor' ),
682 'return_value' => 'yes',
683 'default' => 'yes',
684 ]
685 );
686 }
687
688 $this->end_controls_section();
689 }
690
691 protected function add_contact_section(): void {
692 $config = static::get_configuration();
693
694 $this->start_controls_section(
695 'contact_section',
696 [
697 'label' => $config['content']['contact_section']['section_name'],
698 'tab' => Controls_Manager::TAB_CONTENT,
699 ]
700 );
701
702 if ( $config['content']['contact_section']['has_cta_text'] ) {
703 $this->add_control(
704 'contact_cta_text',
705 [
706 'label' => esc_html__( 'Call to Action Text', 'elementor' ),
707 'type' => Controls_Manager::TEXT,
708 'default' => esc_html__( 'Start conversation:', 'elementor' ),
709 'placeholder' => esc_html__( 'Type your text here', 'elementor' ),
710 ]
711 );
712 }
713
714 if ( $config['content']['contact_section']['platform']['limit'] ) {
715 if ( $config['content']['contact_section']['platform']['min_items'] ) {
716 $this->add_control(
717 'contact_custom_panel_alert',
718 [
719 'type' => Controls_Manager::ALERT,
720 'alert_type' => 'info',
721 'content' => sprintf(
722 __( 'Add between <b>%1$d</b> to <b>%2$d</b> icons', 'elementor' ),
723 $config['content']['contact_section']['platform']['min_items'],
724 $config['content']['contact_section']['platform']['limit']
725 ),
726 ]
727 );
728 } else {
729 $this->add_control(
730 'contact_custom_panel_alert',
731 [
732 'type' => Controls_Manager::ALERT,
733 'alert_type' => 'info',
734 'content' => sprintf(
735 __( 'Add up to <b>%d</b> icons', 'elementor' ),
736 $config['content']['contact_section']['platform']['limit']
737 ),
738 ]
739 );
740 }
741 }
742
743 $repeater = new Repeater();
744
745 $repeater->add_control(
746 'contact_icon_platform',
747 [
748 'label' => esc_html__( 'Platform', 'elementor' ),
749 'type' => Controls_Manager::SELECT,
750 'options' => Social_Network_Provider::get_social_networks_text(
751 $config['content']['contact_section']['platform']['group-1']
752 ),
753 'default' => Social_Network_Provider::WHATSAPP,
754 ],
755 );
756
757 if ( $config['content']['contact_section']['repeater']['has_tooltip'] ) {
758 $repeater->add_control(
759 'contact_tooltip',
760 [
761 'label' => $config['content']['contact_section']['repeater']['tooltip_label'],
762 'type' => Controls_Manager::TEXT,
763 'dynamic' => [
764 'active' => true,
765 ],
766 'default' => $config['content']['contact_section']['repeater']['tooltip_default'],
767 'placeholder' => $config['content']['contact_section']['repeater']['tooltip_placeholder'],
768 ],
769 );
770 }
771
772 if ( $config['content']['contact_section']['repeater']['has_title'] ) {
773 $repeater->add_control(
774 'contact_title',
775 [
776 'label' => 'Title',
777 'type' => Controls_Manager::TEXT,
778 'dynamic' => [
779 'active' => true,
780 ],
781 'default' => 'Title',
782 'placeholder' => esc_html__( 'Enter title', 'elementor' ),
783 ],
784 );
785 }
786
787 if ( $config['content']['contact_section']['repeater']['has_description'] ) {
788 $repeater->add_control(
789 'contact_description',
790 [
791 'label' => 'Description',
792 'type' => Controls_Manager::TEXT,
793 'dynamic' => [
794 'active' => true,
795 ],
796 'default' => 'Description',
797 'placeholder' => esc_html__( 'Enter description', 'elementor' ),
798 ],
799 );
800 }
801
802 $repeater->add_control(
803 'contact_icon_mail',
804 [
805 'label' => esc_html__( 'Email', 'elementor' ),
806 'type' => Controls_Manager::TEXT,
807 'placeholder' => esc_html__( 'Enter your email', 'elementor' ),
808 'dynamic' => [
809 'active' => true,
810 ],
811 'ai' => [
812 'active' => false,
813 ],
814 'label_block' => true,
815 'condition' => [
816 'contact_icon_platform' => [
817 Social_Network_Provider::EMAIL,
818 ],
819 ],
820 ],
821 );
822
823 $repeater->add_control(
824 'contact_icon_mail_subject',
825 [
826 'label' => esc_html__( 'Subject', 'elementor' ),
827 'type' => Controls_Manager::TEXT,
828 'placeholder' => esc_html__( 'Subject', 'elementor' ),
829 'label_block' => true,
830 'condition' => [
831 'contact_icon_platform' => [
832 Social_Network_Provider::EMAIL,
833 ],
834 ],
835 ]
836 );
837
838 $repeater->add_control(
839 'contact_icon_mail_body',
840 [
841 'label' => esc_html__( 'Message', 'elementor' ),
842 'type' => Controls_Manager::TEXTAREA,
843 'placeholder' => esc_html__( 'Message', 'elementor' ),
844 'label_block' => true,
845 'condition' => [
846 'contact_icon_platform' => [
847 Social_Network_Provider::EMAIL,
848 ],
849 ],
850 ]
851 );
852
853 $repeater->add_control(
854 'contact_icon_number',
855 [
856 'label' => esc_html__( 'Number', 'elementor' ),
857 'type' => Controls_Manager::TEXT,
858 'dynamic' => [
859 'active' => true,
860 ],
861 'ai' => [
862 'active' => false,
863 ],
864 'label_block' => true,
865 'placeholder' => esc_html__( '+', 'elementor' ),
866 'condition' => [
867 'contact_icon_platform' => [
868 Social_Network_Provider::SMS,
869 Social_Network_Provider::WHATSAPP,
870 Social_Network_Provider::VIBER,
871 Social_Network_Provider::TELEPHONE,
872 ],
873 ],
874 ],
875 );
876
877 $repeater->add_control(
878 'contact_icon_username',
879 [
880 'label' => esc_html__( 'Username', 'elementor' ),
881 'type' => Controls_Manager::TEXT,
882 'dynamic' => [
883 'active' => true,
884 ],
885 'ai' => [
886 'active' => false,
887 ],
888 'label_block' => true,
889 'placeholder' => esc_html__( 'Enter your username', 'elementor' ),
890 'condition' => [
891 'contact_icon_platform' => [
892 Social_Network_Provider::MESSENGER,
893 Social_Network_Provider::SKYPE,
894 ],
895 ],
896 ],
897 );
898
899 $repeater->add_control(
900 'contact_icon_url',
901 [
902 'label' => esc_html__( 'Link', 'elementor' ),
903 'type' => Controls_Manager::URL,
904 'dynamic' => [
905 'active' => true,
906 ],
907 'ai' => [
908 'active' => false,
909 ],
910 'autocomplete' => true,
911 'label_block' => true,
912 'condition' => [
913 'contact_icon_platform' => [
914 Social_Network_Provider::URL,
915 ],
916 ],
917 'default' => [
918 'is_external' => true,
919 ],
920 'placeholder' => esc_html__( 'Paste URL or type', 'elementor' ),
921 ],
922 );
923
924 $repeater->add_control(
925 'contact_icon_waze',
926 [
927 'label' => esc_html__( 'Location', 'elementor' ),
928 'type' => Controls_Manager::URL,
929 'default' => [
930 'is_external' => true,
931 ],
932 'dynamic' => [
933 'active' => true,
934 ],
935 'label_block' => true,
936 'placeholder' => esc_html__( 'Paste Waze link', 'elementor' ),
937 'condition' => [
938 'contact_icon_platform' => [
939 Social_Network_Provider::WAZE,
940 ],
941 ],
942 'ai' => [
943 'active' => false,
944 ],
945 ],
946 );
947
948 $repeater->add_control(
949 'contact_icon_viber_action',
950 [
951 'label' => esc_html__( 'Action', 'elementor' ),
952 'type' => Controls_Manager::SELECT,
953 'default' => 'chat',
954 'dynamic' => [
955 'active' => true,
956 ],
957 'options' => [
958 'chat' => 'Chat',
959 'contact' => 'Contact',
960 ],
961 'condition' => [
962 'contact_icon_platform' => Social_Network_Provider::VIBER,
963 ],
964 ]
965 );
966
967 $this->add_control(
968 'contact_repeater',
969 [
970 'max_items' => $config['content']['contact_section']['platform']['limit'],
971 'min_items' => $config['content']['contact_section']['platform']['min_items'],
972 'type' => Controls_Manager::REPEATER,
973 'fields' => $repeater->get_controls(),
974 'title_field' => $this->get_icon_title_field(),
975 'prevent_empty' => true,
976 'button_text' => esc_html__( 'Add Item', 'elementor' ),
977 'default' => $config['content']['contact_section']['default'],
978 ]
979 );
980
981 $this->end_controls_section();
982 }
983
984 protected function get_icon_title_field(): string {
985 $platform_icons_js = json_encode( Social_Network_Provider::get_social_networks_icons() );
986 $platform_text_js = json_encode( Social_Network_Provider::get_social_networks_text() );
987
988 return <<<JS
989 <#
990 elementor.helpers.enqueueIconFonts( 'fa-solid' );
991 elementor.helpers.enqueueIconFonts( 'fa-brands' );
992 const mapping = {$platform_icons_js};
993 const text_mapping = {$platform_text_js};
994 #>
995 <i class='{{{ mapping[contact_icon_platform] }}}' ></i> {{{ text_mapping[contact_icon_platform] }}}
996 JS;
997 }
998
999 protected function add_send_button_section(): void {
1000 $config = static::get_configuration();
1001
1002 $this->start_controls_section(
1003 'send_button_section',
1004 [
1005 'label' => $config['content']['send_button_section']['section_name'],
1006 'tab' => Controls_Manager::TAB_CONTENT,
1007 ]
1008 );
1009
1010 $this->add_control(
1011 'send_button_text',
1012 [
1013 'label' => esc_html__( 'Text', 'elementor' ),
1014 'type' => Controls_Manager::TEXT,
1015 'default' => $config['content']['send_button_section']['text']['default'],
1016 'placeholder' => esc_html__( 'Type your text here', 'elementor' ),
1017 'dynamic' => [
1018 'active' => true,
1019 ],
1020 'ai' => [
1021 'active' => false,
1022 ],
1023 ]
1024 );
1025
1026 if ( $config['content']['send_button_section']['has_link'] ) {
1027 $this->add_control(
1028 'send_button_url',
1029 [
1030 'label' => esc_html__( 'Link', 'elementor' ),
1031 'type' => Controls_Manager::URL,
1032 'default' => [
1033 'is_external' => true,
1034 ],
1035 'dynamic' => [
1036 'active' => true,
1037 ],
1038 'ai' => [
1039 'active' => false,
1040 ],
1041 'autocomplete' => true,
1042 'label_block' => true,
1043 ],
1044 );
1045 }
1046
1047 $this->end_controls_section();
1048 }
1049
1050 protected function add_content_tab(): void {
1051 $this->add_chat_button_section();
1052
1053 $this->add_top_bar_section();
1054
1055 $this->add_message_bubble_section();
1056
1057 $this->add_send_button_section();
1058 }
1059
1060 private function get_platform_color_condition( $condition ) {
1061 $config = static::get_configuration();
1062
1063 if ( true == $config['style']['has_platform_colors'] ) {
1064 return $condition;
1065 }
1066
1067 return null;
1068 }
1069
1070 protected function add_style_chat_button_section(): void {
1071 $config = static::get_configuration();
1072
1073 $this->start_controls_section(
1074 'style_chat_button',
1075 [
1076 'label' => $config['content']['chat_button_section']['section_name'],
1077 'tab' => Controls_Manager::TAB_STYLE,
1078 ]
1079 );
1080
1081 if ( $config['style']['chat_button_section']['has_button_size'] ) {
1082 $this->add_control(
1083 'style_chat_button_size',
1084 [
1085 'label' => esc_html__( 'Size', 'elementor' ),
1086 'type' => Controls_Manager::SELECT,
1087 'default' => $config['style']['chat_button_section']['button_size_default'],
1088 'options' => [
1089 'small' => esc_html__( 'Small', 'elementor' ),
1090 'medium' => esc_html__( 'Medium', 'elementor' ),
1091 'large' => esc_html__( 'Large', 'elementor' ),
1092 ],
1093 ]
1094 );
1095 }
1096
1097 if ( $config['style']['chat_button_section']['has_icon_position'] ) {
1098 $this->add_responsive_control(
1099 'style_chat_button_horizontal_position',
1100 [
1101 'label' => esc_html__( 'Icon Position', 'elementor' ),
1102 'type' => Controls_Manager::CHOOSE,
1103 'options' => [
1104 'start' => [
1105 'title' => esc_html__( 'Left', 'elementor' ),
1106 'icon' => 'eicon-h-align-left',
1107 ],
1108 'end' => [
1109 'title' => esc_html__( 'Right', 'elementor' ),
1110 'icon' => 'eicon-h-align-right',
1111 ],
1112 ],
1113 'default' => 'start',
1114 'toggle' => true,
1115 ]
1116 );
1117 }
1118
1119 if ( $config['style']['chat_button_section']['has_icon_spacing'] ) {
1120 $this->add_responsive_control(
1121 'style_chat_button_spacing',
1122 [
1123 'label' => esc_html__( 'Icon Spacing', 'elementor' ),
1124 'type' => Controls_Manager::SLIDER,
1125 'range' => [
1126 '%' => [
1127 'min' => 10,
1128 'max' => 100,
1129 ],
1130 'px' => [
1131 'min' => 0,
1132 'max' => 100,
1133 ],
1134 ],
1135 'default' => [
1136 'unit' => 'px',
1137 'size' => 8,
1138 ],
1139 'size_units' => [ 'px', '%', 'em', 'rem', 'vw', 'custom' ],
1140 'selectors' => [
1141 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-chat-button-gap: {{SIZE}}{{UNIT}}',
1142 ],
1143 'separator' => 'before',
1144 ]
1145 );
1146 }
1147
1148 if ( $config['style']['chat_button_section']['has_typography'] ) {
1149 $this->add_group_control(
1150 Group_Control_Typography::get_type(),
1151 [
1152 'name' => 'style_top_bar_title_typography',
1153 'selector' => '{{WRAPPER}} .e-contact-buttons__chat-button',
1154 ]
1155 );
1156 }
1157
1158 if ( $config['style']['chat_button_section']['has_tabs'] ) {
1159 $this->start_controls_tabs(
1160 'style_button_color_tabs'
1161 );
1162
1163 $this->start_controls_tab(
1164 'style_button_color_tabs_normal',
1165 [
1166 'label' => esc_html__( 'Normal', 'elementor' ),
1167 ]
1168 );
1169
1170 if ( $config['style']['has_platform_colors'] ) {
1171 $this->add_control(
1172 'style_button_color_select',
1173 [
1174 'label' => esc_html__( 'Colors', 'elementor' ),
1175 'type' => Controls_Manager::SELECT,
1176 'default' => 'default',
1177 'options' => [
1178 'default' => esc_html__( 'Default', 'elementor' ),
1179 'custom' => esc_html__( 'Custom', 'elementor' ),
1180 ],
1181 ]
1182 );
1183 }
1184
1185 $this->add_control(
1186 'style_button_color_icon',
1187 [
1188 'label' => $config['style']['chat_button_section']['icon_color_label'],
1189 'type' => Controls_Manager::COLOR,
1190 'selectors' => [
1191 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-button-icon: {{VALUE}}',
1192 ],
1193 'condition' => $this->get_platform_color_condition( [
1194 'style_button_color_select' => 'custom',
1195 ] ),
1196 ]
1197 );
1198
1199 $this->add_control(
1200 'style_button_color_background',
1201 [
1202 'label' => esc_html__( 'Background Color', 'elementor' ),
1203 'type' => Controls_Manager::COLOR,
1204 'selectors' => [
1205 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-button-bg: {{VALUE}}',
1206 ],
1207 'condition' => $this->get_platform_color_condition( [
1208 'style_button_color_select' => 'custom',
1209 ] ),
1210 ]
1211 );
1212
1213 $this->end_controls_tab();
1214
1215 $this->start_controls_tab(
1216 'style_button_color_tabs_hover',
1217 [
1218 'label' => esc_html__( 'Hover', 'elementor' ),
1219 ]
1220 );
1221
1222 if ( $config['style']['has_platform_colors'] ) {
1223 $this->add_control(
1224 'style_button_color_select_hover',
1225 [
1226 'label' => esc_html__( 'Colors', 'elementor' ),
1227 'type' => Controls_Manager::SELECT,
1228 'default' => 'default',
1229 'options' => [
1230 'default' => esc_html__( 'Default', 'elementor' ),
1231 'custom' => esc_html__( 'Custom', 'elementor' ),
1232 ],
1233 ]
1234 );
1235 }
1236
1237 $this->add_control(
1238 'style_button_color_icon_hover',
1239 [
1240 'label' => $config['style']['chat_button_section']['icon_color_label'],
1241 'type' => Controls_Manager::COLOR,
1242 'selectors' => [
1243 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-button-icon-hover: {{VALUE}}',
1244 ],
1245 'condition' => $this->get_platform_color_condition( [
1246 'style_button_color_select_hover' => 'custom',
1247 ] ),
1248 ]
1249 );
1250
1251 $this->add_control(
1252 'style_button_color_background_hover',
1253 [
1254 'label' => esc_html__( 'Background Color', 'elementor' ),
1255 'type' => Controls_Manager::COLOR,
1256 'selectors' => [
1257 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-button-bg-hover: {{VALUE}}',
1258 ],
1259 'condition' => $this->get_platform_color_condition( [
1260 'style_button_color_select_hover' => 'custom',
1261 ] ),
1262 ]
1263 );
1264
1265 if ( 'default' == $config['style']['chat_button_section']['hover_animation_type'] ) {
1266 $this->add_hover_animation_control(
1267 'style_button_color_hover_animation',
1268 );
1269 }
1270
1271 $this->end_controls_tab();
1272
1273 if ( $config['content']['chat_button_section']['has_active_tab'] ) {
1274 $this->start_controls_tab(
1275 'style_button_color_tabs_active',
1276 [
1277 'label' => esc_html__( 'Active', 'elementor' ),
1278 ]
1279 );
1280
1281 $this->add_control(
1282 'style_button_color_icon_active',
1283 [
1284 'label' => esc_html__( 'Icon Color', 'elementor' ),
1285 'type' => Controls_Manager::COLOR,
1286 'selectors' => [
1287 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-active-button-color: {{VALUE}}',
1288 ],
1289 ]
1290 );
1291
1292 $this->add_control(
1293 'style_button_color_background_active',
1294 [
1295 'label' => esc_html__( 'Background Color', 'elementor' ),
1296 'type' => Controls_Manager::COLOR,
1297 'selectors' => [
1298 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-active-button-bg: {{VALUE}}',
1299 ],
1300 ]
1301 );
1302
1303 $this->end_controls_tab();
1304 }
1305
1306 $this->end_controls_tabs();
1307 }
1308
1309 if ( $config['style']['chat_button_section']['has_platform_color_controls'] ) {
1310 $this->add_control(
1311 'style_platform_control_select',
1312 [
1313 'label' => esc_html__( 'Colors', 'elementor' ),
1314 'type' => Controls_Manager::SELECT,
1315 'default' => 'default',
1316 'options' => [
1317 'default' => esc_html__( 'Default', 'elementor' ),
1318 'custom' => esc_html__( 'Custom', 'elementor' ),
1319 ],
1320 'separator' => 'before',
1321 ]
1322 );
1323
1324 $this->add_control(
1325 'style_button_color_icon',
1326 [
1327 'label' => $config['style']['chat_button_section']['icon_color_label'],
1328 'type' => Controls_Manager::COLOR,
1329 'selectors' => [
1330 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-button-icon: {{VALUE}}',
1331 ],
1332 'condition' => [
1333 'style_platform_control_select' => 'custom',
1334 ],
1335 ]
1336 );
1337
1338 $this->add_control(
1339 'style_button_color_background',
1340 [
1341 'label' => esc_html__( 'Background Color', 'elementor' ),
1342 'type' => Controls_Manager::COLOR,
1343 'selectors' => [
1344 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-button-bg: {{VALUE}}',
1345 ],
1346 'condition' => [
1347 'style_platform_control_select' => 'custom',
1348 ],
1349 ]
1350 );
1351 }
1352
1353 if ( $config['style']['chat_button_section']['has_entrance_animation'] ) {
1354 $this->add_responsive_control(
1355 'style_chat_button_animation',
1356 [
1357 'label' => esc_html__( 'Entrance Animation', 'elementor' ),
1358 'type' => Controls_Manager::ANIMATION,
1359 'frontend_available' => true,
1360 'separator' => 'before',
1361 ]
1362 );
1363
1364 $this->add_control(
1365 'style_chat_button_animation_duration',
1366 [
1367 'label' => esc_html__( 'Animation Duration', 'elementor' ),
1368 'type' => Controls_Manager::SELECT,
1369 'default' => 'normal',
1370 'options' => [
1371 'slow' => esc_html__( 'Slow', 'elementor' ),
1372 'normal' => esc_html__( 'Normal', 'elementor' ),
1373 'fast' => esc_html__( 'Fast', 'elementor' ),
1374 ],
1375 'prefix_class' => 'animated-',
1376 ]
1377 );
1378
1379 $this->add_control(
1380 'style_chat_button_animation_delay',
1381 [
1382 'label' => esc_html__( 'Animation Delay', 'elementor' ) . ' (ms)',
1383 'type' => Controls_Manager::NUMBER,
1384 'default' => 0,
1385 'min' => 0,
1386 'step' => 100,
1387 'selectors' => [
1388 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-button-chat-button-animation-delay: {{SIZE}}ms;',
1389 ],
1390 'render_type' => 'none',
1391 'frontend_available' => true,
1392 'separator' => 'after',
1393 ]
1394 );
1395 }
1396
1397 if ( $config['style']['chat_button_section']['has_box_shadow'] ) {
1398 $this->add_group_control(
1399 Group_Control_Box_Shadow::get_type(),
1400 [
1401 'name' => 'style_chat_button_box_shadow',
1402 'selector' => '{{WRAPPER}} .e-contact-buttons__chat-button-shadow',
1403 'fields_options' => static::BOX_SHADOW_FIELDS_OPTIONS,
1404 ]
1405 );
1406 }
1407
1408 if ( $config['style']['chat_button_section']['has_drop_shadow'] ) {
1409 $this->add_group_control(
1410 Group_Control_Box_Shadow::get_type(),
1411 [
1412 'name' => 'style_chat_button_box_shadow',
1413 'fields_options' => [
1414 'box_shadow_type' => [
1415 'default' => 'yes',
1416 ],
1417 'box_shadow' => [
1418 'default' => [
1419 'horizontal' => 4,
1420 'vertical' => 4,
1421 'blur' => 10,
1422 'spread' => 0,
1423 'color' => 'rgba(0,0,0,0.15)',
1424 ],
1425 'selectors' => [
1426 '{{WRAPPER}} .e-contact-buttons__chat-button-drop-shadow' => 'filter: drop-shadow({{HORIZONTAL}}px {{VERTICAL}}px {{BLUR}}px {{COLOR}});',
1427 ],
1428 ],
1429 ],
1430 ]
1431 );
1432 }
1433
1434 if ( $config['style']['chat_button_section']['has_padding'] ) {
1435 $this->add_responsive_control(
1436 'style_chat_button_padding',
1437 [
1438 'label' => esc_html__( 'Padding', 'elementor' ),
1439 'type' => Controls_Manager::DIMENSIONS,
1440 'size_units' => [ 'px', '%', 'em', 'rem' ],
1441 'default' => $config['style']['chat_button_section']['padding_defaults'],
1442 'selectors' => [
1443 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-chat-button-padding-block-end: {{BOTTOM}}{{UNIT}}; --e-contact-buttons-chat-button-padding-block-start: {{TOP}}{{UNIT}}; --e-contact-buttons-chat-button-padding-inline-end: {{RIGHT}}{{UNIT}}; --e-contact-buttons-chat-button-padding-inline-start: {{LEFT}}{{UNIT}};',
1444 ],
1445 'separator' => 'before',
1446 ]
1447 );
1448 }
1449
1450 if ( 'custom' == $config['style']['chat_button_section']['hover_animation_type'] ) {
1451 $this->add_control(
1452 'style_chat_button_custom_animation_heading',
1453 [
1454 'label' => esc_html__( 'Hover Animation', 'elementor' ),
1455 'type' => Controls_Manager::HEADING,
1456 'separator' => 'before',
1457 ]
1458 );
1459
1460 $this->add_control(
1461 'style_chat_button_custom_animation_alert',
1462 [
1463 'type' => Controls_Manager::ALERT,
1464 'alert_type' => 'info',
1465 'content' => __( 'Hover animation is <b>desktop only</b>', 'elementor' ),
1466 ]
1467 );
1468
1469 $this->add_control(
1470 'style_chat_button_custom_animation_transition',
1471 [
1472 'label' => esc_html__( 'Transition Duration', 'elementor' ) . ' (s)',
1473 'type' => Controls_Manager::SLIDER,
1474 'range' => [
1475 's' => [
1476 'min' => 0,
1477 'max' => 3,
1478 'step' => 0.1,
1479 ],
1480 ],
1481 'default' => [
1482 'unit' => 's',
1483 'size' => 0.3,
1484 ],
1485 'selectors' => [
1486 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-transition-duration: {{SIZE}}{{UNIT}}',
1487 ],
1488 ]
1489 );
1490 }
1491
1492 $this->end_controls_section();
1493 }
1494
1495 protected function add_style_top_bar_section(): void {
1496 $config = static::get_configuration();
1497
1498 $this->start_controls_section(
1499 'style_top_bar_section',
1500 [
1501 'label' => $config['content']['top_bar_section']['section_name'],
1502 'tab' => Controls_Manager::TAB_STYLE,
1503 ]
1504 );
1505
1506 if ( $config['content']['top_bar_section']['has_image'] ) {
1507 $this->add_control(
1508 'style_top_bar_profile_heading',
1509 [
1510 'label' => esc_html__( 'Profile Image', 'elementor' ),
1511 'type' => Controls_Manager::HEADING,
1512 'separator' => 'before',
1513 ]
1514 );
1515
1516 $this->add_control(
1517 'style_top_bar_image_size',
1518 [
1519 'label' => esc_html__( 'Size', 'elementor' ),
1520 'type' => Controls_Manager::SELECT,
1521 'default' => 'medium',
1522 'options' => [
1523 'small' => esc_html__( 'Small', 'elementor' ),
1524 'medium' => esc_html__( 'Medium', 'elementor' ),
1525 'large' => esc_html__( 'Large', 'elementor' ),
1526 ],
1527 ]
1528 );
1529 }
1530
1531 if ( $config['style']['has_platform_colors'] ) {
1532 $this->add_control(
1533 'style_top_bar_colors',
1534 [
1535 'label' => esc_html__( 'Colors', 'elementor' ),
1536 'type' => Controls_Manager::SELECT,
1537 'default' => 'default',
1538 'options' => [
1539 'default' => esc_html__( 'Default', 'elementor' ),
1540 'custom' => esc_html__( 'Custom', 'elementor' ),
1541 ],
1542 'separator' => 'before',
1543 ]
1544 );
1545 }
1546
1547 if ( $config['style']['top_bar_section']['has_title_heading'] ) {
1548 $this->add_control(
1549 'style_top_bar_title_heading',
1550 [
1551 'label' => $config['style']['top_bar_section']['title_heading_label'],
1552 'type' => Controls_Manager::HEADING,
1553 'separator' => ! $config['style']['has_platform_colors'] ? 'before' : false,
1554 ]
1555 );
1556 }
1557
1558 $this->add_control(
1559 'style_top_bar_title_color',
1560 [
1561 'label' => esc_html__( 'Text Color', 'elementor' ),
1562 'type' => Controls_Manager::COLOR,
1563 'selectors' => [
1564 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-top-bar-title: {{VALUE}}',
1565 ],
1566 'condition' => $this->get_platform_color_condition( [
1567 'style_top_bar_colors' => 'custom',
1568 ] ),
1569 ]
1570 );
1571
1572 $this->add_group_control(
1573 Group_Control_Typography::get_type(),
1574 [
1575 'name' => 'style_top_bar_title_typography',
1576 'selector' => '{{WRAPPER}} .e-contact-buttons__top-bar-title',
1577 ]
1578 );
1579
1580 if ( $config['content']['top_bar_section']['has_subtitle'] ) {
1581 $this->add_control(
1582 'style_top_bar_subtitle_heading',
1583 [
1584 'label' => $config['style']['top_bar_section']['subtitle_heading_label'],
1585 'type' => Controls_Manager::HEADING,
1586 'separator' => false,
1587 ]
1588 );
1589
1590 $this->add_control(
1591 'style_top_bar_subtitle_color',
1592 [
1593 'label' => esc_html__( 'Text Color', 'elementor' ),
1594 'type' => Controls_Manager::COLOR,
1595 'selectors' => [
1596 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-top-bar-subtitle: {{VALUE}}',
1597 ],
1598 'condition' => $this->get_platform_color_condition( [
1599 'style_top_bar_colors' => 'custom',
1600 ] ),
1601 ]
1602 );
1603
1604 $this->add_group_control(
1605 Group_Control_Typography::get_type(),
1606 [
1607 'name' => 'style_top_bar_subtitle_typography',
1608 'selector' => '{{WRAPPER}} .e-contact-buttons__top-bar-subtitle',
1609 ]
1610 );
1611 }
1612
1613 $close_and_background_partial_divider = 'before';
1614
1615 if ( $config['style']['top_bar_section']['has_style_close_button'] ) {
1616
1617 if ( $config['style']['top_bar_section']['has_close_button_heading'] ) {
1618 $this->add_control(
1619 'style_top_bar_close_button_heading',
1620 [
1621 'label' => esc_html__( 'Close Button', 'elementor' ),
1622 'type' => Controls_Manager::HEADING,
1623 'separator' => $close_and_background_partial_divider,
1624 'condition' => $this->get_platform_color_condition( [
1625 'style_top_bar_colors' => 'custom',
1626 ] ),
1627 ]
1628 );
1629 $close_and_background_partial_divider = false;
1630 }
1631
1632 $this->add_control(
1633 'style_top_bar_close_button_color',
1634 [
1635 'label' => esc_html__( 'Close Button Color', 'elementor' ),
1636 'type' => Controls_Manager::COLOR,
1637 'selectors' => [
1638 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-close-button-color: {{VALUE}}',
1639 ],
1640 'condition' => $this->get_platform_color_condition( [
1641 'style_top_bar_colors' => 'custom',
1642 ] ),
1643 'separator' => $close_and_background_partial_divider,
1644 ]
1645 );
1646
1647 $close_and_background_partial_divider = false;
1648 }
1649
1650 if ( $config['style']['top_bar_section']['has_background'] ) {
1651
1652 if ( $config['style']['top_bar_section']['has_background_heading'] ) {
1653 $this->add_control(
1654 'style_top_bar_background_heading',
1655 [
1656 'label' => esc_html__( 'Background', 'elementor' ),
1657 'type' => Controls_Manager::HEADING,
1658 'separator' => $close_and_background_partial_divider,
1659 'condition' => $this->get_platform_color_condition( [
1660 'style_top_bar_colors' => 'custom',
1661 ] ),
1662 ]
1663 );
1664 $close_and_background_partial_divider = false;
1665 }
1666
1667 $this->add_control(
1668 'style_top_bar_background_color',
1669 [
1670 'label' => esc_html__( 'Background Color', 'elementor' ),
1671 'type' => Controls_Manager::COLOR,
1672 'selectors' => [
1673 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-top-bar-bg: {{VALUE}}',
1674 ],
1675 'condition' => $this->get_platform_color_condition( [
1676 'style_top_bar_colors' => 'custom',
1677 ] ),
1678 'separator' => $close_and_background_partial_divider,
1679 ]
1680 );
1681 }
1682
1683 $this->end_controls_section();
1684 }
1685
1686 protected function add_style_message_bubble_section(): void {
1687 $config = static::get_configuration();
1688
1689 $this->start_controls_section(
1690 'style_bubble_section',
1691 [
1692 'label' => esc_html__( 'Message Bubble', 'elementor' ),
1693 'tab' => Controls_Manager::TAB_STYLE,
1694 ]
1695 );
1696
1697 if ( $config['style']['has_platform_colors'] ) {
1698 $this->add_control(
1699 'style_bubble_colors',
1700 [
1701 'label' => esc_html__( 'Colors', 'elementor' ),
1702 'type' => Controls_Manager::SELECT,
1703 'default' => 'default',
1704 'options' => [
1705 'default' => esc_html__( 'Default', 'elementor' ),
1706 'custom' => esc_html__( 'Custom', 'elementor' ),
1707 ],
1708 ]
1709 );
1710 }
1711
1712 $this->add_control(
1713 'style_bubble_name_heading',
1714 [
1715 'label' => esc_html__( 'Name', 'elementor' ),
1716 'type' => Controls_Manager::HEADING,
1717 'separator' => false,
1718 ]
1719 );
1720
1721 $this->add_control(
1722 'style_bubble_name_color',
1723 [
1724 'label' => esc_html__( 'Text Color', 'elementor' ),
1725 'type' => Controls_Manager::COLOR,
1726 'selectors' => [
1727 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-message-bubble-name: {{VALUE}}',
1728 ],
1729 'condition' => $this->get_platform_color_condition( [
1730 'style_bubble_colors' => 'custom',
1731 ] ),
1732 ]
1733 );
1734
1735 $this->add_group_control(
1736 Group_Control_Typography::get_type(),
1737 [
1738 'name' => 'style_bubble_name_typography',
1739 'selector' => '{{WRAPPER}} .e-contact-buttons__message-bubble-name',
1740 ]
1741 );
1742
1743 $this->add_control(
1744 'style_bubble_message_heading',
1745 [
1746 'label' => esc_html__( 'Message', 'elementor' ),
1747 'type' => Controls_Manager::HEADING,
1748 'separator' => false,
1749 ]
1750 );
1751
1752 $this->add_control(
1753 'style_bubble_message_color',
1754 [
1755 'label' => esc_html__( 'Text Color', 'elementor' ),
1756 'type' => Controls_Manager::COLOR,
1757 'selectors' => [
1758 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-message-bubble-body: {{VALUE}}',
1759 ],
1760 'condition' => $this->get_platform_color_condition( [
1761 'style_bubble_colors' => 'custom',
1762 ] ),
1763 ]
1764 );
1765
1766 $this->add_group_control(
1767 Group_Control_Typography::get_type(),
1768 [
1769 'name' => 'style_bubble_message_typography',
1770 'selector' => '{{WRAPPER}} .e-contact-buttons__message-bubble-body',
1771 ]
1772 );
1773
1774 $this->add_control(
1775 'style_bubble_time_heading',
1776 [
1777 'label' => esc_html__( 'Time', 'elementor' ),
1778 'type' => Controls_Manager::HEADING,
1779 'separator' => false,
1780 ]
1781 );
1782
1783 $this->add_control(
1784 'style_bubble_time_color',
1785 [
1786 'label' => esc_html__( 'Text Color', 'elementor' ),
1787 'type' => Controls_Manager::COLOR,
1788 'selectors' => [
1789 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-message-bubble-time: {{VALUE}}',
1790 ],
1791 'condition' => $this->get_platform_color_condition( [
1792 'style_bubble_colors' => 'custom',
1793 ] ),
1794 ]
1795 );
1796
1797 $this->add_group_control(
1798 Group_Control_Typography::get_type(),
1799 [
1800 'name' => 'style_bubble_time_typography',
1801 'selector' => '{{WRAPPER}} .e-contact-buttons__message-bubble-time',
1802 ]
1803 );
1804
1805 $this->add_control(
1806 'style_bubble_background_color',
1807 [
1808 'label' => esc_html__( 'Bubble Background Color', 'elementor' ),
1809 'type' => Controls_Manager::COLOR,
1810 'selectors' => [
1811 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-message-bubble-bubble-bg: {{VALUE}}',
1812 ],
1813 'condition' => $this->get_platform_color_condition( [
1814 'style_bubble_colors' => 'custom',
1815 ] ),
1816 'separator' => 'before',
1817 ]
1818 );
1819
1820 if ( $config['style']['message_bubble_section']['has_chat_background'] ) {
1821 $this->add_control(
1822 'style_bubble_chat_color',
1823 [
1824 'label' => esc_html__( 'Chat Background Color', 'elementor' ),
1825 'type' => Controls_Manager::COLOR,
1826 'selectors' => [
1827 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-message-bubble-chat-bg: {{VALUE}}',
1828 ],
1829 'condition' => $this->get_platform_color_condition( [
1830 'style_bubble_colors' => 'custom',
1831 ] ),
1832 ]
1833 );
1834 }
1835
1836 $this->end_controls_section();
1837 }
1838
1839 protected function add_style_contact_section(): void {
1840 $config = static::get_configuration();
1841
1842 $this->start_controls_section(
1843 'style_contact_section',
1844 [
1845 'label' => $config['content']['contact_section']['section_name'],
1846 'tab' => Controls_Manager::TAB_STYLE,
1847 ]
1848 );
1849
1850 if ( $config['content']['contact_section']['has_cta_text'] ) {
1851 $this->add_control(
1852 'style_contact_text_heading',
1853 [
1854 'label' => esc_html__( 'Call to Action Text', 'elementor' ),
1855 'type' => Controls_Manager::HEADING,
1856 'separator' => false,
1857 'condition' => $this->get_platform_color_condition( [
1858 'style_bubble_colors' => 'custom',
1859 ] ),
1860 ]
1861 );
1862
1863 $this->add_control(
1864 'style_contact_text_color',
1865 [
1866 'label' => esc_html__( 'Color', 'elementor' ),
1867 'type' => Controls_Manager::COLOR,
1868 'selectors' => [
1869 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-contact-text: {{VALUE}}',
1870 ],
1871 ]
1872 );
1873
1874 $this->add_group_control(
1875 Group_Control_Typography::get_type(),
1876 [
1877 'name' => 'style_contact_text_typography',
1878 'selector' => '{{WRAPPER}} .e-contact-buttons__contact-text',
1879 ]
1880 );
1881 }
1882
1883 if ( $config['style']['contact_section']['has_buttons_heading'] ) {
1884 $this->add_control(
1885 'style_contact_buttons_heading',
1886 [
1887 'label' => $config['style']['contact_section']['buttons_heading_label'],
1888 'type' => Controls_Manager::HEADING,
1889 'separator' => false,
1890 'condition' => $this->get_platform_color_condition( [
1891 'style_bubble_colors' => 'custom',
1892 ] ),
1893 ]
1894 );
1895 }
1896
1897 if ( $config['style']['contact_section']['has_buttons_size'] ) {
1898 $this->add_control(
1899 'style_contact_button_size',
1900 [
1901 'label' => esc_html__( 'Size', 'elementor' ),
1902 'type' => Controls_Manager::SELECT,
1903 'default' => 'small',
1904 'options' => [
1905 'small' => esc_html__( 'Small', 'elementor' ),
1906 'medium' => esc_html__( 'Medium', 'elementor' ),
1907 'large' => esc_html__( 'Large', 'elementor' ),
1908 ],
1909 ]
1910 );
1911 }
1912
1913 if ( $config['style']['contact_section']['has_text_color'] ) {
1914 $this->add_control(
1915 'style_contact_button_text_color',
1916 [
1917 'label' => $config['style']['contact_section']['icon_color_label'],
1918 'type' => Controls_Manager::COLOR,
1919 'selectors' => [
1920 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-contact-button-icon: {{VALUE}}',
1921 ],
1922 ]
1923 );
1924 }
1925
1926 if ( $config['style']['contact_section']['has_typography'] ) {
1927 $this->add_group_control(
1928 Group_Control_Typography::get_type(),
1929 [
1930 'name' => 'style_contact_typography',
1931 'selector' => '{{WRAPPER}} .e-contact-buttons__contact-icon-link',
1932 ]
1933 );
1934 }
1935
1936 if ( $config['style']['contact_section']['has_bg_color'] ) {
1937 $this->add_control(
1938 'style_contact_button_bg_color',
1939 [
1940 'label' => esc_html__( 'Background Color', 'elementor' ),
1941 'type' => Controls_Manager::COLOR,
1942 'selectors' => [
1943 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-contact-button-bg: {{VALUE}}',
1944 ],
1945 ]
1946 );
1947 }
1948
1949 if ( $config['style']['contact_section']['has_tabs'] ) {
1950 $this->start_controls_tabs(
1951 'style_contact_button_color_tabs'
1952 );
1953
1954 $this->start_controls_tab(
1955 'style_contact_button_color_tabs_normal',
1956 [
1957 'label' => esc_html__( 'Normal', 'elementor' ),
1958 ]
1959 );
1960
1961 $this->add_control(
1962 'style_contact_button_color_icon',
1963 [
1964 'label' => $config['style']['contact_section']['icon_color_label'],
1965 'type' => Controls_Manager::COLOR,
1966 'selectors' => [
1967 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-contact-button-icon: {{VALUE}}',
1968 ],
1969 ]
1970 );
1971
1972 if ( $config['style']['contact_section']['has_icon_bg_color'] ) {
1973 $this->add_control(
1974 'style_contact_button_color_background',
1975 [
1976 'label' => esc_html__( 'Background Color', 'elementor' ),
1977 'type' => Controls_Manager::COLOR,
1978 'selectors' => [
1979 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-contact-button-bg: {{VALUE}}',
1980 ],
1981 ]
1982 );
1983 }
1984
1985 $this->end_controls_tab();
1986
1987 $this->start_controls_tab(
1988 'style_contact_button_color_tabs_hover',
1989 [
1990 'label' => esc_html__( 'Hover', 'elementor' ),
1991 ]
1992 );
1993
1994 $this->add_control(
1995 'style_contact_button_color_icon_hover',
1996 [
1997 'label' => esc_html__( 'Icon Color', 'elementor' ),
1998 'type' => Controls_Manager::COLOR,
1999 'selectors' => [
2000 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-contact-button-icon-hover: {{VALUE}}',
2001 ],
2002 ]
2003 );
2004
2005 if ( $config['style']['contact_section']['has_icon_bg_color'] ) {
2006 $this->add_control(
2007 'style_contact_button_color_background_hover',
2008 [
2009 'label' => esc_html__( 'Background Color', 'elementor' ),
2010 'type' => Controls_Manager::COLOR,
2011 'selectors' => [
2012 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-contact-button-bg-hover: {{VALUE}}',
2013 ],
2014 ]
2015 );
2016 }
2017
2018 if ( $config['style']['contact_section']['has_hover_animation'] ) {
2019 $this->add_hover_animation_control(
2020 'style_contact_button_hover_animation',
2021 );
2022 }
2023
2024 $this->end_controls_tab();
2025
2026 $this->end_controls_tabs();
2027 }
2028
2029 if ( $config['style']['contact_section']['has_buttons_spacing'] ) {
2030
2031 $this->add_responsive_control(
2032 'style_contact_buttons_spacing',
2033 [
2034 'label' => esc_html__( 'Buttons Spacing', 'elementor' ),
2035 'type' => Controls_Manager::SLIDER,
2036 'range' => [
2037 '%' => [
2038 'min' => 10,
2039 'max' => 100,
2040 ],
2041 'px' => [
2042 'min' => 0,
2043 'max' => 100,
2044 ],
2045 ],
2046 'default' => $config['style']['contact_section']['buttons_spacing_default'],
2047 'size_units' => [ 'px', '%', 'em', 'rem', 'vw', 'custom' ],
2048 'selectors' => [
2049 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-contact-gap: {{SIZE}}{{UNIT}}',
2050 ],
2051 'separator' => 'before',
2052 ]
2053 );
2054 }
2055
2056 if ( $config['style']['contact_section']['has_button_corners'] ) {
2057 $this->add_control(
2058 'style_contact_corners',
2059 [
2060 'label' => esc_html__( 'Corners', 'elementor' ),
2061 'type' => Controls_Manager::SELECT,
2062 'default' => 'round',
2063 'options' => [
2064 'round' => esc_html__( 'Round', 'elementor' ),
2065 'rounded' => esc_html__( 'Rounded', 'elementor' ),
2066 'sharp' => esc_html__( 'Sharp', 'elementor' ),
2067 ],
2068 ]
2069 );
2070 }
2071
2072 if ( $config['style']['contact_section']['has_box_shadow'] ) {
2073 $this->add_group_control(
2074 Group_Control_Box_Shadow::get_type(),
2075 [
2076 'name' => 'style_contact_icons_box_shadow',
2077 'selector' => '{{WRAPPER}} .e-contact-buttons__contact-box-shadow',
2078 'fields_options' => static::BOX_SHADOW_FIELDS_OPTIONS,
2079 ]
2080 );
2081 }
2082
2083 if ( $config['content']['contact_section']['repeater']['has_tooltip'] ) {
2084 $this->add_control(
2085 'style_contact_tooltip_heading',
2086 [
2087 'label' => esc_html__( 'Tooltips', 'elementor' ),
2088 'type' => Controls_Manager::HEADING,
2089 'separator' => 'before',
2090 ]
2091 );
2092
2093 $this->add_control(
2094 'style_contact_tooltip_text_color',
2095 [
2096 'label' => esc_html__( 'Text Color', 'elementor' ),
2097 'type' => Controls_Manager::COLOR,
2098 'selectors' => [
2099 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-tooltip-text: {{VALUE}}',
2100 ],
2101 ]
2102 );
2103
2104 $this->add_group_control(
2105 Group_Control_Typography::get_type(),
2106 [
2107 'name' => 'style_contact_tooltip_typography',
2108 'selector' => '{{WRAPPER}} .e-contact-buttons__contact-tooltip',
2109 ]
2110 );
2111
2112 $this->add_control(
2113 'style_contact_tooltip_bg_color',
2114 [
2115 'label' => esc_html__( 'Background Color', 'elementor' ),
2116 'type' => Controls_Manager::COLOR,
2117 'selectors' => [
2118 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-tooltip-bg: {{VALUE}}',
2119 ],
2120 ]
2121 );
2122 }
2123
2124 if ( $config['style']['contact_section']['has_chat_box_animation'] ) {
2125 $this->chat_box_animation_controls();
2126 }
2127
2128 if ( $config['style']['contact_section']['has_button_bar'] ) {
2129 $this->add_control(
2130 'style_contact_button_bar_heading',
2131 [
2132 'label' => esc_html__( 'Button Bar', 'elementor' ),
2133 'type' => Controls_Manager::HEADING,
2134 'separator' => 'before',
2135 ]
2136 );
2137
2138 $this->add_control(
2139 'style_contact_button_bar_bg_color',
2140 [
2141 'label' => esc_html__( 'Background Color', 'elementor' ),
2142 'type' => Controls_Manager::COLOR,
2143 'selectors' => [
2144 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-button-bar-bg: {{VALUE}}',
2145 ],
2146 ]
2147 );
2148
2149 $this->add_control(
2150 'style_contact_button_bar_corners',
2151 [
2152 'label' => esc_html__( 'Corners', 'elementor' ),
2153 'type' => Controls_Manager::SELECT,
2154 'default' => 'round',
2155 'options' => [
2156 'round' => esc_html__( 'Round', 'elementor' ),
2157 'rounded' => esc_html__( 'Rounded', 'elementor' ),
2158 'sharp' => esc_html__( 'Sharp', 'elementor' ),
2159 ],
2160 ]
2161 );
2162
2163 $this->add_responsive_control(
2164 'style_contact_button_bar_padding',
2165 [
2166 'label' => esc_html__( 'Padding', 'elementor' ),
2167 'type' => Controls_Manager::DIMENSIONS,
2168 'size_units' => [ 'px', '%', 'em', 'rem' ],
2169 'default' => [
2170 'top' => '12',
2171 'bottom' => '12',
2172 'left' => '12',
2173 'right' => '12',
2174 'unit' => 'px',
2175 'isLinked' => true,
2176 ],
2177 'selectors' => [
2178 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-button-bar-padding-block-end: {{BOTTOM}}{{UNIT}}; --e-contact-buttons-button-bar-padding-block-start: {{TOP}}{{UNIT}}; --e-contact-buttons-button-bar-padding-inline-end: {{RIGHT}}{{UNIT}}; --e-contact-buttons-button-bar-padding-inline-start: {{LEFT}}{{UNIT}};',
2179 ],
2180 'separator' => 'before',
2181 ]
2182 );
2183 }
2184
2185 if ( $config['style']['contact_section']['has_padding'] ) {
2186 $this->add_responsive_control(
2187 'style_contact_padding',
2188 [
2189 'label' => esc_html__( 'Padding', 'elementor' ),
2190 'type' => Controls_Manager::DIMENSIONS,
2191 'size_units' => [ 'px', '%', 'em', 'rem' ],
2192 'default' => [
2193 'top' => '8',
2194 'bottom' => '8',
2195 'left' => '12',
2196 'right' => '12',
2197 'unit' => 'px',
2198 'isLinked' => false,
2199 ],
2200 'selectors' => [
2201 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-contact-padding-block-end: {{BOTTOM}}{{UNIT}}; --e-contact-buttons-contact-padding-block-start: {{TOP}}{{UNIT}}; --e-contact-buttons-contact-padding-inline-end: {{RIGHT}}{{UNIT}}; --e-contact-buttons-contact-padding-inline-start: {{LEFT}}{{UNIT}};',
2202 ],
2203 'separator' => 'before',
2204 ]
2205 );
2206 }
2207
2208 if ( $config['style']['contact_section']['has_hover_transition_duration'] ) {
2209 $this->add_control(
2210 'style_contact_custom_animation_heading',
2211 [
2212 'label' => esc_html__( 'Animation', 'elementor' ),
2213 'type' => Controls_Manager::HEADING,
2214 ]
2215 );
2216
2217 $this->add_control(
2218 'style_contact_custom_animation_alert',
2219 [
2220 'type' => Controls_Manager::ALERT,
2221 'alert_type' => 'info',
2222 'content' => __( 'Adjust transition duration to change the speed of the <b>hover animation on desktop</b> and the <b>click animation on touchscreen</b>.', 'elementor' ),
2223 ]
2224 );
2225
2226 $this->add_control(
2227 'style_contact_custom_animation_transition',
2228 [
2229 'label' => esc_html__( 'Transition Duration', 'elementor' ) . ' (s)',
2230 'type' => Controls_Manager::SLIDER,
2231 'range' => [
2232 's' => [
2233 'min' => 0,
2234 'max' => 3,
2235 'step' => 0.1,
2236 ],
2237 ],
2238 'default' => [
2239 'unit' => 's',
2240 'size' => 0.3,
2241 ],
2242 'selectors' => [
2243 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-transition-duration: {{SIZE}}{{UNIT}}',
2244 ],
2245 ]
2246 );
2247 }
2248
2249 $this->end_controls_section();
2250 }
2251
2252 protected function add_style_resource_links_section(): void {
2253 $this->start_controls_section(
2254 'style_resource_links_section',
2255 [
2256 'label' => esc_html__( 'Resource Links', 'elementor' ),
2257 'tab' => Controls_Manager::TAB_STYLE,
2258 ]
2259 );
2260
2261 $this->add_control(
2262 'style_resource_links_icons_heading',
2263 [
2264 'label' => esc_html__( 'Icons', 'elementor' ),
2265 'type' => Controls_Manager::HEADING,
2266 'separator' => false,
2267 ]
2268 );
2269
2270 $this->add_control(
2271 'style_resource_links_button_size',
2272 [
2273 'label' => esc_html__( 'Size', 'elementor' ),
2274 'type' => Controls_Manager::SELECT,
2275 'default' => 'small',
2276 'options' => [
2277 'small' => esc_html__( 'Small', 'elementor' ),
2278 'medium' => esc_html__( 'Medium', 'elementor' ),
2279 'large' => esc_html__( 'Large', 'elementor' ),
2280 ],
2281 ]
2282 );
2283
2284 $this->add_control(
2285 'style_resource_links_color_select',
2286 [
2287 'label' => esc_html__( 'Color', 'elementor' ),
2288 'type' => Controls_Manager::SELECT,
2289 'default' => 'custom',
2290 'options' => [
2291 'default' => esc_html__( 'Default', 'elementor' ),
2292 'custom' => esc_html__( 'Custom', 'elementor' ),
2293 ],
2294 ]
2295 );
2296
2297 $this->add_control(
2298 'style_contact_icon_color',
2299 [
2300 'label' => esc_html__( 'Color', 'elementor' ),
2301 'type' => Controls_Manager::COLOR,
2302 'selectors' => [
2303 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-contact-button-icon: {{VALUE}}',
2304 ],
2305 'condition' => [
2306 'style_resource_links_color_select' => 'custom',
2307 ],
2308 ]
2309 );
2310
2311 $this->add_control(
2312 'style_resource_links_title_heading',
2313 [
2314 'label' => esc_html__( 'Title', 'elementor' ),
2315 'type' => Controls_Manager::HEADING,
2316 'separator' => false,
2317 ]
2318 );
2319
2320 $this->add_control(
2321 'style_resource_links_title_color',
2322 [
2323 'label' => esc_html__( 'Text Color', 'elementor' ),
2324 'type' => Controls_Manager::COLOR,
2325 'selectors' => [
2326 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-contact-title-text-color: {{VALUE}}',
2327 ],
2328 ]
2329 );
2330
2331 $this->add_group_control(
2332 Group_Control_Typography::get_type(),
2333 [
2334 'name' => 'style_resource_links_title_typography',
2335 'selector' => '{{WRAPPER}} .e-contact-buttons__contact-title',
2336 ]
2337 );
2338
2339 $this->add_control(
2340 'style_resource_links_description_heading',
2341 [
2342 'label' => esc_html__( 'Description', 'elementor' ),
2343 'type' => Controls_Manager::HEADING,
2344 'separator' => false,
2345 ]
2346 );
2347
2348 $this->add_control(
2349 'style_resource_links_description_color',
2350 [
2351 'label' => esc_html__( 'Text Color', 'elementor' ),
2352 'type' => Controls_Manager::COLOR,
2353 'selectors' => [
2354 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-contact-description-text-color: {{VALUE}}',
2355 ],
2356 ]
2357 );
2358
2359 $this->add_group_control(
2360 Group_Control_Typography::get_type(),
2361 [
2362 'name' => 'style_resource_links_description_typography',
2363 'selector' => '{{WRAPPER}} .e-contact-buttons__contact-description',
2364 ]
2365 );
2366
2367 $this->add_control(
2368 'style_resource_links_bg_color',
2369 [
2370 'label' => esc_html__( 'Background Color', 'elementor' ),
2371 'type' => Controls_Manager::COLOR,
2372 'selectors' => [
2373 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-contact-button-bg: {{VALUE}}',
2374 ],
2375 'separator' => 'before',
2376 ]
2377 );
2378
2379 $this->add_hover_animation_control(
2380 'style_resource_links_hover_animation',
2381 );
2382
2383 $this->end_controls_section();
2384 }
2385
2386 protected function add_style_info_links_section(): void {
2387 $this->start_controls_section(
2388 'style_info_links_section',
2389 [
2390 'label' => esc_html__( 'Info Links', 'elementor' ),
2391 'tab' => Controls_Manager::TAB_STYLE,
2392 ]
2393 );
2394
2395 $this->add_control(
2396 'style_info_links_icon_position',
2397 [
2398 'label' => esc_html__( 'Icon Position', 'elementor' ),
2399 'type' => Controls_Manager::CHOOSE,
2400 'options' => [
2401 'start' => [
2402 'title' => esc_html__( 'Left', 'elementor' ),
2403 'icon' => 'eicon-h-align-left',
2404 ],
2405 'end' => [
2406 'title' => esc_html__( 'Right', 'elementor' ),
2407 'icon' => 'eicon-h-align-right',
2408 ],
2409 ],
2410 'default' => 'start',
2411 'toggle' => true,
2412 ]
2413 );
2414
2415 $this->add_control(
2416 'style_info_links_icon_spacing',
2417 [
2418 'label' => esc_html__( 'Icon Spacing', 'elementor' ),
2419 'type' => Controls_Manager::SLIDER,
2420 'range' => [
2421 '%' => [
2422 'min' => 10,
2423 'max' => 100,
2424 ],
2425 'px' => [
2426 'min' => 0,
2427 'max' => 20,
2428 ],
2429 ],
2430 'default' => [
2431 'unit' => 'px',
2432 'size' => 12,
2433 ],
2434 'size_units' => [ 'px', '%', 'em', 'rem', 'vw', 'custom' ],
2435 'selectors' => [
2436 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-icon-link-gap: {{SIZE}}{{UNIT}}',
2437 ],
2438 ]
2439 );
2440
2441 $this->add_responsive_control(
2442 'style_info_links_link_spacing',
2443 [
2444 'label' => esc_html__( 'Link Spacing', 'elementor' ),
2445 'type' => Controls_Manager::SLIDER,
2446 'range' => [
2447 '%' => [
2448 'min' => 10,
2449 'max' => 100,
2450 ],
2451 'px' => [
2452 'min' => 0,
2453 'max' => 10,
2454 ],
2455 ],
2456 'default' => [
2457 'unit' => 'px',
2458 'size' => 12,
2459 ],
2460 'size_units' => [ 'px', '%', 'em', 'rem', 'vw', 'custom' ],
2461 'selectors' => [
2462 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-icon-link-spacing: {{SIZE}}{{UNIT}}',
2463 ],
2464 ]
2465 );
2466
2467 $this->add_group_control(
2468 Group_Control_Typography::get_type(),
2469 [
2470 'name' => 'style_info_links_typography',
2471 'selector' => '{{WRAPPER}} .e-contact-buttons__contact-icon-link',
2472 ]
2473 );
2474
2475 $this->start_controls_tabs(
2476 'style_info_links_tabs'
2477 );
2478
2479 $this->start_controls_tab(
2480 'style_info_links_tabs_normal',
2481 [
2482 'label' => esc_html__( 'Normal', 'elementor' ),
2483 ]
2484 );
2485
2486 $this->add_control(
2487 'style_info_links_normal_text_color',
2488 [
2489 'label' => esc_html__( 'Text and Icon Color', 'elementor' ),
2490 'type' => Controls_Manager::COLOR,
2491 'selectors' => [
2492 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-icon-link-text-color: {{VALUE}}',
2493 ],
2494 ]
2495 );
2496
2497 $this->end_controls_tab();
2498
2499 $this->start_controls_tab(
2500 'style_info_links_tabs_hover',
2501 [
2502 'label' => esc_html__( 'Hover', 'elementor' ),
2503 ]
2504 );
2505
2506 $this->add_control(
2507 'style_info_links_hover_text_color',
2508 [
2509 'label' => esc_html__( 'Text and Icon Color', 'elementor' ),
2510 'type' => Controls_Manager::COLOR,
2511 'selectors' => [
2512 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-icon-link-text-color-hover: {{VALUE}}',
2513 ],
2514 ]
2515 );
2516
2517 $this->add_control(
2518 'style_info_links_hover_animation',
2519 [
2520 'label' => esc_html__( 'Hover Animation', 'elementor' ),
2521 'type' => Controls_Manager::HOVER_ANIMATION,
2522 'frontend_available' => true,
2523 ]
2524 );
2525
2526 $this->end_controls_tab();
2527
2528 $this->end_controls_tabs();
2529
2530 $this->add_control(
2531 'style_info_links_dividers',
2532 [
2533 'label' => esc_html__( 'Dividers', 'elementor' ),
2534 'type' => Controls_Manager::SWITCHER,
2535 'label_on' => esc_html__( 'Show', 'elementor' ),
2536 'label_off' => esc_html__( 'Hide', 'elementor' ),
2537 'return_value' => 'yes',
2538 'default' => 'yes',
2539 'separator' => 'before',
2540 ]
2541 );
2542
2543 $this->add_control(
2544 'style_info_links_divider_color',
2545 [
2546 'label' => esc_html__( 'Color', 'elementor' ),
2547 'type' => Controls_Manager::COLOR,
2548 'selectors' => [
2549 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-icon-link-divider-color: {{VALUE}}',
2550 ],
2551 'condition' => [
2552 'style_info_links_dividers' => 'yes',
2553 ],
2554 ]
2555 );
2556
2557 $this->add_responsive_control(
2558 'style_info_links_divider_weight',
2559 [
2560 'label' => esc_html__( 'Weight', 'elementor' ),
2561 'type' => Controls_Manager::SLIDER,
2562 'range' => [
2563 '%' => [
2564 'min' => 10,
2565 'max' => 100,
2566 ],
2567 'px' => [
2568 'min' => 1,
2569 'max' => 10,
2570 ],
2571 ],
2572 'default' => [
2573 'unit' => 'px',
2574 'size' => 1,
2575 ],
2576 'size_units' => [ 'px', '%', 'em', 'rem', 'vw', 'custom' ],
2577 'selectors' => [
2578 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-icon-link-divider-weight: {{SIZE}}{{UNIT}}',
2579 ],
2580 'condition' => [
2581 'style_info_links_dividers' => 'yes',
2582 ],
2583 ]
2584 );
2585
2586 $this->end_controls_section();
2587 }
2588
2589 protected function add_style_send_button_section(): void {
2590 $config = static::get_configuration();
2591
2592 $this->start_controls_section(
2593 'style_send_section',
2594 [
2595 'label' => $config['content']['send_button_section']['section_name'],
2596 'tab' => Controls_Manager::TAB_STYLE,
2597 ]
2598 );
2599
2600 if ( $config['style']['send_button_section']['has_typography'] ) {
2601 $this->add_group_control(
2602 Group_Control_Typography::get_type(),
2603 [
2604 'name' => 'style_send_typography',
2605 'selector' => '{{WRAPPER}} .e-contact-buttons__cta-button',
2606 ]
2607 );
2608 }
2609
2610 $this->start_controls_tabs(
2611 'style_send_tabs'
2612 );
2613
2614 $this->start_controls_tab(
2615 'style_send_tabs_normal',
2616 [
2617 'label' => esc_html__( 'Normal', 'elementor' ),
2618 ]
2619 );
2620
2621 if ( $config['style']['send_button_section']['has_platform_colors'] ) {
2622 $this->add_control(
2623 'style_send_normal_colors',
2624 [
2625 'label' => esc_html__( 'Colors', 'elementor' ),
2626 'type' => Controls_Manager::SELECT,
2627 'default' => 'default',
2628 'options' => [
2629 'default' => esc_html__( 'Default', 'elementor' ),
2630 'custom' => esc_html__( 'Custom', 'elementor' ),
2631 ],
2632 ]
2633 );
2634 }
2635
2636 if ( $config['style']['send_button_section']['has_icon_color'] ) {
2637 $this->add_control(
2638 'style_send_normal_icon_color',
2639 [
2640 'label' => esc_html__( 'Icon Color', 'elementor' ),
2641 'type' => Controls_Manager::COLOR,
2642 'selectors' => [
2643 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-send-button-icon: {{VALUE}}',
2644 ],
2645 'condition' => [
2646 'style_send_normal_colors' => 'custom',
2647 ],
2648 ]
2649 );
2650 }
2651
2652 if ( $config['style']['send_button_section']['has_text_color'] ) {
2653 $this->add_control(
2654 'style_send_normal_text_color',
2655 [
2656 'label' => esc_html__( 'Text Color', 'elementor' ),
2657 'type' => Controls_Manager::COLOR,
2658 'selectors' => [
2659 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-send-button-text: {{VALUE}}',
2660 ],
2661 ]
2662 );
2663 }
2664
2665 if ( $config['style']['send_button_section']['has_background_color'] ) {
2666 $this->add_control(
2667 'style_send_normal_background_color',
2668 [
2669 'label' => esc_html__( 'Background Color', 'elementor' ),
2670 'type' => Controls_Manager::COLOR,
2671 'selectors' => [
2672 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-send-button-bg: {{VALUE}}',
2673 ],
2674 'condition' => $this->get_platform_color_condition( [
2675 'style_send_normal_colors' => 'custom',
2676 ] ),
2677 ]
2678 );
2679 }
2680
2681 $this->end_controls_tab();
2682
2683 $this->start_controls_tab(
2684 'style_send_tabs_hover',
2685 [
2686 'label' => esc_html__( 'Hover', 'elementor' ),
2687 ]
2688 );
2689
2690 if ( $config['style']['send_button_section']['has_platform_colors'] ) {
2691 $this->add_control(
2692 'style_send_hover_colors',
2693 [
2694 'label' => esc_html__( 'Colors', 'elementor' ),
2695 'type' => Controls_Manager::SELECT,
2696 'default' => 'default',
2697 'options' => [
2698 'default' => esc_html__( 'Default', 'elementor' ),
2699 'custom' => esc_html__( 'Custom', 'elementor' ),
2700 ],
2701 ]
2702 );
2703 }
2704
2705 if ( $config['style']['send_button_section']['has_icon_color'] ) {
2706 $this->add_control(
2707 'style_send_hover_icon_color',
2708 [
2709 'label' => esc_html__( 'Icon Color', 'elementor' ),
2710 'type' => Controls_Manager::COLOR,
2711 'selectors' => [
2712 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-send-button-icon-hover: {{VALUE}}',
2713 ],
2714 'condition' => [
2715 'style_send_hover_colors' => 'custom',
2716 ],
2717 ]
2718 );
2719 }
2720
2721 if ( $config['style']['send_button_section']['has_text_color'] ) {
2722 $this->add_control(
2723 'style_send_hover_text_color',
2724 [
2725 'label' => esc_html__( 'Text Color', 'elementor' ),
2726 'type' => Controls_Manager::COLOR,
2727 'selectors' => [
2728 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-send-button-text-hover: {{VALUE}}',
2729 ],
2730 ]
2731 );
2732 }
2733
2734 if ( $config['style']['send_button_section']['has_background_color'] ) {
2735 $this->add_control(
2736 'style_send_hover_background_color',
2737 [
2738 'label' => esc_html__( 'Background Color', 'elementor' ),
2739 'type' => Controls_Manager::COLOR,
2740 'selectors' => [
2741 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-send-button-bg-hover: {{VALUE}}',
2742 ],
2743 'condition' => $this->get_platform_color_condition( [
2744 'style_send_hover_colors' => 'custom',
2745 ] ),
2746 ]
2747 );
2748 }
2749
2750 $this->add_hover_animation_control(
2751 'style_send_hover_animation',
2752 );
2753
2754 $this->end_controls_tab();
2755
2756 $this->end_controls_tabs();
2757
2758 $this->add_responsive_control(
2759 'style_chat_button_padding',
2760 [
2761 'label' => esc_html__( 'Padding', 'elementor' ),
2762 'type' => Controls_Manager::DIMENSIONS,
2763 'size_units' => [ 'px', '%', 'em', 'rem' ],
2764 'default' => [
2765 'top' => '8',
2766 'bottom' => '8',
2767 'left' => '16',
2768 'right' => '16',
2769 'unit' => 'px',
2770 'isLinked' => true,
2771 ],
2772 'selectors' => [
2773 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-send-button-padding-block-end: {{BOTTOM}}{{UNIT}}; --e-contact-buttons-send-button-padding-block-start: {{TOP}}{{UNIT}}; --e-contact-buttons-send-button-padding-inline-end: {{RIGHT}}{{UNIT}}; --e-contact-buttons-send-button-padding-inline-start: {{LEFT}}{{UNIT}};',
2774 ],
2775 'separator' => 'before',
2776 ]
2777 );
2778
2779 $this->end_controls_section();
2780 }
2781
2782 protected function chat_box_animation_controls(): void {
2783 $this->add_responsive_control(
2784 'style_chat_box_entrance_animation',
2785 [
2786 'label' => esc_html__( 'Open Animation', 'elementor' ),
2787 'type' => Controls_Manager::ANIMATION,
2788 'frontend_available' => true,
2789 'separator' => 'before',
2790 ]
2791 );
2792
2793 $this->add_responsive_control(
2794 'style_chat_box_exit_animation',
2795 [
2796 'label' => esc_html__( 'Close Animation', 'elementor' ),
2797 'type' => Controls_Manager::EXIT_ANIMATION,
2798 'frontend_available' => true,
2799 ]
2800 );
2801
2802 $this->add_control(
2803 'style_chat_box_animation_duration',
2804 [
2805 'label' => esc_html__( 'Animation Duration', 'elementor' ),
2806 'type' => Controls_Manager::SELECT,
2807 'default' => 'normal',
2808 'options' => [
2809 'slow' => esc_html__( 'Slow', 'elementor' ),
2810 'normal' => esc_html__( 'Normal', 'elementor' ),
2811 'fast' => esc_html__( 'Fast', 'elementor' ),
2812 ],
2813 'prefix_class' => 'animated-',
2814 ]
2815 );
2816 }
2817
2818 protected function add_style_chat_box_section(): void {
2819 $config = static::get_configuration();
2820
2821 $this->start_controls_section(
2822 'style_chat_box_section',
2823 [
2824 'label' => $config['style']['chat_box_section']['section_name'],
2825 'tab' => Controls_Manager::TAB_STYLE,
2826 ]
2827 );
2828
2829 if ( $config['style']['has_platform_colors'] ) {
2830 $this->add_control(
2831 'style_chat_box_bg_select',
2832 [
2833 'label' => esc_html__( 'Background Color', 'elementor' ),
2834 'type' => Controls_Manager::SELECT,
2835 'default' => 'default',
2836 'options' => [
2837 'default' => esc_html__( 'Default', 'elementor' ),
2838 'custom' => esc_html__( 'Custom', 'elementor' ),
2839 ],
2840 ]
2841 );
2842 }
2843
2844 $this->add_control(
2845 'style_chat_box_bg_color',
2846 [
2847 'label' => esc_html__( 'Background Color', 'elementor' ),
2848 'type' => Controls_Manager::COLOR,
2849 'selectors' => [
2850 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-chat-box-bg: {{VALUE}}',
2851 ],
2852 'condition' => $this->get_platform_color_condition( [
2853 'style_chat_box_bg_select' => 'custom',
2854 ] ),
2855 ]
2856 );
2857
2858 if ( $config['style']['chat_box_section']['has_width'] ) {
2859 $this->add_responsive_control(
2860 'style_chat_box_width',
2861 [
2862 'label' => esc_html__( 'Width', 'elementor' ),
2863 'type' => Controls_Manager::SLIDER,
2864 'range' => [
2865 '%' => [
2866 'min' => 10,
2867 'max' => 100,
2868 ],
2869 'px' => [
2870 'min' => 0,
2871 'max' => 400,
2872 ],
2873 ],
2874 'default' => [
2875 'unit' => 'px',
2876 'size' => $config['style']['chat_box_section']['width'],
2877 ],
2878 'mobile_default' => [
2879 'unit' => 'vw',
2880 'size' => 100,
2881 ],
2882 'size_units' => [ 'px', '%', 'em', 'rem', 'vw', 'custom' ],
2883 'selectors' => [
2884 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-chat-box-width: {{SIZE}}{{UNIT}}',
2885 ],
2886 ]
2887 );
2888 }
2889
2890 $this->add_control(
2891 'style_chat_box_corners',
2892 [
2893 'label' => esc_html__( 'Corners', 'elementor' ),
2894 'type' => Controls_Manager::SELECT,
2895 'default' => 'rounded',
2896 'options' => [
2897 'round' => esc_html__( 'Round', 'elementor' ),
2898 'rounded' => esc_html__( 'Rounded', 'elementor' ),
2899 'sharp' => esc_html__( 'Sharp', 'elementor' ),
2900 ],
2901 'separator' => 'before',
2902 ]
2903 );
2904
2905 $this->add_group_control(
2906 Group_Control_Box_Shadow::get_type(),
2907 [
2908 'name' => 'style_chat_box_box_shadow',
2909 'selector' => '{{WRAPPER}} .e-contact-buttons__content',
2910 'fields_options' => static::BOX_SHADOW_FIELDS_OPTIONS,
2911 ]
2912 );
2913
2914 if ( $config['style']['chat_box_section']['has_padding'] ) {
2915 $this->add_responsive_control(
2916 'style_chat_box_padding',
2917 [
2918 'label' => esc_html__( 'Padding', 'elementor' ),
2919 'type' => Controls_Manager::DIMENSIONS,
2920 'size_units' => [ 'px', '%', 'em', 'rem' ],
2921 'default' => [
2922 'top' => '16',
2923 'bottom' => '16',
2924 'left' => '16',
2925 'right' => '16',
2926 'unit' => 'px',
2927 'isLinked' => true,
2928 ],
2929 'selectors' => [
2930 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-chat-box-padding-block-end: {{BOTTOM}}{{UNIT}}; --e-contact-buttons-chat-box-padding-block-start: {{TOP}}{{UNIT}}; --e-contact-buttons-chat-box-padding-inline-end: {{RIGHT}}{{UNIT}}; --e-contact-buttons-chat-box-padding-inline-start: {{LEFT}}{{UNIT}};',
2931 ],
2932 ]
2933 );
2934 }
2935
2936 $this->chat_box_animation_controls();
2937
2938 $this->end_controls_section();
2939 }
2940
2941 protected function add_style_tab(): void {
2942 $this->add_style_chat_button_section();
2943
2944 $this->add_style_top_bar_section();
2945
2946 $this->add_style_message_bubble_section();
2947
2948 $this->add_style_send_button_section();
2949
2950 $this->add_style_chat_box_section();
2951 }
2952
2953 private function add_advanced_tab(): void {
2954 $config = static::get_configuration();
2955
2956 Controls_Manager::add_tab(
2957 static::TAB_ADVANCED,
2958 esc_html__( 'Advanced', 'elementor' )
2959 );
2960
2961 if ( $config['advanced']['has_layout_position'] ) {
2962 $this->start_controls_section(
2963 'advanced_layout_section',
2964 [
2965 'label' => esc_html__( 'Layout', 'elementor' ),
2966 'tab' => static::TAB_ADVANCED,
2967 ]
2968 );
2969
2970 $this->add_responsive_control(
2971 'advanced_horizontal_position',
2972 [
2973 'label' => esc_html__( 'Horizontal Position', 'elementor' ),
2974 'type' => Controls_Manager::CHOOSE,
2975 'options' => [
2976 'start' => [
2977 'title' => esc_html__( 'Left', 'elementor' ),
2978 'icon' => 'eicon-h-align-left',
2979 ],
2980 'center' => [
2981 'title' => esc_html__( 'Center', 'elementor' ),
2982 'icon' => 'eicon-h-align-center',
2983 ],
2984 'end' => [
2985 'title' => esc_html__( 'Right', 'elementor' ),
2986 'icon' => 'eicon-h-align-right',
2987 ],
2988 ],
2989 'default' => $config['advanced']['horizontal_position_default'],
2990 'toggle' => false,
2991 ]
2992 );
2993
2994 if ( $config['advanced']['has_horizontal_offset'] ) {
2995 $this->add_responsive_control(
2996 'advanced_horizontal_offset',
2997 [
2998 'label' => esc_html__( 'Offset', 'elementor' ),
2999 'type' => Controls_Manager::SLIDER,
3000 'range' => [
3001 '%' => [
3002 'min' => 10,
3003 'max' => 100,
3004 ],
3005 'px' => [
3006 'min' => 0,
3007 'max' => 100,
3008 ],
3009 ],
3010 'default' => [
3011 'unit' => 'px',
3012 'size' => $config['advanced']['horizontal_offset_default'],
3013 ],
3014 'size_units' => [ 'px', '%', 'em', 'rem', 'vw', 'custom' ],
3015 'selectors' => [
3016 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-horizontal-offset: {{SIZE}}{{UNIT}}',
3017 ],
3018 'condition' => [
3019 'advanced_horizontal_position' => [
3020 'start',
3021 'end',
3022 ],
3023 ],
3024 ]
3025 );
3026 }
3027
3028 $this->add_responsive_control(
3029 'advanced_vertical_position',
3030 [
3031 'label' => esc_html__( 'Vertical Position', 'elementor' ),
3032 'type' => Controls_Manager::CHOOSE,
3033 'options' => [
3034 'top' => [
3035 'title' => esc_html__( 'Top', 'elementor' ),
3036 'icon' => 'eicon-v-align-top',
3037 ],
3038 'middle' => [
3039 'title' => esc_html__( 'Middle', 'elementor' ),
3040 'icon' => 'eicon-v-align-middle',
3041 ],
3042 'bottom' => [
3043 'title' => esc_html__( 'Bottom', 'elementor' ),
3044 'icon' => 'eicon-v-align-bottom',
3045 ],
3046 ],
3047 'default' => 'bottom',
3048 'toggle' => false,
3049 ]
3050 );
3051
3052 if ( $config['advanced']['has_vertical_offset'] ) {
3053 $this->add_responsive_control(
3054 'advanced_vertical_offset',
3055 [
3056 'label' => esc_html__( 'Offset', 'elementor' ),
3057 'type' => Controls_Manager::SLIDER,
3058 'range' => [
3059 '%' => [
3060 'min' => 10,
3061 'max' => 100,
3062 ],
3063 'px' => [
3064 'min' => 0,
3065 'max' => 100,
3066 ],
3067 ],
3068 'default' => [
3069 'unit' => 'px',
3070 'size' => $config['advanced']['vertical_offset_default'],
3071 ],
3072 'size_units' => [ 'px', '%', 'em', 'rem', 'vw', 'custom' ],
3073 'selectors' => [
3074 '{{WRAPPER}} .e-contact-buttons' => '--e-contact-buttons-vertical-offset: {{SIZE}}{{UNIT}}',
3075 ],
3076 'condition' => [
3077 'advanced_vertical_position' => [
3078 'top',
3079 'bottom',
3080 ],
3081 ],
3082 ]
3083 );
3084 }
3085
3086 if ( $config['advanced']['has_mobile_full_width'] ) {
3087 $this->add_control(
3088 'advanced_mobile_full_width',
3089 [
3090 'label' => esc_html__( 'Full Width on Mobile', 'elementor' ),
3091 'type' => Controls_Manager::SWITCHER,
3092 'label_on' => esc_html__( 'Yes', 'elementor' ),
3093 'label_off' => esc_html__( 'No', 'elementor' ),
3094 'return_value' => 'yes',
3095 'default' => 'yes',
3096 ]
3097 );
3098 }
3099
3100 $this->end_controls_section();
3101 }
3102
3103 $this->start_controls_section(
3104 'advanced_responsive_section',
3105 [
3106 'label' => esc_html__( 'Responsive', 'elementor' ),
3107 'tab' => static::TAB_ADVANCED,
3108 ]
3109 );
3110
3111 $this->add_control(
3112 'responsive_description',
3113 [
3114 'raw' => __( 'Responsive visibility will take effect only on preview mode or live page, and not while editing in Elementor.', 'elementor' ),
3115 'type' => Controls_Manager::RAW_HTML,
3116 'content_classes' => 'elementor-descriptor',
3117 ]
3118 );
3119
3120 $this->add_hidden_device_controls();
3121
3122 $this->end_controls_section();
3123
3124 $this->start_controls_section(
3125 'advanced_custom_controls_section',
3126 [
3127 'label' => esc_html__( 'CSS', 'elementor' ),
3128 'tab' => static::TAB_ADVANCED,
3129 ]
3130 );
3131
3132 $this->add_control(
3133 'advanced_custom_css_id',
3134 [
3135 'label' => esc_html__( 'CSS ID', 'elementor' ),
3136 'type' => Controls_Manager::TEXT,
3137 'default' => '',
3138 'ai' => [
3139 'active' => false,
3140 ],
3141 'dynamic' => [
3142 'active' => true,
3143 ],
3144 'title' => esc_html__( 'Add your custom id WITHOUT the Pound key. e.g: my-id', 'elementor' ),
3145 'style_transfer' => false,
3146 ]
3147 );
3148
3149 $this->add_control(
3150 'advanced_custom_css_classes',
3151 [
3152 'label' => esc_html__( 'CSS Classes', 'elementor' ),
3153 'type' => Controls_Manager::TEXT,
3154 'default' => '',
3155 'ai' => [
3156 'active' => false,
3157 ],
3158 'dynamic' => [
3159 'active' => true,
3160 ],
3161 'title' => esc_html__( 'Add your custom class WITHOUT the dot. e.g: my-class', 'elementor' ),
3162 ]
3163 );
3164
3165 $this->end_controls_section();
3166
3167 Plugin::$instance->controls_manager->add_custom_css_controls( $this, static::TAB_ADVANCED );
3168
3169 Plugin::$instance->controls_manager->add_custom_attributes_controls( $this, static::TAB_ADVANCED );
3170
3171 }
3172
3173 protected function render(): void {
3174 $render_strategy = new Contact_Buttons_Core_Render( $this );
3175
3176 $render_strategy->render();
3177 }
3178 }
3179