bit-form / includes / Frontend / Form / View / Theme / Fields / DropdownField.php

DropdownField.php in Bit Form – Contact Form, Payment Forms, Multi Step Forms, Calculator & Custom Form Builder 3.2.2, at includes/Frontend/Form/View/Theme/Fields/DropdownField.php

472 lines 16.2 KB

Raw Download Zip

1	<?php
2
3	namespace BitCode\BitForm\Frontend\Form\View\Theme\Fields;
4
5	class DropdownField
6	{
7	public static function init($field, $rowID, $field_name, $form_atomic_Cls_map, $formID, $error = null, $value = null)
8	{
9	$inputWrapper = new ClassicInputWrapper($field, $rowID, $field_name, $form_atomic_Cls_map, $formID, $error, $value);
10	$input = self::field($field, $rowID, $field_name, $form_atomic_Cls_map, $formID, $error, $value);
11	return $inputWrapper->wrapper($input);
12	}
13
14	private static function field($field, $rowID, $field_name, $form_atomic_Cls_map, $formID, $error = null, $value = null)
15	{
16	$fh = new ClassicFieldHelpers($field, $rowID, $form_atomic_Cls_map);
17	$ph = isset($field->ph) ? $field->ph : '';
18	$val = !empty($value) ? $value : $fh->value();
19	$val = 'array' === gettype($val) ? ("value='" . implode(',', $val) . "'") : $val;
20	$name = $fh->name();
21	$req = $fh->required();
22	$readonlyCls = isset($field->valid->readonly) ? 'readonly' : '';
23	$disabledCls = isset($field->valid->disabled) ? 'disabled' : '';
24	$selectedOptImage = '';
25	$optionsList = '';
26	$activeList = isset($field->config->activeList) ? $field->config->activeList : null;
27	$allowCustomOption = apply_filters('bitform_dropdown_allow_custom_option', false, $field);
28	$showSearch = !$fh->property_exists_nested($field, 'config->showSearch', false);
29	$searchMarkup = '';
30	$img = htmlentities("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg'/>");
31
32	$selectedOptImage = apply_filters('bitform_dropdown_selected_opt_image', '', $field, $fh);
33
34	if (property_exists($field, 'optionsList')) {
35	foreach ($field->optionsList as $key => $value) {
36	$dataIndex = 0;
37	$valueArr = (array) $value;
38	$listName = array_keys($valueArr)[0];
39	$options = array_values($valueArr)[0];
40
41	$optionsList .= sprintf(
42	'<ul
43	%1$s
44	class="%2$s %3$s"
45	aria-hidden="true"
46	aria-label="Option List"
47	data-list="%4$s"
48	data-list-index="%5$s"
49	tabIndex="-1"
50	role="listbox"
51	>',
52	$fh->getCustomAttributes('option-list'),
53	$fh->getAtomicCls('option-list'),
54	$fh->getCustomClasses('option-list'),
55	$fh->esc_attr($listName),
56	$key
57	);
58	if ($allowCustomOption) {
59	$optionsList .= sprintf(
60	'<li
61	%1$s
62	data-index=%2$s
63	data-value="create-opt"
64	class="option create-opt %3$s"
65	role="option"
66	aria-selected="false"
67	tabIndex="-1"
68	style="display: none !important;"
69	>
70	<span
71	%4$s
72	class="opt-lbl-wrp %5$s"
73	>
74	<span
75	%6$s
76	class="opt-lbl %7$s"
77	>
78	Create:
79	</span>
80	</span>
81	<span class="opt-prefix"></span>
82	</li>',
83	$fh->getCustomAttributes('option'),
84	$dataIndex,
85	$fh->getCustomClasses('option'),
86	$fh->getCustomAttributes('opt-lbl-wrp'),
87	$fh->getCustomClasses('opt-lbl-wrp'),
88	$fh->getCustomAttributes('opt-lbl'),
89	$fh->getCustomClasses('opt-lbl')
90	);
91	}
92
93	foreach ($options as $opt) {
94	if (isset($opt->type)) {
95	$disableOpt = isset($opt->disabled) ? 'disabled-opt' : '';
96	$optionsList .= sprintf(
97	'<li
98	data-index=%1$s
99	%2$s
100	class="option opt-group-title %3$s %4$s"
101	>
102	<span
103	%5$s
104	class="opt-lbl %6$s"
105	>
106	%7$s
107	</span>
108	</li>',
109	$dataIndex,
110	$fh->getCustomAttributes('option'),
111	$fh->getCustomClasses('option'),
112	$disableOpt,
113	$fh->getCustomAttributes('opt-lbl'),
114	$fh->getCustomClasses('opt-lbl'),
115	$fh->kses_post($opt->title)
116	);
117	foreach ($opt->childs as $child) {
118	$optVal = isset($child->val) ? $child->val : $child->lbl;
119	$disableOpt = (isset($opt->disabled) \|\| isset($child->disabled)) ? 'disabled-opt' : '';
120	$optImage = '';
121	if (isset($child->img)) {
122	$optImage = sprintf(
123	'<img
124	%1$s
125	class="opt-icn %2$s"
126	aria-hidden="true"
127	alt="%3$s"
128	src="%4$s"
129	>',
130	$fh->getCustomAttributes('opt-icn'),
131	$fh->getCustomClasses('opt-icn'),
132	$fh->esc_attr($child->lbl),
133	$fh->esc_url($child->img)
134	);
135	}
136	$optionsList .= sprintf(
137	'<li
138	%1$s
139	data-index="%2$s"
140	data-value="%3$s"
141	class="option opt-group-child %4$s %5$s"
142	role="option"
143	aria-selected="false"
144	tabIndex="-1"
145	>
146	<span
147	%6$s
148	class="opt-lbl-wrp %7$s"
149	>
150	%8$s
151	<span
152	%9$s
153	class="opt-lbl %10$s"
154	>
155	%11$s
156	</span>
157	</span>
158	<span class="opt-prefix" />
159	</li>',
160	$fh->getCustomAttributes('option'),
161	$dataIndex,
162	$fh->esc_attr($optVal),
163	$fh->getCustomClasses('option'),
164	$disableOpt,
165	$fh->getCustomAttributes('opt-lbl-wrp'),
166	$fh->getCustomClasses('opt-lbl-wrp'),
167	$optImage,
168	$fh->getCustomAttributes('opt-lbl'),
169	$fh->getCustomClasses('opt-lbl'),
170	$fh->kses_post($child->lbl)
171	);
172	}
173	} else {
174	$optVal = isset($opt->val) ? $opt->val : $opt->lbl;
175	$disableOpt = isset($opt->disabled) ? 'disabled-opt' : '';
176	$optImage = '';
177	if (isset($opt->img)) {
178	$optImage = sprintf(
179	'<img
180	%1$s
181	class="opt-icn %2$s"
182	aria-hidden="true"
183	alt="%3$s"
184	src="%4$s"
185	>',
186	$fh->getCustomAttributes('opt-icn'),
187	$fh->getCustomClasses('opt-icn'),
188	$fh->esc_attr($opt->lbl),
189	$fh->esc_url($opt->img)
190	);
191	}
192	$optionsList .= sprintf(
193	'<li
194	%1$s
195	data-index="%2$s"
196	data-value="%3$s"
197	class="option %4$s %5$s"
198	role="option"
199	aria-selected="false"
200	tabIndex="-1"
201	>
202	<span
203	%6$s
204	class="opt-lbl-wrp %7$s"
205	>
206	%8$s
207	<span
208	%9$s
209	class="opt-lbl %10$s"
210	>
211	%11$s
212	</span>
213	</span>
214	<span class="opt-prefix" />
215	</li>',
216	$fh->getCustomAttributes('option'),
217	$dataIndex,
218	$fh->esc_attr($optVal),
219	$fh->getCustomClasses('option'),
220	$disableOpt,
221	$fh->getCustomAttributes('opt-lbl-wrp'),
222	$fh->getCustomClasses('opt-lbl-wrp'),
223	$optImage,
224	$fh->getCustomAttributes('opt-lbl'),
225	$fh->getCustomClasses('opt-lbl'),
226	$fh->kses_post($opt->lbl)
227	);
228	}
229	}
230	$optionsList .= '</ul>';
231	$dataIndex++;
232	}
233
234	$optionsList .= sprintf(
235	'<ul
236	%1$s
237	class="%2$s %3$s active-list"
238	aria-hidden="true"
239	aria-label="Option List"
240	tabIndex="-1"
241	role="listbox"
242	>
243	</ul>',
244	$fh->getCustomAttributes('option-list'),
245	$fh->getAtomicCls('option-list'),
246	$fh->getCustomClasses('option-list')
247	);
248
249	$multiChipClass = ($fh->property_exists_nested($field, 'config->multipleSelect', true) && $fh->property_exists_nested($field, 'config->showChip', true)) ? 'multi-chip' : '';
250
251	if ($showSearch) {
252	$searchMarkup = sprintf(
253	'<div
254	%1$s
255	class="%2$s %3$s"
256	>
257	<input
258	%4$s
259	type="search"
260	class="%5$s %6$s"
261	placeholder="Search Country"
262	aria-label="Search Options"
263	aria-hidden="true"
264	tabIndex="-1"
265	inert
266	/>
267	<svg
268	%7$s
269	class="%8$s %9$s %10$s"
270	aria-hidden="true"
271	width="22"
272	height="22"
273	role="img"
274	title="Search icon"
275	viewBox="0 0 24 24"
276	fill="none"
277	stroke="currentColor"
278	stroke-width="2"
279	stroke-linecap="round"
280	stroke-linejoin="round"
281	>
282	<circle cx="11" cy="11" r="8" />
283	<line x1="21" y1="21" x2="16.65" y2="16.65" />
284	</svg>
285	<button
286	%11$s
287	type="button"
288	aria-label="Clear search"
289	class="%12$s %13$s %14$s"
290	tabIndex="-1"
291	>
292	<svg
293	width="13"
294	height="13"
295	role="img"
296	viewBox="0 0 24 24"
297	fill="none"
298	stroke="currentColor"
299	stroke-width="2"
300	stroke-linecap="round"
301	stroke-linejoin="round"
302	>
303	<line x1="18" y1="6" x2="6" y2="18" />
304	<line x1="6" y1="6" x2="18" y2="18" />
305	</svg>
306	</button>
307	</div>',
308	$fh->getCustomAttributes('option-search-wrp'),
309	$fh->getAtomicCls('option-search-wrp'),
310	$fh->getCustomClasses('option-search-wrp'),
311	$fh->getCustomAttributes('opt-search-input'),
312	$fh->getAtomicCls('opt-search-input'),
313	$fh->getCustomClasses('opt-search-input'),
314	$fh->getCustomAttributes('opt-search-icn'),
315	$fh->getAtomicCls('icn'),
316	$fh->getAtomicCls('opt-search-icn'),
317	$fh->getCustomClasses('opt-search-icn'),
318	$fh->getCustomAttributes('search-clear-btn'),
319	$fh->getAtomicCls('icn'),
320	$fh->getAtomicCls('search-clear-btn'),
321	$fh->getCustomClasses('search-clear-btn')
322	);
323	}
324
325	return sprintf(
326	'<div class="%1$s %2$s">
327	<div
328	%3$s
329	class="%4$s %5$s %6$s %7$s"
330	>
331	<input
332	%8$s
333	%9$s
334	type="text"
335	title="Dropdown Hidden Input"
336	class="%10$s d-none"
337	%11$s
338	%12$s
339	%13$s
340	/>
341	<div
342	%14$s
343	class="%15$s %16$s"
344	role="combobox"
345	aria-controls=""
346	aria-haspopup="listbox"
347	aria-live="assertive"
348	aria-expanded="false"
349	tabIndex="0"
350	aria-label="Dropdown"
351	>
352	<div
353	%17$s
354	class="%18$s %19$s"
355	>
356	%20$s
357	<span
358	%21$s
359	aria-label="Selected Option Label"
360	class="%22$s %23$s %24$s"
361	>
362	%25$s
363	</span>
364	</div>
365	<div
366	%26$s
367	class="%27$s %28$s"
368	>
369	<button
370	%29$s
371	type="button"
372	aria-label="Clear selected option value"
373	class="%30$s %31$s"
374	>
375	<svg
376	width="15"
377	height="15"
378	role="img"
379	title="Cross icon"
380	viewBox="0 0 24 24"
381	fill="none"
382	stroke="currentColor"
383	stroke-width="2"
384	stroke-linecap="round"
385	stroke-linejoin="round"
386	>
387	<line x1="18" y1="6" x2="6" y2="18" />
388	<line x1="6" y1="6" x2="18" y2="18" />
389	</svg>
390	</button>
391	<div
392	%32$s
393	class="%33$s %34$s"
394	>
395	<svg
396	width="15"
397	height="15"
398	viewBox="0 0 24 24"
399	title="Down icon"
400	role="img"
401	fill="none"
402	stroke="currentColor"
403	stroke-width="2"
404	stroke-linecap="round"
405	stroke-linejoin="round"
406	>
407	<polyline points="6 9 12 15 18 9" />
408	</svg>
409	</div>
410	</div>
411	</div>
412	<div
413	%35$s
414	class="%36$s %37$s"
415	>
416	<div
417	%38$s
418	class="%39$s %40$s"
419	>
420	%41$s
421	%42$s
422	</div>
423	</div>
424	</div>
425	</div>',
426	$fh->getAtomicCls('dpd-fld-container'), // 1
427	$fh->getCustomClasses('dpd-fld-container'), // 2
428	$fh->getCustomAttributes('dpd-fld-wrp'), // 3
429	$fh->getAtomicCls('dpd-fld-wrp'), // 4
430	$fh->getCustomClasses('dpd-fld-wrp'), // 5
431	$readonlyCls, // 6
432	$disabledCls, // 7
433	$name, // 8
434	$req, // 9
435	$fh->getAtomicCls('dpd-hidden-input'), // 10
436	$fh->disabled(), // 11
437	$fh->readonly(), // 12
438	$val, // 13
439	$fh->getCustomAttributes('dpd-wrp'), // 14
440	$fh->getAtomicCls('dpd-wrp'), // 15
441	$fh->getCustomClasses('dpd-wrp'), // 16
442	$fh->getCustomAttributes('selected-opt-wrp'), // 17
443	$fh->getAtomicCls('selected-opt-wrp'), // 18
444	$fh->getCustomClasses('selected-opt-wrp'), // 19
445	$selectedOptImage, // 20
446	$fh->getCustomAttributes('selected-opt-lbl'), // 21
447	$fh->getAtomicCls('selected-opt-lbl'), // 22
448	$multiChipClass, // 23
449	$fh->getCustomClasses('selected-opt-lbl'), // 24
450	$fh->esc_html($ph), // 25
451	$fh->getCustomAttributes('dpd-btn-wrp'), // 26
452	$fh->getAtomicCls('dpd-btn-wrp'), // 27
453	$fh->getCustomClasses('dpd-btn-wrp'), // 28
454	$fh->getCustomAttributes('selected-opt-clear-btn'), // 29
455	$fh->getAtomicCls('selected-opt-clear-btn'), // 30
456	$fh->getCustomClasses('selected-opt-clear-btn'), // 31
457	$fh->getCustomAttributes('dpd-down-btn'), // 32
458	$fh->getAtomicCls('dpd-down-btn'), // 33
459	$fh->getCustomClasses('dpd-down-btn'), // 34
460	$fh->getCustomAttributes('option-wrp'), // 35
461	$fh->getAtomicCls('option-wrp'), // 36
462	$fh->getCustomClasses('option-wrp'), // 37
463	$fh->getCustomAttributes('option-inner-wrp'), // 38
464	$fh->getAtomicCls('option-inner-wrp'), // 39
465	$fh->getCustomClasses('option-inner-wrp'), // 40
466	$searchMarkup, // 41
467	$optionsList // 42
468	);
469	}
470	}
471	}
472