PluginProbe
Elementor Website Builder – more than just a page builder / 3.24.0-dev2
Elementor Website Builder – more than just a page builder v3.24.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.24.0-dev2, at modules/floating-buttons/base/widget-contact-button-base.php

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