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 2.21.13, at includes/Frontend/Form/View/Theme/Fields/DropdownField.php

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