booking / includes / _toolbar_ui / flex_ui_elements.php

flex_ui_elements.php in Booking Calendar 11.8, at includes/_toolbar_ui/flex_ui_elements.php

2,089 lines 99.0 KB

Raw Download Zip

1	<?php /**
2	* @version 1.0
3	* @package Booking Calendar
4	* @category Toolbar UI Elements. Data for UI Elements at Booking Calendar admin pages
5	* @author wpdevelop
6	*
7	* @web-site https://wpbookingcalendar.com/
8	* @email info@wpbookingcalendar.com
9	*
10	* @modified 2024-08-13
11	*/
12
13	if ( ! defined( 'ABSPATH' ) ) exit; // Exit, if accessed directly
14
15
16	// ---------------------------------------------------------------------------------------------------------------------
17	// Simple elements
18	// ---------------------------------------------------------------------------------------------------------------------
19
20	/**
21	* Show FLEX Button
22	*
23	* @param array $item
24	array(
25	'type' => 'button'
26	, 'title' => '' // Title of the button
27	, 'hint' => '' // , 'hint' => array( 'title' => __('Select status' ,'booking') , 'position' => 'bottom' )
28	, 'link' => 'javascript:void(0)' // Direct link or skip it
29	, 'action' => '' // Some JavaScript to execure, for example run the function
30	, 'class' => '' // wpbc_ui_button \| wpbc_ui_button_primary
31	, 'icon' => ''
32	, 'font_icon' => ''
33	, 'icon_position' => 'left' // Position of icon relative to Text: left \| right
34	, 'style' => '' // Any CSS class here
35	, 'mobile_show_text' => false // Show or hide text, when viewing on Mobile devices (small window size).
36	, 'attr' => array()
37	);
38	*/
39	function wpbc_flex_button( $item ) {
40
41	$default_item_params = array(
42	'type' => 'button'
43	, 'title' => '' // Title of the button
44	, 'hint' => '' // , 'hint' => array( 'title' => __('Select status' ,'booking') , 'position' => 'bottom' )
45	, 'link' => 'javascript:void(0)' // Direct link or skip it
46	, 'action' => '' // Some JavaScript to execure, for example run the function
47	, 'id' => '' // '' \| 'wpbc_ui_button_primary'
48	, 'class' => '' // '' \| 'wpbc_ui_button_primary'
49	, 'icon' => false // array( 'icon_font' => 'wpbc_icn_check_circle_outline', 'position' => 'right', 'icon_img' => '' )
50	, 'style' => '' // Any CSS class here
51	, 'mobile_show_text' => false // Show or hide text, when viewing on Mobile devices (small window size).
52	, 'attr' => array()
53	, 'options' => array( 'link' => 'esc_attr' ) // array( 'link' => 'decode' )
54	);
55	$item_params = wp_parse_args( $item, $default_item_params );
56
57	$css_button_class = esc_attr( $item_params['class'] );
58
59	if ( 'wpbc_button_as_icon' !== $css_button_class ) {
60	$css_button_class = 'wpbc_ui_button ' . $css_button_class;
61	}
62
63	?><a class="wpbc_ui_control <?php echo esc_attr( $css_button_class );
64	echo ( ! empty( $item_params['hint'] ) ) ? ' tooltip_' . esc_attr( $item_params['hint']['position'] ) . ' ' : '' ; ?>"
65	style="<?php echo esc_attr( $item_params['style'] ); ?>"
66	href="<?php
67	if ( 'esc_attr' == $item_params['options']['link'] ) {
68	echo esc_attr( $item_params['link'] );
69	}
70	if ( 'decode' == $item_params['options']['link'] ) {
71	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
72	echo str_replace( '"', '', htmlspecialchars_decode( esc_attr( $item_params['link'] ), ENT_QUOTES ) );
73	}
74	if ( 'no_decode' == $item_params['options']['link'] ) {
75	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
76	echo str_replace( '"', '', $item_params['link'] );
77	}
78	?>"
79	<?php if ( ! empty( $item_params['id'] ) ) { ?>
80	id="<?php echo wp_kses_post( $item_params['id'] ); ?>"
81	<?php } ?>
82
83	<?php
84	if ( ! empty( $item_params['action'] ) ) {
85	?>
86	onclick="javascript:<?php
87	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
88	echo wpbc_esc_js( $item_params['action'] );
89	?>" <?php
90	}
91	?>
92
93	<?php if ( ! empty( $item_params['hint'] ) ) { ?>
94	title="<?php echo esc_attr( $item_params['hint']['title'] ); ?>"
95	<?php } ?>
96	<?php
97	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
98	echo wpbc_get_custom_attr( $item_params );
99	?>
100	><?php
101	$btn_icon = '';
102
103	// Icon
104	if ( ( ! empty( $item_params['icon'] ) ) && ( is_array( $item_params['icon'] ) ) ) {
105
106	// Icon IMG
107	if ( ! empty( $item_params['icon']['icon_img'] ) ) {
108
109	if ( substr( $item_params['icon']['icon_img'], 0, 4 ) != 'http' ) {
110	$img_path = WPBC_PLUGIN_URL . '/assets/img/' . $item_params['icon']['icon_img'];
111	} else {
112	$img_path = $item_params['icon']['icon_img'];
113	}
114	// phpcs:ignore PluginCheck.CodeAnalysis.ImageFunctions.NonEnqueuedImage
115	$btn_icon = '<img class="menuicons" src="' . esc_url( $img_path ) . '" />'; // Img Icon
116	}
117
118	// Icon Font
119	if ( ! empty( $item_params['icon']['icon_font'] ) ) {
120	$btn_icon = '<i class="menu_icon icon-1x ' . esc_attr( $item_params['icon']['icon_font'] ) . '"></i>'; // Font Icon
121	}
122	}
123
124	if ( ( ! empty( $btn_icon ) ) && ( $item_params['icon']['position'] == 'left' ) ) {
125	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
126	echo $btn_icon;
127
128	if ( ! empty( $item_params['title'] ) ) {
129	echo ' ';
130	}
131	}
132
133	// Text
134	echo '<span' . ( ( ( ! empty( $btn_icon ) ) && ( ! $item_params['mobile_show_text'] ) )? ' class="in-button-text"' : '' ) . '>';
135	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
136	echo html_entity_decode(
137	wp_kses_post( $item_params['title'] ) // Sanitizes content for allowed HTML tags for post content
138	, ENT_QUOTES // Convert " to " and '
139	, get_bloginfo( 'charset' ) // 'UTF-8' or other
140	); // Convert &dash; to &dash; etc...
141
142	if ( ( ! empty( $btn_icon ) ) && ( $item_params['icon']['position'] == 'right' ) ) {
143	echo ' ';
144	}
145
146	echo '</span>';
147
148	if ( ( ! empty( $btn_icon ) ) && ( $item_params['icon']['position'] == 'right' ) ) {
149	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
150	echo $btn_icon;
151	}
152	?></a><?php
153	}
154
155	/**
156	* Show FLEX Label
157	*
158	* @param array $item
159	array(
160	'id' => '' // HTML ID of INPUT element
161	, 'label' => __('Text..','booking') // Label text here
162	, 'style' => '' // CSS of select element
163	, 'class' => '' // CSS Class of select element
164	, 'disabled' => false
165	, 'attr' => array() // Any additional attributes
166	)
167	*/
168	function wpbc_flex_label( $item ) {
169
170	$default_item_params = array(
171	'id' => '' // HTML ID of element
172	, 'label' => '' // Label
173	, 'style' => '' // CSS of select element
174	, 'class' => '' // CSS Class of select element
175	, 'disabled' => false
176	, 'hint' => '' // , 'hint' => array( 'title' => __('Select status' ,'booking') , 'position' => 'bottom' )
177	, 'attr' => array() // Any additional attributes, if this radio \| checkbox element
178	);
179	$item_params = wp_parse_args( $item, $default_item_params );
180
181	if ( ( ! empty( $item_params['label'] ) ) \|\| ( ! empty( $btn_icon ) ) ) {
182
183	?><label for="<?php echo esc_attr( $item_params['id'] ); ?>"
184	class="wpbc_ui_control_label <?php echo esc_attr( $item_params['class'] );
185	echo ( ! empty( $item_params['hint'] ) ) ? ' tooltip_' . esc_attr( $item_params['hint']['position'] ) . ' ' : '' ; ?>"
186	style="<?php echo esc_attr( $item_params['style'] ); ?>"
187	<?php if ( ! empty( $item_params['hint'] ) ) { ?>
188	title="<?php echo esc_attr( $item_params['hint']['title'] ); ?>"
189	<?php } ?>
190	<?php disabled( $item_params['disabled'], true ); ?>
191	<?php
192	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
193	echo wpbc_get_custom_attr( $item_params ); ?>
194	><?php
195
196	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
197	echo html_entity_decode(
198	wp_kses_post( $item_params['label'] ) // Sanitizes content for allowed HTML tags for post content
199	, ENT_QUOTES // Convert " to " and '
200	, get_bloginfo( 'charset' ) // 'UTF-8' or other
201	); // Convert &dash; to &dash; etc...
202	?></label><?php
203	}
204
205	}
206
207	/**
208	* Show FLEX text
209	*
210	* @param array $item
211	*
212	* Example:
213	$params_checkbox = array(
214	'id' => 'my_check_id' // HTML ID of element
215	, 'name' => 'my_check_id'
216	, 'label' => __('Approve' ,'booking')
217	, 'style' => '' // CSS of select element
218	, 'class' => '' // CSS Class of select element
219	, 'disabled' => false
220	, 'attr' => array() // Any additional attributes, if this radio \| checkbox element
221	, 'placeholder' => ''
222	, 'value' => 'CHECK_VAL_1' // Some Value from optins array that selected by default
223	, 'onfocus' => "console.log( 'ON FOCUS:', jQuery( this ).is(':checked') , 'in element:' , jQuery( this ) );" // JavaScript code
224	, 'onchange' => "console.log( 'ON CHANGE:', jQuery( this ).is(':checked') , 'in element:' , jQuery( this ) );" // JavaScript code
225	);
226	?><div class="ui_element"><?php
227
228	wpbc_flex_text( $params_select );
229
230	?></div><?php
231	*
232	*/
233	function wpbc_flex_text( $item ) {
234
235	$default_item_params = array(
236	'type' => 'text'
237	, 'id' => ''
238	, 'name' => ''
239	, 'label' => ''
240	, 'disabled' => false
241	, 'class' => ''
242	, 'style' => ''
243	, 'placeholder' => ''
244	, 'attr' => array()
245	, 'value' => ''
246	, 'is_escape_value' => true
247	, 'onfocus' => '' // JavaScript code
248	, 'onchange' => '' // JavaScript code
249	, 'onkeydown' => '' // JavaScript code
250
251	);
252	$item_params = wp_parse_args( $item, $default_item_params );
253
254	if ( ( empty( $item_params['name'] ) )
255	&& ( ! empty( $item_params['id'] ) )
256	) {
257	$item_params['name'] = $item_params['id'];
258	}
259
260	// Show only, if $item_params['label'] ! EMPTY
261	wpbc_flex_label(
262	array(
263	'id' => $item_params['id']
264	, 'label' => $item_params['label']
265	)
266	);
267
268	if ( $item_params['is_escape_value'] ) {
269	$escaped_value = esc_attr( $item_params['value'] );
270	} else {
271	$escaped_value = $item_params['value'];
272	}
273
274	?><input type="<?php echo esc_attr( $item_params['type'] ); ?>"
275	id="<?php echo esc_attr( $item_params['id'] ); ?>"
276	name="<?php echo esc_attr( $item_params['name'] ); ?>"
277	style="<?php echo esc_attr( $item_params['style'] ); ?>"
278	class="wpbc_ui_control wpbc_ui_text <?php echo esc_attr( $item_params['class'] ); ?>"
279	placeholder="<?php echo esc_attr( $item_params['placeholder'] ); ?>"
280	value="<?php
281	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
282	echo $escaped_value; ?>"
283	autocomplete="off"
284	<?php disabled( $item_params['disabled'], true ); ?>
285	<?php
286	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
287	echo wpbc_get_custom_attr( $item_params ); ?>
288	<?php
289	if ( ! empty( $item_params['onfocus'] ) ) {
290	?> onfocus="javascript:<?php
291	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
292	echo wpbc_esc_js( $item_params['onfocus'] ); ?>" <?php
293	}
294	if ( ! empty( $item_params['onchange'] ) ) {
295	?> onchange="javascript:<?php
296	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
297	echo wpbc_esc_js( $item_params['onchange'] ); ?>" <?php
298	}
299	if ( ! empty( $item_params['onkeydown'] ) ) {
300	?> onkeydown="javascript:<?php
301	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
302	echo wpbc_esc_js( $item_params['onkeydown'] ); ?>" <?php
303	}
304	?>
305	/><?php
306	}
307
308	/**
309	* Show FLEX textarea
310	*
311	* @param array $item
312	*
313	* Example:
314	$params_textarea = array(
315	'id' => 'my_check_id' // HTML ID of element
316	, 'name' => 'my_check_id'
317	, 'label' => __('Approve' ,'booking')
318	, 'style' => '' // CSS of select element
319	, 'class' => '' // CSS Class of select element
320	, 'disabled' => false
321	, 'attr' => array() // Any additional attributes, if this radio \| checkbox element
322	, 'rows' => '3'
323	, 'cols' => '50'
324	, 'placeholder' => ''
325	, 'value' => 'Test VAL 1' // Some Value from optins array that selected by default
326	, 'onfocus' => "console.log( 'ON FOCUS:', jQuery( this ).val() , 'in element:' , jQuery( this ) );" // JavaScript code
327	, 'onchange' => "console.log( 'ON CHANGE:', jQuery( this ).val() , 'in element:' , jQuery( this ) );" // JavaScript code
328	);
329	?><div class="ui_element"><?php
330
331	wpbc_flex_textarea( $params_textarea );
332
333	?></div><?php
334	*
335	*/
336	function wpbc_flex_textarea( $item ) {
337
338	$default_item_params = array(
339	'id' => ''
340	, 'name' => ''
341	, 'label' => ''
342	, 'disabled' => false
343	, 'class' => ''
344	, 'style' => ''
345	, 'placeholder' => ''
346	, 'attr' => array()
347	, 'rows' => '3'
348	, 'cols' => '50'
349	, 'value' => ''
350	, 'is_escape_value' => true
351	, 'onfocus' => '' // JavaScript code
352	, 'onchange' => '' // JavaScript code
353	);
354	$item_params = wp_parse_args( $item, $default_item_params );
355
356	if ( ( empty( $item_params['name'] ) )
357	&& ( ! empty( $item_params['id'] ) )
358	) {
359	$item_params['name'] = $item_params['id'];
360	}
361
362	// Show only, if $item_params['label'] ! EMPTY
363	wpbc_flex_label(
364	array(
365	'id' => $item_params['id']
366	, 'label' => $item_params['label']
367	)
368	);
369
370	if ( $item_params['is_escape_value'] ) {
371	$escaped_value = esc_textarea( $item_params['value'] );
372	} else {
373	$escaped_value = $item_params['value'];
374	}
375
376	?><textarea id="<?php echo esc_attr( $item_params['id'] ); ?>"
377	name="<?php echo esc_attr( $item_params['name'] ); ?>"
378	style="<?php echo esc_attr( $item_params['style'] ); ?>"
379	class="wpbc_ui_control wpbc_ui_textarea <?php echo esc_attr( $item_params['class'] ); ?>"
380	placeholder="<?php echo esc_attr( $item_params['placeholder'] ); ?>"
381	autocomplete="off"
382	rows="<?php echo esc_attr( $item_params['rows'] ); ?>"
383	cols="<?php echo esc_attr( $item_params['cols'] ); ?>"
384	<?php disabled( $item_params['disabled'], true ); ?>
385	<?php
386	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
387	echo wpbc_get_custom_attr( $item_params ); ?>
388	<?php
389	if ( ! empty( $item_params['onfocus'] ) ) {
390	?> onfocus="javascript:<?php
391	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
392	echo wpbc_esc_js( $item_params['onfocus'] ); ?>" <?php
393	}
394	if ( ! empty( $item_params['onchange'] ) ) {
395	?> onchange="javascript:<?php
396	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
397	echo wpbc_esc_js( $item_params['onchange'] ); ?>" <?php
398	}
399	?>
400	><?php echo esc_html( $escaped_value ); ?></textarea><?php
401	}
402
403	/**
404	* Show FLEX selectbox
405	*
406	* @param array $item
407	array(
408	'id' => '' // HTML ID of element
409	, 'name' => ''
410	, 'style' => '' // CSS of select element
411	, 'class' => '' // CSS Class of select element
412	, 'multiple' => false
413	, 'disabled' => false
414	, 'attr' => array() // Any additional attributes, if this radio \| checkbox element
415	, 'options' => array() // Associated array of titles and values
416	, 'disabled_options' => array() // If some options disbaled, then its must list here
417	, 'value' => '' // Some Value from optins array that selected by default
418	, 'onfocus' => "console.log( 'ON FOCUS:', jQuery( this ).val(), 'in element:' , jQuery( this ) );" // JavaScript code
419	, 'onchange' => "console.log( 'ON CHANGE:', jQuery( this ).val(), 'in element:' , jQuery( this ) );" // JavaScript code
420	)
421	*
422	*
423	* Simple Example :
424	*
425	$params_select = array(
426	'id' => 'next_days' // HTML ID of element
427	, 'name' => 'next_days'
428	, 'label' => '' // __( 'Next Days', 'booking' ) // Label (optional)
429	, 'style' => '' // CSS of select element
430	, 'class' => '' // CSS Class of select element
431	, 'multiple' => false
432	, 'attr' => array() // Any additional attributes, if this radio \| checkbox element
433	, 'disabled' => false
434	, 'disabled_options' => array( 2, 30 ) // If some options disabled, then it has to list here
435	, 'options' => array( // Associated array of titles and values
436	, 1 => '1' . ' ' . __('day' ,'booking')
437	, 2 => '2' . ' ' . __('days' ,'booking')
438	, 7 => '1' . ' ' . __('week' ,'booking')
439	, 30 => '1' . ' ' . __('month' ,'booking')
440	, 365 => '1' . ' ' . __('Year' ,'booking')
441	)
442
443	, 'value' => ( isset( $escaped_search_request_params[ 'next_days' ] ) ) ? $escaped_search_request_params[ 'next_days' ] : '183' // Some Value from options array that selected by default
444	, 'onfocus' => "console.log( 'ON FOCUS:', jQuery( this ).val(), 'in element:' , jQuery( this ) );" // JavaScript code
445	, 'onchange' => "console.log( 'ON CHANGE:', jQuery( this ).val(), 'in element:' , jQuery( this ) );" // JavaScript code
446
447	);
448
449	?><div class="ui_element"><?php
450
451	wpbc_flex_select( $params_select );
452
453	?></div><?php
454	*
455	*
456	*
457	* Example complex:
458	*
459	*
460	*
461
462	$params_select = array(
463	'id' => 'next_days' // HTML ID of element
464	, 'name' => 'next_days'
465	, 'label' => '<span class="" style="font-weight:600;">' . esc_html__( 'Cost', 'booking' ) . ' <em style="color:#888;">(' . __( 'min-max', 'booking' ) . '):</em></span>'
466	, 'style' => '' // CSS of select element
467	, 'class' => '' // CSS Class of select element
468	, 'multiple' => false
469	, 'attr' => array() // Any additional attributes, if this radio \| checkbox element
470	, 'disabled' => false
471	, 'disabled_options' => array( 2, 5 ) // If some options disabled, then it has to list here
472	, 'options' => array( // Associated array of titles and values: array( $option_value => $option_data, ... )
473	'group_days' => array( 'optgroup' => true, 'close' => false, 'title' => __( 'days', 'booking' ) )
474	, 1 => '1' . ' ' . __('day' ,'booking')
475	, 2 => '2' . ' ' . __('days' ,'booking')
476	, 3 => '3' . ' ' . __('days' ,'booking')
477	, 4 => '4' . ' ' . __('days' ,'booking')
478	, 5 => '5' . ' ' . __('days' ,'booking')
479	, 6 => '6' . ' ' . __('days' ,'booking')
480	, 'group_days_end' => array( 'optgroup' => true, 'close' => true )
481
482	, 'group_weeks' => array( 'optgroup' => true, 'close' => false, 'title' => __( 'weeks', 'booking' ) )
483	, 7 => '1' . ' ' . __('week' ,'booking')
484	, 14 => '2' . ' ' . __('weeks' ,'booking')
485	, 'group_weeks_end' => array( 'optgroup' => true, 'close' => true )
486
487	, 'group_months' => array( 'optgroup' => true, 'close' => false, 'title' => __( 'months', 'booking' ) )
488	, 30 => '1' . ' ' . __('month' ,'booking')
489	, 60 => '2' . ' ' . __('months' ,'booking')
490	, 90 => '3' . ' ' . __('months' ,'booking')
491	, 183 => '6' . ' ' . __('months' ,'booking')
492	, 365 => '1' . ' ' . __('Year' ,'booking')
493	, 'group_months_end' => array( 'optgroup' => true, 'close' => true )
494
495	, 'complex_value' => array(
496	'title' => 'Complex Option Here' // Text in selectbox option
497	, 'style' => '' // CSS of select element
498	, 'class' => '' // CSS Class of select element
499	, 'disabled' => false
500	, 'selected' => true
501	, 'attr' => array() // Any additional attributes, if this radio \| checkbox element
502	, 'optgroup' => false // Use only if you need to show OPTGROUP - Also need to use 'title' of start, end 'close' for END
503	, 'close' => false
504	)
505	)
506
507	, 'value' => ( isset( $escaped_search_request_params[ 'next_days' ] ) ) ? $escaped_search_request_params[ 'next_days' ] : '183' // Some Value from options array that selected by default
508	, 'onfocus' => "console.log( 'ON FOCUS:', jQuery( this ).val(), 'in element:' , jQuery( this ) );" // JavaScript code
509	, 'onchange' => "console.log( 'ON CHANGE:', jQuery( this ).val(), 'in element:' , jQuery( this ) );" // JavaScript code
510
511	);
512
513	?><div class="ui_element"><?php
514
515	wpbc_flex_select( $params_select );
516
517	?></div><?php
518
519	*
520	*/
521	function wpbc_flex_select( $item ) {
522
523	$default_item_params = array(
524	'id' => '' // HTML ID of element
525	, 'name' => ''
526	, 'label' => '' // Label
527	, 'style' => '' // CSS of select element
528	, 'class' => '' // CSS Class of select element
529	, 'multiple' => false
530	, 'disabled' => false
531	, 'attr' => array() // Any additional attributes, if this radio \| checkbox element
532	, 'options' => array() // Associated array of titles and values: array( $option_value => $option_data, ... )
533	, 'disabled_options' => array() // If some options disabled, then it has to list here
534	, 'value' => '' // Some Value from options array that selected by default
535	, 'onfocus' => '' // JavaScript code
536	, 'onchange' => '' // JavaScript code
537	);
538	$item_params = wp_parse_args( $item, $default_item_params );
539
540	// Show only, if $item_params['label'] ! EMPTY
541	wpbc_flex_label(
542	array(
543	'id' => $item_params['id']
544	, 'label' => $item_params['label']
545	)
546	);
547
548	?><select
549	id="<?php echo esc_attr( $item_params['id'] ); ?>"
550	name="<?php echo esc_attr( $item_params['name'] ); echo ( $item_params['multiple'] ? '[]' : '' ); ?>"
551	class="wpbc_ui_control wpbc_ui_select <?php echo esc_attr( $item_params['class'] ); ?>"
552	style="<?php echo esc_attr( $item_params['style'] ); ?>"
553	<?php disabled( $item_params['disabled'], true ); ?>
554	<?php
555	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
556	echo wpbc_get_custom_attr( $item_params ); ?>
557	<?php echo ( $item_params['multiple'] ? ' multiple="MULTIPLE"' : '' ); ?>
558	<?php
559	if ( ! empty( $item_params['onfocus'] ) ) {
560	?> onfocus="javascript:<?php
561	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
562	echo wpbc_esc_js( $item_params['onfocus'] ); ?>" <?php
563	}
564	if ( ! empty( $item_params['onchange'] ) ) {
565	?> onchange="javascript:<?php
566	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
567	echo wpbc_esc_js( $item_params['onchange'] ); ?>" <?php
568	}
569	?>
570	autocomplete="off"
571	><?php
572	foreach ( $item_params['options'] as $option_value => $option_data ) {
573
574	if ( ! is_array( $option_data ) ) {
575	$option_data = array( 'title' => $option_data );
576	$is_was_simple = true;
577	} else {
578	$is_was_simple = false;
579	}
580
581	$default_option_params = array(
582	'title' => '' // Text in selectbox option
583	, 'style' => '' // CSS of select element
584	, 'class' => '' // CSS Class of select element
585	, 'disabled' => false
586	, 'selected' => false
587	, 'attr' => array() // Any additional attributes, if this radio \| checkbox element
588
589	, 'optgroup' => false // Use only if you need to show OPTGROUP - Also need to use 'title' of start, end 'close' for END
590	, 'close' => false
591
592	);
593	$option_data = wp_parse_args( $option_data, $default_option_params );
594
595	if ( $option_data['optgroup'] ) { // OPTGROUP
596
597	if ( ! $option_data['close'] ) {
598	?><optgroup label="<?php echo esc_attr( $option_data['title'] ); ?>"><?php
599	} else {
600	?></optgroup><?php
601	}
602
603	} else { // OPTION
604
605	?><option
606	value="<?php echo esc_attr( $option_value ); ?>"
607	<?php
608	if ( $is_was_simple ) {
609	selected( $option_value, $item_params['value'] );
610	disabled( in_array( $option_value, $item_params['disabled_options'] ), true );
611	}
612
613	if ( ! empty( $option_data['class'] ) ){
614	echo ' class="' . esc_attr( $option_data['class'] ) . '" ';
615	}
616	if ( ! empty( $option_data['style'] ) ){
617	echo ' style="' . esc_attr( $option_data['style'] ) . '" ';
618	}
619
620	selected( $option_data['selected'], true );
621
622	disabled( $option_data['disabled'], true );
623
624
625	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
626	echo wpbc_get_custom_attr( $option_data );
627
628	if ( ! empty( $item_params['value'] ) ) {
629
630	if ( is_array( $item_params['value'] ) ) {
631	selected( in_array( esc_attr( $option_value ), $item_params['value'] ), true ); // SELECT multiple, have several items
632	} else {
633	selected( $item_params['value'], esc_attr( $option_value ) ); //Recheck global selected parameter
634	}
635	}
636	?>
637	><?php
638	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
639	echo html_entity_decode(
640	wp_kses_post( $option_data['title'] ) // Sanitizes content for allowed HTML tags for post content
641	, ENT_QUOTES // Convert " to " and '
642	, get_bloginfo( 'charset' ) // 'UTF-8' or other
643	); // Convert &dash; to &dash; etc...
644
645
646	?></option><?php
647	}
648	}
649	?></select><?php
650	}
651
652	/**
653	* Show FLEX checkbox
654	*
655	* @param array $item
656	*
657	* Example:
658	$params_checkbox = array(
659	'id' => 'my_check_id' // HTML ID of element
660	, 'name' => 'my_check_id'
661	, 'label' => array( 'title' => __('Approve' ,'booking') , 'position' => 'right' )
662	, 'style' => '' // CSS of select element
663	, 'class' => '' // CSS Class of select element
664	, 'disabled' => false
665	, 'attr' => array() // Any additional attributes, if this radio \| checkbox element
666	, 'legend' => '' // aria-label parameter
667	, 'value' => 'CHECK_VAL_1' // Some Value from optins array that selected by default
668	, 'selected' => !false // Selected or not
669	, 'onfocus' => "console.log( 'ON FOCUS:', jQuery( this ).is(':checked') , 'in element:' , jQuery( this ) );" // JavaScript code
670	, 'onchange' => "console.log( 'ON CHANGE:', jQuery( this ).is(':checked') , 'in element:' , jQuery( this ) );" // JavaScript code
671	, 'is_use_toggle' => false // Show checkbox as toggle
672	, 'hint' => '' // , 'hint' => array( 'title' => __('Select status' ,'booking') , 'position' => 'bottom' )
673	);
674	?><div class="ui_element"><?php
675
676	wpbc_flex_checkbox( $params_select );
677
678	?></div><?php
679	*/
680	function wpbc_flex_checkbox( $item ) {
681
682	$default_item_params = array(
683	'type' => 'checkbox'
684	, 'id' => '' // HTML ID of element
685	, 'name' => ''
686	, 'label' => '' // Label Example: 'label' => array( 'title' => __('Select status' ,'booking') , 'position' => 'left' )
687	, 'style' => '' // CSS of select element
688	, 'class' => '' // CSS Class of select element
689	, 'disabled' => false
690	, 'attr' => array() // Any additional attributes, if this radio \| checkbox element
691	, 'legend' => '' // aria-label parameter
692	, 'value' => '' // Some Value from optins array that selected by default
693	, 'selected' => false // Selected or not
694	, 'onfocus' => '' // JavaScript code
695	, 'onchange' => '' // JavaScript code
696	, 'is_use_toggle' => false // Show checkbox as toggle
697	, 'hint' => '' // , 'hint' => array( 'title' => __('Select status' ,'booking') , 'position' => 'bottom' )
698	);
699	$item_params = wp_parse_args( $item, $default_item_params );
700
701
702	// Use toggle element, instead of checkbox.
703	if ( $item_params['is_use_toggle'] ) {
704
705	wpbc_flex_toggle( $item );
706	return;
707	}
708
709	if ( ( ! empty( $item_params['label'] ) ) && ( 'left' == $item_params['label']['position'] ) ) {
710	$label_params = array( 'id' => $item_params['id'], 'label' => $item_params['label']['title'] );
711	if ( ! empty( $item_params['label']['class'] ) ) {
712	$label_params['class'] = $item_params['label']['class'];
713	}
714	wpbc_flex_label( $label_params );
715	}
716
717	?><input type="<?php echo esc_attr( $item_params['type'] ); ?>"
718	id="<?php echo esc_attr( $item_params['id'] ); ?>"
719	name="<?php echo esc_attr( $item_params['name'] ); ?>"
720	value="<?php echo esc_attr( $item_params['value'] ); ?>"
721	aria-label="<?php echo esc_attr( $item_params['legend'] ); ?>"
722	class="wpbc_ui_<?php echo esc_attr( $item_params['type'] ); ?> <?php echo esc_attr( $item_params['class'] ); ?> <?php echo ( ! empty( $item_params['hint'] ) ) ? ' tooltip_' . esc_attr( $item_params['hint']['position'] ) . ' ' : '' ; ?>"
723	style="<?php echo esc_attr( $item_params['style'] ); ?>"
724	<?php
725	if ( ! empty( $item_params['hint'] ) ) { ?>
726	title="<?php echo esc_attr( $item_params['hint']['title'] ); ?>" <?php
727	}
728	?>
729	<?php
730	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
731	echo wpbc_get_custom_attr( $item_params ); ?>
732	<?php checked( $item_params['selected'], true ); ?>
733	<?php disabled( $item_params['disabled'], true ); ?>
734	<?php
735	if ( ! empty( $item_params['onfocus'] ) ) {
736	?> onfocus="javascript:<?php
737	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
738	echo wpbc_esc_js( $item_params['onfocus'] ); ?>" <?php
739	}
740	if ( ! empty( $item_params['onchange'] ) ) {
741	?> onchange="javascript:<?php
742	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
743	echo wpbc_esc_js( $item_params['onchange'] ); ?>" <?php
744	}
745	?>
746	autocomplete="off"
747	/><?php
748
749	if ( ( ! empty( $item_params['label'] ) ) && ( 'right' == $item_params['label']['position'] ) ) {
750	$label_params = array( 'id' => $item_params['id'], 'label' => $item_params['label']['title'] );
751	if ( ! empty( $item_params['label']['class'] ) ) {
752	$label_params['class'] = $item_params['label']['class'];
753	}
754	wpbc_flex_label( $label_params );
755	}
756	}
757
758	/**
759	* Show FLEX toggle instead of checkbox
760	*
761	* @param array $item
762	*
763	* Example:
764	$params_checkbox = array(
765	'id' => 'my_check_id' // HTML ID of element
766	, 'name' => 'my_check_id'
767	, 'label' => array( 'title' => __('Approve' ,'booking') , 'position' => 'right' )
768	, 'style' => '' // CSS of select element
769	, 'toggle_style' => '' // Styles CSS of toggle container
770	, 'toggle_class' => '' // Class CSS of toggle container
771	, 'class' => '' // CSS Class of input element
772	, 'disabled' => false
773	, 'attr' => array() // Any additional attributes, if this radio \| checkbox element
774	, 'legend' => '' // aria-label parameter
775	, 'value' => 'CHECK_VAL_1' // Some Value from optins array that selected by default
776	, 'selected' => !false // Selected or not
777	, 'onfocus' => "console.log( 'ON FOCUS:', jQuery( this ).is(':checked') , 'in element:' , jQuery( this ) );" // JavaScript code
778	, 'onchange' => "console.log( 'ON CHANGE:', jQuery( this ).is(':checked') , 'in element:' , jQuery( this ) );" // JavaScript code
779	);
780	?><div class="ui_element"><?php
781
782	wpbc_flex_toggle( $params_select );
783
784	?></div><?php
785	*/
786	function wpbc_flex_toggle( $item ){
787
788	$default_item_params = array(
789	'type' => 'checkbox'
790	, 'id' => '' // HTML ID of element
791	, 'name' => ''
792	, 'label' => '' // Label Example: 'label' => array( 'title' => __('Select status' ,'booking') , 'position' => 'left' )
793	, 'style' => '' // CSS of select element
794	, 'toggle_style' => '' // Styles CSS of toggle container
795	, 'toggle_class' => '' // Class CSS of toggle container
796	, 'class' => '' // CSS Class of input element
797	, 'disabled' => false
798	, 'attr' => array() // Any additional attributes, if this radio \| checkbox element
799	, 'legend' => '' // aria-label parameter
800	, 'value' => '' // Some Value from optins array that selected by default
801	, 'selected' => false // Selected or not
802	, 'onfocus' => '' // JavaScript code
803	, 'onchange' => '' // JavaScript code
804	, 'hint' => '' // , 'hint' => array( 'title' => __('Select status' ,'booking') , 'position' => 'bottom' )
805	);
806	$item_params = wp_parse_args( $item, $default_item_params );
807	/**
808	* Structure:
809	?><span class="wpbc_ui__toggle">
810	<input type="checkbox" name="field_name" id="wpbc_field_id" value="On" />
811	<label class="wpbc_ui__toggle_icon" for="wpbc_field_id"></label>
812	<label class="wpbc_ui__toggle_label" for="wpbc_field_id">Some Text</label>
813	<i class="wpbc_help_tooltip"></i>
814	</span><?php
815	*/
816
817	?><span class="wpbc_ui__toggle <?php echo esc_attr( $item_params['toggle_class'] ); ?>" style="<?php echo esc_attr( $item_params['toggle_style'] ); ?>"><?php
818
819	?><input type="<?php echo esc_attr( $item_params['type'] ); ?>"
820	id="<?php echo esc_attr( $item_params['id'] ); ?>"
821	name="<?php echo esc_attr( $item_params['name'] ); ?>"
822	value="<?php echo esc_attr( $item_params['value'] ); ?>"
823	aria-label="<?php echo esc_attr( $item_params['legend'] ); ?>"
824	class="wpbc_ui_<?php echo esc_attr( $item_params['type'] ); ?> <?php echo esc_attr( $item_params['class'] ); ?>"
825	<?php
826	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
827	echo wpbc_get_custom_attr( $item_params ); ?>
828	<?php checked( $item_params['selected'], true ); ?>
829	<?php disabled( $item_params['disabled'], true ); ?>
830	<?php
831	if ( ! empty( $item_params['onfocus'] ) ) {
832	?> onfocus="javascript:<?php
833	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
834	echo wpbc_esc_js( $item_params['onfocus'] ); ?>" <?php
835	}
836	if ( ! empty( $item_params['onchange'] ) ) {
837	?> onchange="javascript:<?php
838	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
839	echo wpbc_esc_js( $item_params['onchange'] ); ?>" <?php
840	}
841	?>
842	autocomplete="off"
843	/><?php
844
845	?><label class="wpbc_ui__toggle_icon
846	<?php echo ( ! empty( $item_params['hint'] ) ) ? ' tooltip_' . esc_attr( $item_params['hint']['position'] ) . ' ' : '' ; ?>
847	"
848	for="<?php echo esc_attr( $item_params['id'] ); ?>"
849	<?php
850	if ( ! empty( $item_params['hint'] ) ) { ?>
851	title="<?php echo esc_attr( $item_params['hint']['title'] ); ?>" <?php
852	}
853	?>
854	></label><?php
855
856	if ( ! empty( $item_params['label'] ) ) {
857	wpbc_flex_label( array( 'id' => $item_params['id'], 'class' => 'wpbc_ui__toggle_label', 'label' => $item_params['label']['title'] ) );
858	}
859
860	?><i class="wpbc_help_tooltip"></i><?php
861
862	?></span><?php
863
864	}
865
866	/**
867	* Show FLEX radio button
868	*
869	* @param array $item
870	*
871	* Example:
872	$params_checkbox = array(
873	'id' => 'my_check_id' // HTML ID of element
874	, 'name' => 'my_check_id'
875	, 'label' => array( 'title' => __('Approve' ,'booking') , 'position' => 'right' )
876	, 'style' => '' // CSS of select element
877	, 'class' => '' // CSS Class of select element
878	, 'disabled' => false
879	, 'attr' => array() // Any additional attributes, if this radio \| checkbox element
880	, 'legend' => '' // aria-label parameter
881	, 'value' => 'CHECK_VAL_1' // Some Value from optins array that selected by default
882	, 'selected' => !false // Selected or not
883	, 'onfocus' => "console.log( 'ON FOCUS:', jQuery( this ).is(':checked') , 'in element:' , jQuery( this ) );" // JavaScript code
884	, 'onchange' => "console.log( 'ON CHANGE:', jQuery( this ).val() , 'in element:' , jQuery( this ) );" // JavaScript code
885	);
886	?><div class="ui_element"><?php
887
888	wpbc_flex_radio( $params_select );
889
890	$params_checkbox['id'] = 'my_check_id2';
891	$params_checkbox['value'] = 'CHECK_VAL_2';
892
893	wpbc_flex_radio( $params_select );
894
895	?></div><?php
896	*/
897	function wpbc_flex_radio( $item ) {
898	$item['type'] = 'radio';
899	$item['is_use_toggle'] = false;
900	wpbc_flex_checkbox( $item );
901	}
902
903	/**
904	* Show FLEX addon (image or text can be here)
905	*
906	* @param array $item
907	array(
908	'type' => 'span' // HTML tag that will bound content
909	, 'html' => '' // Any other HTML content
910	, 'icon' => false // array( 'icon_font' => 'wpbc_icn_check_circle_outline', 'position' => 'right', 'icon_img' => '' )
911	, 'style' => '' // CSS of select element
912	, 'class' => '' // CSS Class of select element // default included class is .wpbc_ui_addon
913	, 'attr' => array() // Any additional attributes
914	);
915	* Example 1:
916	` $params_span = array(
917	'type' => 'span'
918	, 'html' => '<i class="menu_icon icon-1x wpbc_icn_event"></i>   Approve '
919	, 'icon' => false // array( 'icon_font' => 'wpbc_icn_check_circle_outline', 'position' => 'right', 'icon_img' => '' )
920	, 'class' => 'wpbc_ui_button inactive ui_nowrap'
921	, 'style' => ''
922	, 'attr' => array()
923	);
924
925	?><div class="ui_element"><?php
926
927	wpbc_flex_addon( $params_span );
928
929	wpbc_flex_text( $params_text );
930
931	wpbc_flex_addon( $params_span );
932
933	?></div><?php
934	* Example 2:
935	$params_addon = array(
936	'type' => 'span'
937	, 'html' => ''// '<i class="menu_icon icon-1x wpbc_icn_event"></i>' //'<strong>' . esc_html__( 'Dates', 'booking ' ) . '</strong>'
938	, 'icon' => array( 'icon_font' => 'wpbc_icn_event', 'position' => 'right', 'icon_img' => '' )
939	, 'class' => 'wpbc_ui_button inactive'
940	, 'style' => ''
941	, 'attr' => array()
942	);
943	?><div class="ui_element ui_nowrap"><?php
944	wpbc_flex_addon( $params_addon );
945	?></div><?php
946
947	*/
948	function wpbc_flex_addon( $item ) {
949
950	$default_item_params = array(
951	'type' => 'span'
952	, 'html' => ''
953	, 'icon' => false
954	, 'class' => ''
955	, 'style' => ''
956	, 'hint' => '' // , 'hint' => array( 'title' => __('Select status' ,'booking') , 'position' => 'bottom' )
957	, 'attr' => array()
958	);
959	$item_params = wp_parse_args( $item, $default_item_params );
960
961	// Icon
962	$btn_icon = '';
963	if ( ( ! empty( $item_params['icon'] ) ) && ( is_array( $item_params['icon'] ) ) ) {
964
965	// Icon IMG
966	if ( ! empty( $item_params['icon']['icon_img'] ) ) {
967
968	if ( substr( $item_params['icon']['icon_img'], 0, 4 ) != 'http' ) {
969	$img_path = WPBC_PLUGIN_URL . '/assets/img/' . $item_params['icon']['icon_img'];
970	} else {
971	$img_path = $item_params['icon']['icon_img'];
972	}
973	// phpcs:ignore PluginCheck.CodeAnalysis.ImageFunctions.NonEnqueuedImage
974	$btn_icon = '<img class="menuicons" src="' . esc_url( $img_path ) . '" />'; // Img Icon
975	}
976
977	// Icon Font
978	if ( ! empty( $item_params['icon']['icon_font'] ) ) {
979	$btn_icon = '<i class="menu_icon icon-1x ' . esc_attr( $item_params['icon']['icon_font'] ) . '"></i>'; // Font Icon
980	}
981	}
982
983	?><<?php echo esc_attr( $item_params['type'] ); ?>
984	class="wpbc_ui_control wpbc_ui_addon <?php echo esc_attr( $item_params['class'] );
985	echo ( ! empty( $item_params['hint'] ) ) ? ' tooltip_' . esc_attr( $item_params['hint']['position'] ) . ' ' : '' ; ?>"
986	style="<?php echo esc_attr( $item_params['style'] ); ?>"
987	<?php
988	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
989	echo wpbc_get_custom_attr( $item_params ); ?>
990	<?php if ( ! empty( $item_params['hint'] ) ) { ?>
991	title="<?php echo esc_attr( $item_params['hint']['title'] ); ?>"
992	<?php } ?>
993
994	><?php
995
996	if ( ( ! empty( $btn_icon ) ) && ( 'left' == $item_params['icon']['position'] ) ) {
997	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
998	echo $btn_icon;
999	}
1000	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
1001	echo html_entity_decode( wp_kses_post( $item_params['html'] ) // Sanitizes content for allowed HTML tags for post content
1002	, ENT_QUOTES // Convert " to " and '
1003	, get_bloginfo( 'charset' ) // 'UTF-8' or other
1004	); // Convert &dash; to &dash; etc...
1005
1006
1007	if ( ( ! empty( $btn_icon ) ) && ( 'right' == $item_params['icon']['position'] ) ) {
1008	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
1009	echo $btn_icon;
1010	}
1011
1012	?></<?php echo esc_attr( $item_params['type'] ); ?>><?php
1013	}
1014
1015	function wpbc_flex_divider( $item = array() ){
1016
1017	$default_item_params = array(
1018	'type' => 'span'
1019	, 'html' => ''
1020	, 'icon' => false
1021	, 'class' => ''
1022	, 'style' => ''
1023	, 'hint' => '' // , 'hint' => array( 'title' => __('Select status' ,'booking') , 'position' => 'bottom' )
1024	, 'attr' => array()
1025	);
1026	$item_params = wp_parse_args( $item, $default_item_params );
1027
1028	?><div class="wpbc_ui_control ui_elements_divider <?php echo esc_attr( $item_params['class'] );
1029	echo ( ! empty( $item_params['hint'] ) ) ? ' tooltip_' . esc_attr( $item_params['hint']['position'] ) . ' ' : '' ; ?>"
1030	style="<?php echo esc_attr( $item_params['style'] ); ?>"
1031	<?php
1032	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
1033	echo wpbc_get_custom_attr( $item_params ); ?>
1034	<?php if ( ! empty( $item_params['hint'] ) ) { ?>
1035	title="<?php echo esc_attr( $item_params['hint']['title'] ); ?>"
1036	<?php } ?>
1037	></div><?php
1038	}
1039
1040	/**
1041	* Show FLEX Vertical line for "wpbc_ui_control" elements with vertical border color
1042	*
1043	* @param $item array
1044	*
1045	* @return void
1046	*
1047	* Example:
1048	* ?><div class="ui_element ui_nowrap"><?php
1049	wpbc_flex_vertical_color( array(
1050	'vertical_line' => 'border-left: 4px solid #11be4c;'
1051	) );
1052	* ?></div><?php
1053	*/
1054	function wpbc_flex_vertical_color( $item = array() ){
1055
1056	$default_item_params = array(
1057	'id' => ''
1058	, 'html' => '<span></span>'
1059	, 'icon' => false
1060	, 'class' => ''
1061	, 'style' => ''
1062	, 'hint' => '' // , 'hint' => array( 'title' => __('Select status' ,'booking') , 'position' => 'bottom' )
1063	, 'attr' => array()
1064	, 'vertical_line' => 'border-left: 4px solid #11be4c;'
1065	);
1066	$item_params = wp_parse_args( $item, $default_item_params );
1067
1068	?><div
1069	id="<?php echo esc_attr( $item_params['id'] ); ?>"
1070	class="wpbc_ui_control wpbc_ui_button ui_elements_vertical_color <?php echo esc_attr( $item_params['class'] );
1071	echo ( ! empty( $item_params['hint'] ) ) ? ' tooltip_' . esc_attr( $item_params['hint']['position'] ) . ' ' : '' ; ?>"
1072	style="<?php echo esc_attr( $item_params['vertical_line'] ) . ';'; ?>padding: 0;<?php echo esc_attr( $item_params['style'] ); ?>"
1073	<?php
1074	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
1075	echo wpbc_get_custom_attr( $item_params ); ?>
1076	<?php if ( ! empty( $item_params['hint'] ) ) { ?>
1077	title="<?php echo esc_attr( $item_params['hint']['title'] ); ?>"
1078	<?php } ?>
1079	><?php
1080	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
1081	echo $item_params['html']; ?></div><?php
1082
1083	}
1084
1085	/**
1086	* Show FLEX Horizontal Text Bar line for "wpbc_ui_control" elements with vertical border color
1087	*
1088	* @param $item array
1089	*
1090	* @return void
1091	*
1092	* Example:
1093	*
1094	$params_text_bar_1 = array( 'id' => ''
1095	, 'html' => '1. ' . __( 'Calendar Skin', 'booking' )
1096	, 'option_class' => 'wpbc_option_step wpbc_passed_step' // 'wpbc_option_step', 'wpbc_option_separator', 'wpbc_option_step wpbc_selected_step', 'wpbc_option_separator wpbc_passed_step'
1097	, 'class' => ''
1098	, 'style' => 'height:auto;'
1099	, 'hint' => '' // , 'hint' => array( 'title' => __('Select status' ,'booking') , 'position' => 'bottom' )
1100	, 'attr' => array()
1101	, 'tag' => 'span'
1102	);
1103	$params_text_bar_hr = array('id' => ''
1104	, 'html' => '>'
1105	, 'option_class' => 'wpbc_option_separator' // 'wpbc_option_step', 'wpbc_option_separator', 'wpbc_option_step wpbc_selected_step', 'wpbc_option_separator wpbc_passed_step'
1106	, 'class' => ''
1107	, 'style' => 'height:auto;'
1108	, 'hint' => '' // , 'hint' => array( 'title' => __('Select status' ,'booking') , 'position' => 'bottom' )
1109	, 'attr' => array()
1110	, 'tag' => 'span'
1111	);
1112
1113	$params_text_bar_2 = $params_text_bar_1;
1114	$params_text_bar_2['html'] = '2. ' . __( 'Calendar size', 'booking' );
1115	$params_text_bar_2['option_class'] = 'wpbc_option_step wpbc_selected_step';
1116
1117	$params_text_bar_3 = $params_text_bar_1;
1118	$params_text_bar_3['html'] = '3. ' . __( 'Dates selection', 'booking' );
1119	$params_text_bar_3['option_class'] = 'wpbc_option_step';
1120
1121	* ?><div class="ui_element ui_nowrap"><?php
1122	*
1123	wpbc_flex_horizontal_text_bar( $params_text_bar_1 );
1124
1125	wpbc_flex_horizontal_text_bar( $params_text_bar_hr );
1126
1127	wpbc_flex_horizontal_text_bar( $params_text_bar_2 );
1128
1129	* ?></div><?php
1130	*/
1131	function wpbc_flex_horizontal_text_bar( $item = array() ){
1132
1133	$default_item_params = array(
1134	'id' => ''
1135	, 'html' => '<span></span>'
1136	, 'class' => ''
1137	, 'style' => ''
1138	, 'hint' => '' // , 'hint' => array( 'title' => __('Select status' ,'booking') , 'position' => 'bottom' )
1139	, 'attr' => array()
1140	, 'tag' => 'span'
1141	, 'option_class' => 'wpbc_option_step' // 'wpbc_option_step', 'wpbc_option_separator', 'wpbc_option_step wpbc_selected_step', 'wpbc_option_separator wpbc_passed_step'
1142	);
1143	$item_params = wp_parse_args( $item, $default_item_params );
1144
1145	?><<?php echo esc_attr( $item_params['tag'] ); ?>
1146	<?php if ( ! empty( $item_params['id'] ) ) { echo ' id="' . esc_attr( $item_params['id'] ) . '" '; } ?>
1147	class="wpbc_ui_control wpbc_ui_addon wpbc_text_bar <?php echo esc_attr( $item_params['class'] );
1148	echo ( ! empty( $item_params['hint'] ) ) ? ' tooltip_' . esc_attr( $item_params['hint']['position'] ) . ' ' : '' ; ?>"
1149	style="<?php echo esc_attr( $item_params['style'] ); ?>"
1150	<?php
1151	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
1152	echo wpbc_get_custom_attr( $item_params ); ?>
1153	<?php if ( ! empty( $item_params['hint'] ) ) { ?>
1154	title="<?php echo esc_attr( $item_params['hint']['title'] ); ?>"
1155	<?php } ?>
1156	><span class="<?php echo esc_attr( $item_params['option_class'] ); ?>"><?php
1157	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
1158	echo $item_params['html'];
1159	?></span></<?php echo esc_attr( $item_params['tag'] ); ?>><?php
1160
1161	}
1162
1163
1164
1165	// ---------------------------------------------------------------------------------------------------------------------
1166	// Complex elements
1167	// ---------------------------------------------------------------------------------------------------------------------
1168
1169	/**
1170	* Show FLEX Dropdown
1171	*
1172	* Dropdown always have value as array. For example: [ '0' ], [ '4', '10' ] or [ '6', '', '2022-05-24' ]
1173	*
1174	* @param array $args
1175	*
1176	* = Simple Example: ==================================================================================================
1177
1178	$params = array(
1179	'id' => 'wh_approved'
1180	, 'default' => isset( $escaped_search_request_params['wh_approved'] ) ? $escaped_search_request_params['wh_approved'] : $defaults['wh_approved']
1181	, 'label' => ''//__('Status', 'booking') . ':'
1182	, 'title' => __('Status', 'booking')
1183	, 'hint' => array( 'title' => __('Filter bookings by booking status' ,'booking') , 'position' => 'top' )
1184	, 'li_options' => array (
1185	'0' => __( 'Pending', 'booking' ),
1186	'1' => __( 'Approved', 'booking' ),
1187	'divider1' => array( 'type' => 'html', 'html' => '<hr/>' ),
1188	// 'header1' => array( 'type' => 'header', 'title' => __( 'Default', 'booking' ) ),
1189	'any' => array(
1190	'type' => 'simple',
1191	'value' => '',
1192	// 'disabled' => true,
1193	'title' => __( 'Any', 'booking' )
1194	),
1195	)
1196	);
1197
1198	?><div class="ui_element ui_nowrap"><?php
1199
1200	wpbc_flex_dropdown( $params );
1201
1202	?></div><?php
1203	*
1204	*
1205	* = Complex Example: =================================================================================================
1206	*
1207
1208	$params_addon = array(
1209	'type' => 'span'
1210	, 'html' => ''// '<i class="menu_icon icon-1x wpbc_icn_event"></i>' //'<strong>' . esc_html__( 'Dates', 'booking ' ) . '</strong>'
1211	, 'icon' => array( 'icon_font' => 'wpbc_icn_event', 'position' => 'right', 'icon_img' => '' )
1212	, 'class' => 'wpbc_ui_button inactive'
1213	, 'style' => ''
1214	, 'attr' => array()
1215	);
1216
1217	$dates_interval = array(
1218	1 => '1' . ' ' . __('day' ,'booking')
1219	, 2 => '2' . ' ' . __('days' ,'booking')
1220	, 3 => '3' . ' ' . __('days' ,'booking')
1221	, 4 => '4' . ' ' . __('days' ,'booking')
1222	, 5 => '5' . ' ' . __('days' ,'booking')
1223	, 6 => '6' . ' ' . __('days' ,'booking')
1224	, 7 => '1' . ' ' . __('week' ,'booking')
1225	, 14 => '2' . ' ' . __('weeks' ,'booking')
1226	, 30 => '1' . ' ' . __('month' ,'booking')
1227	, 60 => '2' . ' ' . __('months' ,'booking')
1228	, 90 => '3' . ' ' . __('months' ,'booking')
1229	, 183 => '6' . ' ' . __('months' ,'booking')
1230	, 365 => '1' . ' ' . __('Year' ,'booking')
1231	);
1232
1233	$request_input_el_default = array(
1234	'wh_booking_date' => isset( $escaped_search_request_params['wh_booking_date'] ) ? $escaped_search_request_params['wh_booking_date'] : $defaults['wh_booking_date'],
1235	'ui_wh_booking_date_radio' => isset( $escaped_search_request_params['ui_wh_booking_date_radio'] ) ? $escaped_search_request_params['ui_wh_booking_date_radio'] : $defaults['ui_wh_booking_date_radio'],
1236	'ui_wh_booking_date_next' => isset( $escaped_search_request_params['ui_wh_booking_date_next'] ) ? $escaped_search_request_params['ui_wh_booking_date_next'] : $defaults['ui_wh_booking_date_next'],
1237	'ui_wh_booking_date_prior' => isset( $escaped_search_request_params['ui_wh_booking_date_prior'] ) ? $escaped_search_request_params['ui_wh_booking_date_prior'] : $defaults['ui_wh_booking_date_prior'],
1238	'ui_wh_booking_date_checkin' => isset( $escaped_search_request_params['ui_wh_booking_date_checkin'] ) ? $escaped_search_request_params['ui_wh_booking_date_checkin'] : $defaults['ui_wh_booking_date_checkin'],
1239	'ui_wh_booking_date_checkout' => isset( $escaped_search_request_params['ui_wh_booking_date_checkout'] ) ? $escaped_search_request_params['ui_wh_booking_date_checkout'] : $defaults['ui_wh_booking_date_checkout']
1240	);
1241
1242	$options = array (
1243	// 'header2' => array( 'type' => 'header', 'title' => __( 'Complex Days', 'booking' ) ),
1244	// 'disabled1' => array( 'type' => 'simple', 'value' => '19', 'title' => __( 'This is option was disabled', 'booking' ), 'disabled' => true ),
1245
1246	'0' => __( 'Current dates', 'booking' ),
1247	'1' => __( 'Today', 'booking' ),
1248	'2' => __( 'Previous dates', 'booking' ),
1249	'3' => __( 'All dates', 'booking' ),
1250
1251	'divider1' => array( 'type' => 'html', 'html' => '<hr/>' ),
1252
1253	'9' => __( 'Today check in/out', 'booking' ),
1254	'7' => __( 'Check In - Tomorrow', 'booking' ),
1255	'8' => __( 'Check Out - Tomorrow', 'booking' ),
1256
1257	'divider2' => array( 'type' => 'html', 'html' => '<hr/>' ),
1258
1259	// Next [ '4', '10' ] - radio button (if selected) value '4' and select-box with selected value '10'
1260	'next' => array(
1261	'type' => 'complex',
1262	'class' => 'ui_complex_option_element',
1263	// recheck if LI selected: $options['next']['selected_options_value'] == $params['default], e.g. ~ [ '4', '10' ]
1264	'selected_options_value' => array(
1265	1 => array( 'value' ), // $options['next']['input_options'][ 1 ]['value'] '4'
1266	4 => array( 'value' ) // $options['next']['input_options'][ 4 ]['value'] '10'
1267	),
1268	// Get selected Title, for dropdown if $options['next'] selected
1269	'selected_options_title' => array(
1270	1 => array( 'label', 'title' ), // $options['next']['input_options'][ 1 ]['label'][ 'title' ] 'Next'
1271	'text1' => ': ', // if key 'text1' not exist in ['input_options'], then it text ': '
1272	4 => array( 'options', $request_input_el_default['ui_wh_booking_date_next'] ) // '10 days'
1273	),
1274	'input_options' => array(
1275	array( 'type' => 'html', 'html' => '<div class="ui_element">' )
1276	, array( // Default options from simple input element, like: wpbc_flex_radio()
1277	'type' => 'radio'
1278	, 'id' => 'ui_wh_booking_date_radio_1' // HTML ID of element
1279	, 'name' => 'ui_wh_booking_date_radio'
1280	, 'label' => array( 'title' => __('Next' ,'booking') , 'position' => 'right' )
1281	, 'style' => '' // CSS of select element
1282	, 'class' => '' // CSS Class of select element
1283	, 'disabled' => false
1284	, 'attr' => array() // Any additional attributes, if this radio \| checkbox element
1285	, 'legend' => '' // aria-label parameter
1286	, 'value' => '4'
1287	, 'selected' => ( $request_input_el_default[ 'ui_wh_booking_date_radio' ] == '4' ) ? true : false // Selected or not
1288	, 'onfocus' => "console.log( 'ON FOCUS:', jQuery( this ).is(':checked') , 'in element:' , jQuery( this ) );" // JavaScript code
1289	, 'onchange' => "console.log( 'ON CHANGE:', jQuery( this ).is(':checked') , 'in element:' , jQuery( this ) );" // JavaScript code
1290	)
1291	, array( 'type' => 'html', 'html' => '</div>' )
1292	, array( 'type' => 'html', 'html' => '<div class="ui_element">' )
1293	, array(
1294	'type' => 'select'
1295	, 'attr' => array()
1296	, 'name' => 'ui_wh_booking_date_next'
1297	, 'id' => 'ui_wh_booking_date_next'
1298	, 'options' => $dates_interval
1299	, 'value' => $request_input_el_default[ 'ui_wh_booking_date_next']
1300	, 'onfocus' => "jQuery('#ui_wh_booking_date_radio_1').prop('checked', true);" // JavaScript code
1301	, 'onchange' => "console.log( 'ON CHANGE:', jQuery( this ).is(':checked') , 'in element:' , jQuery( this ) );" // JavaScript code
1302	)
1303	, array( 'type' => 'html', 'html' => '</div>' )
1304	)
1305	),
1306
1307	// Prior [ '5', '10' ]
1308	'prior' => array(
1309	'type' => 'complex',
1310	'class' => 'ui_complex_option_element',
1311	'style' => 'min-width: 244px;',
1312	'selected_options_value' => array( 1 => array( 'value' ), 4 => array( 'value' ) ), // 4 => array( 'value' ) --> $complex_option['input_options'][4]['value']
1313	'selected_options_title' => array( 1 => array( 'label', 'title' )
1314	, 'text1' => ': '
1315	, 4 => array( 'options' , $request_input_el_default[ 'ui_wh_booking_date_prior'] )
1316	), // 1 => array( 'label', 'title' ) --> $complex_option['input_options'][1]['label'][ 'title' ]
1317	'input_options' => array(
1318	array( 'type' => 'html', 'html' => '<div class="ui_element">' )
1319	, array(
1320	'type' => 'radio'
1321
1322	, 'id' => 'ui_wh_booking_date_radio_2' // HTML ID of element
1323	, 'name' => 'ui_wh_booking_date_radio'
1324	, 'label' => array( 'title' => __('Prior' ,'booking') , 'position' => 'right' )
1325	, 'style' => '' // CSS of select element
1326	, 'class' => '' // CSS Class of select element
1327	, 'disabled' => false
1328	, 'attr' => array() // Any additional attributes, if this radio \| checkbox element
1329	, 'legend' => '' // aria-label parameter
1330	, 'value' => '5' // Some Value from optins array that selected by default
1331	, 'selected' => ( $request_input_el_default[ 'ui_wh_booking_date_radio' ] == '5' ) ? true : false // Selected or not
1332	, 'onfocus' => "console.log( 'ON FOCUS:', jQuery( this ).is(':checked') , 'in element:' , jQuery( this ) );" // JavaScript code
1333	, 'onchange' => "console.log( 'ON CHANGE:', jQuery( this ).is(':checked') , 'in element:' , jQuery( this ) );" // JavaScript code
1334	)
1335	, array( 'type' => 'html', 'html' => '</div>' )
1336	, array( 'type' => 'html', 'html' => '<div class="ui_element">' )
1337	, array(
1338	'type' => 'select'
1339	, 'attr' => array()
1340	, 'name' => 'ui_wh_booking_date_prior'
1341	, 'id' => 'ui_wh_booking_date_prior'
1342	, 'options' => $dates_interval
1343	, 'value' => $request_input_el_default[ 'ui_wh_booking_date_prior']
1344	, 'onfocus' => "jQuery('#ui_wh_booking_date_radio_2').prop('checked', true);" // JavaScript code
1345	, 'onchange' => "console.log( 'ON CHANGE:', jQuery( this ).is(':checked') , 'in element:' , jQuery( this ) );" // JavaScript code
1346	)
1347	, array( 'type' => 'html', 'html' => '</div>' )
1348	)
1349	),
1350
1351	// Fixed [ '6', '', '2022-05-21']
1352	'fixed' => array(
1353	'type' => 'complex',
1354	'class' => 'ui_complex_option_element',
1355	'selected_options_value' => array( 1 => array( 'value' ), 4 => array( 'value' ), 7 => array( 'value' ) ), // 4 => array( 'value' ) --> $complex_option['input_options'][4]['value']
1356	'selected_options_title' => array( 1 => array( 'label', 'title' ), 'text1' => ': ', 4 => array( 'value' ), 'text2' => ' - ' ,7 => array( 'value' ) ), // 1 => array( 'label', 'title' ) --> $complex_option['input_options'][1]['label'][ 'title' ]
1357	'input_options' => array(
1358	array( 'type' => 'html', 'html' => '<div class="ui_element" style="flex:1 1 100%;margin-top:5px;">' )
1359	, array(
1360	'type' => 'radio'
1361
1362	, 'id' => 'ui_wh_booking_date_radio_3' // HTML ID of element
1363	, 'name' => 'ui_wh_booking_date_radio'
1364	, 'label' => array( 'title' => __('Dates' ,'booking') , 'position' => 'right' )
1365	, 'style' => '' // CSS of select element
1366	, 'class' => '' // CSS Class of select element
1367	, 'disabled' => false
1368	, 'attr' => array() // Any additional attributes, if this radio \| checkbox element
1369	, 'legend' => '' // aria-label parameter
1370	, 'value' => '6' // Some Value from optins array that selected by default
1371	, 'selected' => ( $request_input_el_default[ 'ui_wh_booking_date_radio' ] == '6' ) ? true : false // Selected or not
1372	, 'onfocus' => "console.log( 'ON FOCUS:', jQuery( this ).is(':checked') , 'in element:' , jQuery( this ) );" // JavaScript code
1373	, 'onchange' => "console.log( 'ON CHANGE:', jQuery( this ).is(':checked') , 'in element:' , jQuery( this ) );" // JavaScript code
1374	)
1375	, array( 'type' => 'html', 'html' => '</div>' )
1376	, array( 'type' => 'html', 'html' => '<div class="ui_element" style="flex-flow: row wrap;padding: 4px 4px 4px 0;">' )
1377	, array(
1378	'type' => 'text'
1379	, 'id' => 'ui_wh_booking_date_checkin' // HTML ID of element
1380	, 'name' => 'ui_wh_booking_date_checkin'
1381	, 'label' => ''//__('Check-in' ,'booking')
1382	, 'style' => 'width:100%;' // CSS of select element
1383	, 'class' => 'wpdevbk-filters-section-calendar' // CSS Class of select element
1384	, 'disabled' => false
1385	, 'attr' => array() // Any additional attributes, if this radio \| checkbox element
1386	, 'placeholder' => __('Check-in' ,'booking')
1387	, 'value' => $request_input_el_default[ 'ui_wh_booking_date_checkin'] // Some Value from optins array that selected by default
1388	, 'onfocus' => "jQuery('#ui_wh_booking_date_radio_3').prop('checked', true);" // JavaScript code
1389	, 'onchange' => "console.log( 'ON CHANGE:', jQuery( this ).is(':checked') , 'in element:' , jQuery( this ) );" // JavaScript code
1390	)
1391	, array( 'type' => 'html', 'html' => '</div>' )
1392	, array( 'type' => 'html', 'html' => '<div class="ui_element" style="flex-flow: row wrap;padding: 4px 0 4px 4px;">' )
1393	, array(
1394	'type' => 'text'
1395	, 'id' => 'ui_wh_booking_date_checkout' // HTML ID of element
1396	, 'name' => 'ui_wh_booking_date_checkout'
1397	, 'label' => ''//__('Check-out' ,'booking')
1398	, 'style' => 'width:100%;' // CSS of select element
1399	, 'class' => 'wpdevbk-filters-section-calendar' // CSS Class of select element
1400	, 'disabled' => false
1401	, 'attr' => array() // Any additional attributes, if this radio \| checkbox element
1402	, 'placeholder' => __('Check-out' ,'booking')
1403	, 'value' => $request_input_el_default[ 'ui_wh_booking_date_checkout'] // Some Value from optins array that selected by default
1404	, 'onfocus' => "jQuery('#ui_wh_booking_date_radio_3').prop('checked', true);" // JavaScript code
1405	, 'onchange' => "console.log( 'ON CHANGE:', jQuery( this ).is(':checked') , 'in element:' , jQuery( this ) );" // JavaScript code
1406	)
1407	, array( 'type' => 'html', 'html' => '</div>' )
1408	)
1409	),
1410
1411	'divider3' => array( 'type' => 'html', 'html' => '<hr/>' ),
1412
1413	// Buttons
1414	'buttons1' => array(
1415	'type' => 'complex',
1416	'class' => 'ui_complex_option_element',
1417	'style' => 'justify-content: flex-end;',
1418	'input_options' => array(
1419	array( 'type' => 'html', 'html' => '<div class="ui_element" style="flex: 0 1 auto;margin: 0;">' )
1420	, array(
1421	'type' => 'button'
1422	, 'title' => __( 'Apply', 'booking' ) // Title of the button
1423	, 'hint' => '' // , 'hint' => array( 'title' => __('Select status' ,'booking') , 'position' => 'bottom' )
1424	, 'link' => 'javascript:void(0)' // Direct link or skip it
1425	, 'action' => "wpbc_ui_dropdown_apply_click( {
1426	'dropdown_id' : 'wh_booking_date',
1427	'dropdown_radio_name': 'ui_wh_booking_date_radio'
1428	} );" // JavaScript code
1429	, 'class' => 'wpbc_ui_button_primary' // wpbc_ui_button \| wpbc_ui_button_primary
1430	, 'icon' => ''
1431	, 'font_icon' => ''
1432	, 'icon_position' => 'left' // Position of icon relative to Text: left \| right
1433	, 'style' => '' // Any CSS class here
1434	, 'mobile_show_text' => false // Show or hide text, when viewing on Mobile devices (small window size).
1435	, 'attr' => array()
1436	)
1437	, array( 'type' => 'html', 'html' => '</div>' )
1438	, array( 'type' => 'html', 'html' => '<div class="ui_element" style="flex: 0 1 auto;margin: 0 0 0 1em;">' )
1439	, array(
1440	'type' => 'button'
1441	, 'title' => __( 'Close', 'booking' ) // Title of the button
1442	, 'hint' => '' // , 'hint' => array( 'title' => __('Select status' ,'booking') , 'position' => 'bottom' )
1443	, 'link' => 'javascript:void(0)' // Direct link or skip it
1444	, 'action' => "wpbc_ui_dropdown_close_click( 'wh_booking_date' );" // JavaScript code
1445	, 'class' => '' // wpbc_ui_button \| wpbc_ui_button_primary
1446	, 'icon' => ''
1447	, 'font_icon' => ''
1448	, 'icon_position' => 'left' // Position of icon relative to Text: left \| right
1449	, 'style' => '' // Any CSS class here
1450	, 'mobile_show_text' => false // Show or hide text, when viewing on Mobile devices (small window size).
1451	, 'attr' => array()
1452	)
1453	, array( 'type' => 'html', 'html' => '</div>' )
1454	)
1455	),
1456	);
1457
1458	$params = array(
1459	'id' => 'wh_booking_date'
1460	, 'default' => $request_input_el_default[ 'wh_booking_date' ]
1461	, 'label' => ''//__('Approve 1', 'booking') . ':'
1462	, 'title' => ''//__('Approve 2', 'booking')
1463	, 'hint' => array( 'title' => __('Filter bookings by booking dates' ,'booking') , 'position' => 'top' )
1464	, 'align' => 'left'
1465	, 'li_options' => $options
1466	);
1467
1468	?><div class="ui_element ui_nowrap"><?php
1469
1470	wpbc_flex_addon( $params_addon );
1471
1472	wpbc_flex_dropdown( $params );
1473
1474	?></div><?php
1475
1476	*
1477	* =====================================================================================================================
1478	*/
1479	function wpbc_flex_dropdown( $args = array() ) {
1480
1481	// $milliseconds = round( microtime( true ) * 1000 );
1482
1483	$defaults = array(
1484	'id' => '' // HTML ID of element Example: 'wh_booking_date'
1485	, 'default' => array() // Selected by default value(s) Example: 'default' => array( $defaults['wh_booking_date'] , $defaults['wh_booking_date2'] )
1486	, 'hint' => '' // Mouse over tooltip Example: 'hint' => array( 'title' => __('Select status' ,'booking') , 'position' => 'bottom' )
1487	, 'style' => '' // CSS style of dropdown element (optional)
1488	, 'class' => '' // CSS class of dropdown element (optional)
1489	, 'label' => '' // Label of element "at Top of element"
1490	, 'title' => '' // Title of element "Inside of element"
1491	, 'align' => 'left' // Align: left \| right
1492	, 'li_options' => array() // Options
1493	, 'disabled' => array() // If some options disabled, then option values list here
1494	, 'onfocus' => '' // JavaScript code
1495	, 'onchange' => '' // JavaScript code
1496	, 'is_use_for_template' => false // In case, if we are using it for template, then we skip JavaScript code for initial value. Need to define it manually. // FixIn: 9.4.3.5.
1497	);
1498	$params = wp_parse_args( $args, $defaults );
1499
1500	// If default value not array, then define it as single value in arr.
1501	if ( ! is_array( $params['default'] ) ) {
1502	$params['default'] = array( $params['default'] );
1503	}
1504
1505	// -----------------------------------------------------------------------------------------------------------------
1506	/**
1507	* Recomposition of simple options configuration from
1508	* 'any' => __( 'Any', 'booking' )
1509	* to
1510	* 'any' => array( 'type' => 'simple', 'value' => 'any', 'title' => __( 'Any', 'booking' ) );
1511	*/
1512	$is_this_simple_list = true;
1513	foreach ( $params['li_options'] as $key_value => $option_data ) {
1514
1515	if ( ! is_array( $option_data ) ) {
1516
1517	$params['li_options'][ $key_value ] = array( 'type' => 'simple', 'value' => (string) $key_value, 'title' => $option_data );
1518
1519	} else {
1520	if ( ( isset( $option_data['type'] ) ) && ( 'complex' == $option_data['type'] ) ) {
1521	$is_this_simple_list = false;
1522	}
1523	}
1524	}
1525	// -----------------------------------------------------------------------------------------------------------------
1526
1527
1528	// -----------------------------------------------------------------------------------------------------------------
1529	// Rechecking about selected LI option, based on $params['default'] like ['4','10'] and getting title of such option
1530	// -----------------------------------------------------------------------------------------------------------------
1531	$default_selected_title = array();
1532	foreach ( $params['li_options'] as $li_option ) {
1533
1534	if ( 'simple' == $li_option['type'] ) {
1535	if ( $li_option['value'] === $params['default'][0] ) {
1536	$default_selected_title = $li_option['title'] ;
1537	}
1538	}
1539
1540	if ( 'complex' == $li_option['type'] ) {
1541
1542	// $option[ 'selected_options_value' ] => array( 1 => array( 'value' ), 4 => array( 'value' ) ),
1543	// $option[ 'selected_options_title' ] => array( 1 => array( 'label', 'title' ), 'text1' => ': ', 4 => array( 'value' ) ),
1544
1545	// Get value of this LI
1546	$li_this_value = array();
1547	if ( isset( $li_option['selected_options_value'] ) )
1548	foreach ( $li_option['selected_options_value'] as $li_key => $input_keys ) {
1549
1550	if ( isset( $li_option['input_options'][ $li_key ] ) ) { // ['input_options'][4]
1551
1552	$li_input_deep_value = $li_option['input_options'][ $li_key ];
1553
1554	foreach ( $input_keys as $input_key_value ) {
1555
1556	if ( isset( $li_input_deep_value[$input_key_value] ) ) { // ['input_options'][4]['value']
1557	$li_input_deep_value = $li_input_deep_value[ $input_key_value ];
1558	}
1559	}
1560	$li_this_value[] = $li_input_deep_value;
1561	}
1562	}
1563
1564	// Is this LI selected ?
1565	$is_same_value = array_diff( $params['default'], $li_this_value ) == array();
1566
1567	if ( $is_same_value ) {
1568
1569	// Get value of this LI
1570	$li_this_value = array();
1571	foreach ( $li_option['selected_options_title'] as $li_key => $input_keys ) {
1572
1573	if ( isset( $li_option['input_options'][ $li_key ] ) ) { // ['input_options'][4]
1574
1575	$li_input_deep_value = $li_option['input_options'][ $li_key ];
1576
1577	foreach ( $input_keys as $input_key_value ) {
1578
1579	if ( isset( $li_input_deep_value[$input_key_value] ) ) { // ['input_options'][4]['value']
1580	$li_input_deep_value = $li_input_deep_value[ $input_key_value ];
1581	}
1582	}
1583	$li_this_value[] = $li_input_deep_value;
1584	} else {
1585	$li_this_value[] = $input_keys; //some text
1586	}
1587	}
1588
1589	$default_selected_title = implode( '', $li_this_value );
1590	}
1591	}
1592
1593	if ( ! empty( $default_selected_title ) ) {
1594	break;
1595	}
1596	}
1597
1598	if ( is_array( $default_selected_title ) ) {
1599	$default_selected_title = implode( '', $default_selected_title ); // Error:: ? no values ?
1600	}
1601
1602
1603	// ---------------------------------------------------------------------------------------------------------------------////////////////////////////////////
1604	// Show only, if $item_params['label'] ! EMPTY
1605	wpbc_flex_label(
1606	array(
1607	'id' => $params['id']
1608	, 'label' => $params['label']
1609	, 'class' => 'wpbc_ui_dropdown__outside_label'
1610	)
1611	);
1612
1613	?><div class="wpbc_ui_dropdown <?php echo esc_attr( $params['class'] ); ?>"
1614	style="<?php echo esc_attr( $params['style'] ); ?>"
1615	><?php
1616
1617	?><a href="javascript:void(0)"
1618	id="<?php echo esc_attr( $params['id'] ); ?>_selector"
1619	data-toggle="wpbc_dropdown"
1620	class="wpbc_ui_control wpbc_ui_button dropdown-toggle <?php
1621	echo ( ! empty( $params['hint'] ) ) ? 'tooltip_' . esc_attr( $params['hint']['position'] ) . ' ' : '' ;
1622	?>"
1623	<?php if (! $is_this_simple_list ) { ?>
1624	onclick="javascript:jQuery('#<?php echo esc_attr( $params['id'] ); ?>_container').show();"
1625	<?php } ?>
1626	<?php if ( ! empty( $params['hint'] ) ) { ?>
1627	title="<?php echo esc_attr( $params['hint']['title'] ); ?>"
1628	<?php } ?>
1629	<?php
1630	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
1631	echo wpbc_get_custom_attr( $params ); ?>
1632	><?php
1633
1634	?><label class="wpbc_ui_dropdown__inside_label" <?php if ( empty( $params['title'] ) ) { echo ' style="display:none;" '; } ?> ><?php
1635	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
1636	echo html_entity_decode(
1637	wp_kses_post( $params['title'] ) // Sanitizes content for allowed HTML tags for post content
1638	, ENT_QUOTES // Convert " to " and '
1639	, get_bloginfo( 'charset' ) // 'UTF-8' or other
1640	); // Convert &dash; to &dash; etc...
1641	?>: <?php
1642	?></label> <?php
1643
1644	?><span class="wpbc_selected_in_dropdown" ><?php
1645	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
1646	echo html_entity_decode(
1647	wp_kses_post( $default_selected_title ) // Sanitizes content for allowed HTML tags for post content
1648	, ENT_QUOTES // Convert " to " and '
1649	, get_bloginfo( 'charset' ) // 'UTF-8' or other
1650	); // Convert &dash; to &dash; etc...
1651	?></span>   <?php
1652
1653	?><span class="wpbc_ui_dropdown__inside_caret"></span><?php
1654
1655	?></a><?php
1656
1657	?><ul id="<?php echo esc_attr( $params['id'] ); ?>_container" class="ui_dropdown_menu ui_dropdown_menu-<?php echo esc_attr( $params['align'] ); ?>" ><?php
1658
1659	wpbc_flex_dropdown__options( $params, array( 'is_this_simple_list' => $is_this_simple_list ) );
1660
1661	?></ul><?php
1662
1663	?><input type="hidden"
1664	autocomplete="off"
1665	value=""
1666	id="<?php echo esc_attr( $params['id'] ); ?>"
1667	name="<?php echo esc_attr( $params['id'] ); ?>"
1668	/><?php
1669	if( ! $params['is_use_for_template'] ){ // FixIn: 9.4.3.5.
1670	?>
1671	<script type="text/javascript">
1672	<?php /* document.getElementById("<?php echo esc_attr( $params['id'] ); ?>").value = "<?php echo wp_slash( wp_json_encode($params['default'] ) ); ?>"; */ ?>
1673	jQuery(document).ready(function(){
1674
1675	jQuery( '#<?php echo esc_attr( $params['id'] ); ?>').val( "<?php
1676	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
1677	echo wp_slash( wp_json_encode( $params['default'] ) ); ?>" );
1678
1679	<?php if (! empty( $params['onchange'] )) { ?>
1680
1681	jQuery( '#<?php echo esc_attr( $params['id'] ); ?>' ).on( 'change', function( event ){
1682
1683	<?php
1684	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
1685	echo $params['onchange']; ?>
1686	});
1687
1688	<?php } ?>
1689
1690	<?php if (! empty( $params['onfocus'] )) { ?>
1691
1692	jQuery( '#<?php echo esc_attr( $params['id'] ); ?>_selector' ).on( 'focus', function( event ){
1693
1694	<?php
1695	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
1696	echo $params['onfocus']; ?>
1697	});
1698
1699	<?php } ?>
1700	})
1701	</script>
1702	<?php
1703	}
1704	?></div><?php
1705	}
1706
1707	/**
1708	* Options list for Dropdown
1709	*
1710	* @param $params
1711	* @param array $args
1712	*/
1713	function wpbc_flex_dropdown__options( $params, $args = array() ) {
1714
1715	$defaults = array(
1716	// 'milliseconds' => round( microtime( true ) * 1000 ),
1717	'is_this_simple_list' => true
1718	);
1719	$args = wp_parse_args( $args, $defaults );
1720
1721
1722	foreach ( $params['li_options'] as $option_name => $li_option ) {
1723
1724	$default_option = array(
1725	'type' => ''
1726	, 'class' => ''
1727	, 'style' => ''
1728	, 'title' => ''
1729	, 'disabled' => false
1730	, 'attr' => array()
1731	, 'value' => ''
1732	, 'html' => ''
1733	);
1734	$li_option = wp_parse_args( $li_option, $default_option );
1735
1736
1737	// Is disabled ?
1738	if ( true === in_array( $li_option['value'], $params['disabled'] ) ) {
1739	$li_option['disabled'] = true;
1740	}
1741	if ( $li_option['disabled'] ) {
1742	$li_option['class'] .= ' disabled';
1743	}
1744	// Is header ?
1745	if ( 'header' == $li_option['type'] ) {
1746	$li_option['class'] .= ' dropdown-header';
1747	}
1748
1749
1750	?><li role="presentation"
1751	class="<?php echo esc_attr( $li_option['class'] ); ?>"
1752	style="<?php echo esc_attr( $li_option['style'] ); ?>"
1753	<?php
1754	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
1755	echo wpbc_get_custom_attr( $li_option ); ?>
1756	><?php
1757
1758	switch ( $li_option['type'] ) {
1759
1760	case 'simple':
1761
1762	?><a role="menuitem"
1763	tabindex="-1"
1764	<?php if ( ! $li_option['disabled'] ) {
1765
1766	if( false !== filter_var( $li_option['value'], FILTER_VALIDATE_URL ) ){ ?>
1767
1768	href="<?php
1769	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
1770	echo $li_option['value']; ?>"
1771
1772	<?php } else { ?>
1773
1774	href="javascript:void(0)"
1775	onclick="javascript: wpbc_ui_dropdown_simple_click( {
1776	'dropdown_id' : '<?php echo esc_attr( $params['id'] ); ?>'
1777	, 'is_this_simple_list': <?php echo esc_attr( ( $args['is_this_simple_list'] ) ? 'true' : 'false' ); ?>
1778	, 'value' : '<?php
1779	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
1780	echo $li_option['value']; ?>'
1781	, '_this' : this
1782	} );"
1783	<?php }
1784
1785	} ?>
1786	><?php
1787	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
1788	echo $li_option['title'];
1789
1790	?></a><?php
1791
1792	break;
1793
1794	case 'html':
1795	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
1796	echo $li_option['html'];
1797	break;
1798
1799	case 'header':
1800	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
1801	echo $li_option['title'];
1802	break;
1803
1804	case 'complex' :
1805
1806	foreach ( $li_option['input_options'] as $input_option ) {
1807
1808	switch ( $input_option['type'] ) {
1809
1810	case 'html':
1811	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
1812	echo $input_option['html'];
1813	break;
1814
1815	case 'button':
1816	wpbc_flex_button( $input_option );
1817	break;
1818
1819	case 'label':
1820	wpbc_flex_label( $input_option );
1821	break;
1822
1823	case 'text':
1824	wpbc_flex_text( $input_option );
1825	break;
1826
1827	case 'select':
1828	wpbc_flex_select( $input_option );
1829	break;
1830
1831	case 'checkbox':
1832	wpbc_flex_checkbox( $input_option );
1833	break;
1834
1835	case 'radio':
1836	wpbc_flex_radio( $input_option );
1837	break;
1838
1839	case 'addon':
1840	wpbc_flex_addon( $input_option );
1841	break;
1842
1843	default: // Default
1844	}
1845	}
1846	break;
1847
1848	default: // Default
1849	}
1850
1851	?></li><?php
1852	}
1853	}
1854
1855
1856	// ---------------------------------------------------------------------------------------------------------------------
1857	// < > Buttons
1858	// ---------------------------------------------------------------------------------------------------------------------
1859
1860	/**
1861	* Button - Select Prior Skin in select-box
1862	* @return void
1863	*/
1864	function wpbc_smpl_form__ui__selectbox_prior_btn( $dropdown_id, $is_apply_rotating_icon = true ){
1865
1866	$params_button = array(
1867	'type' => 'button'
1868	, 'title' => '' // Title of the button
1869	// , 'hint' => array( 'title' => __('Previous' ,'booking') , 'position' => 'top' )
1870	, 'link' => 'javascript:void(0)' // Direct link or skip it
1871	, 'action' => // "console.log( 'ON CLICK:', jQuery( '[name=\"set_days_customize_plugin\"]:checked' ).val() , jQuery( 'textarea[id^=\"date_booking\"]' ).val() );" // Some JavaScript to execure, for example run the function
1872	" var is_selected = jQuery( '#" . $dropdown_id . " option:selected' ).prev(); "
1873	// . " if ( is_selected.length == 0 ){ " //FixIn: 10.7.1.5.1
1874	// . " if ( ( 'optgroup' == jQuery( '#" . $dropdown_id . " option:selected' ).parent().prop('nodeName').toLowerCase() ) "
1875	// . " && ( jQuery( '#" . $dropdown_id . " option:selected' ).parent().prev().length ) "
1876	// . " && ( 'optgroup' == jQuery( '#" . $dropdown_id . " option:selected' ).parent().prev().prop('nodeName').toLowerCase() ) ){ "
1877	// . " is_selected = jQuery( '#" . $dropdown_id . " option:selected' ).parent().prev().find('option').last(); "
1878	// . " } "
1879	// . " } "
1880	. " jQuery( '#" . $dropdown_id . " option:selected' ).prop('selected', false); "
1881	. " if ( is_selected.length == 0 ){ "
1882	// . " is_selected = jQuery( '#" . $dropdown_id . " option' ).last(); " //FixIn: 10.7.1.5.1
1883	. " is_selected = jQuery( '#" . $dropdown_id . " option:selected' ).parent().find('option').last(); " //FixIn: 10.7.1.5.1
1884	. " } "
1885	. " if ( is_selected.length > 0 ){ "
1886	. " is_selected.prop('selected', true).trigger('change'); "
1887	. ( ( $is_apply_rotating_icon ) ? " wpbc_button_enable_loading_icon( this ); " : "" )
1888	. " } else { "
1889	. " jQuery( this ).addClass( 'disabled' ); "
1890	. " } "
1891	, 'class' => 'wpbc_ui_button' // wpbc_ui_button \| wpbc_ui_button_primary
1892	//, 'icon_position' => 'left' // Position of icon relative to Text: left \| right
1893	, 'icon' => array(
1894	'icon_font' => 'wpbc_icn_arrow_back_ios', // 'wpbc_icn_check_circle_outline',
1895	'position' => 'left',
1896	'icon_img' => ''
1897	)
1898	, 'style' => '' // Any CSS class here
1899	, 'mobile_show_text' => false // Show or hide text, when viewing on Mobile devices (small window size).
1900	, 'attr' => array()
1901	);
1902
1903	wpbc_flex_button( $params_button );
1904	}
1905
1906	/**
1907	* Button - Select Next Skin in select-box
1908	* @return void
1909	*/
1910	function wpbc_smpl_form__ui__selectbox_next_btn( $dropdown_id, $is_apply_rotating_icon = true ){
1911
1912	$params_button = array(
1913	'type' => 'button'
1914	, 'title' => '' // Title of the button
1915	// , 'hint' => array( 'title' => __('Next' ,'booking') , 'position' => 'top' )
1916	, 'link' => 'javascript:void(0)' // Direct link or skip it
1917	, 'action' => //"console.log( 'ON CLICK:', jQuery( '[name=\"set_days_customize_plugin\"]:checked' ).val() , jQuery( 'textarea[id^=\"date_booking\"]' ).val() );" // Some JavaScript to execure, for example run the function
1918	" var is_selected = jQuery( '#" . $dropdown_id . " option:selected' ).next(); "
1919	// . " if ( is_selected.length == 0 ){ " //FixIn: 10.7.1.5.1
1920	// . " if ( ( 'optgroup' == jQuery( '#" . $dropdown_id . " option:selected' ).parent().prop('nodeName').toLowerCase() ) "
1921	// . " && ( jQuery( '#" . $dropdown_id . " option:selected' ).parent().next().length ) "
1922	// . " && ( 'optgroup' == jQuery( '#" . $dropdown_id . " option:selected' ).parent().next().prop('nodeName').toLowerCase() ) ){ "
1923	// . " is_selected = jQuery( '#" . $dropdown_id . " option:selected' ).parent().next().find('option').first(); "
1924	// . " } "
1925	// . " } "
1926	. " jQuery( '#" . $dropdown_id . " option:selected' ).prop('selected', false); "
1927	. " if ( is_selected.length == 0 ){ "
1928	. " is_selected = jQuery( '#" . $dropdown_id . " option' ).first(); "
1929	. " } "
1930	. " if ( is_selected.length > 0 ){ "
1931	. " is_selected.prop('selected', true).trigger('change'); "
1932	. ( ( $is_apply_rotating_icon ) ? " wpbc_button_enable_loading_icon( this ); " : "" )
1933	. " } else { "
1934	. " jQuery( this ).addClass( 'disabled' ); "
1935	. " } "
1936	, 'class' => 'wpbc_ui_button' // wpbc_ui_button \| wpbc_ui_button_primary
1937	//, 'icon_position' => 'left' // Position of icon relative to Text: left \| right
1938	, 'icon' => array(
1939	'icon_font' => 'wpbc_icn_arrow_forward_ios', // 'wpbc_icn_check_circle_outline',
1940	'position' => 'right',
1941	'icon_img' => ''
1942	)
1943	, 'style' => '' // Any CSS class here
1944	, 'mobile_show_text' => false // Show or hide text, when viewing on Mobile devices (small window size).
1945	, 'attr' => array()
1946	);
1947
1948	wpbc_flex_button( $params_button );
1949	}
1950
1951	// ---------------------------------------------------------------------------------------------------------------------
1952	// Radio Containers
1953	// ---------------------------------------------------------------------------------------------------------------------
1954
1955	/**
1956	* Show FLEX == Radio Container ==
1957	*
1958	* @param array $item
1959	*
1960	* Example:
1961	* $params_radio = array(
1962	* 'id' => 'wpbc_swp_booking_types__changeover_multi_dates_bookings' // HTML ID of element
1963	* , 'name' => 'wpbc_swp_booking_types'
1964	* , 'value' => 'changeover_multi_dates_bookings' // Some Value from optins array that selected by default
1965	* , 'label' => array( 'title' => __('Changeover multi dates bookings','booking') , 'position' => 'right', 'class' => 'wpbc_ui_radio_choice_title' )
1966	* , 'text_description' => __('Receive and manage bookings for chosen times on selected date(s). Time-slots selection in booking form.','booking')
1967	* , 'label_after_right' => '<a tabindex="-1" href="https://wpbookingcalendar.com/features/#change-over-days" target="_blank"><strong class="wpbc_ui_radio_text_right">Pro</strong></a>'
1968	* , 'footer_text' => sprintf( __( '...', 'booking' ), '<a tabindex="-1" href="https://wpbookingcalendar.com/features/#change-over-days" target="_blank">','</a>')
1969	* , 'style' => '' // CSS of select element
1970	* , 'class' => '' // CSS Class of select element
1971	* , 'disabled' => !false
1972	* , 'attr' => array() // Any additional attributes, if this radio \| checkbox element
1973	* , 'legend' => '' // aria-label parameter
1974	* , 'selected' => false // Selected or not
1975	* , 'onfocus' => "console.log( 'ON FOCUS:', jQuery( this ).is(':checked') , 'in element:' , jQuery( this ) );" // JavaScript code
1976	* , 'onchange' => "console.log( 'ON CHANGE:', jQuery( this ).val() , 'in element:' , jQuery( this ) );" // JavaScript code
1977	* );
1978	* ?><div class="wpbc_ui_radio_section wpbc_ui_radio_section_as_row"><?php
1979	* wpbc_flex_radio_container( $params_radio );
1980	* ?></div><?php
1981	*
1982	*
1983	* It generate this HTML Content:
1984	* <div class="wpbc_ui_radio_container" >
1985	* <div class="wpbc_ui_radio_choice">
1986	* <input class="wpbc_ui_radio_choice_input"
1987	* type="radio"
1988	* disabled="disabled"
1989	* name="wpbc_swp_booking_types"
1990	* id="wpbc_swp_booking_types__changeover_multi_dates_bookings"
1991	* value="changeover_multi_dates_bookings"
1992	* />
1993	* <label for="wpbc_swp_booking_types__changeover_multi_dates_bookings" class="wpbc_ui_radio_choice_title"><?php esc_html_e('Changeover multi dates bookings','booking'); ?></label>
1994	* <a tabindex="-1" href="https://wpbookingcalendar.com/features/#change-over-days" target="_blank"><strong class="wpbc_ui_radio_text_right">Pro</strong></a>
1995	* <p class="wpbc_ui_radio_choice_description"><?php esc_html_e('Manage multidays bookings with changeover days for check in/out dates, marked with diagonal or vertical lines. Split days bookings.','booking'); ?></p>
1996	* </div>
1997	* <div class="wpbc_ui_radio_choice wpbc_ui_radio_footer">
1998	* <p class="wpbc_ui_radio_choice_description"><?php echo wp_kses_post( sprintf( __( ',,,', 'booking' ),
1999	* '<a tabindex="-1" href="https://wpbookingcalendar.com/features/#change-over-days" target="_blank">','</a>') ); ?></p>
2000	* </div>
2001	* </div>
2002	*
2003	* CSS located in: ../includes/__css/admin/ui_el__radio_container.css
2004	*/
2005	function wpbc_flex_radio_container( $args = array() ) {
2006
2007	// $milliseconds = round( microtime( true ) * 1000 );
2008
2009	$defaults = array(
2010	'type' => 'checkbox'
2011	, 'id' => '' // HTML ID of element
2012	, 'name' => ''
2013	, 'label' => '' // Label Example: 'label' => array( 'title' => __('Select status' ,'booking') , 'position' => 'left' )
2014	, 'style' => '' // CSS of select element
2015	, 'class' => '' // CSS Class of select element
2016	, 'disabled' => false
2017	, 'attr' => array() // Any additional attributes, if this radio \| checkbox element
2018	, 'legend' => '' // aria-label parameter
2019	, 'value' => '' // Some Value from options array that selected by default
2020	, 'selected' => false // Selected or not
2021	, 'onfocus' => '' // JavaScript code
2022	, 'onchange' => '' // JavaScript code
2023	, 'is_use_toggle' => false // Show checkbox as toggle
2024	, 'hint' => '' // , 'hint' => array( 'title' => __('Select status' ,'booking') , 'position' => 'bottom' )
2025
2026	// Text at Right side of Label, e.g. 'Pro'
2027	, 'label_after_right' => '' // '<a tabindex="-1" href="https://wpbookingcalendar.com/features/#change-over-days" target="_blank"><strong class="wpbc_ui_radio_text_right">Pro</strong></a>'
2028
2029	// Text at Right side of Label, e.g. 'Pro'
2030	, 'text_description' => '' // __('Receive and manage bookings for chosen times on selected date(s). Time-slots selection in booking form.','booking')
2031
2032	// Footer Text separated by line
2033	, 'footer_text' => ''
2034	, 'bottom_html' => ''
2035	);
2036	$params = wp_parse_args( $args, $defaults );
2037
2038
2039	$params['type'] = 'radio';
2040	$params['is_use_toggle'] = false;
2041	if ( ( ! empty( $params['label'] ) ) && ( empty( $params['label']['position'] ) ) ) {
2042	$params['label']['position'] = 'right';
2043	$params['label']['class'] = 'wpbc_ui_radio_choice_title';
2044	}
2045
2046	$params['class'] .= ' wpbc_ui_radio_choice_input';
2047
2048
2049	// Should start with <div class="wpbc_ui_radio_section wpbc_ui_radio_section_as_row"> \| <div class="wpbc_ui_radio_section">
2050
2051	?>
2052	<div class="wpbc_ui_radio_container">
2053	<div class="wpbc_ui_radio_choice">
2054	<?php
2055
2056	wpbc_flex_checkbox( $params );
2057
2058	if ( ! empty( $params['label_after_right'] ) ) {
2059	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
2060	echo $params['label_after_right'];
2061	}
2062
2063	if ( ! empty( $params['text_description'] ) ) {
2064	?><p class="wpbc_ui_radio_choice_description"><?php
2065	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
2066	echo $params['text_description'];
2067	?></p><?php
2068	}
2069
2070	?>
2071	</div><?php
2072
2073	if ( ! empty( $params['footer_text'] ) ) {
2074	?><div class="wpbc_ui_radio_choice wpbc_ui_radio_footer">
2075	<p class="wpbc_ui_radio_choice_description"><?php
2076	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
2077	echo $params['footer_text'];
2078	?></p>
2079	</div><?php
2080	}
2081	// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
2082	echo $params['bottom_html'];
2083	?>
2084	</div>
2085	<?php
2086
2087	// Should end with </div> .
2088	}
2089