@syncfusion/ej2-inputs 25.1.37 → 25.1.38
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 +260 -0
- package/CHANGELOG.md +20 -0
- 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 +34 -26
- package/dist/es6/ej2-inputs.es2015.js.map +1 -1
- package/dist/es6/ej2-inputs.es5.js +34 -26
- 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 +7 -7
- package/src/color-picker/color-picker-model.d.ts +1 -1
- package/src/color-picker/color-picker.d.ts +1 -0
- package/src/color-picker/color-picker.js +26 -22
- package/src/common/signature-base.js +5 -1
- package/src/input/input.js +3 -3
- package/tslint.json +111 -0
|
@@ -88,7 +88,7 @@ var Input;
|
|
|
88
88
|
if (parent.classList.contains('e-input-group') || parent.classList.contains('e-outline') || parent.classList.contains('e-filled')) {
|
|
89
89
|
parent.classList.add('e-input-focus');
|
|
90
90
|
}
|
|
91
|
-
if (args.floatLabelType
|
|
91
|
+
if (args.floatLabelType !== 'Never') {
|
|
92
92
|
setTimeout(() => {
|
|
93
93
|
Input.calculateWidth(args.element, parent);
|
|
94
94
|
}, 80);
|
|
@@ -99,7 +99,7 @@ var Input;
|
|
|
99
99
|
if (parent.classList.contains('e-input-group') || parent.classList.contains('e-outline') || parent.classList.contains('e-filled')) {
|
|
100
100
|
parent.classList.remove('e-input-focus');
|
|
101
101
|
}
|
|
102
|
-
if (args.floatLabelType
|
|
102
|
+
if (args.floatLabelType !== 'Never') {
|
|
103
103
|
setTimeout(() => {
|
|
104
104
|
Input.calculateWidth(args.element, parent);
|
|
105
105
|
}, 80);
|
|
@@ -501,7 +501,7 @@ var Input;
|
|
|
501
501
|
*/
|
|
502
502
|
function setValue$$1(value, element, floatLabelType, clearButton) {
|
|
503
503
|
element.value = value;
|
|
504
|
-
if (floatLabelType
|
|
504
|
+
if (floatLabelType !== 'Never') {
|
|
505
505
|
calculateWidth(element, element.parentElement);
|
|
506
506
|
}
|
|
507
507
|
if ((!isNullOrUndefined(floatLabelType)) && floatLabelType === 'Auto') {
|
|
@@ -11580,9 +11580,10 @@ let ColorPicker = class ColorPicker extends Component {
|
|
|
11580
11580
|
createPopupOnClick: this.createPopupOnClick,
|
|
11581
11581
|
open: this.onOpen.bind(this),
|
|
11582
11582
|
click: () => {
|
|
11583
|
+
const ev = new MouseEvent('click', { bubbles: true, cancelable: false });
|
|
11583
11584
|
this.trigger('change', {
|
|
11584
11585
|
currentValue: { hex: this.value.slice(0, 7), rgba: this.convertToRgbString(this.hexToRgb(this.value)) },
|
|
11585
|
-
previousValue: { hex: null, rgba: null }, value: this.value
|
|
11586
|
+
previousValue: { hex: null, rgba: null }, value: this.value, event: ev
|
|
11586
11587
|
});
|
|
11587
11588
|
}
|
|
11588
11589
|
});
|
|
@@ -12078,14 +12079,14 @@ let ColorPicker = class ColorPicker extends Component {
|
|
|
12078
12079
|
this.hsv[2] = this.hsv[2] > 100 ? 100 : this.hsv[2];
|
|
12079
12080
|
this.setHandlerPosition();
|
|
12080
12081
|
}
|
|
12081
|
-
convertToOtherFormat(isKey = false) {
|
|
12082
|
+
convertToOtherFormat(isKey = false, e) {
|
|
12082
12083
|
const pValue = this.rgbToHex(this.rgb);
|
|
12083
12084
|
this.rgb = this.hsvToRgb.apply(this, this.hsv);
|
|
12084
12085
|
const cValue = this.rgbToHex(this.rgb);
|
|
12085
12086
|
const rgba = this.convertToRgbString(this.rgb);
|
|
12086
12087
|
this.updatePreview(rgba);
|
|
12087
12088
|
this.updateInput(cValue);
|
|
12088
|
-
this.triggerEvent(cValue, pValue, rgba, isKey);
|
|
12089
|
+
this.triggerEvent(cValue, pValue, rgba, isKey, e);
|
|
12089
12090
|
}
|
|
12090
12091
|
updateInput(value) {
|
|
12091
12092
|
const wrapper = this.getWrapper();
|
|
@@ -12317,10 +12318,10 @@ let ColorPicker = class ColorPicker extends Component {
|
|
|
12317
12318
|
}
|
|
12318
12319
|
});
|
|
12319
12320
|
}
|
|
12320
|
-
triggerChangeEvent(value) {
|
|
12321
|
+
triggerChangeEvent(value, e) {
|
|
12321
12322
|
const hex = value.slice(0, 7);
|
|
12322
12323
|
this.trigger('change', {
|
|
12323
|
-
currentValue: { hex: hex, rgba: this.convertToRgbString(this.rgb) },
|
|
12324
|
+
currentValue: { hex: hex, rgba: this.convertToRgbString(this.rgb) }, event: e,
|
|
12324
12325
|
previousValue: { hex: this.value.slice(0, 7), rgba: this.convertToRgbString(this.hexToRgb(this.value)) },
|
|
12325
12326
|
value: this.enableOpacity ? value : hex
|
|
12326
12327
|
});
|
|
@@ -12339,7 +12340,7 @@ let ColorPicker = class ColorPicker extends Component {
|
|
|
12339
12340
|
this.hsv[prob] = 0;
|
|
12340
12341
|
}
|
|
12341
12342
|
this.updateHsv();
|
|
12342
|
-
this.convertToOtherFormat(true);
|
|
12343
|
+
this.convertToOtherFormat(true, e);
|
|
12343
12344
|
}
|
|
12344
12345
|
handlerDown(e) {
|
|
12345
12346
|
e.preventDefault();
|
|
@@ -12356,7 +12357,7 @@ let ColorPicker = class ColorPicker extends Component {
|
|
|
12356
12357
|
this.setHsv(this.clientX, this.clientY);
|
|
12357
12358
|
this.getDragHandler().style.transition = 'left .4s cubic-bezier(.25, .8, .25, 1), top .4s cubic-bezier(.25, .8, .25, 1)';
|
|
12358
12359
|
this.updateHsv();
|
|
12359
|
-
this.convertToOtherFormat();
|
|
12360
|
+
this.convertToOtherFormat(false, e);
|
|
12360
12361
|
this.getDragHandler().focus();
|
|
12361
12362
|
EventHandler.add(document, 'mousemove touchmove', this.handlerMove, this);
|
|
12362
12363
|
EventHandler.add(document, 'mouseup touchend', this.handlerEnd, this);
|
|
@@ -12378,7 +12379,7 @@ let ColorPicker = class ColorPicker extends Component {
|
|
|
12378
12379
|
this.setHsv(x, y);
|
|
12379
12380
|
const dragHandler = this.getDragHandler();
|
|
12380
12381
|
this.updateHsv();
|
|
12381
|
-
this.convertToOtherFormat();
|
|
12382
|
+
this.convertToOtherFormat(false, e);
|
|
12382
12383
|
this.getTooltipInst().refresh(dragHandler);
|
|
12383
12384
|
if (!this.tooltipEle.style.transform) {
|
|
12384
12385
|
if (Math.abs(this.clientX - x) > 8 || Math.abs(this.clientY - y) > 8) {
|
|
@@ -12522,7 +12523,7 @@ let ColorPicker = class ColorPicker extends Component {
|
|
|
12522
12523
|
this.setHandlerPosition();
|
|
12523
12524
|
this.updateInput(cValue);
|
|
12524
12525
|
select('.' + PREVIEW + ' .' + CURRENT, this.container).style.backgroundColor = this.convertToRgbString(this.rgb);
|
|
12525
|
-
this.triggerEvent(cValue, pValue, this.convertToRgbString(this.rgb));
|
|
12526
|
+
this.triggerEvent(cValue, pValue, this.convertToRgbString(this.rgb), false, e);
|
|
12526
12527
|
}
|
|
12527
12528
|
paletteClickHandler(e) {
|
|
12528
12529
|
e.preventDefault();
|
|
@@ -12541,7 +12542,7 @@ let ColorPicker = class ColorPicker extends Component {
|
|
|
12541
12542
|
if (this.getWrapper().classList.contains(SHOWVALUE)) {
|
|
12542
12543
|
this.updateInput(cValue);
|
|
12543
12544
|
}
|
|
12544
|
-
this.triggerEvent(cValue, pValue, this.convertToRgbString(this.rgb));
|
|
12545
|
+
this.triggerEvent(cValue, pValue, this.convertToRgbString(this.rgb), false, e);
|
|
12545
12546
|
}
|
|
12546
12547
|
if (!this.inline && !this.showButtons) {
|
|
12547
12548
|
this.closePopup(e);
|
|
@@ -12599,7 +12600,7 @@ let ColorPicker = class ColorPicker extends Component {
|
|
|
12599
12600
|
ctrlBtnClick(ele, e) {
|
|
12600
12601
|
if (ele.classList.contains(APPLY)) {
|
|
12601
12602
|
const cValue = this.rgbToHex(this.rgb);
|
|
12602
|
-
this.triggerChangeEvent(cValue);
|
|
12603
|
+
this.triggerChangeEvent(cValue, e);
|
|
12603
12604
|
}
|
|
12604
12605
|
if (!this.inline) {
|
|
12605
12606
|
this.closePopup(e);
|
|
@@ -12707,7 +12708,7 @@ let ColorPicker = class ColorPicker extends Component {
|
|
|
12707
12708
|
if (value.length === 9) {
|
|
12708
12709
|
pValue = this.rgbToHex(this.rgb);
|
|
12709
12710
|
this.rgb = this.hexToRgb(value + value.substr(-2));
|
|
12710
|
-
this.inputValueChange(this.rgbToHsv.apply(this, this.rgb), pValue, target.value);
|
|
12711
|
+
this.inputValueChange(this.rgbToHsv.apply(this, this.rgb), pValue, target.value, e);
|
|
12711
12712
|
}
|
|
12712
12713
|
else {
|
|
12713
12714
|
return;
|
|
@@ -12719,7 +12720,7 @@ let ColorPicker = class ColorPicker extends Component {
|
|
|
12719
12720
|
pValue = this.rgbToHex(this.rgb);
|
|
12720
12721
|
this.rgb[0] = Number(target.value);
|
|
12721
12722
|
hsv = this.rgbToHsv.apply(this, this.rgb);
|
|
12722
|
-
this.inputValueChange(hsv, pValue);
|
|
12723
|
+
this.inputValueChange(hsv, pValue, null, e);
|
|
12723
12724
|
}
|
|
12724
12725
|
break;
|
|
12725
12726
|
case 'G':
|
|
@@ -12727,7 +12728,7 @@ let ColorPicker = class ColorPicker extends Component {
|
|
|
12727
12728
|
pValue = this.rgbToHex(this.rgb);
|
|
12728
12729
|
this.rgb[1] = Number(target.value);
|
|
12729
12730
|
hsv = this.rgbToHsv.apply(this, this.rgb);
|
|
12730
|
-
this.inputValueChange(hsv, pValue);
|
|
12731
|
+
this.inputValueChange(hsv, pValue, null, e);
|
|
12731
12732
|
}
|
|
12732
12733
|
break;
|
|
12733
12734
|
case 'B':
|
|
@@ -12735,7 +12736,7 @@ let ColorPicker = class ColorPicker extends Component {
|
|
|
12735
12736
|
pValue = this.rgbToHex(this.rgb);
|
|
12736
12737
|
this.rgb[2] = Number(target.value);
|
|
12737
12738
|
hsv = this.rgbToHsv.apply(this, this.rgb);
|
|
12738
|
-
this.inputValueChange(hsv, pValue);
|
|
12739
|
+
this.inputValueChange(hsv, pValue, null, e);
|
|
12739
12740
|
}
|
|
12740
12741
|
break;
|
|
12741
12742
|
case 'H':
|
|
@@ -12745,14 +12746,14 @@ let ColorPicker = class ColorPicker extends Component {
|
|
|
12745
12746
|
if (this.hsv[1] !== Number(target.value)) {
|
|
12746
12747
|
this.hsv[1] = Number(target.value);
|
|
12747
12748
|
this.updateHsv();
|
|
12748
|
-
this.convertToOtherFormat();
|
|
12749
|
+
this.convertToOtherFormat(false, e);
|
|
12749
12750
|
}
|
|
12750
12751
|
break;
|
|
12751
12752
|
case 'V':
|
|
12752
12753
|
if (this.hsv[2] !== Number(target.value)) {
|
|
12753
12754
|
this.hsv[2] = Number(target.value);
|
|
12754
12755
|
this.updateHsv();
|
|
12755
|
-
this.convertToOtherFormat();
|
|
12756
|
+
this.convertToOtherFormat(false, e);
|
|
12756
12757
|
}
|
|
12757
12758
|
break;
|
|
12758
12759
|
case 'A':
|
|
@@ -12760,7 +12761,7 @@ let ColorPicker = class ColorPicker extends Component {
|
|
|
12760
12761
|
break;
|
|
12761
12762
|
}
|
|
12762
12763
|
}
|
|
12763
|
-
inputValueChange(hsv, pValue, value) {
|
|
12764
|
+
inputValueChange(hsv, pValue, value, e) {
|
|
12764
12765
|
if (hsv[0] !== this.hsv[0]) {
|
|
12765
12766
|
this.hueSlider.setProperties({ 'value': hsv[0] }, true);
|
|
12766
12767
|
this.hueSlider.refresh();
|
|
@@ -12772,12 +12773,15 @@ let ColorPicker = class ColorPicker extends Component {
|
|
|
12772
12773
|
this.updateInput(value ? value : cValue);
|
|
12773
12774
|
const rgba = this.convertToRgbString(this.rgb);
|
|
12774
12775
|
this.updatePreview(rgba);
|
|
12775
|
-
this.triggerEvent(cValue, pValue, rgba);
|
|
12776
|
+
this.triggerEvent(cValue, pValue, rgba, false, e);
|
|
12776
12777
|
}
|
|
12777
|
-
triggerEvent(cValue, pValue, rgba, isKey = false) {
|
|
12778
|
+
triggerEvent(cValue, pValue, rgba, isKey = false, e) {
|
|
12778
12779
|
const hex = cValue.slice(0, 7);
|
|
12780
|
+
if (isNullOrUndefined(e)) {
|
|
12781
|
+
e = new MouseEvent('click', { bubbles: true, cancelable: false });
|
|
12782
|
+
}
|
|
12779
12783
|
if (!this.showButtons && !isKey) {
|
|
12780
|
-
this.trigger('change', { currentValue: { hex: hex, rgba: rgba },
|
|
12784
|
+
this.trigger('change', { currentValue: { hex: hex, rgba: rgba }, event: e,
|
|
12781
12785
|
previousValue: { hex: this.value.slice(0, 7), rgba: this.convertToRgbString(this.hexToRgb(this.value)) }, value: cValue });
|
|
12782
12786
|
if (this.enableOpacity) {
|
|
12783
12787
|
this.setProperties({ 'value': cValue }, true);
|
|
@@ -12789,7 +12793,7 @@ let ColorPicker = class ColorPicker extends Component {
|
|
|
12789
12793
|
}
|
|
12790
12794
|
else {
|
|
12791
12795
|
this.trigger('select', {
|
|
12792
|
-
currentValue: { hex: hex, rgba: rgba },
|
|
12796
|
+
currentValue: { hex: hex, rgba: rgba }, event: e,
|
|
12793
12797
|
previousValue: { hex: pValue.slice(0, 7), rgba: this.convertToRgbString(this.hexToRgb(pValue)) }
|
|
12794
12798
|
});
|
|
12795
12799
|
}
|
|
@@ -15017,6 +15021,10 @@ class SignatureBase extends Component {
|
|
|
15017
15021
|
this.lastWidth = newWidth;
|
|
15018
15022
|
}
|
|
15019
15023
|
endDraw() {
|
|
15024
|
+
if (isNullOrUndefined(this.pointColl)) {
|
|
15025
|
+
return;
|
|
15026
|
+
}
|
|
15027
|
+
|
|
15020
15028
|
const canDrawCurve = this.pointColl.length > 2;
|
|
15021
15029
|
const point = this.pointColl[0];
|
|
15022
15030
|
if (!canDrawCurve && point) {
|
|
@@ -15286,7 +15294,7 @@ class SignatureBase extends Component {
|
|
|
15286
15294
|
const args = { actionName: 'clear' };
|
|
15287
15295
|
this.canvasContext.clearRect(0, 0, this.canvasContext.canvas.width, this.canvasContext.canvas.height);
|
|
15288
15296
|
this.tempContext.clearRect(0, 0, this.tempContext.canvas.width, this.tempContext.canvas.height);
|
|
15289
|
-
if (this.saveWithBackground) {
|
|
15297
|
+
if (this.saveWithBackground && this.backgroundImage) {
|
|
15290
15298
|
this.setBackgroundImage(this.backgroundImage, 'temp');
|
|
15291
15299
|
}
|
|
15292
15300
|
this.internalRefresh();
|