PluginProbe
Elementor Website Builder – more than just a page builder / 3.27.4
Elementor Website Builder – more than just a page builder v3.27.4
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 4.0.7 All 451 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.27.4, at modules/floating-buttons/base/widget-contact-button-base.php

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