| 1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108 | 1×
1×
1×
1×
1×
1×
1×
63×
63×
63×
63×
63×
63×
63×
63×
63×
31×
31×
63×
63×
63×
63×
63×
63×
30×
26×
30×
1×
1×
63×
9×
9×
54×
54×
1×
1×
1394×
1394×
1394×
1394×
45×
45×
45×
45×
45×
1349×
1349×
1394×
1×
1×
1394×
782×
612×
1×
1×
111×
111×
111×
8×
8×
3×
1×
1×
138×
138×
138×
2×
2×
1×
1×
190×
190×
180×
180×
180×
180×
190×
1×
| define(["require", "exports", "@syncfusion/ej2-base", "@syncfusion/ej2-base"], function (require, exports, ej2_base_1, ej2_base_2) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var FLOATLINE = 'e-float-line';
var FLOATTEXT = 'e-float-text';
var LABELTOP = 'e-label-top';
var LABELBOTTOM = 'e-label-bottom';
function createFloatLabel(overAllWrapper, searchWrapper, element, inputElement, value, floatLabelType, placeholder) {
var floatLinelement = ej2_base_2.createElement('span', { className: FLOATLINE });
var floatLabelElement = ej2_base_2.createElement('label', { className: FLOATTEXT });
var id = element.getAttribute('id') ? element.getAttribute('id') : ej2_base_2.getUniqueID('ej2_multiselect');
element.id = id;
Eif (!ej2_base_2.isNullOrUndefined(element.id) && element.id !== '') {
floatLabelElement.id = 'label_' + element.id.replace(/ /g, '_');
floatLabelElement.setAttribute('for', element.id);
ej2_base_2.attributes(inputElement, { 'aria-labelledby': floatLabelElement.id });
}
if (!ej2_base_2.isNullOrUndefined(inputElement.placeholder) && inputElement.placeholder !== '') {
floatLabelElement.innerText = encodePlaceholder(inputElement.placeholder);
inputElement.removeAttribute('placeholder');
}
floatLabelElement.innerText = encodePlaceholder(placeholder);
searchWrapper.appendChild(floatLinelement);
searchWrapper.appendChild(floatLabelElement);
overAllWrapper.classList.add('e-float-input');
updateFloatLabelState(value, floatLabelElement);
if (floatLabelType === 'Always') {
if (floatLabelElement.classList.contains(LABELBOTTOM)) {
ej2_base_1.removeClass([floatLabelElement], LABELBOTTOM);
}
ej2_base_1.addClass([floatLabelElement], LABELTOP);
}
}
exports.createFloatLabel = createFloatLabel;
function updateFloatLabelState(value, label) {
if (value && value.length > 0) {
ej2_base_1.addClass([label], LABELTOP);
ej2_base_1.removeClass([label], LABELBOTTOM);
}
else {
ej2_base_1.removeClass([label], LABELTOP);
ej2_base_1.addClass([label], LABELBOTTOM);
}
}
exports.updateFloatLabelState = updateFloatLabelState;
function removeFloating(overAllWrapper, componentWrapper, searchWrapper, inputElement, value, floatLabelType, placeholder) {
var placeholderElement = componentWrapper.querySelector('.' + FLOATTEXT);
var floatLine = componentWrapper.querySelector('.' + FLOATLINE);
var placeholderText;
if (!ej2_base_2.isNullOrUndefined(placeholderElement)) {
placeholderText = placeholderElement.innerText;
ej2_base_1.detach(searchWrapper.querySelector('.' + FLOATTEXT));
setPlaceHolder(value, inputElement, placeholderText);
Eif (!ej2_base_2.isNullOrUndefined(floatLine)) {
ej2_base_1.detach(searchWrapper.querySelector('.' + FLOATLINE));
}
}
else {
placeholderText = (placeholder !== null) ? placeholder : '';
setPlaceHolder(value, inputElement, placeholderText);
}
overAllWrapper.classList.remove('e-float-input');
}
exports.removeFloating = removeFloating;
function setPlaceHolder(value, inputElement, placeholder) {
if (value && value.length) {
inputElement.placeholder = '';
}
else {
inputElement.placeholder = placeholder;
}
}
exports.setPlaceHolder = setPlaceHolder;
function floatLabelFocus(overAllWrapper, componentWrapper) {
overAllWrapper.classList.add('e-input-focus');
var label = componentWrapper.querySelector('.' + FLOATTEXT);
if (!ej2_base_2.isNullOrUndefined(label)) {
ej2_base_1.addClass([label], LABELTOP);
if (label.classList.contains(LABELBOTTOM)) {
ej2_base_1.removeClass([label], LABELBOTTOM);
}
}
}
exports.floatLabelFocus = floatLabelFocus;
function floatLabelBlur(overAllWrapper, componentWrapper, value, floatLabelType, placeholder) {
overAllWrapper.classList.remove('e-input-focus');
var label = componentWrapper.querySelector('.' + FLOATTEXT);
if (value && value.length <= 0 && floatLabelType === 'Auto' && !ej2_base_2.isNullOrUndefined(label)) {
Iif (label.classList.contains(LABELTOP)) {
ej2_base_1.removeClass([label], LABELTOP);
}
ej2_base_1.addClass([label], LABELBOTTOM);
}
}
exports.floatLabelBlur = floatLabelBlur;
function encodePlaceholder(placeholder) {
var result = '';
if (!ej2_base_2.isNullOrUndefined(placeholder) && placeholder !== '') {
var spanElement = document.createElement('span');
spanElement.innerHTML = '<input placeholder="' + placeholder + '"/>';
var hiddenInput = (spanElement.children[0]);
result = hiddenInput.placeholder;
}
return result;
}
exports.encodePlaceholder = encodePlaceholder;
});
|