betterdocs / includes / Editors / Elementor / Widget / Basic / SearchForm.php

SearchForm.php in BetterDocs – AI Documentation, Knowledge Base, MCP Server, Docs, Wikis, FAQ & Chatbot 4.9.1, at includes/Editors/Elementor/Widget/Basic/SearchForm.php

1,946 lines 57.4 KB

Raw Download Zip

1	<?php
2	namespace WPDeveloper\BetterDocs\Editors\Elementor\Widget\Basic;
3
4	// If this file is called directly, abort.
5	if ( ! defined( 'ABSPATH' ) ) {
6	exit;
7	}
8
9
10	// Doc/category-listing primitives (meta_query/tax_query, post__not_in/exclude)
11	// are intrinsic to BetterDocs' KB / category / FAQ filters and intentional.
12	// phpcs:disable WordPress.DB.SlowDBQuery.slow_db_query_meta_key
13	// phpcs:disable WordPress.DB.SlowDBQuery.slow_db_query_meta_query
14	// phpcs:disable WordPress.DB.SlowDBQuery.slow_db_query_tax_query
15	// phpcs:disable WordPressVIPMinimum.Performance.WPQueryParams.PostNotIn_exclude
16	// phpcs:disable WordPressVIPMinimum.Performance.WPQueryParams.PostNotIn_post__not_in
17	use Elementor\Group_Control_Background;
18	use Elementor\Controls_Manager;
19	use WPDeveloper\BetterDocs\Editors\Elementor\BaseWidget;
20	use Elementor\Group_Control_Border;
21	use Elementor\Group_Control_Typography;
22
23	class SearchForm extends BaseWidget {
24	public $view_wrapper = 'betterdocs-search-form-wrapper';
25
26	public function get_name() {
27	return 'betterdocs-search-form';
28	}
29
30	public function get_title() {
31	return __( 'BetterDocs Search Form', 'betterdocs' );
32	}
33
34	public function get_categories() {
35	return [ 'betterdocs-elements', 'docs-archive', 'betterdocs-elements-single' ];
36	}
37
38	public function get_icon() {
39	return 'betterdocs-icon-search';
40	}
41
42	public function get_style_depends() {
43	return [ 'betterdocs-search', 'betterdocs-search-modal' ];
44	}
45
46	public function get_script_depends() {
47	return [ 'betterdocs-search', 'betterdocs-pro', 'betterdocs-search-modal', 'betterdocs-category-grid', 'betterdocs-extend-search-modal' ];
48	}
49
50	/**
51	* Get widget keywords.
52	*
53	* Retrieve the list of keywords the widget belongs to.
54	*
55	* @return array Widget keywords.
56	* @since 3.5.2
57	* @access public
58	*
59	*/
60	public function get_keywords() {
61	return [
62	'knowledgebase',
63	'knowledge Base',
64	'documentation',
65	'doc',
66	'kb',
67	'betterdocs',
68	'search',
69	'search form'
70
71	];
72	}
73
74	public function get_custom_help_url() {
75	return 'https://betterdocs.co/docs/single-doc-in-elementor';
76	}
77
78	protected function register_controls() {
79	$this->layout_selection();
80	$this->search_modal_query();
81	$this->search_content_settings();
82	$this->search_box_layout_1();
83	$this->search_field_layout_1();
84	$this->search_result_box_layout_1();
85	$this->search_result_list_layout_1();
86
87	$this->search_box_layout_2();
88	$this->search_field_layout_2();
89	$this->ai_search_suggestions_controls();
90	$this->search_modal_layout();
91	}
92
93	public function layout_selection() {
94	$this->start_controls_section(
95	'layout_selection_section',
96	[
97	'label' => __( 'Search Layout', 'betterdocs' ),
98	'tab' => Controls_Manager::TAB_CONTENT
99	]
100	);
101
102	$this->add_control(
103	'layout_select',
104	[
105	'label' => esc_html__( 'Select layout', 'betterdocs' ),
106	'type' => Controls_Manager::SELECT,
107	'default' => 'layout-2',
108	'label_block' => false,
109	'options' => [
110	'layout-1' => esc_html__( 'Classic Layout', 'betterdocs' ),
111	'layout-2' => esc_html__( 'Modal Layout', 'betterdocs' )
112	]
113	]
114	);
115
116	$this->add_control(
117	'search_modal_layout',
118	[
119	'label' => __( 'Search Modal Layout', 'betterdocs' ),
120	'type' => Controls_Manager::SELECT,
121	'default' => 'layout-1',
122	'label_block' => false,
123	'options' => [
124	'layout-1' => esc_html__( 'Layout 1', 'betterdocs' ),
125	'docs-archive' => esc_html__( 'Layout 2', 'betterdocs' ),
126	'sidebar' => esc_html__( 'Layout 3', 'betterdocs' )
127	],
128	'condition' => [
129	'layout_select' => [ 'layout-2' ]
130	]
131	]
132	);
133
134	$this->add_control(
135	'search_modal_width',
136	[
137	'label' => __( 'Width', 'betterdocs' ),
138	'type' => Controls_Manager::SLIDER,
139	'size_units' => [ '%', 'px' ],
140	'range' => [
141	'%' => [
142	'min' => 10,
143	'max' => 100,
144	],
145	'px' => [
146	'min' => 100,
147	'max' => 1200,
148	],
149	],
150	'default' => [
151	'unit' => '%',
152	'size' => 100,
153	],
154	'selectors' => [
155	'{{WRAPPER}} .betterdocs-search-modal-archive' => 'width: {{SIZE}}{{UNIT}};max-width: 100%;',
156	'{{WRAPPER}} .betterdocs-search-modal-sidebar' => 'width: {{SIZE}}{{UNIT}};',
157	],
158	'condition' => [
159	'layout_select' => [ 'layout-2' ],
160	'search_modal_layout' => [ 'docs-archive', 'sidebar' ]
161	]
162	]
163	);
164
165	$this->add_control(
166	'search_modal_position',
167	[
168	'label' => __( 'Position', 'betterdocs' ),
169	'type' => Controls_Manager::SELECT,
170	'default' => 'left',
171	'options' => [
172	'left' => __( 'Left', 'betterdocs' ),
173	'right' => __( 'Right', 'betterdocs' ),
174	],
175	'selectors' => [
176	'{{WRAPPER}}' => 'text-align: {{VALUE}};',
177	'{{WRAPPER}} .betterdocs-search-modal-archive' => 'display: inline-block; text-align: left;',
178	'{{WRAPPER}} .betterdocs-search-modal-sidebar' => 'display: inline-block; text-align: left;',
179	],
180	'condition' => [
181	'layout_select' => [ 'layout-2' ],
182	'search_modal_layout' => [ 'docs-archive', 'sidebar' ]
183	]
184	]
185	);
186
187	$this->end_controls_section();
188	}
189
190	public function search_modal_query() {
191	$this->start_controls_section(
192	'search_modal_query',
193	[
194	'label' => __( 'Modal Query', 'betterdocs' ),
195	'condition' => [
196	'layout_select' => [ 'layout-2' ]
197	]
198	]
199	);
200
201	$this->add_control(
202	'search_modal_doc_query_type',
203	[
204	'label' => __( 'Select Docs Type', 'betterdocs' ),
205	'label_block' => true,
206	'type' => Controls_Manager::SELECT2,
207	'options' => [
208	'popular_docs' => __( 'Popular Docs', 'betterdocs' ),
209	'specific_doc_ids' => __( "Specific Doc Id's", 'betterdocs' ),
210	'specific_doc_term_ids' => __( "Specific Doc Term Id's", 'betterdocs' )
211	],
212	'multiple' => false,
213	'default' => 'popular_docs'
214	]
215	);
216
217	$this->add_control(
218	'search_modal_query_term_ids',
219	[
220	'label' => __( "Doc Term ID's", 'betterdocs' ),
221	'type' => Controls_Manager::TEXT,
222	'description' => __( 'Example: 8, 9', 'betterdocs' ),
223	'default' => '',
224	'condition' => [
225	'search_modal_doc_query_type' => 'specific_doc_term_ids'
226	]
227	]
228	);
229
230	$this->add_control(
231	'search_modal_query_doc_ids',
232	[
233	'label' => __( "Doc ID's", 'betterdocs' ),
234	'type' => Controls_Manager::TEXT,
235	'description' => __( 'Example: 15, 16', 'betterdocs' ),
236	'default' => '',
237	'condition' => [
238	'search_modal_doc_query_type' => 'specific_doc_ids'
239	]
240	]
241	);
242
243	$this->add_control(
244	'initial_docs_number',
245	[
246	'label' => __( 'Number of Docs', 'betterdocs' ),
247	'type' => Controls_Manager::NUMBER,
248	'default' => '5',
249	'condition' => [
250	'search_modal_doc_query_type' => 'popular_docs'
251	]
252	]
253	);
254
255	$this->add_control(
256	'search_modal_faq_query_type',
257	[
258	'label' => __( 'Select FAQ Type', 'betterdocs' ),
259	'label_block' => true,
260	'type' => Controls_Manager::SELECT2,
261	'default' => 'default',
262	'options' => [
263	'default' => __( 'Default', 'betterdocs' ),
264	'specific_faq_term_ids' => __( "Specific FAQ Term Id's", 'betterdocs' ),
265	],
266	'multiple' => false,
267	]
268	);
269
270	$this->add_control(
271	'search_modal_query_faq_term_ids',
272	[
273	'label' => __( "FAQ Term ID's", 'betterdocs' ),
274	'type' => Controls_Manager::TEXT,
275	'description' => __( 'Example: 8, 9', 'betterdocs' ),
276	'default' => '',
277	'condition' => [
278	'search_modal_faq_query_type' => 'specific_faq_term_ids'
279	]
280	]
281	);
282
283	$this->add_control(
284	'initial_faqs_number',
285	[
286	'label' => __( "Number of FAQ's", 'betterdocs' ),
287	'type' => Controls_Manager::NUMBER,
288	'default' => '5',
289	'condition' => [
290	'search_modal_faq_query_type' => 'default'
291	]
292	]
293	);
294
295	$this->end_controls_section();
296	}
297
298
299
300	public function return_mod_terms( $accumulator, $term ) {
301	$accumulator[ $term->term_id ] = htmlspecialchars_decode( $term->name );
302	return $accumulator;
303	}
304
305
306	public function search_content_settings() {
307	$this->start_controls_section(
308	'search_content_placeholders',
309	[
310	'label' => __( 'Search Content', 'betterdocs' ),
311	'tab' => Controls_Manager::TAB_CONTENT
312	]
313	);
314
315	$this->add_control(
316	'section_search_field_placeholder',
317	[
318	'label' => __( 'Placeholder', 'betterdocs' ),
319	'type' => Controls_Manager::TEXT,
320	'default' => esc_html__( 'Search', 'betterdocs' )
321	]
322	);
323
324	$this->add_control(
325	'section_search_field_heading',
326	[
327	'label' => __( 'Search Heading', 'betterdocs' ),
328	'type' => Controls_Manager::TEXT,
329	'condition' => [
330	'layout_select' => 'layout-1',
331	'search_modal_layout' => 'layout-1'
332	],
333	'conditions' => [
334	'relation' => 'or',
335	'terms' => [
336	[
337	'name' => 'layout_select',
338	'operator' => '==',
339	'value' => 'layout-1'
340	],
341	[
342	'relation' => 'and',
343	'terms' => [
344	[
345	'name' => 'layout_select',
346	'operator' => '==',
347	'value' => 'layout-2'
348	],
349	[
350	'name' => 'search_modal_layout',
351	'operator' => '==',
352	'value' => 'layout-1'
353	]
354	]
355	]
356	]
357	]
358	]
359	);
360
361	$this->add_control(
362	'section_search_field_sub_heading',
363	[
364	'label' => __( 'Search Subheading', 'betterdocs' ),
365	'type' => Controls_Manager::TEXT,
366	'condition' => [
367	'layout_select' => 'layout-1',
368	'search_modal_layout' => 'layout-1'
369	],
370	'conditions' => [
371	'relation' => 'or',
372	'terms' => [
373	[
374	'name' => 'layout_select',
375	'operator' => '==',
376	'value' => 'layout-1'
377	],
378	[
379	'relation' => 'and',
380	'terms' => [
381	[
382	'name' => 'layout_select',
383	'operator' => '==',
384	'value' => 'layout-2'
385	],
386	[
387	'name' => 'search_modal_layout',
388	'operator' => '==',
389	'value' => 'layout-1'
390	]
391	]
392	]
393	]
394	]
395	]
396	);
397
398	$this->add_control(
399	'section_search_field_heading_tag',
400	[
401	'label' => __( 'Heading Tag', 'betterdocs' ),
402	'type' => Controls_Manager::SELECT,
403	'default' => 'h1',
404	'options' => [
405	'h1' => 'H1',
406	'h2' => 'H2',
407	'h3' => 'H3',
408	'h4' => 'H4',
409	'h5' => 'H5',
410	'h6' => 'H6',
411	'p' => 'P'
412	]
413	]
414	);
415
416	$this->add_control(
417	'section_search_field_subheading_tag',
418	[
419	'label' => __( 'Subheading Tag', 'betterdocs' ),
420	'type' => Controls_Manager::SELECT,
421	'default' => 'p',
422	'options' => [
423	'h1' => 'H1',
424	'h2' => 'H2',
425	'h3' => 'H3',
426	'h4' => 'H4',
427	'h5' => 'H5',
428	'h6' => 'H6',
429	'p' => 'P'
430	]
431	]
432	);
433
434	$this->add_control(
435	'betterdocs_search_button_toogle',
436	[
437	'label' => __( 'Enable Search Button', 'betterdocs' ),
438	'type' => Controls_Manager::SWITCHER,
439	'label_on' => __( 'On', 'betterdocs' ),
440	'label_off' => __( 'Off', 'betterdocs' ),
441	'return_value' => 'true',
442	'default' => true
443	]
444	);
445
446	$this->add_control(
447	'enable_ai_powered_search',
448	[
449	'label' => __( 'AI-Powered Smart Modal Search', 'betterdocs' ),
450	'type' => Controls_Manager::SWITCHER,
451	'label_on' => __( 'On', 'betterdocs' ),
452	'label_off' => __( 'Off', 'betterdocs' ),
453	'return_value' => 'true',
454	'default' => false
455	]
456	);
457
458	do_action( 'betterdocs/elementor/widgets/advanced-search/switcher', $this );
459
460	// AI Search Suggestions filter
461	apply_filters( 'betterdocs_search_form_ai_suggestions', '', $this );
462
463	$this->end_controls_section();
464	}
465
466	public function ai_search_suggestions_controls() {
467	// Check if AI Search Suggestions are available
468	if ( ! betterdocs()->helper->is_ai_chatbot_enabled() ) {
469	return;
470	}
471
472	$this->start_controls_section(
473	'ai_search_suggestions_section',
474	[
475	'label' => __( 'AI-Powered Smart Modal Search', 'betterdocs' ),
476	'tab' => Controls_Manager::TAB_STYLE,
477	'condition' => [
478	'enable_ai_powered_search' => 'true',
479	],
480	]
481	);
482
483	$this->add_control(
484	'ai_suggestion_background_color',
485	[
486	'label' => __( 'Background Color', 'betterdocs' ),
487	'type' => Controls_Manager::COLOR,
488	'selectors' => [
489	'{{WRAPPER}} .betterdocs-ai-suggestion' => 'background-color: {{VALUE}};',
490	],
491	'condition' => [
492	'enable_ai_powered_search' => 'true',
493	],
494	]
495	);
496
497	$this->add_control(
498	'ai_suggestion_hover_background_color',
499	[
500	'label' => __( 'Hover Background Color', 'betterdocs' ),
501	'type' => Controls_Manager::COLOR,
502	'selectors' => [
503	'{{WRAPPER}} .betterdocs-ai-suggestion:hover' => 'background-color: {{VALUE}};',
504	],
505	'condition' => [
506	'enable_ai_powered_search' => 'true',
507	],
508	]
509	);
510
511	$this->add_responsive_control(
512	'ai_suggestion_margin',
513	[
514	'label' => __( 'Margin', 'betterdocs' ),
515	'type' => Controls_Manager::DIMENSIONS,
516	'size_units' => [ 'px', '%', 'em' ],
517	'selectors' => [
518	'{{WRAPPER}} .betterdocs-ai-suggestion' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
519	],
520	'condition' => [
521	'enable_ai_powered_search' => 'true',
522	],
523	]
524	);
525
526	$this->add_responsive_control(
527	'ai_suggestion_padding',
528	[
529	'label' => __( 'Padding', 'betterdocs' ),
530	'type' => Controls_Manager::DIMENSIONS,
531	'size_units' => [ 'px', '%', 'em' ],
532	'selectors' => [
533	'{{WRAPPER}} .betterdocs-ai-suggestion' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
534	],
535	'condition' => [
536	'enable_ai_powered_search' => 'true',
537	],
538	]
539	);
540
541	// Title Controls
542	$this->add_control(
543	'ai_suggestion_title_heading',
544	[
545	'label' => __( 'Title', 'betterdocs' ),
546	'type' => Controls_Manager::HEADING,
547	'separator' => 'before',
548	'condition' => [
549	'enable_ai_powered_search' => 'true',
550	],
551	]
552	);
553
554	$this->add_group_control(
555	Group_Control_Typography::get_type(),
556	[
557	'name' => 'ai_suggestion_title_typography',
558	'selector' => '{{WRAPPER}} .betterdocs-ai-suggestion .ai-suggestion-prompt .ai-suggestion-text .ai-suggestion-label, {{WRAPPER}} .betterdocs-ai-suggestion .ai-response .ai-response-header .ai-response-title',
559	'condition' => [
560	'enable_ai_powered_search' => 'true',
561	],
562	]
563	);
564
565	$this->add_control(
566	'ai_suggestion_title_color',
567	[
568	'label' => __( 'Title Color', 'betterdocs' ),
569	'type' => Controls_Manager::COLOR,
570	'selectors' => [
571	'{{WRAPPER}} .betterdocs-ai-suggestion .ai-suggestion-prompt .ai-suggestion-text .ai-suggestion-label, , {{WRAPPER}} .betterdocs-ai-suggestion .ai-response .ai-response-header .ai-response-title' => 'color: {{VALUE}};',
572	],
573	'condition' => [
574	'enable_ai_powered_search' => 'true',
575	],
576	]
577	);
578
579	// Query Controls
580	$this->add_control(
581	'ai_suggestion_query_heading',
582	[
583	'label' => __( 'Query', 'betterdocs' ),
584	'type' => Controls_Manager::HEADING,
585	'separator' => 'before',
586	'condition' => [
587	'enable_ai_powered_search' => 'true',
588	],
589	]
590	);
591
592	$this->add_group_control(
593	Group_Control_Typography::get_type(),
594	[
595	'name' => 'ai_suggestion_query_typography',
596	'selector' => '{{WRAPPER}} .betterdocs-ai-suggestion .ai-suggestion-prompt .ai-suggestion-content .ai-suggestion-query',
597	'condition' => [
598	'enable_ai_powered_search' => 'true',
599	],
600	]
601	);
602
603	$this->add_control(
604	'ai_suggestion_query_color',
605	[
606	'label' => __( 'Query Text Color', 'betterdocs' ),
607	'type' => Controls_Manager::COLOR,
608	'selectors' => [
609	'{{WRAPPER}} .betterdocs-ai-suggestion .ai-suggestion-prompt .ai-suggestion-content .ai-suggestion-query' => 'color: {{VALUE}};',
610	],
611	'condition' => [
612	'enable_ai_powered_search' => 'true',
613	],
614	]
615	);
616
617	// Response Controls
618	$this->add_control(
619	'ai_suggestion_response_heading',
620	[
621	'label' => __( 'Response', 'betterdocs' ),
622	'type' => Controls_Manager::HEADING,
623	'separator' => 'before',
624	'condition' => [
625	'enable_ai_powered_search' => 'true',
626	],
627	]
628	);
629
630	$this->add_group_control(
631	Group_Control_Typography::get_type(),
632	[
633	'name' => 'ai_suggestion_response_typography',
634	'selector' => '{{WRAPPER}} .betterdocs-ai-suggestion .ai-response-content',
635	'condition' => [
636	'enable_ai_powered_search' => 'true',
637	],
638	]
639	);
640
641	$this->add_control(
642	'ai_suggestion_response_color',
643	[
644	'label' => __( 'Response Text Color', 'betterdocs' ),
645	'type' => Controls_Manager::COLOR,
646	'selectors' => [
647	'{{WRAPPER}} .betterdocs-ai-suggestion .ai-response-content' => 'color: {{VALUE}};',
648	],
649	'condition' => [
650	'enable_ai_powered_search' => 'true',
651	],
652	]
653	);
654
655	// Button Controls
656	$this->add_control(
657	'ai_suggestion_button_heading',
658	[
659	'label' => __( 'Continue Chat Button', 'betterdocs' ),
660	'type' => Controls_Manager::HEADING,
661	'separator' => 'before',
662	'condition' => [
663	'enable_ai_powered_search' => 'true',
664	],
665	]
666	);
667
668	$this->add_group_control(
669	Group_Control_Typography::get_type(),
670	[
671	'name' => 'ai_suggestion_button_typography',
672	'selector' => '{{WRAPPER}} .betterdocs-ai-suggestion .ai-response .ai-response-actions .continue-conversation-btn',
673	'condition' => [
674	'enable_ai_powered_search' => 'true',
675	],
676	]
677	);
678
679	$this->add_control(
680	'ai_suggestion_button_color',
681	[
682	'label' => __( 'Button Text Color', 'betterdocs' ),
683	'type' => Controls_Manager::COLOR,
684	'selectors' => [
685	'{{WRAPPER}} .betterdocs-ai-suggestion .ai-response .ai-response-actions .continue-conversation-btn' => 'color: {{VALUE}};',
686	],
687	'condition' => [
688	'enable_ai_powered_search' => 'true',
689	],
690	]
691	);
692
693	$this->add_control(
694	'ai_suggestion_button_bg_color',
695	[
696	'label' => __( 'Button Background Color', 'betterdocs' ),
697	'type' => Controls_Manager::COLOR,
698	'selectors' => [
699	'{{WRAPPER}} .betterdocs-ai-suggestion .ai-response .ai-response-actions .continue-conversation-btn' => 'background-color: {{VALUE}};',
700	],
701	'condition' => [
702	'enable_ai_powered_search' => 'true',
703	],
704	]
705	);
706
707	$this->add_responsive_control(
708	'ai_suggestion_button_padding',
709	[
710	'label' => __( 'Button Padding', 'betterdocs' ),
711	'type' => Controls_Manager::DIMENSIONS,
712	'size_units' => [ 'px', '%', 'em' ],
713	'selectors' => [
714	'{{WRAPPER}} .betterdocs-ai-suggestion .ai-response .ai-response-actions .continue-conversation-btn' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
715	],
716	'condition' => [
717	'enable_ai_powered_search' => 'true',
718	],
719	]
720	);
721
722	$this->add_responsive_control(
723	'ai_suggestion_button_margin',
724	[
725	'label' => __( 'Button Margin', 'betterdocs' ),
726	'type' => Controls_Manager::DIMENSIONS,
727	'size_units' => [ 'px', '%', 'em' ],
728	'selectors' => [
729	'{{WRAPPER}} .betterdocs-ai-suggestion .ai-response .ai-response-actions .continue-conversation-btn' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
730	],
731	'condition' => [
732	'enable_ai_powered_search' => 'true',
733	],
734	]
735	);
736
737	$this->add_group_control(
738	Group_Control_Border::get_type(),
739	[
740	'name' => 'ai_suggestion_button_border',
741	'label' => esc_html__( 'Button Border', 'betterdocs' ),
742	'selector' => '{{WRAPPER}} .betterdocs-ai-suggestion .ai-response .ai-response-actions .continue-conversation-btn',
743	'condition' => [
744	'enable_ai_powered_search' => 'true',
745	],
746	]
747	);
748
749	$this->end_controls_section();
750	}
751
752	public function search_box_layout_1() {
753	/**
754	* ----------------------------------------------------------
755	* Section: Search Box
756	* ----------------------------------------------------------
757	*/
758	$this->start_controls_section(
759	'section_search_box_settings',
760	[
761	'label' => __( 'Search Box', 'betterdocs' ),
762	'tab' => Controls_Manager::TAB_STYLE,
763	'condition' => [
764	'layout_select' => 'layout-1'
765	]
766	]
767	);
768
769	$this->add_group_control(
770	Group_Control_Background::get_type(),
771	[
772	'name' => 'search_box_bg',
773	'types' => [ 'classic', 'gradient' ],
774	'selector' => '{{WRAPPER}} .betterdocs-search-form-wrapper'
775	]
776	);
777
778	$this->add_responsive_control(
779	'search_box_padding',
780	[
781	'label' => esc_html__( 'Padding', 'betterdocs' ),
782	'type' => Controls_Manager::DIMENSIONS,
783	'size_units' => [ 'px', 'em', '%' ],
784	'default' => [
785	'top' => 50,
786	'right' => 50,
787	'bottom' => 50,
788	'left' => 50
789	],
790	'selectors' => [
791	'{{WRAPPER}} .betterdocs-search-form-wrapper' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
792	]
793	]
794	);
795
796	$this->add_responsive_control(
797	'search_box_margin',
798	[
799	'label' => esc_html__( 'Margin', 'betterdocs' ),
800	'type' => Controls_Manager::DIMENSIONS,
801	'size_units' => [ 'px', 'em', '%' ],
802	'default' => [
803	'top' => 50,
804	'right' => 50,
805	'bottom' => 50,
806	'left' => 50
807	],
808	'selectors' => [
809	'{{WRAPPER}} .betterdocs-search-form-wrapper' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
810	]
811	]
812	);
813
814	$this->end_controls_section(); # end of 'Search Box'
815	}
816
817	public function search_box_layout_2() {
818	/**
819	* ----------------------------------------------------------
820	* Section: Search Box
821	* ----------------------------------------------------------
822	*/
823	$this->start_controls_section(
824	'section_search_box_settings_layout_2',
825	[
826	'label' => __( 'Search Box', 'betterdocs' ),
827	'tab' => Controls_Manager::TAB_STYLE,
828	'condition' => [
829	'layout_select' => 'layout-2',
830	'search_modal_layout' => [ 'layout-1' ]
831	]
832	]
833	);
834
835	$this->add_group_control(
836	Group_Control_Background::get_type(),
837	[
838	'name' => 'search_box_bg_layout_2',
839	'types' => [ 'classic', 'gradient' ],
840	'selector' => '{{WRAPPER}} .betterdocs-search-layout-1'
841	]
842	);
843
844	$this->add_responsive_control(
845	'search_box_padding_layout_2',
846	[
847	'label' => esc_html__( 'Padding', 'betterdocs' ),
848	'type' => Controls_Manager::DIMENSIONS,
849	'size_units' => [ 'px', 'em', '%' ],
850	'default' => [
851	'top' => 50,
852	'right' => 50,
853	'bottom' => 50,
854	'left' => 50
855	],
856	'selectors' => [
857	'{{WRAPPER}} .betterdocs-search-layout-1' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
858	]
859	]
860	);
861
862	$this->add_responsive_control(
863	'search_box_margin_layout_2',
864	[
865	'label' => esc_html__( 'Margin', 'betterdocs' ),
866	'type' => Controls_Manager::DIMENSIONS,
867	'size_units' => [ 'px', 'em', '%' ],
868	'default' => [
869	'top' => 50,
870	'right' => 50,
871	'bottom' => 50,
872	'left' => 50
873	],
874	'selectors' => [
875	'{{WRAPPER}} .betterdocs-search-layout-1' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
876	]
877	]
878	);
879
880	$this->end_controls_section(); # end of 'Search Box'
881	}
882
883	public function search_field_layout_1() {
884	/**
885	* ----------------------------------------------------------
886	* Section: Search Field
887	* ----------------------------------------------------------
888	*/
889	$this->start_controls_section(
890	'section_search_field_settings',
891	[
892	'label' => __( 'Search Field', 'betterdocs' ),
893	'tab' => Controls_Manager::TAB_STYLE,
894	'condition' => [
895	'layout_select' => 'layout-1'
896	]
897	]
898	);
899
900	$this->add_control(
901	'search_field_bg',
902	[
903	'label' => esc_html__( 'Field Background Color', 'betterdocs' ),
904	'type' => Controls_Manager::COLOR,
905	'selectors' => [
906	'{{WRAPPER}} .betterdocs-searchform' => 'background: {{VALUE}};'
907	]
908	]
909	);
910
911	$this->add_control(
912	'search_field_text_color',
913	[
914	'label' => esc_html__( 'Text Color', 'betterdocs' ),
915	'type' => Controls_Manager::COLOR,
916	'selectors' => [
917	'{{WRAPPER}} .betterdocs-searchform .betterdocs-search-field' => 'color: {{VALUE}};'
918	]
919	]
920	);
921
922	$this->add_group_control(
923	Group_Control_Typography::get_type(),
924	[
925	'name' => 'search_field_text_typography',
926	'selector' => '{{WRAPPER}} .betterdocs-searchform .betterdocs-search-field'
927	]
928	);
929
930	$this->add_responsive_control(
931	'search_field_padding',
932	[
933	'label' => __( 'Field Padding', 'betterdocs' ),
934	'type' => Controls_Manager::DIMENSIONS,
935	'size_units' => [ 'px', 'em', '%' ],
936	'selectors' => [
937	'{{WRAPPER}} .betterdocs-searchform .betterdocs-search-field' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
938	]
939	]
940	);
941
942	$this->add_control(
943	'search_field_placeholder',
944	[
945	'label' => esc_html__( 'Field Placeholder Color', 'betterdocs' ),
946	'type' => Controls_Manager::COLOR,
947	'selectors' => [
948	'{{WRAPPER}} .betterdocs-searchform .betterdocs-search-field::placeholder' => 'color: {{VALUE}};'
949	]
950	]
951	);
952
953	$this->add_responsive_control(
954	'search_box_outer_margin',
955	[
956	'label' => __( 'Search Box Margin', 'betterdocs' ),
957	'type' => Controls_Manager::DIMENSIONS,
958	'size_units' => [ 'px', 'em', '%' ],
959	'selectors' => [
960	'{{WRAPPER}} .betterdocs-searchform' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
961	]
962	]
963	);
964
965	$this->add_responsive_control(
966	'advanced_search_padding',
967	[
968	'label' => __( 'Search Box Padding', 'betterdocs' ),
969	'type' => Controls_Manager::DIMENSIONS,
970	'size_units' => [ 'px', 'em', '%' ],
971	'selectors' => [
972	'{{WRAPPER}} .betterdocs-searchform' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
973	]
974	]
975	);
976
977	$this->add_group_control(
978	Group_Control_Border::get_type(),
979	[
980	'name' => 'advanced_search_border',
981	'label' => esc_html__( 'Search Box Border', 'betterdocs' ),
982	'selector' => '{{WRAPPER}} .betterdocs-searchform'
983	]
984	);
985
986	$this->add_control(
987	'search_box_outer_width',
988	[
989	'label' => esc_html__( 'Size', 'betterdocs' ),
990	'type' => Controls_Manager::SLIDER,
991	'size_units' => [ 'px', '%', 'em' ],
992	'default' => [
993	'unit' => '%',
994	'size' => 100
995	],
996	'selectors' => [
997	'{{WRAPPER}} .betterdocs-searchform' => 'width: {{SIZE}}{{UNIT}}; height: auto;'
998	]
999	]
1000	);
1001
1002	$this->add_responsive_control(
1003	'search_field_padding_radius',
1004	[
1005	'label' => esc_html__( 'Border Radius', 'betterdocs' ),
1006	'type' => Controls_Manager::DIMENSIONS,
1007	'size_units' => [ 'px', 'em', '%' ],
1008	'selectors' => [
1009	'{{WRAPPER}} .betterdocs-searchform' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
1010	]
1011	]
1012	);
1013
1014	$this->add_control(
1015	'field_search_icon_heading',
1016	[
1017	'label' => esc_html__( 'Search Icon', 'betterdocs' ),
1018	'type' => Controls_Manager::HEADING,
1019	'separator' => 'before'
1020	]
1021	);
1022
1023	$this->add_control(
1024	'field_search_icon_color',
1025	[
1026	'label' => esc_html__( 'Color', 'betterdocs' ),
1027	'type' => Controls_Manager::COLOR,
1028	'selectors' => [
1029	'{{WRAPPER}} .betterdocs-searchform svg.docs-search-icon' => 'fill: {{VALUE}};'
1030	]
1031	]
1032	);
1033
1034	$this->add_control(
1035	'field_search_icon_size',
1036	[
1037	'label' => esc_html__( 'Size', 'betterdocs' ),
1038	'type' => Controls_Manager::SLIDER,
1039	'size_units' => [ 'px', '%', 'em' ],
1040	'range' => [
1041	'px' => [
1042	'max' => 500
1043	]
1044	],
1045	'selectors' => [
1046	'{{WRAPPER}} .betterdocs-searchform svg.docs-search-icon' => 'width: {{SIZE}}{{UNIT}}; height: auto;'
1047	]
1048	]
1049	);
1050
1051	$this->add_control(
1052	'field_close_icon_heading',
1053	[
1054	'label' => esc_html__( 'Close Icon', 'betterdocs' ),
1055	'type' => Controls_Manager::HEADING,
1056	'separator' => 'before'
1057	]
1058	);
1059
1060	$this->add_control(
1061	'search_field_close_icon_color',
1062	[
1063	'label' => esc_html__( 'Color', 'betterdocs' ),
1064	'type' => Controls_Manager::COLOR,
1065	'selectors' => [
1066	'{{WRAPPER}} .docs-search-close .close-line' => 'fill: {{VALUE}};'
1067	]
1068	]
1069	);
1070
1071	$this->add_control(
1072	'search_field_close_icon_border_color',
1073	[
1074	'label' => esc_html__( 'Border Color', 'betterdocs' ),
1075	'type' => Controls_Manager::COLOR,
1076	'selectors' => [
1077	'{{WRAPPER}} .docs-search-loader, {{WRAPPER}} .docs-search-close .close-border' => 'fill: {{VALUE}};'
1078	]
1079	]
1080	);
1081
1082	$this->end_controls_section(); # end of 'Search Field'
1083	}
1084
1085	public function search_field_layout_2() {
1086	/**
1087	* ----------------------------------------------------------
1088	* Section: Search Field
1089	* ----------------------------------------------------------
1090	*/
1091	$this->start_controls_section(
1092	'section_search_field_settings_layout_2',
1093	[
1094	'label' => __( 'Search Field', 'betterdocs' ),
1095	'tab' => Controls_Manager::TAB_STYLE,
1096	'condition' => [
1097	'layout_select' => 'layout-2'
1098	]
1099	]
1100	);
1101
1102	$this->add_control(
1103	'search_field_bg_layout_2',
1104	[
1105	'label' => esc_html__( 'Field Background Color', 'betterdocs' ),
1106	'type' => Controls_Manager::COLOR,
1107	'selectors' => [
1108	'{{WRAPPER}} .betterdocs-search-layout-1 .search-bar, {{WRAPPER}} .betterdocs-search-form-widget-wrapper .betterdocs-live-search .betterdocs-searchform' => 'background: {{VALUE}};'
1109	]
1110	]
1111	);
1112
1113	$this->add_control(
1114	'search_field_text_color_layout_2',
1115	[
1116	'label' => esc_html__( 'Text Color', 'betterdocs' ),
1117	'type' => Controls_Manager::COLOR,
1118	'selectors' => [
1119	'{{WRAPPER}} .betterdocs-search-layout-1 .search-bar .search-input-wrapper .search-input, {{WRAPPER}} .betterdocs-search-form-widget-wrapper .betterdocs-live-search .betterdocs-searchform .betterdocs-searchform-input-wrap .betterdocs-search-command' => 'color: {{VALUE}};'
1120	]
1121	]
1122	);
1123
1124	$this->add_group_control(
1125	Group_Control_Typography::get_type(),
1126	[
1127	'name' => 'search_field_text_typography_layout_2',
1128	'selector' => '{{WRAPPER}} .betterdocs-search-layout-1 .search-bar .search-input-wrapper .search-input,, {{WRAPPER}} .betterdocs-search-form-widget-wrapper .betterdocs-live-search .betterdocs-searchform .betterdocs-searchform-input-wrap .betterdocs-search-command'
1129	]
1130	);
1131
1132	$this->add_responsive_control(
1133	'search_field_padding_layout_2',
1134	[
1135	'label' => __( 'Field Padding', 'betterdocs' ),
1136	'type' => Controls_Manager::DIMENSIONS,
1137	'size_units' => [ 'px', 'em', '%' ],
1138	'selectors' => [
1139	'{{WRAPPER}} .betterdocs-search-layout-1 .search-bar, {{WRAPPER}} .betterdocs-search-form-widget-wrapper .betterdocs-live-search .betterdocs-searchform' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
1140	]
1141	]
1142	);
1143
1144	$this->add_responsive_control(
1145	'search_box_outer_margin_layout_2',
1146	[
1147	'label' => __( 'Search Box Margin', 'betterdocs' ),
1148	'type' => Controls_Manager::DIMENSIONS,
1149	'size_units' => [ 'px', 'em', '%' ],
1150	'selectors' => [
1151	'{{WRAPPER}} .betterdocs-search-layout-1 .search-bar' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
1152	],
1153	'condition' => [
1154	'layout_select' => [ 'layout-2' ],
1155	'search_modal_layout' => [ 'layout-1' ]
1156	]
1157	]
1158	);
1159
1160	$this->add_responsive_control(
1161	'advanced_search_padding_layout_2',
1162	[
1163	'label' => __( 'Search Box Padding', 'betterdocs' ),
1164	'type' => Controls_Manager::DIMENSIONS,
1165	'size_units' => [ 'px', 'em', '%' ],
1166	'selectors' => [
1167	'{{WRAPPER}} .betterdocs-search-layout-1 .search-bar' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
1168	],
1169	'condition' => [
1170	'layout_select' => [ 'layout-2' ],
1171	'search_modal_layout' => [ 'layout-1' ]
1172	]
1173	]
1174	);
1175
1176	$this->add_group_control(
1177	Group_Control_Border::get_type(),
1178	[
1179	'name' => 'advanced_search_border_layout_2',
1180	'label' => esc_html__( 'Search Box Border', 'betterdocs' ),
1181	'selector' => '{{WRAPPER}} .betterdocs-search-layout-1 .search-bar',
1182	'condition' => [
1183	'layout_select' => [ 'layout-2' ],
1184	'search_modal_layout' => [ 'layout-1' ]
1185	]
1186	],
1187	);
1188
1189	$this->add_control(
1190	'search_box_outer_width_layout_2',
1191	[
1192	'label' => esc_html__( 'Size', 'betterdocs' ),
1193	'type' => Controls_Manager::SLIDER,
1194	'size_units' => [ 'px', '%', 'em' ],
1195	'default' => [
1196	'unit' => '%',
1197	'size' => 100
1198	],
1199	'selectors' => [
1200	'{{WRAPPER}} .betterdocs-search-layout-1 .search-bar' => 'width: {{SIZE}}{{UNIT}}; height: auto;'
1201	],
1202	'condition' => [
1203	'layout_select' => [ 'layout-2' ],
1204	'search_modal_layout' => [ 'layout-1' ]
1205	]
1206	]
1207	);
1208
1209	$this->add_responsive_control(
1210	'search_field_padding_radius_layout_2',
1211	[
1212	'label' => esc_html__( 'Border Radius', 'betterdocs' ),
1213	'type' => Controls_Manager::DIMENSIONS,
1214	'size_units' => [ 'px', 'em', '%' ],
1215	'selectors' => [
1216	'{{WRAPPER}} .betterdocs-search-layout-1 .search-bar' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
1217	],
1218	'condition' => [
1219	'layout_select' => [ 'layout-2' ],
1220	'search_modal_layout' => [ 'layout-1' ]
1221	]
1222	]
1223	);
1224
1225	$this->add_control(
1226	'field_search_icon_heading_layout_2',
1227	[
1228	'label' => esc_html__( 'Search Icon', 'betterdocs' ),
1229	'type' => Controls_Manager::HEADING,
1230	'separator' => 'before'
1231	]
1232	);
1233
1234	$this->add_control(
1235	'field_search_icon_color_layout_2',
1236	[
1237	'label' => esc_html__( 'Color', 'betterdocs' ),
1238	'type' => Controls_Manager::COLOR,
1239	'selectors' => [
1240	'{{WRAPPER}} .betterdocs-search-layout-1 .search-bar .search-input-wrapper .search-icon g path, {{WRAPPER}} .betterdocs-search-form-widget-wrapper .betterdocs-live-search .betterdocs-searchform .betterdocs-searchform-input-wrap svg path' => 'fill: {{VALUE}};'
1241	]
1242	]
1243	);
1244
1245	$this->add_control(
1246	'field_search_icon_size_layout_2',
1247	[
1248	'label' => esc_html__( 'Size', 'betterdocs' ),
1249	'type' => Controls_Manager::SLIDER,
1250	'size_units' => [ 'px', '%', 'em' ],
1251	'range' => [
1252	'px' => [
1253	'max' => 500
1254	]
1255	],
1256	'selectors' => [
1257	'{{WRAPPER}} .betterdocs-search-layout-1 .search-bar .search-input-wrapper .search-icon, {{WRAPPER}} .betterdocs-search-form-widget-wrapper .betterdocs-live-search .betterdocs-searchform .betterdocs-searchform-input-wrap svg' => 'width: {{SIZE}}{{UNIT}}; height: auto;'
1258	]
1259	]
1260	);
1261
1262	$this->add_control(
1263	'field_search_button_heading_layout_2',
1264	[
1265	'label' => esc_html__( 'Search Button', 'betterdocs' ),
1266	'type' => Controls_Manager::HEADING,
1267	'separator' => 'before'
1268	]
1269	);
1270
1271	$this->add_control(
1272	'field_search_button_color_layout_2',
1273	[
1274	'label' => esc_html__( 'Color', 'betterdocs' ),
1275	'type' => Controls_Manager::COLOR,
1276	'selectors' => [
1277	'{{WRAPPER}} .betterdocs-search-layout-1 .search-bar .search-button, {{WRAPPER}} .betterdocs-search-modal-archive .betterdocs-live-search .betterdocs-searchform .search-button' => 'color: {{VALUE}};'
1278	]
1279	]
1280	);
1281
1282	$this->add_control(
1283	'field_search_button_background_color_layout_2',
1284	[
1285	'label' => esc_html__( 'Background Color', 'betterdocs' ),
1286	'type' => Controls_Manager::COLOR,
1287	'selectors' => [
1288	'{{WRAPPER}} .betterdocs-search-layout-1 .search-bar .search-button, {{WRAPPER}} .betterdocs-search-modal-archive .betterdocs-live-search .betterdocs-searchform .search-button' => 'background-color: {{VALUE}};'
1289	]
1290	]
1291	);
1292
1293	$this->add_responsive_control(
1294	'field_search_button_border_radius_layout_2',
1295	[
1296	'label' => esc_html__( 'Border Radius', 'betterdocs' ),
1297	'type' => Controls_Manager::DIMENSIONS,
1298	'size_units' => [ 'px', 'em', '%' ],
1299	'selectors' => [
1300	'{{WRAPPER}} .betterdocs-search-layout-1 .search-bar .search-button, {{WRAPPER}} .betterdocs-search-modal-archive .betterdocs-live-search .betterdocs-searchform .search-button' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
1301	]
1302	]
1303	);
1304
1305	$this->add_group_control(
1306	Group_Control_Typography::get_type(),
1307	[
1308	'name' => 'field_search_button_typography_layout_2',
1309	'selector' => '{{WRAPPER}} .betterdocs-search-layout-1 .search-bar .search-button, {{WRAPPER}} .betterdocs-search-modal-archive .betterdocs-live-search .betterdocs-searchform .search-button'
1310	]
1311	);
1312
1313	$this->end_controls_section(); # end of 'Search Field'
1314	}
1315
1316	public function search_modal_layout() {
1317	$this->start_controls_section(
1318	'search_modal',
1319	[
1320	'label' => __( 'Search Modal', 'betterdocs' ),
1321	'tab' => Controls_Manager::TAB_STYLE,
1322	'condition' => [
1323	'layout_select' => 'layout-2'
1324	]
1325	]
1326	);
1327
1328	$this->add_control(
1329	'search_modal_field',
1330	[
1331	'label' => esc_html__( 'Search Field', 'betterdocs' ),
1332	'type' => Controls_Manager::HEADING,
1333	'separator' => 'before',
1334	]
1335	);
1336
1337	$this->add_responsive_control(
1338	'search_magnifier_color',
1339	[
1340	'label' => esc_html__( 'Magnifier Color', 'betterdocs' ),
1341	'type' => Controls_Manager::COLOR,
1342	'selectors' => [
1343	'{{WRAPPER}} .betterdocs-search-wrapper .betterdocs-search-details .betterdocs-search-header svg g path' => 'fill: {{VALUE}};'
1344	]
1345	]
1346	);
1347
1348	$this->add_responsive_control(
1349	'search_field_background_color',
1350	[
1351	'label' => esc_html__( 'Field Background Color', 'betterdocs' ),
1352	'type' => Controls_Manager::COLOR,
1353	'selectors' => [
1354	'{{WRAPPER}} .betterdocs-search-wrapper .betterdocs-search-details .betterdocs-search-header' => 'background-color: {{VALUE}};'
1355	]
1356	]
1357	);
1358
1359	$this->add_group_control(
1360	Group_Control_Typography::get_type(),
1361	[
1362	'name' => 'search_modal_field_typography',
1363	'selector' => '{{WRAPPER}} .betterdocs-search-wrapper .betterdocs-search-details .betterdocs-search-header .betterdocs-searchform-input-wrap .betterdocs-search-field'
1364	]
1365	);
1366
1367	$this->add_responsive_control(
1368	'search_modal_field_color',
1369	[
1370	'label' => esc_html__( 'Field Text Color', 'betterdocs' ),
1371	'type' => Controls_Manager::COLOR,
1372	'selectors' => [
1373	'{{WRAPPER}} .betterdocs-search-wrapper .betterdocs-search-details .betterdocs-search-header .betterdocs-searchform-input-wrap .betterdocs-search-field' => 'color: {{VALUE}};'
1374	]
1375	]
1376	);
1377
1378	$this->add_responsive_control(
1379	'search_modal_field_placeholder_color',
1380	[
1381	'label' => esc_html__( 'Field Placeholder Color', 'betterdocs' ),
1382	'type' => Controls_Manager::COLOR,
1383	'selectors' => [
1384	'{{WRAPPER}} .betterdocs-search-wrapper .betterdocs-search-details .betterdocs-search-header .betterdocs-searchform-input-wrap .betterdocs-search-field::placeholder' => 'color: {{VALUE}};'
1385	]
1386	]
1387	);
1388
1389	$this->add_control(
1390	'search_modal_category_section',
1391	[
1392	'label' => esc_html__( 'Search Category', 'betterdocs' ),
1393	'type' => Controls_Manager::HEADING,
1394	'separator' => 'before',
1395	]
1396	);
1397
1398	$this->add_responsive_control(
1399	'search_modal_categories_color',
1400	[
1401	'label' => esc_html__( 'Color', 'betterdocs' ),
1402	'type' => Controls_Manager::COLOR,
1403	'selectors' => [
1404	'{{WRAPPER}} .betterdocs-search-wrapper .betterdocs-search-details .betterdocs-search-header .betterdocs-select-option-wrapper .betterdocs-form-select' => 'color: {{VALUE}};'
1405	]
1406	]
1407	);
1408
1409	$this->add_group_control(
1410	Group_Control_Typography::get_type(),
1411	[
1412	'name' => 'search_modal_categories_typography',
1413	'selector' => '{{WRAPPER}} .betterdocs-search-wrapper .betterdocs-search-details .betterdocs-search-header .betterdocs-select-option-wrapper .betterdocs-form-select'
1414	]
1415	);
1416
1417	$this->add_control(
1418	'search_modal_content_tabs',
1419	[
1420	'label' => esc_html__( 'Content Tabs', 'betterdocs' ),
1421	'type' => Controls_Manager::HEADING,
1422	'separator' => 'before',
1423	]
1424	);
1425
1426	$this->add_group_control(
1427	Group_Control_Typography::get_type(),
1428	[
1429	'name' => 'search_modal_content_tabs_typography',
1430	'selector' => '{{WRAPPER}} .betterdocs-search-wrapper .betterdocs-search-details .betterdocs-search-content .betterdocs-search-info-tab .betterdocs-tab-items span'
1431	]
1432	);
1433
1434	$this->add_control(
1435	'search_modal_content_tabs_icon_size',
1436	[
1437	'label' => __( 'Icon Size', 'betterdocs' ),
1438	'type' => Controls_Manager::SLIDER,
1439	'size_units' => [ 'px', '%' ],
1440	'range' => [
1441	'px' => [
1442	'min' => 0,
1443	'max' => 1000,
1444	'step' => 5
1445	],
1446	'%' => [
1447	'min' => 0,
1448	'max' => 100
1449	]
1450	],
1451	'selectors' => [
1452	'{{WRAPPER}} .betterdocs-search-wrapper .betterdocs-search-details .betterdocs-search-content .betterdocs-search-info-tab .betterdocs-tab-items span svg' => 'height: {{SIZE}}{{UNIT}}; width:{{SIZE}}{{UNIT}};'
1453	]
1454	]
1455	);
1456
1457	$this->add_responsive_control(
1458	'search_modal_content_tabs_icon_colors',
1459	[
1460	'label' => esc_html__( 'Icon Color', 'betterdocs' ),
1461	'type' => Controls_Manager::COLOR,
1462	'selectors' => [
1463	'{{WRAPPER}} .betterdocs-search-wrapper .betterdocs-search-details .betterdocs-search-content .betterdocs-search-info-tab .betterdocs-tab-items span svg path' => 'fill: {{VALUE}};'
1464	]
1465	]
1466	);
1467
1468	$this->add_group_control(
1469	Group_Control_Border::get_type(),
1470	[
1471	'name' => 'search_modal_content_active_tab_border',
1472	'label' => esc_html__( 'Border', 'betterdocs' ),
1473	'selector' => '{{WRAPPER}} .betterdocs-search-wrapper .betterdocs-search-details .betterdocs-search-content .betterdocs-search-info-tab .betterdocs-tab-items.active'
1474	]
1475	);
1476
1477	$this->add_control(
1478	'search_modal_content_list',
1479	[
1480	'label' => esc_html__( 'Content List', 'betterdocs' ),
1481	'type' => Controls_Manager::HEADING,
1482	'separator' => 'before',
1483	]
1484	);
1485
1486	$this->add_group_control(
1487	Group_Control_Typography::get_type(),
1488	[
1489	'name' => 'search_modal_content_list_typography',
1490	'selector' => '{{WRAPPER}} .betterdocs-search-wrapper .betterdocs-search-details .betterdocs-search-content .betterdocs-search-items-wrapper .betterdocs-search-item-content .betterdocs-search-item-list .content-main h4'
1491	]
1492	);
1493
1494	$this->add_responsive_control(
1495	'search_modal_content_list_color',
1496	[
1497	'label' => esc_html__( 'Color', 'betterdocs' ),
1498	'type' => Controls_Manager::COLOR,
1499	'selectors' => [
1500	'{{WRAPPER}} .betterdocs-search-wrapper .betterdocs-search-details .betterdocs-search-content .betterdocs-search-items-wrapper .betterdocs-search-item-content .betterdocs-search-item-list .content-main h4' => 'color: {{VALUE}};'
1501	]
1502	]
1503	);
1504
1505	$this->add_control(
1506	'search_modal_content_list_icon_size',
1507	[
1508	'label' => __( 'Icon Size', 'betterdocs' ),
1509	'type' => Controls_Manager::SLIDER,
1510	'size_units' => [ 'px', '%' ],
1511	'range' => [
1512	'px' => [
1513	'min' => 0,
1514	'max' => 1000,
1515	'step' => 5
1516	],
1517	'%' => [
1518	'min' => 0,
1519	'max' => 100
1520	]
1521	],
1522	'selectors' => [
1523	'{{WRAPPER}} .betterdocs-search-wrapper .betterdocs-search-details .betterdocs-search-content .betterdocs-search-items-wrapper .betterdocs-search-item-content .betterdocs-search-item-list .content-main svg' => 'height: {{SIZE}}{{UNIT}}; width:{{SIZE}}{{UNIT}};'
1524	]
1525	]
1526	);
1527
1528	$this->add_group_control(
1529	Group_Control_Border::get_type(),
1530	[
1531	'name' => 'search_modal_content_list_border',
1532	'label' => esc_html__( 'Border', 'betterdocs' ),
1533	'selector' => '{{WRAPPER}} .betterdocs-search-wrapper .betterdocs-search-details .betterdocs-search-content .betterdocs-search-items-wrapper .betterdocs-search-item-content .betterdocs-search-item-list'
1534	]
1535	);
1536
1537	$this->add_control(
1538	'search_modal_content_list_category',
1539	[
1540	'label' => esc_html__( 'Content List Category', 'betterdocs' ),
1541	'type' => Controls_Manager::HEADING,
1542	'separator' => 'before',
1543	]
1544	);
1545
1546	$this->add_group_control(
1547	Group_Control_Typography::get_type(),
1548	[
1549	'name' => 'search_modal_content_list_category_typography',
1550	'selector' => '{{WRAPPER}} .betterdocs-search-wrapper .betterdocs-search-details .betterdocs-search-content .betterdocs-search-items-wrapper .betterdocs-search-item-content .betterdocs-search-item-list .content-sub h5'
1551	]
1552	);
1553
1554	$this->add_responsive_control(
1555	'search_modal_content_list_category_color',
1556	[
1557	'label' => esc_html__( 'Color', 'betterdocs' ),
1558	'type' => Controls_Manager::COLOR,
1559	'selectors' => [
1560	'{{WRAPPER}} .betterdocs-search-wrapper .betterdocs-search-details .betterdocs-search-content .betterdocs-search-items-wrapper .betterdocs-search-item-content .betterdocs-search-item-list .content-sub h5' => 'color: {{VALUE}};'
1561	]
1562	]
1563	);
1564
1565	$this->add_control(
1566	'search_modal_content_list_category_icon_size',
1567	[
1568	'label' => __( 'Icon Size', 'betterdocs' ),
1569	'type' => Controls_Manager::SLIDER,
1570	'size_units' => [ 'px', '%' ],
1571	'range' => [
1572	'px' => [
1573	'min' => 0,
1574	'max' => 1000,
1575	'step' => 5
1576	],
1577	'%' => [
1578	'min' => 0,
1579	'max' => 100
1580	]
1581	],
1582	'selectors' => [
1583	'{{WRAPPER}} .betterdocs-search-wrapper .betterdocs-search-details .betterdocs-search-content .betterdocs-search-items-wrapper .betterdocs-search-item-content .betterdocs-search-item-list .content-sub svg' => 'height: {{SIZE}}{{UNIT}}; width:{{SIZE}}{{UNIT}};'
1584	]
1585	]
1586	);
1587
1588	$this->end_controls_section();
1589	}
1590
1591	public function search_result_box_layout_1() {
1592	/**
1593	* ----------------------------------------------------------
1594	* Section: Search Result Box
1595	* ----------------------------------------------------------
1596	*/
1597	$this->start_controls_section(
1598	'section_search_result_settings',
1599	[
1600	'label' => __( 'Search Result Box', 'betterdocs' ),
1601	'tab' => Controls_Manager::TAB_STYLE,
1602	'condition' => [
1603	'layout_select' => 'layout-1'
1604	]
1605	]
1606	);
1607
1608	$this->add_responsive_control(
1609	'result_box_width',
1610	[
1611	'label' => __( 'Width', 'betterdocs' ),
1612	'type' => Controls_Manager::SLIDER,
1613	'default' => [
1614	'size' => 100,
1615	'unit' => '%'
1616	],
1617	'size_units' => [ '%', 'px', 'em' ],
1618	'range' => [
1619	'%' => [
1620	'max' => 100,
1621	'step' => 1
1622	]
1623	],
1624	'selectors' => [
1625	'{{WRAPPER}} .betterdocs-live-search .docs-search-result' => 'width: {{SIZE}}{{UNIT}};'
1626	]
1627	]
1628	);
1629
1630	$this->add_responsive_control(
1631	'result_box_max_width',
1632	[
1633	'label' => __( 'Max Width', 'betterdocs' ),
1634	'type' => Controls_Manager::SLIDER,
1635	'default' => [
1636	'size' => 1600,
1637	'unit' => 'px'
1638	],
1639	'size_units' => [ 'px', 'em' ],
1640	'range' => [
1641	'px' => [
1642	'max' => 1600,
1643	'step' => 1
1644	]
1645	],
1646	'selectors' => [
1647	'{{WRAPPER}} .betterdocs-live-search .docs-search-result' => 'max-width: {{SIZE}}{{UNIT}};'
1648	]
1649	]
1650	);
1651
1652	$this->add_group_control(
1653	Group_Control_Background::get_type(),
1654	[
1655	'name' => 'result_box_bg',
1656	'types' => [ 'classic', 'gradient' ],
1657	'selector' => '{{WRAPPER}} .betterdocs-live-search .docs-search-result'
1658	]
1659	);
1660
1661	$this->add_group_control(
1662	Group_Control_Border::get_type(),
1663	[
1664	'name' => 'result_box_border',
1665	'label' => esc_html__( 'Border', 'betterdocs' ),
1666	'selector' => '{{WRAPPER}} .betterdocs-live-search .docs-search-result'
1667	]
1668	);
1669
1670	$this->end_controls_section(); # end of 'Search Result Box'
1671	}
1672
1673	public function search_result_list_layout_1() {
1674	/**
1675	* ----------------------------------------------------------
1676	* Section: Search Result Item
1677	* ----------------------------------------------------------
1678	*/
1679	$this->start_controls_section(
1680	'section_search_result_item_settings',
1681	[
1682	'label' => __( 'Search Result List', 'betterdocs' ),
1683	'tab' => Controls_Manager::TAB_STYLE,
1684	'condition' => [
1685	'layout_select' => 'layout-1'
1686	]
1687	]
1688	);
1689
1690	$this->start_controls_tabs( 'item_settings_tab' );
1691
1692	// Normal State Tab
1693	$this->start_controls_tab(
1694	'item_normal',
1695	[ 'label' => esc_html__( 'Normal', 'betterdocs' ) ]
1696	);
1697
1698	$this->add_control(
1699	'result_box_item',
1700	[
1701	'label' => esc_html__( 'Item', 'betterdocs' ),
1702	'type' => Controls_Manager::HEADING
1703	]
1704	);
1705
1706	$this->add_group_control(
1707	Group_Control_Typography::get_type(),
1708	[
1709	'name' => 'result_box_item_typography',
1710	'selector' => '{{WRAPPER}} .betterdocs-live-search .docs-search-result li a .betterdocs-search-title'
1711	]
1712	);
1713
1714	$this->add_control(
1715	'result_box_item_color',
1716	[
1717	'label' => esc_html__( 'Item Color', 'betterdocs' ),
1718	'type' => Controls_Manager::COLOR,
1719	'selectors' => [
1720	'{{WRAPPER}} .betterdocs-live-search .docs-search-result li a .betterdocs-search-title' => 'color: {{VALUE}};'
1721	]
1722	]
1723	);
1724
1725	$this->add_group_control(
1726	Group_Control_Border::get_type(),
1727	[
1728	'name' => 'result_item_border',
1729	'label' => esc_html__( 'Border', 'betterdocs' ),
1730	'selector' => '{{WRAPPER}} .betterdocs-live-search .docs-search-result li'
1731	]
1732	);
1733
1734	$this->add_responsive_control(
1735	'result_box_item_padding',
1736	[
1737	'label' => __( 'Padding', 'betterdocs' ),
1738	'type' => Controls_Manager::DIMENSIONS,
1739	'size_units' => [ 'px', 'em', '%' ],
1740	'selectors' => [
1741	'{{WRAPPER}} .betterdocs-live-search .docs-search-result li a' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
1742	]
1743	]
1744	);
1745
1746	$this->add_control(
1747	'search_result_box_item_category',
1748	[
1749	'label' => esc_html__( 'Category', 'betterdocs' ),
1750	'type' => Controls_Manager::HEADING,
1751	'separator' => 'before'
1752	]
1753	);
1754
1755	$this->add_group_control(
1756	Group_Control_Typography::get_type(),
1757	[
1758	'name' => 'result_box_item_category_typography',
1759	'selector' => '{{WRAPPER}} .betterdocs-live-search .docs-search-result li span.betterdocs-search-category'
1760	]
1761	);
1762
1763	$this->add_control(
1764	'result_box_item_category_color',
1765	[
1766	'label' => esc_html__( 'Color', 'betterdocs' ),
1767	'type' => Controls_Manager::COLOR,
1768	'selectors' => [
1769	'{{WRAPPER}} .betterdocs-live-search .docs-search-result li span.betterdocs-search-category' => 'color: {{VALUE}};'
1770	]
1771	]
1772	);
1773
1774	$this->end_controls_tab();
1775
1776	// Hover State Tab
1777	$this->start_controls_tab(
1778	'item_hover',
1779	[ 'label' => esc_html__( 'Hover', 'betterdocs' ) ]
1780	);
1781
1782	$this->add_responsive_control(
1783	'result_item_transition',
1784	[
1785	'label' => __( 'Transition', 'betterdocs' ),
1786	'type' => Controls_Manager::SLIDER,
1787	'default' => [
1788	'size' => 300,
1789	'unit' => '%'
1790	],
1791	'size_units' => [ '%' ],
1792	'range' => [
1793	'%' => [
1794	'max' => 2500,
1795	'step' => 1
1796	]
1797	],
1798	'selectors' => [
1799	'{{WRAPPER}} .betterdocs-live-search .docs-search-result li, {{WRAPPER}} .betterdocs-live-search .docs-search-result li a, {{WRAPPER}} .betterdocs-live-search .docs-search-result li span, {{WRAPPER}} .betterdocs-live-search .docs-search-result' => 'transition: {{SIZE}}ms;'
1800	]
1801	]
1802	);
1803
1804	$this->add_control(
1805	'result_box_item_hover_heading',
1806	[
1807	'label' => esc_html__( 'Item', 'betterdocs' ),
1808	'type' => Controls_Manager::HEADING
1809	]
1810	);
1811
1812	$this->add_group_control(
1813	Group_Control_Background::get_type(),
1814	[
1815	'name' => 'result_box_item_hover_bg',
1816	'types' => [ 'classic', 'gradient' ],
1817	'selector' => '{{WRAPPER}} .betterdocs-live-search .docs-search-result li:hover',
1818	'exclude' => [
1819	'image'
1820	]
1821	]
1822	);
1823
1824	$this->add_control(
1825	'result_box_item_hover_color',
1826	[
1827	'label' => esc_html__( 'Item Color', 'betterdocs' ),
1828	'type' => Controls_Manager::COLOR,
1829	'selectors' => [
1830	'{{WRAPPER}} .betterdocs-live-search .docs-search-result li:hover a' => 'color: {{VALUE}};'
1831	]
1832	]
1833	);
1834
1835	$this->add_group_control(
1836	Group_Control_Border::get_type(),
1837	[
1838	'name' => 'result_item_hover_border',
1839	'label' => esc_html__( 'Border', 'betterdocs' ),
1840	'selector' => '{{WRAPPER}} .betterdocs-live-search .docs-search-result li:hover'
1841	]
1842	);
1843
1844	$this->add_control(
1845	'result_box_item_hover_count_heading',
1846	[
1847	'label' => esc_html__( 'Count', 'betterdocs' ),
1848	'type' => Controls_Manager::HEADING,
1849	'separator' => 'before'
1850	]
1851	);
1852
1853	$this->add_control(
1854	'result_box_item_hover_count_color',
1855	[
1856	'label' => esc_html__( 'Item Color', 'betterdocs' ),
1857	'type' => Controls_Manager::COLOR,
1858	'selectors' => [
1859	'{{WRAPPER}} .betterdocs-live-search .docs-search-result li:hover span' => 'color: {{VALUE}};'
1860	]
1861	]
1862	);
1863	$this->end_controls_tab();
1864	$this->end_controls_tabs();
1865
1866	$this->end_controls_section(); # end of 'Search Result Item'
1867
1868	do_action( 'betterdocs/elementor/widgets/advanced-search/controllers', $this );
1869	}
1870
1871	public function render_callback() {
1872	$settings = &$this->attributes;
1873
1874	// Always ensure content is output to prevent empty widget background
1875	if ( $settings['layout_select'] == 'layout-1' ) {
1876	$this->views( 'widgets/search-form' );
1877	} else {
1878	$number_of_docs = isset( $settings['initial_docs_number'] ) ? $settings['initial_docs_number'] : '';
1879	$number_of_faqs = isset( $settings['initial_faqs_number'] ) ? $settings['initial_faqs_number'] : '';
1880	$doc_categories_ids = isset( $settings['search_modal_query_term_ids'] ) ? $settings['search_modal_query_term_ids'] : '';
1881	$doc_ids = isset( $settings['search_modal_query_doc_ids'] ) ? $settings['search_modal_query_doc_ids'] : '';
1882	$faq_categories_ids = isset( $settings['search_modal_query_faq_term_ids'] ) ? $settings['search_modal_query_faq_term_ids'] : '';
1883	$search_modal_layout = isset( $settings['search_modal_layout'] ) ? $settings['search_modal_layout'] : 'layout-1';
1884	$search_modal_search_type = betterdocs()->settings->get('search_modal_search_type');
1885
1886	// Ensure we always output content, especially in edit mode
1887	echo '<div class="betterdocs-search-form-widget-wrapper">';
1888	echo do_shortcode( '[betterdocs_search_modal enable_faq_search="'.($search_modal_search_type == 'all' \|\| $search_modal_search_type == 'faq' ? true : false).'" enable_docs_search="'.($search_modal_search_type == 'all' \|\| $search_modal_search_type == 'docs' ? true : false).'" faq_categories_ids="' . $faq_categories_ids . '" doc_ids="' . $doc_ids . '" doc_categories_ids="' . $doc_categories_ids . '" search_button="' . ( isset( $settings['betterdocs_search_button_toogle'] ) ? $settings['betterdocs_search_button_toogle'] : true ) . '" number_of_docs="' . $number_of_docs . '" number_of_faqs="' . $number_of_faqs . '" heading_tag="' . ( isset( $settings['section_search_field_heading_tag'] ) ? $settings['section_search_field_heading_tag'] : 'h2' ) . '" subheading_tag="' . ( isset( $settings['section_search_field_subheading_tag'] ) ? $settings['section_search_field_subheading_tag'] : 'h3' ) . '" search_button_text="Search" layout="' . $search_modal_layout . '" heading="' . ( isset( $settings['section_search_field_heading'] ) ? $settings['section_search_field_heading'] : '' ) . '" placeholder="' . ( isset( $settings['section_search_field_placeholder'] ) ? $settings['section_search_field_placeholder'] : '' ) . '" subheading="' . ( isset( $settings['section_search_field_sub_heading'] ) ? $settings['section_search_field_sub_heading'] : '' ) . '" category_search="' . ( isset( $settings['betterdocs_category_search_toogle'] ) ? $settings['betterdocs_category_search_toogle'] : false ) . '" popular_search="' . ( isset( $settings['betterdocs_popular_search_toogle'] ) ? $settings['betterdocs_popular_search_toogle'] : false ) . '" enable_ai_powered_search="' . ( isset( $settings['enable_ai_powered_search'] ) && $settings['enable_ai_powered_search'] === 'true' ? 'true' : 'false' ) . '"]' );
1889	echo '</div>';
1890	}
1891
1892	// Add editor-specific styles to prevent empty widget background
1893	if ( \Elementor\Plugin::$instance->editor->is_edit_mode() ) {
1894	echo '<style>
1895	.elementor-widget-betterdocs-search-form {
1896	background-color: transparent !important;
1897	}
1898	.elementor-widget-betterdocs-search-form .elementor-widget-container {
1899	min-height: 50px;
1900	}
1901	</style>';
1902	}
1903	}
1904
1905	public function view_params() {
1906	$settings = &$this->attributes;
1907
1908	$popular_search_title = isset( $settings['advance_search_popular_search_title_placeholder'] ) ? $settings['advance_search_popular_search_title_placeholder'] : '';
1909	$category_search_toggle = isset( $settings['betterdocs_category_search_toogle'] ) ? $settings['betterdocs_category_search_toogle'] : '';
1910	$search_button_toggle = isset( $settings['betterdocs_search_button_toogle'] ) ? $settings['betterdocs_search_button_toogle'] : true;
1911	$popular_search_toggle = isset( $settings['betterdocs_popular_search_toogle'] ) ? $settings['betterdocs_popular_search_toogle'] : '';
1912
1913	$_shortcode_attributes = apply_filters(
1914	'betterdocs_elementor_search_form_params',
1915	[
1916	'enable_heading' => 'true',
1917	'popular_search_title' => $popular_search_title,
1918	'category_search' => $category_search_toggle,
1919	'search_button' => $search_button_toggle,
1920	'popular_search' => $popular_search_toggle,
1921	'heading' => esc_html( $settings['section_search_field_heading'] ),
1922	'subheading' => esc_html( $settings['section_search_field_sub_heading'] ),
1923	'heading_tag' => esc_attr( $settings['section_search_field_heading_tag'] ),
1924	'subheading_tag' => esc_attr( $settings['section_search_field_subheading_tag'] ),
1925	'placeholder' => esc_html( $settings['section_search_field_placeholder'] )
1926	],
1927	$this->attributes
1928	);
1929
1930	return [
1931	'shortcode_attr' => $_shortcode_attributes
1932	];
1933	}
1934
1935	// Prevent empty widget background in Elementor
1936	protected function should_print_empty() {
1937	return false;
1938	}
1939
1940	// In plain mode, render without shortcode
1941	public function render_plain_content() {
1942	$settings = $this->get_settings_for_display();
1943	echo '[betterdocs_search_form placeholder="' . esc_attr( $settings['section_search_field_placeholder'] ) . '"]';
1944	}
1945	}
1946