@luftborn/custom-elements 2.12.7 → 2.12.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/demo/index.js +85 -8
- package/demo/index.min.js +84 -7
- package/demo/index.min.js.map +1 -1
- package/dist/elements/Address/AddressElement.js +6 -3
- package/dist/elements/Address/AddressElement.js.map +1 -1
- package/dist/elements/BankField/BankFieldElement.js +3 -0
- package/dist/elements/BankField/BankFieldElement.js.map +1 -1
- package/dist/elements/CPRElement/CPRElement.js +3 -0
- package/dist/elements/CPRElement/CPRElement.js.map +1 -1
- package/dist/elements/CVRElement/CVRElement.js +3 -0
- package/dist/elements/CVRElement/CVRElement.js.map +1 -1
- package/dist/elements/CheckBoxElement/CheckBoxElement.js +3 -0
- package/dist/elements/CheckBoxElement/CheckBoxElement.js.map +1 -1
- package/dist/elements/CustomFormatDateFieldElement/CustomFormatDateFieldElement.js +3 -0
- package/dist/elements/CustomFormatDateFieldElement/CustomFormatDateFieldElement.js.map +1 -1
- package/dist/elements/CustomRegularExpression/CustomRegularExpressionElement.js +3 -0
- package/dist/elements/CustomRegularExpression/CustomRegularExpressionElement.js.map +1 -1
- package/dist/elements/DateField/DateFieldElement.js +3 -0
- package/dist/elements/DateField/DateFieldElement.js.map +1 -1
- package/dist/elements/DropDownList/DropDownListElement.js +3 -0
- package/dist/elements/DropDownList/DropDownListElement.js.map +1 -1
- package/dist/elements/EmailField/EmailFieldElement.js +3 -0
- package/dist/elements/EmailField/EmailFieldElement.js.map +1 -1
- package/dist/elements/FileField/FileFieldElement.js +3 -0
- package/dist/elements/FileField/FileFieldElement.js.map +1 -1
- package/dist/elements/IdentificationElement/IdentificationElement.js +3 -0
- package/dist/elements/IdentificationElement/IdentificationElement.js.map +1 -1
- package/dist/elements/InternationaPhoneNumber/InternationaPhoneNumberElement.js +3 -0
- package/dist/elements/InternationaPhoneNumber/InternationaPhoneNumberElement.js.map +1 -1
- package/dist/elements/NumericField/NumericFieldElement.js +3 -0
- package/dist/elements/NumericField/NumericFieldElement.js.map +1 -1
- package/dist/elements/RadioButtonGroup/RadioButtonGroupElement.js +3 -0
- package/dist/elements/RadioButtonGroup/RadioButtonGroupElement.js.map +1 -1
- package/dist/elements/SECompanyRegistrationElement/SECompanyRegistrationElement.js +3 -0
- package/dist/elements/SECompanyRegistrationElement/SECompanyRegistrationElement.js.map +1 -1
- package/dist/elements/SEPersonalNumberElement/SEPersonalNumberElement.js +3 -0
- package/dist/elements/SEPersonalNumberElement/SEPersonalNumberElement.js.map +1 -1
- package/dist/elements/TextAreaElement/TextAreaElement.js +3 -0
- package/dist/elements/TextAreaElement/TextAreaElement.js.map +1 -1
- package/dist/elements/TextField/TextFieldElement.js +3 -0
- package/dist/elements/TextField/TextFieldElement.js.map +1 -1
- package/dist/elements/TypeAhead/TypeAheadElement.js +3 -0
- package/dist/elements/TypeAhead/TypeAheadElement.js.map +1 -1
- package/dist/framework/CustomInputElement.d.ts +3 -1
- package/dist/framework/CustomInputElement.js +21 -4
- package/dist/framework/CustomInputElement.js.map +1 -1
- package/package.json +1 -1
- package/src/elements/Address/AddressElement.ts +6 -3
- package/src/elements/BankField/BankFieldElement.ts +3 -0
- package/src/elements/CPRElement/CPRElement.ts +3 -0
- package/src/elements/CVRElement/CVRElement.ts +3 -0
- package/src/elements/CheckBoxElement/CheckBoxElement.ts +3 -0
- package/src/elements/CustomFormatDateFieldElement/CustomFormatDateFieldElement.ts +3 -0
- package/src/elements/CustomRegularExpression/CustomRegularExpressionElement.ts +3 -0
- package/src/elements/DateField/DateFieldElement.ts +3 -0
- package/src/elements/DropDownList/DropDownListElement.ts +3 -0
- package/src/elements/EmailField/EmailFieldElement.ts +3 -0
- package/src/elements/FileField/FileFieldElement.ts +3 -0
- package/src/elements/IdentificationElement/IdentificationElement.ts +3 -0
- package/src/elements/InternationaPhoneNumber/InternationaPhoneNumberElement.ts +3 -0
- package/src/elements/NumericField/NumericFieldElement.ts +3 -0
- package/src/elements/RadioButtonGroup/RadioButtonGroupElement.ts +3 -0
- package/src/elements/SECompanyRegistrationElement/SECompanyRegistrationElement.ts +3 -0
- package/src/elements/SEPersonalNumberElement/SEPersonalNumberElement.ts +3 -0
- package/src/elements/TextAreaElement/TextAreaElement.ts +3 -0
- package/src/elements/TextField/TextFieldElement.ts +3 -0
- package/src/elements/TypeAhead/TypeAheadElement.ts +3 -0
- package/src/framework/CustomInputElement.ts +23 -5
|
@@ -9,6 +9,7 @@ export declare abstract class CustomInputElement extends HTMLElement {
|
|
|
9
9
|
protected hasValueDependency: any;
|
|
10
10
|
protected noValueDependency: any;
|
|
11
11
|
protected dependencies: any[];
|
|
12
|
+
protected labelId: string;
|
|
12
13
|
onChange: CustomElementEvent<CustomElementEventArgs>;
|
|
13
14
|
onValidate: CustomElementEvent<CustomElementEventArgs>;
|
|
14
15
|
onVisibilityChanged: CustomElementEvent<CustomElementEventArgs>;
|
|
@@ -32,7 +33,7 @@ export declare abstract class CustomInputElement extends HTMLElement {
|
|
|
32
33
|
abstract initChildInputs(): void;
|
|
33
34
|
abstract validate(): void;
|
|
34
35
|
abstract change($event: any): void;
|
|
35
|
-
|
|
36
|
+
compareValues: any[];
|
|
36
37
|
isValueConditionMatched(val: any): boolean;
|
|
37
38
|
connectedCallback(): void;
|
|
38
39
|
init(): void;
|
|
@@ -44,6 +45,7 @@ export declare abstract class CustomInputElement extends HTMLElement {
|
|
|
44
45
|
private setVisibility;
|
|
45
46
|
private hide;
|
|
46
47
|
private show;
|
|
48
|
+
private createLabelEventListener;
|
|
47
49
|
protected getChildInput(selector: string): HTMLInputElement;
|
|
48
50
|
protected getChildInputs(selector: string): HTMLInputElement[];
|
|
49
51
|
protected getChildElement(selector: string): HTMLElement;
|
|
@@ -36,7 +36,7 @@ var CustomInputElement = /** @class */ (function (_super) {
|
|
|
36
36
|
_this.onVisibilityChanged = new CustomEvents_1.CustomElementEvent();
|
|
37
37
|
_this.allDependenciesMustBeMet = false;
|
|
38
38
|
_this.multi = false;
|
|
39
|
-
_this.
|
|
39
|
+
_this.compareValues = [];
|
|
40
40
|
return _this;
|
|
41
41
|
}
|
|
42
42
|
CustomInputElement.prototype.isValueConditionMatched = function (val) {
|
|
@@ -44,7 +44,7 @@ var CustomInputElement = /** @class */ (function (_super) {
|
|
|
44
44
|
if (val && Array.isArray(val) && val.length) {
|
|
45
45
|
var result_1 = false;
|
|
46
46
|
val.forEach(function (element) {
|
|
47
|
-
var elementMatched = _this.
|
|
47
|
+
var elementMatched = _this.compareValues.findIndex(function (x) { return x == element; }) !== -1;
|
|
48
48
|
if (elementMatched) {
|
|
49
49
|
result_1 = true;
|
|
50
50
|
return;
|
|
@@ -52,7 +52,7 @@ var CustomInputElement = /** @class */ (function (_super) {
|
|
|
52
52
|
});
|
|
53
53
|
return result_1;
|
|
54
54
|
}
|
|
55
|
-
return this.
|
|
55
|
+
return this.compareValues.findIndex(function (x) { return x == val; }) !== -1;
|
|
56
56
|
};
|
|
57
57
|
CustomInputElement.prototype.connectedCallback = function () {
|
|
58
58
|
this.init();
|
|
@@ -92,6 +92,7 @@ var CustomInputElement = /** @class */ (function (_super) {
|
|
|
92
92
|
this.customValue = data.value;
|
|
93
93
|
this.dateFormat = data.dateFormat;
|
|
94
94
|
this.initialValue = data.value;
|
|
95
|
+
this.labelId = data.labelId;
|
|
95
96
|
}
|
|
96
97
|
catch (ex) {
|
|
97
98
|
console.error(ex);
|
|
@@ -119,6 +120,9 @@ var CustomInputElement = /** @class */ (function (_super) {
|
|
|
119
120
|
_this.validate();
|
|
120
121
|
}
|
|
121
122
|
});
|
|
123
|
+
if (this.labelId) {
|
|
124
|
+
this.createLabelEventListener(this.labelId);
|
|
125
|
+
}
|
|
122
126
|
};
|
|
123
127
|
CustomInputElement.prototype.setAttributes = function () {
|
|
124
128
|
this.setAttribute("custom-input", "");
|
|
@@ -153,7 +157,7 @@ var CustomInputElement = /** @class */ (function (_super) {
|
|
|
153
157
|
var _this = this;
|
|
154
158
|
var element = document.querySelector("[name=\"" + elementName + "\"]");
|
|
155
159
|
if (element instanceof CustomInputElement) {
|
|
156
|
-
element.
|
|
160
|
+
element.compareValues.push(value);
|
|
157
161
|
if (this.dependentOnList.hasOwnProperty(element.name)) {
|
|
158
162
|
return;
|
|
159
163
|
}
|
|
@@ -217,6 +221,19 @@ var CustomInputElement = /** @class */ (function (_super) {
|
|
|
217
221
|
this.closest('.custom-validation-target').removeAttribute("hidden");
|
|
218
222
|
}
|
|
219
223
|
};
|
|
224
|
+
CustomInputElement.prototype.createLabelEventListener = function (labelId) {
|
|
225
|
+
var _this = this;
|
|
226
|
+
var label = document.querySelector("[id=\"" + labelId + "\"]");
|
|
227
|
+
if (label) {
|
|
228
|
+
label.addEventListener("click", function () {
|
|
229
|
+
// the input is that have aria-labelledby attribute equal to the this.labelId
|
|
230
|
+
var input = _this.getChildElement("[aria-labelledby=\"" + labelId + "\"]");
|
|
231
|
+
if (input) {
|
|
232
|
+
input.focus();
|
|
233
|
+
}
|
|
234
|
+
});
|
|
235
|
+
}
|
|
236
|
+
};
|
|
220
237
|
CustomInputElement.prototype.getChildInput = function (selector) {
|
|
221
238
|
var element = this;
|
|
222
239
|
if (this.shadowRoot) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CustomInputElement.js","sourceRoot":"","sources":["../../src/framework/CustomInputElement.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAAA,+CAA4E;AAE5E,mDAA8C;AAC9C,+CAA0C;AAE1C;IAAA;IAEA,CAAC;IAAD,kBAAC;AAAD,CAAC,AAFD,IAEC;AACD;IAAiD,sCAAW;
|
|
1
|
+
{"version":3,"file":"CustomInputElement.js","sourceRoot":"","sources":["../../src/framework/CustomInputElement.ts"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -48,9 +48,9 @@ export class AddressElement extends CustomInputElement {
|
|
|
48
48
|
|
|
49
49
|
get value(): string {
|
|
50
50
|
let address = this.address.value || '';
|
|
51
|
-
let city = this.city.value ?
|
|
52
|
-
let zip = this.zip.value ?
|
|
53
|
-
let country = this.country.value ?
|
|
51
|
+
let city = this.city.value ? `, ${this.city.value}` : '';
|
|
52
|
+
let zip = this.zip.value ? `, ${this.zip.value}` : '';
|
|
53
|
+
let country = this.country.value ? `, ${this.country.value}` : '';
|
|
54
54
|
return `${address}${zip}${city}${country}`;
|
|
55
55
|
}
|
|
56
56
|
|
|
@@ -102,6 +102,9 @@ export class AddressElement extends CustomInputElement {
|
|
|
102
102
|
this.country.setAttribute('required', '');
|
|
103
103
|
this.zip.setAttribute('required', '');
|
|
104
104
|
}
|
|
105
|
+
if (this.labelId) {
|
|
106
|
+
this.address.setAttribute('aria-labelledby', this.labelId);
|
|
107
|
+
}
|
|
105
108
|
}
|
|
106
109
|
|
|
107
110
|
// events
|
|
@@ -96,6 +96,9 @@ export class BankFieldElement extends CustomInputElement {
|
|
|
96
96
|
this.account.setAttribute('required', '');
|
|
97
97
|
this.regNumber.setAttribute('required', '');
|
|
98
98
|
}
|
|
99
|
+
if (this.labelId) {
|
|
100
|
+
this.regNumber.setAttribute('aria-labelledby', this.labelId);
|
|
101
|
+
}
|
|
99
102
|
}
|
|
100
103
|
|
|
101
104
|
// events
|
|
@@ -67,6 +67,9 @@ export class CheckBoxElement extends CustomInputElement {
|
|
|
67
67
|
this.checkbox.forEach(c =>
|
|
68
68
|
c.addEventListener('change', this.change.bind(this)),
|
|
69
69
|
);
|
|
70
|
+
if (this.labelId) {
|
|
71
|
+
this.checkbox[0].setAttribute('aria-labelledby', this.labelId);
|
|
72
|
+
}
|
|
70
73
|
}
|
|
71
74
|
|
|
72
75
|
private addCheckBoxes() {
|
|
@@ -66,6 +66,9 @@ export class CustomRegularExpressionElement extends CustomInputElement {
|
|
|
66
66
|
if (this.placeholder) {
|
|
67
67
|
this.text.setAttribute('placeholder', this.placeholder);
|
|
68
68
|
}
|
|
69
|
+
if (this.labelId) {
|
|
70
|
+
this.text.setAttribute('aria-labelledby', this.labelId);
|
|
71
|
+
}
|
|
69
72
|
}
|
|
70
73
|
|
|
71
74
|
// events
|
|
@@ -85,6 +85,9 @@ export class DropDownListElement extends CustomInputElement {
|
|
|
85
85
|
this.value = this.initialValue;
|
|
86
86
|
}
|
|
87
87
|
this.select.addEventListener('change', this.change.bind(this));
|
|
88
|
+
if (this.labelId) {
|
|
89
|
+
this.select.setAttribute('aria-labelledby', this.labelId);
|
|
90
|
+
}
|
|
88
91
|
}
|
|
89
92
|
|
|
90
93
|
private addOptions() {
|
|
@@ -86,6 +86,9 @@ export class IdentificationElement extends CustomInputElement {
|
|
|
86
86
|
this.text.setAttribute('required', '');
|
|
87
87
|
}
|
|
88
88
|
this.type = this.typeSelector.value;
|
|
89
|
+
if (this.labelId) {
|
|
90
|
+
this.text.setAttribute('aria-labelledby', this.labelId);
|
|
91
|
+
}
|
|
89
92
|
}
|
|
90
93
|
|
|
91
94
|
// events
|
|
@@ -79,6 +79,9 @@ export class IntPhoneFieldElement extends CustomInputElement {
|
|
|
79
79
|
this.phone.setAttribute('placeholder', this.placeholder);
|
|
80
80
|
this.intlTelInput.options.autoPlaceholder = 'off';
|
|
81
81
|
}
|
|
82
|
+
if (this.labelId) {
|
|
83
|
+
this.phone.setAttribute('aria-labelledby', this.labelId);
|
|
84
|
+
}
|
|
82
85
|
}
|
|
83
86
|
setIntlTelInput() {
|
|
84
87
|
this.phone = super.getChildInput('#phone-field');
|
|
@@ -73,6 +73,9 @@ export class RadioButtonGroupElement extends CustomInputElement {
|
|
|
73
73
|
if (this.initialValue) {
|
|
74
74
|
this.value = this.initialValue;
|
|
75
75
|
}
|
|
76
|
+
if (this.labelId) {
|
|
77
|
+
this.radioButton[0].setAttribute('aria-labelledby', this.labelId);
|
|
78
|
+
}
|
|
76
79
|
}
|
|
77
80
|
|
|
78
81
|
private addRadioButtons() {
|
|
@@ -134,6 +134,9 @@ export class TypeAheadElement extends CustomInputElement {
|
|
|
134
134
|
if (this.initialValue) {
|
|
135
135
|
this.value = this.initialValue;
|
|
136
136
|
}
|
|
137
|
+
if (this.labelId) {
|
|
138
|
+
this.textInputElement.setAttribute('aria-labelledby', this.labelId);
|
|
139
|
+
}
|
|
137
140
|
this.textInputElement.addEventListener('change', this.change.bind(this));
|
|
138
141
|
this.textInputElement.addEventListener('input', () => {
|
|
139
142
|
this.inputEventHandler();
|
|
@@ -16,6 +16,7 @@ export abstract class CustomInputElement extends HTMLElement {
|
|
|
16
16
|
protected hasValueDependency: any;
|
|
17
17
|
protected noValueDependency: any;
|
|
18
18
|
protected dependencies: any[];
|
|
19
|
+
protected labelId: string;
|
|
19
20
|
|
|
20
21
|
public onChange = new CustomElementEvent<CustomElementEventArgs>();
|
|
21
22
|
public onValidate = new CustomElementEvent<CustomElementEventArgs>();
|
|
@@ -47,13 +48,13 @@ export abstract class CustomInputElement extends HTMLElement {
|
|
|
47
48
|
abstract validate(): void;
|
|
48
49
|
abstract change($event): void;
|
|
49
50
|
|
|
50
|
-
|
|
51
|
+
compareValues = [];
|
|
51
52
|
|
|
52
53
|
isValueConditionMatched(val: any) {
|
|
53
54
|
if (val && Array.isArray(val) && val.length) {
|
|
54
55
|
let result = false;
|
|
55
56
|
val.forEach(element => {
|
|
56
|
-
const elementMatched = this.
|
|
57
|
+
const elementMatched = this.compareValues.findIndex(x => x == element) !== -1;
|
|
57
58
|
if (elementMatched) {
|
|
58
59
|
result = true;
|
|
59
60
|
return;
|
|
@@ -61,7 +62,7 @@ export abstract class CustomInputElement extends HTMLElement {
|
|
|
61
62
|
});
|
|
62
63
|
return result;
|
|
63
64
|
}
|
|
64
|
-
return this.
|
|
65
|
+
return this.compareValues.findIndex(x => x == val) !== -1;
|
|
65
66
|
}
|
|
66
67
|
|
|
67
68
|
connectedCallback(): void {
|
|
@@ -81,7 +82,7 @@ export abstract class CustomInputElement extends HTMLElement {
|
|
|
81
82
|
this.bindDependencies();
|
|
82
83
|
});
|
|
83
84
|
}
|
|
84
|
-
|
|
85
|
+
|
|
85
86
|
private parseData(): void {
|
|
86
87
|
try {
|
|
87
88
|
if (!(this.children[0] instanceof HTMLScriptElement)) {
|
|
@@ -104,6 +105,7 @@ export abstract class CustomInputElement extends HTMLElement {
|
|
|
104
105
|
this.customValue = data.value;
|
|
105
106
|
this.dateFormat = data.dateFormat;
|
|
106
107
|
this.initialValue = data.value;
|
|
108
|
+
this.labelId = data.labelId;
|
|
107
109
|
} catch (ex) {
|
|
108
110
|
console.error(ex);
|
|
109
111
|
}
|
|
@@ -129,6 +131,9 @@ export abstract class CustomInputElement extends HTMLElement {
|
|
|
129
131
|
this.validate();
|
|
130
132
|
}
|
|
131
133
|
});
|
|
134
|
+
if (this.labelId) {
|
|
135
|
+
this.createLabelEventListener(this.labelId);
|
|
136
|
+
}
|
|
132
137
|
}
|
|
133
138
|
|
|
134
139
|
private setAttributes(): void {
|
|
@@ -169,7 +174,7 @@ export abstract class CustomInputElement extends HTMLElement {
|
|
|
169
174
|
private bindDependency(elementName: string, type: string, value?: string, criteria?: string,): void {
|
|
170
175
|
let element = document.querySelector(`[name="${elementName}"]`) as CustomInputElement;
|
|
171
176
|
if (element instanceof CustomInputElement) {
|
|
172
|
-
element.
|
|
177
|
+
element.compareValues.push(value);
|
|
173
178
|
if (this.dependentOnList.hasOwnProperty(element.name)) {
|
|
174
179
|
return;
|
|
175
180
|
}
|
|
@@ -235,6 +240,19 @@ export abstract class CustomInputElement extends HTMLElement {
|
|
|
235
240
|
}
|
|
236
241
|
}
|
|
237
242
|
|
|
243
|
+
private createLabelEventListener(labelId: string) {
|
|
244
|
+
let label = document.querySelector(`[id="${labelId}"]`);
|
|
245
|
+
if (label) {
|
|
246
|
+
label.addEventListener("click", () => {
|
|
247
|
+
// the input is that have aria-labelledby attribute equal to the this.labelId
|
|
248
|
+
let input = this.getChildElement(`[aria-labelledby="${labelId}"]`);
|
|
249
|
+
if (input) {
|
|
250
|
+
input.focus();
|
|
251
|
+
}
|
|
252
|
+
});
|
|
253
|
+
}
|
|
254
|
+
}
|
|
255
|
+
|
|
238
256
|
protected getChildInput(selector: string): HTMLInputElement {
|
|
239
257
|
let element: any = this;
|
|
240
258
|
if (this.shadowRoot) {
|