@syncfusion/ej2-inputs 23.1.43 → 24.1.41
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/CHANGELOG.md +0 -31
- 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 +43 -5
- package/dist/es6/ej2-inputs.es2015.js.map +1 -1
- package/dist/es6/ej2-inputs.es5.js +43 -5
- 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 +10 -10
- package/src/color-picker/color-picker.d.ts +1 -0
- package/src/color-picker/color-picker.js +28 -0
- package/src/input/input.js +3 -5
- package/src/numerictextbox/numerictextbox.js +1 -0
- package/src/rating/rating.d.ts +1 -0
- package/src/rating/rating.js +11 -0
- package/styles/bootstrap-dark.css +263 -3
- package/styles/bootstrap-dark.scss +1 -0
- package/styles/bootstrap.css +263 -3
- package/styles/bootstrap.scss +1 -0
- package/styles/bootstrap4.css +263 -3
- package/styles/bootstrap4.scss +1 -0
- package/styles/bootstrap5-dark.css +276 -3
- package/styles/bootstrap5-dark.scss +1 -0
- package/styles/bootstrap5.css +276 -3
- package/styles/bootstrap5.scss +1 -0
- package/styles/color-picker/_layout.scss +36 -0
- package/styles/color-picker/bootstrap5-dark.css +13 -0
- package/styles/color-picker/bootstrap5.css +13 -0
- package/styles/color-picker/fabric.css +5 -0
- package/styles/color-picker/fluent-dark.css +13 -0
- package/styles/color-picker/fluent.css +13 -0
- package/styles/color-picker/material.css +13 -0
- package/styles/color-picker/material3-dark.css +18 -0
- package/styles/color-picker/material3.css +18 -0
- package/styles/color-picker/tailwind-dark.css +13 -0
- package/styles/color-picker/tailwind.css +13 -0
- package/styles/data-form/_all.scss +2 -0
- package/styles/data-form/_bootstrap-dark-definition.scss +42 -0
- package/styles/data-form/_bootstrap-definition.scss +41 -0
- package/styles/data-form/_bootstrap4-definition.scss +41 -0
- package/styles/data-form/_bootstrap5-dark-definition.scss +1 -0
- package/styles/data-form/_bootstrap5-definition.scss +41 -0
- package/styles/data-form/_fabric-dark-definition.scss +41 -0
- package/styles/data-form/_fabric-definition.scss +41 -0
- package/styles/data-form/_fluent-dark-definition.scss +1 -0
- package/styles/data-form/_fluent-definition.scss +41 -0
- package/styles/data-form/_fusionnew-definition.scss +41 -0
- package/styles/data-form/_highcontrast-definition.scss +41 -0
- package/styles/data-form/_highcontrast-light-definition.scss +41 -0
- package/styles/data-form/_layout.scss +223 -0
- package/styles/data-form/_material-dark-definition.scss +41 -0
- package/styles/data-form/_material-definition.scss +42 -0
- package/styles/data-form/_material3-dark-definition.scss +1 -0
- package/styles/data-form/_material3-definition.scss +41 -0
- package/styles/data-form/_tailwind-dark-definition.scss +1 -0
- package/styles/data-form/_tailwind-definition.scss +41 -0
- package/styles/data-form/_theme.scss +38 -0
- package/styles/data-form/bootstrap-dark.css +240 -0
- package/styles/data-form/bootstrap-dark.scss +3 -0
- package/styles/data-form/bootstrap.css +240 -0
- package/styles/data-form/bootstrap.scss +3 -0
- package/styles/data-form/bootstrap4.css +240 -0
- package/styles/data-form/bootstrap4.scss +3 -0
- package/styles/data-form/bootstrap5-dark.css +240 -0
- package/styles/data-form/bootstrap5-dark.scss +3 -0
- package/styles/data-form/bootstrap5.css +240 -0
- package/styles/data-form/bootstrap5.scss +3 -0
- package/styles/data-form/fabric-dark.css +240 -0
- package/styles/data-form/fabric-dark.scss +3 -0
- package/styles/data-form/fabric.css +240 -0
- package/styles/data-form/fabric.scss +3 -0
- package/styles/data-form/fluent-dark.css +240 -0
- package/styles/data-form/fluent-dark.scss +3 -0
- package/styles/data-form/fluent.css +240 -0
- package/styles/data-form/fluent.scss +3 -0
- package/styles/data-form/highcontrast-light.css +240 -0
- package/styles/data-form/highcontrast-light.scss +3 -0
- package/styles/data-form/highcontrast.css +240 -0
- package/styles/data-form/highcontrast.scss +3 -0
- package/styles/data-form/material-dark.css +240 -0
- package/styles/data-form/material-dark.scss +3 -0
- package/styles/data-form/material.css +240 -0
- package/styles/data-form/material.scss +3 -0
- package/styles/data-form/material3-dark.css +295 -0
- package/styles/data-form/material3-dark.scss +4 -0
- package/styles/data-form/material3.css +351 -0
- package/styles/data-form/material3.scss +4 -0
- package/styles/data-form/tailwind-dark.css +240 -0
- package/styles/data-form/tailwind-dark.scss +3 -0
- package/styles/data-form/tailwind.css +240 -0
- package/styles/data-form/tailwind.scss +3 -0
- package/styles/fabric-dark.css +263 -3
- package/styles/fabric-dark.scss +1 -0
- package/styles/fabric.css +268 -3
- package/styles/fabric.scss +1 -0
- package/styles/fluent-dark.css +276 -3
- package/styles/fluent-dark.scss +1 -0
- package/styles/fluent.css +276 -3
- package/styles/fluent.scss +1 -0
- package/styles/highcontrast-light.css +263 -3
- package/styles/highcontrast-light.scss +1 -0
- package/styles/highcontrast.css +263 -3
- package/styles/highcontrast.scss +1 -0
- package/styles/material-dark.css +275 -3
- package/styles/material-dark.scss +1 -0
- package/styles/material.css +288 -3
- package/styles/material.scss +1 -0
- package/styles/material3-dark.css +293 -3
- package/styles/material3-dark.scss +1 -0
- package/styles/material3.css +293 -3
- package/styles/material3.scss +1 -0
- package/styles/rating/_bootstrap-dark-definition.scss +4 -0
- package/styles/rating/_bootstrap-definition.scss +4 -0
- package/styles/rating/_bootstrap4-definition.scss +4 -0
- package/styles/rating/_bootstrap5-definition.scss +4 -0
- package/styles/rating/_fabric-dark-definition.scss +4 -0
- package/styles/rating/_fabric-definition.scss +4 -0
- package/styles/rating/_fluent-definition.scss +4 -0
- package/styles/rating/_fusionnew-definition.scss +4 -0
- package/styles/rating/_highcontrast-definition.scss +4 -0
- package/styles/rating/_highcontrast-light-definition.scss +4 -0
- package/styles/rating/_layout.scss +21 -7
- package/styles/rating/_material-dark-definition.scss +4 -0
- package/styles/rating/_material-definition.scss +4 -0
- package/styles/rating/_material3-definition.scss +4 -0
- package/styles/rating/_tailwind-definition.scss +4 -0
- package/styles/rating/_theme.scss +5 -2
- package/styles/rating/bootstrap-dark.css +22 -3
- package/styles/rating/bootstrap.css +22 -3
- package/styles/rating/bootstrap4.css +22 -3
- package/styles/rating/bootstrap5-dark.css +22 -3
- package/styles/rating/bootstrap5.css +22 -3
- package/styles/rating/fabric-dark.css +22 -3
- package/styles/rating/fabric.css +22 -3
- package/styles/rating/fluent-dark.css +22 -3
- package/styles/rating/fluent.css +22 -3
- package/styles/rating/highcontrast-light.css +22 -3
- package/styles/rating/highcontrast.css +22 -3
- package/styles/rating/material-dark.css +22 -3
- package/styles/rating/material.css +22 -3
- package/styles/rating/material3-dark.css +22 -3
- package/styles/rating/material3.css +22 -3
- package/styles/rating/tailwind-dark.css +22 -3
- package/styles/rating/tailwind.css +22 -3
- package/styles/slider/_layout.scss +4 -0
- package/styles/slider/material-dark.css +12 -0
- package/styles/slider/material.css +12 -0
- package/styles/slider/material3-dark.css +12 -0
- package/styles/slider/material3.css +12 -0
- package/styles/tailwind-dark.css +276 -3
- package/styles/tailwind-dark.scss +1 -0
- package/styles/tailwind.css +276 -3
- package/styles/tailwind.scss +1 -0
|
@@ -29,7 +29,6 @@ var Input;
|
|
|
29
29
|
(function (Input) {
|
|
30
30
|
var floatType;
|
|
31
31
|
var isBindClearAction = true;
|
|
32
|
-
var floatLabelElement;
|
|
33
32
|
/**
|
|
34
33
|
* Create a wrapper to input element with multiple span elements and set the basic properties to input based components.
|
|
35
34
|
* ```
|
|
@@ -177,7 +176,7 @@ var Input;
|
|
|
177
176
|
inputObject.container.classList.add(CLASSNAMES.FLOATINPUT);
|
|
178
177
|
}
|
|
179
178
|
var floatLinelement = makeElement('span', { className: CLASSNAMES.FLOATLINE });
|
|
180
|
-
floatLabelElement = makeElement('label', { className: CLASSNAMES.FLOATTEXT });
|
|
179
|
+
var floatLabelElement = makeElement('label', { className: CLASSNAMES.FLOATTEXT });
|
|
181
180
|
if (!isNullOrUndefined(args.element.id) && args.element.id !== '') {
|
|
182
181
|
floatLabelElement.id = 'label_' + args.element.id.replace(/ /g, '_');
|
|
183
182
|
attributes(args.element, { 'aria-labelledby': floatLabelElement.id });
|
|
@@ -214,11 +213,11 @@ var Input;
|
|
|
214
213
|
if (args.floatLabelType === 'Auto') {
|
|
215
214
|
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
216
215
|
args.element.addEventListener('input', function (event) {
|
|
217
|
-
|
|
216
|
+
validateLabel(args.element, args.floatLabelType);
|
|
218
217
|
});
|
|
219
218
|
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
220
219
|
args.element.addEventListener('blur', function (event) {
|
|
221
|
-
|
|
220
|
+
validateLabel(args.element, args.floatLabelType);
|
|
222
221
|
});
|
|
223
222
|
}
|
|
224
223
|
if (!isNullOrUndefined(args.element.getAttribute('id'))) {
|
|
@@ -346,7 +345,6 @@ var Input;
|
|
|
346
345
|
}
|
|
347
346
|
Input.wireClearBtnEvents = wireClearBtnEvents;
|
|
348
347
|
function destroy() {
|
|
349
|
-
floatLabelElement = null;
|
|
350
348
|
|
|
351
349
|
}
|
|
352
350
|
Input.destroy = destroy;
|
|
@@ -1430,6 +1428,7 @@ var NumericTextBox = /** @__PURE__ @class */ (function (_super) {
|
|
|
1430
1428
|
this.updateValue(parsedInput, event);
|
|
1431
1429
|
};
|
|
1432
1430
|
NumericTextBox.prototype.raiseChangeEvent = function (event) {
|
|
1431
|
+
this.inputValue = (isNullOrUndefined(this.inputValue) || isNaN(this.inputValue)) ? null : this.inputValue;
|
|
1433
1432
|
if (this.prevValue !== this.value || this.prevValue !== this.inputValue) {
|
|
1434
1433
|
var eventArgs = {};
|
|
1435
1434
|
this.changeEventArgs = { value: this.value, previousValue: this.prevValue, isInteracted: this.isInteract,
|
|
@@ -12067,6 +12066,7 @@ var ColorPicker = /** @__PURE__ @class */ (function (_super) {
|
|
|
12067
12066
|
opensOn: 'Custom',
|
|
12068
12067
|
showTipPointer: false,
|
|
12069
12068
|
cssClass: 'e-color-picker-tooltip',
|
|
12069
|
+
htmlAttributes: { title: 'tooltip' },
|
|
12070
12070
|
beforeOpen: function (args) {
|
|
12071
12071
|
_this.tooltipEle = args.element;
|
|
12072
12072
|
},
|
|
@@ -12076,6 +12076,7 @@ var ColorPicker = /** @__PURE__ @class */ (function (_super) {
|
|
|
12076
12076
|
tooltip.appendTo(this.container);
|
|
12077
12077
|
tooltip.open(this.container);
|
|
12078
12078
|
this.tooltipEle.style.zIndex = getZindexPartial(this.tooltipEle).toString();
|
|
12079
|
+
this.tooltipEle.setAttribute('aria-label', 'colorpicker-tooltip');
|
|
12079
12080
|
select('.e-tip-content', this.tooltipEle).appendChild(this.createElement('div', { className: 'e-tip-transparent' }));
|
|
12080
12081
|
};
|
|
12081
12082
|
ColorPicker.prototype.getTooltipInst = function () {
|
|
@@ -12485,9 +12486,26 @@ var ColorPicker = /** @__PURE__ @class */ (function (_super) {
|
|
|
12485
12486
|
this.firstPaletteFocus();
|
|
12486
12487
|
this.createInput();
|
|
12487
12488
|
this.refreshPopupPos();
|
|
12489
|
+
//for image editor popup position refreshing
|
|
12490
|
+
if (this.element.parentElement && this.element.parentElement.parentElement && this.element.parentElement.parentElement.classList.contains('e-ie-ddb-popup')) {
|
|
12491
|
+
this.refreshImageEditorPopupPos();
|
|
12492
|
+
}
|
|
12493
|
+
|
|
12488
12494
|
this.wireEvents();
|
|
12489
12495
|
this.trigger('onModeSwitch', { element: this.container, mode: 'Palette' });
|
|
12490
12496
|
};
|
|
12497
|
+
//for image editor popup position refreshing
|
|
12498
|
+
ColorPicker.prototype.refreshImageEditorPopupPos = function () {
|
|
12499
|
+
if (Browser.isDevice) {
|
|
12500
|
+
var popupEle = this.getPopupEle();
|
|
12501
|
+
popupEle.style.left = formatUnit(0 + pageXOffset);
|
|
12502
|
+
popupEle.style.top = formatUnit(0 + pageYOffset);
|
|
12503
|
+
var btnElem = document.querySelector("#" + this.element.parentElement.parentElement.id.split('-popup')[0]);
|
|
12504
|
+
if (btnElem) {
|
|
12505
|
+
popupEle.parentElement.ej2_instances[0].refreshPosition(btnElem);
|
|
12506
|
+
}
|
|
12507
|
+
}
|
|
12508
|
+
};
|
|
12491
12509
|
ColorPicker.prototype.refreshPopupPos = function () {
|
|
12492
12510
|
if (!this.inline) {
|
|
12493
12511
|
var popupEle = this.getPopupEle();
|
|
@@ -12609,6 +12627,11 @@ var ColorPicker = /** @__PURE__ @class */ (function (_super) {
|
|
|
12609
12627
|
this.getDragHandler().focus();
|
|
12610
12628
|
this.createInput();
|
|
12611
12629
|
this.refreshPopupPos();
|
|
12630
|
+
//for image editor popup position refreshing
|
|
12631
|
+
if (this.element.parentElement && this.element.parentElement.parentElement && this.element.parentElement.parentElement.classList.contains('e-ie-ddb-popup')) {
|
|
12632
|
+
this.refreshImageEditorPopupPos();
|
|
12633
|
+
}
|
|
12634
|
+
|
|
12612
12635
|
this.wireEvents();
|
|
12613
12636
|
this.trigger('onModeSwitch', { element: this.container, mode: 'Picker' });
|
|
12614
12637
|
};
|
|
@@ -12621,6 +12644,10 @@ var ColorPicker = /** @__PURE__ @class */ (function (_super) {
|
|
|
12621
12644
|
this.closePopup(e);
|
|
12622
12645
|
this.splitBtn.element.focus();
|
|
12623
12646
|
}
|
|
12647
|
+
else if (ele.classList.contains(CANCEL)) {
|
|
12648
|
+
var beforeCloseArgs = { element: this.container, event: e, cancel: false };
|
|
12649
|
+
this.trigger('beforeClose', beforeCloseArgs);
|
|
12650
|
+
}
|
|
12624
12651
|
};
|
|
12625
12652
|
ColorPicker.prototype.paletteKeyDown = function (e) {
|
|
12626
12653
|
var target = e.target;
|
|
@@ -15410,6 +15437,7 @@ var Rating = /** @__PURE__ @class */ (function (_super) {
|
|
|
15410
15437
|
space: 'space'
|
|
15411
15438
|
};
|
|
15412
15439
|
this.tooltipOpen = false;
|
|
15440
|
+
this.isTouchSelected = false;
|
|
15413
15441
|
};
|
|
15414
15442
|
Rating.prototype.render = function () {
|
|
15415
15443
|
this.initialize();
|
|
@@ -15472,6 +15500,11 @@ var Rating = /** @__PURE__ @class */ (function (_super) {
|
|
|
15472
15500
|
EventHandler.add(this.ratingItemList, Browser.touchEndEvent, this.touchEndHandler, this);
|
|
15473
15501
|
};
|
|
15474
15502
|
Rating.prototype.touchMoveHandler = function (e) {
|
|
15503
|
+
if (!this.isTouchSelected) {
|
|
15504
|
+
this.wrapper.classList.add("e-rating-touch");
|
|
15505
|
+
this.isTouchSelected = true;
|
|
15506
|
+
}
|
|
15507
|
+
this.wrapper.classList.add("e-touch-select");
|
|
15475
15508
|
var rect = this.ratingItemList.getBoundingClientRect();
|
|
15476
15509
|
var x = e.touches[0].clientX - rect.x;
|
|
15477
15510
|
var currValue = (x / rect.width) * this.itemsCount;
|
|
@@ -15502,6 +15535,7 @@ var Rating = /** @__PURE__ @class */ (function (_super) {
|
|
|
15502
15535
|
};
|
|
15503
15536
|
Rating.prototype.touchEndHandler = function () {
|
|
15504
15537
|
this.closeRatingTooltip();
|
|
15538
|
+
this.wrapper.classList.remove("e-touch-select");
|
|
15505
15539
|
};
|
|
15506
15540
|
Rating.prototype.updateTemplateFunction = function () {
|
|
15507
15541
|
this.emptyTemplateFunction = this.emptyTemplate ? this.getTemplateString(this.emptyTemplate) : null;
|
|
@@ -15781,6 +15815,10 @@ var Rating = /** @__PURE__ @class */ (function (_super) {
|
|
|
15781
15815
|
this.trigger('valueChanged', eventArgs);
|
|
15782
15816
|
};
|
|
15783
15817
|
Rating.prototype.mouseMoveHandler = function (index, e) {
|
|
15818
|
+
if (this.isTouchSelected) {
|
|
15819
|
+
this.wrapper.classList.remove("e-rating-touch");
|
|
15820
|
+
this.isTouchSelected = false;
|
|
15821
|
+
}
|
|
15784
15822
|
var currValue = this.calculateCurrentValue(index, e);
|
|
15785
15823
|
currValue = this.validateValue(currValue);
|
|
15786
15824
|
var element = this.itemElements[parseInt((index - 1).toString(), 10)];
|