@syncfusion/ej2-inputs 20.3.57 → 20.4.40
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/.eslintrc.json +16 -1
- package/CHANGELOG.md +8 -15
- package/dist/ej2-inputs.min.js +2 -2
- package/dist/ej2-inputs.umd.min.js +2 -2
- package/dist/ej2-inputs.umd.min.js.map +1 -1
- package/dist/es6/ej2-inputs.es2015.js +884 -63
- package/dist/es6/ej2-inputs.es2015.js.map +1 -1
- package/dist/es6/ej2-inputs.es5.js +908 -63
- package/dist/es6/ej2-inputs.es5.js.map +1 -1
- package/dist/global/ej2-inputs.min.js +2 -2
- package/dist/global/ej2-inputs.min.js.map +1 -1
- package/dist/global/index.d.ts +1 -1
- package/package.json +11 -10
- package/rating.d.ts +4 -0
- package/rating.js +4 -0
- package/src/color-picker/color-picker-model.d.ts +4 -4
- package/src/color-picker/color-picker.d.ts +4 -4
- package/src/color-picker/color-picker.js +4 -2
- package/src/common/signature-base.d.ts +0 -1
- package/src/common/signature-base.js +3 -8
- package/src/index.d.ts +1 -0
- package/src/index.js +1 -0
- package/src/input/input.d.ts +1 -0
- package/src/input/input.js +5 -1
- package/src/maskedtextbox/base/mask-base.d.ts +1 -0
- package/src/maskedtextbox/base/mask-base.js +20 -13
- package/src/maskedtextbox/maskedtextbox/maskedtextbox-model.d.ts +1 -0
- package/src/maskedtextbox/maskedtextbox/maskedtextbox.d.ts +1 -0
- package/src/maskedtextbox/maskedtextbox/maskedtextbox.js +16 -7
- package/src/numerictextbox/numerictextbox.js +21 -9
- package/src/rating/index.d.ts +5 -0
- package/src/rating/index.js +4 -0
- package/src/rating/rating-model.d.ts +185 -0
- package/src/rating/rating.d.ts +344 -0
- package/src/rating/rating.js +783 -0
- package/src/slider/slider.js +4 -2
- package/src/textbox/textbox.js +10 -9
- package/src/uploader/uploader-model.d.ts +10 -1
- package/src/uploader/uploader.d.ts +8 -0
- package/src/uploader/uploader.js +41 -12
- package/styles/bootstrap-dark.css +265 -0
- package/styles/bootstrap-dark.scss +1 -0
- package/styles/bootstrap.css +265 -0
- package/styles/bootstrap.scss +1 -0
- package/styles/bootstrap4.css +268 -2
- package/styles/bootstrap4.scss +1 -0
- package/styles/bootstrap5-dark.css +266 -0
- package/styles/bootstrap5-dark.scss +1 -0
- package/styles/bootstrap5.css +266 -0
- package/styles/bootstrap5.scss +1 -0
- package/styles/color-picker/_theme.scss +2 -2
- package/styles/color-picker/bootstrap4.css +2 -2
- package/styles/fabric-dark.css +265 -0
- package/styles/fabric-dark.scss +1 -0
- package/styles/fabric.css +265 -0
- package/styles/fabric.scss +1 -0
- package/styles/fluent-dark.css +265 -0
- package/styles/fluent-dark.scss +1 -0
- package/styles/fluent.css +265 -0
- package/styles/fluent.scss +1 -0
- package/styles/highcontrast-light.css +265 -0
- package/styles/highcontrast-light.scss +1 -0
- package/styles/highcontrast.css +265 -0
- package/styles/highcontrast.scss +1 -0
- package/styles/material-dark.css +265 -0
- package/styles/material-dark.scss +1 -0
- package/styles/material.css +265 -0
- package/styles/material.scss +1 -0
- package/styles/rating/_all.scss +2 -0
- package/styles/rating/_bootstrap-dark-definition.scss +45 -0
- package/styles/rating/_bootstrap-definition.scss +45 -0
- package/styles/rating/_bootstrap4-definition.scss +45 -0
- package/styles/rating/_bootstrap5-dark-definition.scss +1 -0
- package/styles/rating/_bootstrap5-definition.scss +45 -0
- package/styles/rating/_fabric-dark-definition.scss +45 -0
- package/styles/rating/_fabric-definition.scss +45 -0
- package/styles/rating/_fluent-dark-definition.scss +1 -0
- package/styles/rating/_fluent-definition.scss +45 -0
- package/styles/rating/_fusionnew-definition.scss +45 -0
- package/styles/rating/_highcontrast-definition.scss +45 -0
- package/styles/rating/_highcontrast-light-definition.scss +45 -0
- package/styles/rating/_layout.scss +204 -0
- package/styles/rating/_material-dark-definition.scss +45 -0
- package/styles/rating/_material-definition.scss +45 -0
- package/styles/rating/_material3-definition.scss +45 -0
- package/styles/rating/_tailwind-dark-definition.scss +1 -0
- package/styles/rating/_tailwind-definition.scss +45 -0
- package/styles/rating/_theme.scss +158 -0
- package/styles/rating/bootstrap-dark.css +264 -0
- package/styles/rating/bootstrap-dark.scss +4 -0
- package/styles/rating/bootstrap.css +264 -0
- package/styles/rating/bootstrap.scss +4 -0
- package/styles/rating/bootstrap4.css +265 -0
- package/styles/rating/bootstrap4.scss +4 -0
- package/styles/rating/bootstrap5-dark.css +265 -0
- package/styles/rating/bootstrap5-dark.scss +4 -0
- package/styles/rating/bootstrap5.css +265 -0
- package/styles/rating/bootstrap5.scss +4 -0
- package/styles/rating/fabric-dark.css +264 -0
- package/styles/rating/fabric-dark.scss +4 -0
- package/styles/rating/fabric.css +264 -0
- package/styles/rating/fabric.scss +4 -0
- package/styles/rating/fluent-dark.css +264 -0
- package/styles/rating/fluent-dark.scss +4 -0
- package/styles/rating/fluent.css +264 -0
- package/styles/rating/fluent.scss +4 -0
- package/styles/rating/highcontrast-light.css +264 -0
- package/styles/rating/highcontrast-light.scss +4 -0
- package/styles/rating/highcontrast.css +264 -0
- package/styles/rating/highcontrast.scss +4 -0
- package/styles/rating/material-dark.css +265 -0
- package/styles/rating/material-dark.scss +4 -0
- package/styles/rating/material.css +265 -0
- package/styles/rating/material.scss +4 -0
- package/styles/rating/tailwind-dark.css +270 -0
- package/styles/rating/tailwind-dark.scss +4 -0
- package/styles/rating/tailwind.css +270 -0
- package/styles/rating/tailwind.scss +4 -0
- package/styles/tailwind-dark.css +271 -0
- package/styles/tailwind-dark.scss +1 -0
- package/styles/tailwind.css +271 -0
- package/styles/tailwind.scss +1 -0
package/dist/global/index.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* filename: index.d.ts
|
|
3
|
-
* version : 20.
|
|
3
|
+
* version : 20.4.40
|
|
4
4
|
* Copyright Syncfusion Inc. 2001 - 2020. All rights reserved.
|
|
5
5
|
* Use of this code is subject to the terms of our license.
|
|
6
6
|
* A copy of the current license can be obtained at any time by e-mailing
|
package/package.json
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
{
|
|
2
2
|
"_from": "@syncfusion/ej2-inputs@*",
|
|
3
|
-
"_id": "@syncfusion/ej2-inputs@20.
|
|
3
|
+
"_id": "@syncfusion/ej2-inputs@20.4.38",
|
|
4
4
|
"_inBundle": false,
|
|
5
|
-
"_integrity": "sha512-
|
|
5
|
+
"_integrity": "sha512-1BObDYS1OiYXHlM3ofwW3AJcOjefONr4guSezY9GGkIeYTd9u+Hp6wXXIDPJySebgTxM3vBPld6r3d3KsoOnrw==",
|
|
6
6
|
"_location": "/@syncfusion/ej2-inputs",
|
|
7
7
|
"_phantomChildren": {},
|
|
8
8
|
"_requested": {
|
|
@@ -39,8 +39,8 @@
|
|
|
39
39
|
"/@syncfusion/ej2-schedule",
|
|
40
40
|
"/@syncfusion/ej2-vue-inputs"
|
|
41
41
|
],
|
|
42
|
-
"_resolved": "https://nexus.syncfusion.com/repository/ej2-hotfix-new/@syncfusion/ej2-inputs/-/ej2-inputs-20.
|
|
43
|
-
"_shasum": "
|
|
42
|
+
"_resolved": "https://nexus.syncfusion.com/repository/ej2-hotfix-new/@syncfusion/ej2-inputs/-/ej2-inputs-20.4.38.tgz",
|
|
43
|
+
"_shasum": "63b3cd6b432a40223cd32e60ddfd4f4f5c61e430",
|
|
44
44
|
"_spec": "@syncfusion/ej2-inputs@*",
|
|
45
45
|
"_where": "/jenkins/workspace/ease-automation_release_19.1.0.1/packages/included",
|
|
46
46
|
"author": {
|
|
@@ -48,10 +48,10 @@
|
|
|
48
48
|
},
|
|
49
49
|
"bundleDependencies": false,
|
|
50
50
|
"dependencies": {
|
|
51
|
-
"@syncfusion/ej2-base": "~20.
|
|
52
|
-
"@syncfusion/ej2-buttons": "~20.
|
|
53
|
-
"@syncfusion/ej2-popups": "~20.
|
|
54
|
-
"@syncfusion/ej2-splitbuttons": "~20.
|
|
51
|
+
"@syncfusion/ej2-base": "~20.4.40",
|
|
52
|
+
"@syncfusion/ej2-buttons": "~20.4.40",
|
|
53
|
+
"@syncfusion/ej2-popups": "~20.4.40",
|
|
54
|
+
"@syncfusion/ej2-splitbuttons": "~20.4.40"
|
|
55
55
|
},
|
|
56
56
|
"deprecated": false,
|
|
57
57
|
"description": "A package of Essential JS 2 input components such as Textbox, Color-picker, Masked-textbox, Numeric-textbox, Slider, Upload, and Form-validator that is used to get input from the users.",
|
|
@@ -119,6 +119,7 @@
|
|
|
119
119
|
"url": "https://github.com/syncfusion/ej2-javascript-ui-controls/tree/master/controls/inputs"
|
|
120
120
|
},
|
|
121
121
|
"typings": "index.d.ts",
|
|
122
|
-
"version": "20.
|
|
123
|
-
"sideEffects": false
|
|
122
|
+
"version": "20.4.40",
|
|
123
|
+
"sideEffects": false,
|
|
124
|
+
"homepage": "https://www.syncfusion.com/javascript-ui-controls"
|
|
124
125
|
}
|
package/rating.d.ts
ADDED
package/rating.js
ADDED
|
@@ -93,10 +93,10 @@ export interface ColorPickerModel extends ComponentModel{
|
|
|
93
93
|
enableOpacity?: boolean;
|
|
94
94
|
|
|
95
95
|
/**
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
96
|
+
* Specifies the popup element creation on open.
|
|
97
|
+
*
|
|
98
|
+
* @default false
|
|
99
|
+
*/
|
|
100
100
|
createPopupOnClick?: boolean;
|
|
101
101
|
|
|
102
102
|
/**
|
|
@@ -109,10 +109,10 @@ export declare class ColorPicker extends Component<HTMLInputElement> implements
|
|
|
109
109
|
*/
|
|
110
110
|
enableOpacity: boolean;
|
|
111
111
|
/**
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
112
|
+
* Specifies the popup element creation on open.
|
|
113
|
+
*
|
|
114
|
+
* @default false
|
|
115
|
+
*/
|
|
116
116
|
createPopupOnClick: boolean;
|
|
117
117
|
/**
|
|
118
118
|
* Triggers while selecting the color in picker / palette, when showButtons property is enabled.
|
|
@@ -540,7 +540,7 @@ var ColorPicker = /** @class */ (function (_super) {
|
|
|
540
540
|
if (!wrapper.classList.contains(HIDEHEX)) {
|
|
541
541
|
var hexInput = this.createElement('input', {
|
|
542
542
|
className: HEX,
|
|
543
|
-
attrs: { 'maxlength': '7', 'spellcheck': 'false' }
|
|
543
|
+
attrs: { 'maxlength': '7', 'spellcheck': 'false', 'aria-label': 'HEX' }
|
|
544
544
|
});
|
|
545
545
|
container.appendChild(hexInput);
|
|
546
546
|
Input.createInput({
|
|
@@ -582,7 +582,8 @@ var ColorPicker = /** @class */ (function (_super) {
|
|
|
582
582
|
};
|
|
583
583
|
ColorPicker.prototype.appendValueSwitchBtn = function (targetEle) {
|
|
584
584
|
var valueSwitchBtn = this.createElement('button', {
|
|
585
|
-
className: 'e-icons e-css e-btn e-flat e-icon-btn ' + FORMATSWITCH
|
|
585
|
+
className: 'e-icons e-css e-btn e-flat e-icon-btn ' + FORMATSWITCH,
|
|
586
|
+
attrs: { 'title': 'Toggle format' }
|
|
586
587
|
});
|
|
587
588
|
targetEle.appendChild(valueSwitchBtn);
|
|
588
589
|
if (this.isPicker() && !this.getWrapper().classList.contains(HIDERGBA)) {
|
|
@@ -634,6 +635,7 @@ var ColorPicker = /** @class */ (function (_super) {
|
|
|
634
635
|
});
|
|
635
636
|
tooltip.createElement = this.createElement;
|
|
636
637
|
tooltip.appendTo(this.container);
|
|
638
|
+
// eslint-disable-next-line
|
|
637
639
|
tooltip.open(this.container);
|
|
638
640
|
this.tooltipEle.style.zIndex = getZindexPartial(this.tooltipEle).toString();
|
|
639
641
|
select('.e-tip-content', this.tooltipEle).appendChild(this.createElement('div', { className: 'e-tip-transparent' }));
|
|
@@ -116,7 +116,6 @@ export declare abstract class SignatureBase extends Component<HTMLCanvasElement>
|
|
|
116
116
|
private distanceTo;
|
|
117
117
|
private isRead;
|
|
118
118
|
private enableOrDisable;
|
|
119
|
-
private reDraw;
|
|
120
119
|
private updateSnapCollection;
|
|
121
120
|
private setBackgroundImage;
|
|
122
121
|
private setBackgroundColor;
|
|
@@ -99,6 +99,7 @@ var SignatureBase = /** @class */ (function (_super) {
|
|
|
99
99
|
this.canvasContext.canvas.style.backgroundColor = this.backgroundColor;
|
|
100
100
|
}
|
|
101
101
|
};
|
|
102
|
+
// eslint-disable-next-line
|
|
102
103
|
SignatureBase.prototype.mouseDownHandler = function (e, canvas, panStart, zoomState) {
|
|
103
104
|
if (e.buttons === 1 || e.buttons === 2 || e.type === 'touchstart') {
|
|
104
105
|
if (e.type === 'touchstart') {
|
|
@@ -429,20 +430,14 @@ var SignatureBase = /** @class */ (function (_super) {
|
|
|
429
430
|
SignatureBase.prototype.enableOrDisable = function (isDisable) {
|
|
430
431
|
this.disabled = isDisable;
|
|
431
432
|
if (isDisable) {
|
|
432
|
-
this.
|
|
433
|
+
this.canvasContext.canvas.style.filter = "opacity(0.5)";
|
|
433
434
|
this.isRead(true);
|
|
434
435
|
}
|
|
435
436
|
else {
|
|
436
|
-
this.
|
|
437
|
+
this.canvasContext.canvas.style.filter = "";
|
|
437
438
|
this.isRead(false);
|
|
438
439
|
}
|
|
439
440
|
};
|
|
440
|
-
SignatureBase.prototype.reDraw = function (opacity) {
|
|
441
|
-
var data = this.canvasContext.getImageData(0, 0, this.element.width, this.element.height);
|
|
442
|
-
this.canvasContext.clearRect(0, 0, this.element.width, this.element.height);
|
|
443
|
-
this.element.style.opacity = opacity;
|
|
444
|
-
this.canvasContext.putImageData(data, 0, 0);
|
|
445
|
-
};
|
|
446
441
|
SignatureBase.prototype.updateSnapCollection = function (isClear) {
|
|
447
442
|
if (isNullOrUndefined(this.incStep)) {
|
|
448
443
|
this.incStep = -1;
|
package/src/index.d.ts
CHANGED
package/src/index.js
CHANGED
package/src/input/input.d.ts
CHANGED
|
@@ -17,6 +17,7 @@ export declare namespace Input {
|
|
|
17
17
|
function bindInitialEvent(args: InputArgs): void;
|
|
18
18
|
function wireFloatingEvents(element: HTMLInputElement | HTMLTextAreaElement): void;
|
|
19
19
|
function wireClearBtnEvents(element: HTMLInputElement | HTMLTextAreaElement, button: HTMLElement, container: HTMLElement): void;
|
|
20
|
+
function destroy(): void;
|
|
20
21
|
/**
|
|
21
22
|
* Sets the value to the input element.
|
|
22
23
|
* ```
|
package/src/input/input.js
CHANGED
|
@@ -330,6 +330,10 @@ export var Input;
|
|
|
330
330
|
});
|
|
331
331
|
}
|
|
332
332
|
Input.wireClearBtnEvents = wireClearBtnEvents;
|
|
333
|
+
function destroy() {
|
|
334
|
+
privateInputObj = null;
|
|
335
|
+
}
|
|
336
|
+
Input.destroy = destroy;
|
|
333
337
|
function validateLabel(element, floatLabelType) {
|
|
334
338
|
var parent = getParentNode(element);
|
|
335
339
|
if (parent.classList.contains(CLASSNAMES.FLOATINPUT) && floatLabelType === 'Auto') {
|
|
@@ -385,7 +389,7 @@ export var Input;
|
|
|
385
389
|
if (!isNullOrUndefined(parentElement)) {
|
|
386
390
|
var button = parentElement.getElementsByClassName(CLASSNAMES.CLEARICON)[0];
|
|
387
391
|
if (!isNullOrUndefined(button)) {
|
|
388
|
-
if (element.value && parentElement.classList.contains('e-input-focus')) {
|
|
392
|
+
if (element.value && !isNullOrUndefined(parentElement) && parentElement.classList.contains('e-input-focus')) {
|
|
389
393
|
removeClass([button], CLASSNAMES.CLEARICONHIDE);
|
|
390
394
|
}
|
|
391
395
|
else {
|
|
@@ -66,6 +66,7 @@ export declare function maskInputMouseDownHandler(): void;
|
|
|
66
66
|
export declare function maskInputMouseUpHandler(): void;
|
|
67
67
|
export declare function maskInputFocusHandler(event: MouseEvent | FocusEvent | TouchEvent | KeyboardEvent): void;
|
|
68
68
|
export declare function triggerFocus(eventArgs: MaskFocusEventArgs, inputElement: HTMLInputElement): void;
|
|
69
|
+
export declare function escapeRegExp(text: any): string;
|
|
69
70
|
export declare function maskInputBlurHandler(event: MouseEvent | FocusEvent | TouchEvent | KeyboardEvent): void;
|
|
70
71
|
export declare function maskInputDropHandler(event: MouseEvent): void;
|
|
71
72
|
export declare function mobileRemoveFunction(): void;
|
|
@@ -80,6 +80,7 @@ export function createMask() {
|
|
|
80
80
|
if (!isNullOrUndefined(this.customCharacters)) {
|
|
81
81
|
for (var i = 0; i < this.promptMask.length; i++) {
|
|
82
82
|
if (!isNullOrUndefined(this.customCharacters[this.promptMask[i]])) {
|
|
83
|
+
// eslint-disable-next-line detect-non-literal-regexp
|
|
83
84
|
this.promptMask = this.promptMask.replace(new RegExp(this.promptMask[i], 'g'), this.promptChar);
|
|
84
85
|
}
|
|
85
86
|
}
|
|
@@ -275,7 +276,7 @@ export function maskInputFocusHandler(event) {
|
|
|
275
276
|
event: event,
|
|
276
277
|
value: this.value,
|
|
277
278
|
maskedValue: inputElement.value,
|
|
278
|
-
container: this.inputObj.container,
|
|
279
|
+
container: !isNullOrUndefined(this.inputObj) ? this.inputObj.container : this.inputObj,
|
|
279
280
|
selectionEnd: inputElement.selectionEnd
|
|
280
281
|
};
|
|
281
282
|
if (!this.isClicked) {
|
|
@@ -342,21 +343,21 @@ export function maskInputFocusHandler(event) {
|
|
|
342
343
|
event: event,
|
|
343
344
|
value: _this.value,
|
|
344
345
|
maskedValue: inputElement.value,
|
|
345
|
-
container: _this.inputObj.container,
|
|
346
|
+
container: !isNullOrUndefined(_this.inputObj) ? _this.inputObj.container : _this.inputObj,
|
|
346
347
|
selectionEnd: inputElement.selectionEnd
|
|
347
348
|
};
|
|
348
349
|
triggerFocus.call(_this, eventArgs, inputElement);
|
|
349
|
-
});
|
|
350
|
+
}, 110);
|
|
350
351
|
break;
|
|
351
352
|
}
|
|
352
353
|
}
|
|
353
|
-
if (isNullOrUndefined(inputElement.value.match(this.promptChar))) {
|
|
354
|
+
if (isNullOrUndefined(inputElement.value.match(escapeRegExp(this.promptChar)))) {
|
|
354
355
|
eventArgs = {
|
|
355
356
|
selectionStart: inputElement.selectionStart,
|
|
356
357
|
event: event,
|
|
357
358
|
value: this.value,
|
|
358
359
|
maskedValue: inputElement.value,
|
|
359
|
-
container: this.inputObj.container,
|
|
360
|
+
container: !isNullOrUndefined(this.inputObj) ? this.inputObj.container : this.inputObj,
|
|
360
361
|
selectionEnd: inputElement.selectionEnd
|
|
361
362
|
};
|
|
362
363
|
triggerFocus.call(this, eventArgs, inputElement);
|
|
@@ -371,12 +372,15 @@ export function triggerFocus(eventArgs, inputElement) {
|
|
|
371
372
|
inputElement.selectionEnd = eventArgs.selectionEnd;
|
|
372
373
|
});
|
|
373
374
|
}
|
|
375
|
+
export function escapeRegExp(text) {
|
|
376
|
+
return !isNullOrUndefined(text) ? text.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, '\\$&') : text;
|
|
377
|
+
}
|
|
374
378
|
export function maskInputBlurHandler(event) {
|
|
375
379
|
this.blurEventArgs = {
|
|
376
380
|
event: event,
|
|
377
381
|
value: this.value,
|
|
378
382
|
maskedValue: this.element.value,
|
|
379
|
-
container: this.inputObj.container
|
|
383
|
+
container: !isNullOrUndefined(this.inputObj) ? this.inputObj.container : this.inputObj,
|
|
380
384
|
};
|
|
381
385
|
this.trigger('blur', this.blurEventArgs);
|
|
382
386
|
if (this.mask) {
|
|
@@ -611,8 +615,8 @@ function removeMaskInputValues(event) {
|
|
|
611
615
|
++startIndex;
|
|
612
616
|
}
|
|
613
617
|
var oldValue = this.element.value[sIndex];
|
|
614
|
-
if ((isNullOrUndefined(this.regExpCollec[curMask]) && (!isNullOrUndefined(this.customCharacters)
|
|
615
|
-
&& isNullOrUndefined(this.customCharacters[curMask]))
|
|
618
|
+
if ((isNullOrUndefined(this.regExpCollec["" + curMask]) && (!isNullOrUndefined(this.customCharacters)
|
|
619
|
+
&& isNullOrUndefined(this.customCharacters["" + curMask]))
|
|
616
620
|
&& ((this.hiddenMask[sIndex] !== this.promptChar && this.customRegExpCollec[sIndex][0] !== '['
|
|
617
621
|
&& this.customRegExpCollec[sIndex][this.customRegExpCollec[sIndex].length - 1] !== ']')))
|
|
618
622
|
|| (this.promptMask[sIndex] !== this.promptChar && isNullOrUndefined(this.customCharacters))) {
|
|
@@ -824,8 +828,8 @@ function validateValue(key, isCtrlKey, event) {
|
|
|
824
828
|
if (this.hiddenMask[startIndex] === '\\' && this.hiddenMask[startIndex + 1] === key) {
|
|
825
829
|
isEqualVal = true;
|
|
826
830
|
}
|
|
827
|
-
if ((isNullOrUndefined(this.regExpCollec[curMask]) && (isNullOrUndefined(this.customCharacters)
|
|
828
|
-
|| (!isNullOrUndefined(this.customCharacters) && isNullOrUndefined(this.customCharacters[curMask])))
|
|
831
|
+
if ((isNullOrUndefined(this.regExpCollec["" + curMask]) && (isNullOrUndefined(this.customCharacters)
|
|
832
|
+
|| (!isNullOrUndefined(this.customCharacters) && isNullOrUndefined(this.customCharacters["" + curMask])))
|
|
829
833
|
&& ((this.hiddenMask[startIndex] !== this.promptChar && this.customRegExpCollec[startIndex][0] !== '['
|
|
830
834
|
&& this.customRegExpCollec[startIndex][this.customRegExpCollec[startIndex].length - 1] !== ']')))
|
|
831
835
|
|| ((this.promptMask[startIndex] !== this.promptChar) && isNullOrUndefined(this.customCharacters))
|
|
@@ -835,22 +839,25 @@ function validateValue(key, isCtrlKey, event) {
|
|
|
835
839
|
curMask = this.hiddenMask[startIndex];
|
|
836
840
|
}
|
|
837
841
|
}
|
|
838
|
-
if (!isNullOrUndefined(this.customCharacters) && !isNullOrUndefined(this.customCharacters[curMask])) {
|
|
839
|
-
var customValStr = this.customCharacters[curMask];
|
|
842
|
+
if (!isNullOrUndefined(this.customCharacters) && !isNullOrUndefined(this.customCharacters["" + curMask])) {
|
|
843
|
+
var customValStr = this.customCharacters["" + curMask];
|
|
840
844
|
var customValArr = customValStr.split(',');
|
|
841
845
|
for (var i = 0; i < customValArr.length; i++) {
|
|
846
|
+
// eslint-disable-next-line detect-non-literal-regexp
|
|
842
847
|
if (keyValue.match(new RegExp('[' + customValArr[i] + ']'))) {
|
|
843
848
|
allowText = true;
|
|
844
849
|
break;
|
|
845
850
|
}
|
|
846
851
|
}
|
|
852
|
+
// eslint-disable-next-line detect-non-literal-regexp
|
|
847
853
|
}
|
|
848
|
-
else if (!isNullOrUndefined(this.regExpCollec[curMask]) && keyValue.match(new RegExp(this.regExpCollec[curMask]))
|
|
854
|
+
else if (!isNullOrUndefined(this.regExpCollec["" + curMask]) && keyValue.match(new RegExp(this.regExpCollec["" + curMask]))
|
|
849
855
|
&& this.promptMask[startIndex] === this.promptChar) {
|
|
850
856
|
allowText = true;
|
|
851
857
|
}
|
|
852
858
|
else if (this.promptMask[startIndex] === this.promptChar && this.customRegExpCollec[startIndex][0] === '['
|
|
853
859
|
&& this.customRegExpCollec[startIndex][this.customRegExpCollec[startIndex].length - 1] === ']'
|
|
860
|
+
// eslint-disable-next-line detect-non-literal-regexp
|
|
854
861
|
&& keyValue.match(new RegExp(this.customRegExpCollec[startIndex]))) {
|
|
855
862
|
allowText = true;
|
|
856
863
|
}
|
|
@@ -90,6 +90,7 @@ export interface MaskedTextBoxModel extends ComponentModel{
|
|
|
90
90
|
* For more information on mask, refer to
|
|
91
91
|
* [mask](../../maskedtextbox/mask-configuration/#standard-mask-elements).
|
|
92
92
|
* * If the mask value is empty, the MaskedTextBox will behave as an input element with text type.
|
|
93
|
+
*
|
|
93
94
|
* {% codeBlock src='maskedtextbox/mask/index.md' %}{% endcodeBlock %}
|
|
94
95
|
*
|
|
95
96
|
* @default null
|
|
@@ -115,6 +115,7 @@ export declare class MaskedTextBox extends Component<HTMLInputElement> implement
|
|
|
115
115
|
* For more information on mask, refer to
|
|
116
116
|
* [mask](../../maskedtextbox/mask-configuration/#standard-mask-elements).
|
|
117
117
|
* * If the mask value is empty, the MaskedTextBox will behave as an input element with text type.
|
|
118
|
+
*
|
|
118
119
|
* {% codeBlock src='maskedtextbox/mask/index.md' %}{% endcodeBlock %}
|
|
119
120
|
*
|
|
120
121
|
* @default null
|
|
@@ -168,7 +168,7 @@ var MaskedTextBox = /** @class */ (function (_super) {
|
|
|
168
168
|
for (var _i = 0, _a = Object.keys(this.htmlAttributes); _i < _a.length; _i++) {
|
|
169
169
|
var key = _a[_i];
|
|
170
170
|
if (wrapperAttr.indexOf(key) < 0) {
|
|
171
|
-
this.element.setAttribute(key, this.htmlAttributes[key]);
|
|
171
|
+
this.element.setAttribute(key, this.htmlAttributes["" + key]);
|
|
172
172
|
}
|
|
173
173
|
}
|
|
174
174
|
}
|
|
@@ -189,19 +189,19 @@ var MaskedTextBox = /** @class */ (function (_super) {
|
|
|
189
189
|
var key = _a[_i];
|
|
190
190
|
if (wrapperAttr.indexOf(key) > -1) {
|
|
191
191
|
if (key === 'class') {
|
|
192
|
-
var updatedClassValues = (this.htmlAttributes[key].replace(/\s+/g, ' ')).trim();
|
|
192
|
+
var updatedClassValues = (this.htmlAttributes["" + key].replace(/\s+/g, ' ')).trim();
|
|
193
193
|
if (updatedClassValues !== '') {
|
|
194
194
|
addClass([this.inputObj.container], updatedClassValues.split(' '));
|
|
195
195
|
}
|
|
196
196
|
}
|
|
197
197
|
else if (key === 'style') {
|
|
198
198
|
var maskStyle = this.inputObj.container.getAttribute(key);
|
|
199
|
-
maskStyle = !isNullOrUndefined(maskStyle) ? (maskStyle + this.htmlAttributes[key]) :
|
|
200
|
-
this.htmlAttributes[key];
|
|
199
|
+
maskStyle = !isNullOrUndefined(maskStyle) ? (maskStyle + this.htmlAttributes["" + key]) :
|
|
200
|
+
this.htmlAttributes["" + key];
|
|
201
201
|
this.inputObj.container.setAttribute(key, maskStyle);
|
|
202
202
|
}
|
|
203
203
|
else {
|
|
204
|
-
this.inputObj.container.setAttribute(key, this.htmlAttributes[key]);
|
|
204
|
+
this.inputObj.container.setAttribute(key, this.htmlAttributes["" + key]);
|
|
205
205
|
}
|
|
206
206
|
}
|
|
207
207
|
}
|
|
@@ -378,10 +378,13 @@ var MaskedTextBox = /** @class */ (function (_super) {
|
|
|
378
378
|
else {
|
|
379
379
|
this.promptChar = '_';
|
|
380
380
|
}
|
|
381
|
+
// eslint-disable-next-line detect-non-literal-regexp
|
|
381
382
|
var value = this.element.value.replace(new RegExp('[' + oldProp.promptChar + ']', 'g'), this.promptChar);
|
|
382
383
|
if (this.promptMask === this.element.value) {
|
|
384
|
+
// eslint-disable-next-line detect-non-literal-regexp
|
|
383
385
|
value = this.promptMask.replace(new RegExp('[' + oldProp.promptChar + ']', 'g'), this.promptChar);
|
|
384
386
|
}
|
|
387
|
+
// eslint-disable-next-line detect-non-literal-regexp
|
|
385
388
|
this.promptMask = this.promptMask.replace(new RegExp('[' + oldProp.promptChar + ']', 'g'), this.promptChar);
|
|
386
389
|
this.undoCollec = this.redoCollec = [];
|
|
387
390
|
setElementValue.call(this, value);
|
|
@@ -443,8 +446,14 @@ var MaskedTextBox = /** @class */ (function (_super) {
|
|
|
443
446
|
this.element.removeAttribute(attrArray[i]);
|
|
444
447
|
}
|
|
445
448
|
this.element.classList.remove('e-input');
|
|
446
|
-
this.inputObj
|
|
447
|
-
|
|
449
|
+
if (this.inputObj) {
|
|
450
|
+
this.inputObj.container.insertAdjacentElement('afterend', this.element);
|
|
451
|
+
detach(this.inputObj.container);
|
|
452
|
+
}
|
|
453
|
+
this.blurEventArgs = null;
|
|
454
|
+
Input.destroy();
|
|
455
|
+
this.changeEventArgs = null;
|
|
456
|
+
this.inputObj = null;
|
|
448
457
|
_super.prototype.destroy.call(this);
|
|
449
458
|
};
|
|
450
459
|
__decorate([
|
|
@@ -37,6 +37,7 @@ var CONTROL = 'e-control';
|
|
|
37
37
|
var NUMERIC_FOCUS = 'e-input-focus';
|
|
38
38
|
var HIDDENELEMENT = 'e-numeric-hidden';
|
|
39
39
|
var wrapperAttributes = ['title', 'style', 'class'];
|
|
40
|
+
var selectionTimeOut = 0;
|
|
40
41
|
/**
|
|
41
42
|
* Represents the NumericTextBox component that allows the user to enter only numeric values.
|
|
42
43
|
* ```html
|
|
@@ -99,7 +100,7 @@ var NumericTextBox = /** @class */ (function (_super) {
|
|
|
99
100
|
this.element = input;
|
|
100
101
|
setValue('ej2_instances', ejInstance, this.element);
|
|
101
102
|
}
|
|
102
|
-
attributes(this.element, { 'role': 'spinbutton', 'tabindex': '0', 'autocomplete': 'off'
|
|
103
|
+
attributes(this.element, { 'role': 'spinbutton', 'tabindex': '0', 'autocomplete': 'off' });
|
|
103
104
|
var localeText = {
|
|
104
105
|
incrementTitle: 'Increment value', decrementTitle: 'Decrement value', placeholder: this.placeholder
|
|
105
106
|
};
|
|
@@ -302,7 +303,7 @@ var NumericTextBox = /** @class */ (function (_super) {
|
|
|
302
303
|
for (var _i = 0, _a = Object.keys(attr); _i < _a.length; _i++) {
|
|
303
304
|
var key = _a[_i];
|
|
304
305
|
if (key.indexOf('data') === 0) {
|
|
305
|
-
this.hiddenInput.setAttribute(key, attr[key]);
|
|
306
|
+
this.hiddenInput.setAttribute(key, attr["" + key]);
|
|
306
307
|
}
|
|
307
308
|
}
|
|
308
309
|
};
|
|
@@ -311,7 +312,7 @@ var NumericTextBox = /** @class */ (function (_super) {
|
|
|
311
312
|
for (var _i = 0, _a = Object.keys(this.htmlAttributes); _i < _a.length; _i++) {
|
|
312
313
|
var pro = _a[_i];
|
|
313
314
|
if (wrapperAttributes.indexOf(pro) < 0) {
|
|
314
|
-
this.element.setAttribute(pro, this.htmlAttributes[pro]);
|
|
315
|
+
this.element.setAttribute(pro, this.htmlAttributes["" + pro]);
|
|
315
316
|
}
|
|
316
317
|
}
|
|
317
318
|
}
|
|
@@ -332,19 +333,19 @@ var NumericTextBox = /** @class */ (function (_super) {
|
|
|
332
333
|
var pro = _a[_i];
|
|
333
334
|
if (wrapperAttributes.indexOf(pro) > -1) {
|
|
334
335
|
if (pro === 'class') {
|
|
335
|
-
var updatedClassValue = this.getNumericValidClassList(this.htmlAttributes[pro]);
|
|
336
|
+
var updatedClassValue = this.getNumericValidClassList(this.htmlAttributes["" + pro]);
|
|
336
337
|
if (updatedClassValue !== '') {
|
|
337
338
|
addClass([this.container], updatedClassValue.split(' '));
|
|
338
339
|
}
|
|
339
340
|
}
|
|
340
341
|
else if (pro === 'style') {
|
|
341
342
|
var numericStyle = this.container.getAttribute(pro);
|
|
342
|
-
numericStyle = !isNullOrUndefined(numericStyle) ? (numericStyle + this.htmlAttributes[pro]) :
|
|
343
|
-
this.htmlAttributes[pro];
|
|
343
|
+
numericStyle = !isNullOrUndefined(numericStyle) ? (numericStyle + this.htmlAttributes["" + pro]) :
|
|
344
|
+
this.htmlAttributes["" + pro];
|
|
344
345
|
this.container.setAttribute(pro, numericStyle);
|
|
345
346
|
}
|
|
346
347
|
else {
|
|
347
|
-
this.container.setAttribute(pro, this.htmlAttributes[pro]);
|
|
348
|
+
this.container.setAttribute(pro, this.htmlAttributes["" + pro]);
|
|
348
349
|
}
|
|
349
350
|
}
|
|
350
351
|
}
|
|
@@ -891,6 +892,7 @@ var NumericTextBox = /** @class */ (function (_super) {
|
|
|
891
892
|
if (this.decimals && this.validateDecimalOnType) {
|
|
892
893
|
fractionRule = '{0,' + this.decimals + '}';
|
|
893
894
|
}
|
|
895
|
+
// eslint-disable-next-line detect-non-literal-regexp
|
|
894
896
|
return new RegExp('^(-)?(((\\d+(' + decimalSeparator + '\\d' + fractionRule +
|
|
895
897
|
')?)|(' + decimalSeparator + '\\d' + fractionRule + ')))?$');
|
|
896
898
|
};
|
|
@@ -915,6 +917,7 @@ var NumericTextBox = /** @class */ (function (_super) {
|
|
|
915
917
|
};
|
|
916
918
|
NumericTextBox.prototype.focusHandler = function (event) {
|
|
917
919
|
var _this = this;
|
|
920
|
+
clearTimeout(selectionTimeOut);
|
|
918
921
|
this.focusEventArgs = { event: event, value: this.value, container: this.container };
|
|
919
922
|
this.trigger('focus', this.focusEventArgs);
|
|
920
923
|
if (!this.enabled || this.readonly) {
|
|
@@ -932,7 +935,7 @@ var NumericTextBox = /** @class */ (function (_super) {
|
|
|
932
935
|
}
|
|
933
936
|
else {
|
|
934
937
|
var delay = (Browser.isDevice && Browser.isIos) ? 600 : 0;
|
|
935
|
-
setTimeout(function () {
|
|
938
|
+
selectionTimeOut = setTimeout(function () {
|
|
936
939
|
_this.element.setSelectionRange(0, formatValue_1.length);
|
|
937
940
|
}, delay);
|
|
938
941
|
}
|
|
@@ -1108,13 +1111,22 @@ var NumericTextBox = /** @class */ (function (_super) {
|
|
|
1108
1111
|
}
|
|
1109
1112
|
var attrArray = ['aria-labelledby', 'role', 'autocomplete', 'aria-readonly',
|
|
1110
1113
|
'aria-disabled', 'autocapitalize', 'spellcheck', 'aria-autocomplete', 'tabindex',
|
|
1111
|
-
'aria-valuemin', 'aria-valuemax', 'aria-
|
|
1114
|
+
'aria-valuemin', 'aria-valuemax', 'aria-valuenow', 'aria-invalid'];
|
|
1112
1115
|
for (var i = 0; i < attrArray.length; i++) {
|
|
1113
1116
|
this.element.removeAttribute(attrArray[i]);
|
|
1114
1117
|
}
|
|
1115
1118
|
this.element.classList.remove('e-input');
|
|
1116
1119
|
this.container.insertAdjacentElement('afterend', this.element);
|
|
1117
1120
|
detach(this.container);
|
|
1121
|
+
this.spinUp = null;
|
|
1122
|
+
this.spinDown = null;
|
|
1123
|
+
this.container = null;
|
|
1124
|
+
this.hiddenInput = null;
|
|
1125
|
+
this.changeEventArgs = null;
|
|
1126
|
+
this.blurEventArgs = null;
|
|
1127
|
+
this.focusEventArgs = null;
|
|
1128
|
+
this.inputWrapper = null;
|
|
1129
|
+
Input.destroy();
|
|
1118
1130
|
_super.prototype.destroy.call(this);
|
|
1119
1131
|
};
|
|
1120
1132
|
/* eslint-disable valid-jsdoc, jsdoc/require-returns */
|