@syncfusion/ej2-inputs 19.4.52 → 20.1.47

package/dist/es6/ej2-inputs.es5.js

@@ -4270,6 +4270,7 @@ var Slider = /** @__PURE__ @class */ (function (_super) {
         this.isBootstrap4 = this.getTheme(this.sliderContainer) === 'bootstrap4';
         this.isTailwind = this.getTheme(this.sliderContainer) === 'tailwind' || this.getTheme(this.sliderContainer) === 'tailwind-dark';
         this.isBootstrap5 = this.getTheme(this.sliderContainer) === 'bootstrap5';
+        this.isFluent = this.getTheme(this.sliderContainer) === 'FluentUI';
         this.isMaterialTooltip = this.isMaterial && this.type !== 'Range' && this.tooltip.isVisible;
     };
     Slider.prototype.createRangeBar = function () {
@@ -4418,7 +4419,9 @@ var Slider = /** @__PURE__ @class */ (function (_super) {
     Slider.prototype.transitionEnd = function (e) {
         if (e.propertyName !== 'transform') {
             this.handleStart();
-            this.getHandle().style.transition = 'none';
+            if (!this.enableAnimation) {
+                this.getHandle().style.transition = 'none';
+            }
             if (this.type !== 'Default') {
                 this.rangeBar.style.transition = 'none';
             }
@@ -4762,7 +4765,7 @@ var Slider = /** @__PURE__ @class */ (function (_super) {
     };
     Slider.prototype.renderTooltip = function () {
         this.tooltipObj = new Tooltip({
-            showTipPointer: this.isBootstrap || this.isMaterial || this.isBootstrap4 || this.isTailwind || this.isBootstrap5,
+            showTipPointer: this.isBootstrap || this.isMaterial || this.isBootstrap4 || this.isTailwind || this.isBootstrap5 || this.isFluent,
             cssClass: classNames.sliderTooltip,
             height: this.isMaterial ? 30 : 'auto',
             animation: { open: { effect: 'None' }, close: { effect: 'FadeOut', duration: 500 } },
@@ -9606,7 +9609,7 @@ var Uploader = /** @__PURE__ @class */ (function (_super) {
     };
     Uploader.prototype.removecanceledFile = function (e, file) {
         var liElement = this.getLiElement(file);
-        if (liElement.querySelector('.' + RETRY_ICON) || isNullOrUndefined(liElement.querySelector('.' + ABORT_ICON))) {
+        if (isNullOrUndefined(liElement) || liElement.querySelector('.' + RETRY_ICON) || isNullOrUndefined(liElement.querySelector('.' + ABORT_ICON))) {
             return;
         }
         this.updateStatus(file, this.localizedTexts('fileUploadCancel'), '5');
@@ -9843,6 +9846,9 @@ var Uploader = /** @__PURE__ @class */ (function (_super) {
                 if (selectAll(uploadTemplate, document).length) {
                     return compile(select(uploadTemplate, document).innerHTML.trim());
                 }
+                else {
+                    return compile(uploadTemplate);
+                }
             }
             catch (exception) {
                 return compile(uploadTemplate);
@@ -11412,7 +11418,7 @@ var ColorPicker = /** @__PURE__ @class */ (function (_super) {
             }
             roundedColor = this.roundValue(colors[i]).toLowerCase();
             tile = this.createElement('span', {
-                className: TILE, attrs: { 'role': 'gridcell', 'aria-label': roundedColor, 'aria-selected': 'false' }
+                className: TILE, attrs: { 'role': 'gridcell', 'aria-label': roundedColor, 'aria-selected': 'false', 'tabindex': '0' }
             });
             this.trigger('beforeTileRender', { element: tile, presetName: key, value: colors[i] });
             row.appendChild(tile);
@@ -13736,6 +13742,7 @@ var SignatureBase = /** @__PURE__ @class */ (function (_super) {
         _this.backgroundLoaded = null;
         _this.clearArray = [];
         _this.isBlazor = false;
+        _this.isResponsive = false;
         return _this;
     }
     /**
@@ -13743,47 +13750,29 @@ var SignatureBase = /** @__PURE__ @class */ (function (_super) {
      *
      * @private
      * @param {HTMLCanvasElement} element - Specifies the canvas element.
-     * @param {parameter} parameter - Specifies only for the blazor parameter.
      * @param {BlazorDotnetObject} dotnetRef - Specifies for blazor client to server communication.
      * @returns {void}
      */
-    SignatureBase.prototype.initialize = function (element, parameter, dotnetRef) {
+    SignatureBase.prototype.initialize = function (element, dotnetRef) {
         this.element = element;
         this.canvasContext = this.element.getContext('2d');
         this.canvasContext.canvas.tabIndex = 0;
-        if (parameter) {
-            this.setBlazorParameter(parameter);
+        if (dotnetRef) {
             this.dotnetRef = dotnetRef;
+            this.isBlazor = true;
+            if (this.signatureValue) {
+                this.loadPersistedSignature();
+            }
         }
         this.setHTMLProperties();
         if (isNullOrUndefined(this.signatureValue)) {
             this.updateSnapCollection(true);
         }
         this.wireEvents();
-        this.isSignatureEmpty = true;
         if (!this.isBlazor) {
             this.trigger('created', null);
         }
     };
-    SignatureBase.prototype.setBlazorParameter = function (parameter) {
-        this.isBlazor = true;
-        this.backgroundColor = parameter.backgroundColor;
-        this.backgroundImage = parameter.backgroundImage;
-        this.disabled = parameter.disabled;
-        this.isReadOnly = parameter.isReadOnly;
-        this.maxStrokeWidth = parameter.maxStrokeWidth || 2;
-        this.minStrokeWidth = parameter.minStrokeWidth || 0.5;
-        this.velocity = parameter.velocity || 0.7;
-        this.strokeColor = parameter.strokeColor || '#000000';
-        this.saveWithBackground = parameter.saveWithBackground;
-        this.interval = 30;
-        this.previous = 0;
-        this.minDistance = 5;
-        this.signatureValue = parameter.signatureValue;
-        if (this.signatureValue) {
-            this.loadPersistedSignature();
-        }
-    };
     SignatureBase.prototype.wireEvents = function () {
         if (isNullOrUndefined(this.pointColl) && !this.isReadOnly && !this.disabled) {
             EventHandler.add(this.canvasContext.canvas, 'mousedown touchstart', this.mouseDownHandler, this);
@@ -13804,24 +13793,21 @@ var SignatureBase = /** @__PURE__ @class */ (function (_super) {
         }
         else {
             EventHandler.remove(this.canvasContext.canvas, 'mousedown touchstart', this.mouseDownHandler);
-            EventHandler.remove(this.canvasContext.canvas, 'mousemove touchmove', this.mouseMoveHandler);
-            EventHandler.remove(this.canvasContext.canvas, 'mouseup touchend', this.mouseUpHandler);
-            EventHandler.remove(document, 'mouseup', this.mouseUpHandler);
             EventHandler.remove(this.canvasContext.canvas, 'keydown', this.keyboardHandler);
             window.removeEventListener('resize', this.resizeHandler);
         }
     };
     SignatureBase.prototype.setHTMLProperties = function () {
-        if (this.element.height === 150) {
+        if (this.element.height === 150 && this.element.width === 300) {
             this.element.height = this.element.offsetHeight;
-        }
-        if (this.element.width === 300) {
             this.element.width = this.element.offsetWidth;
+            this.isResponsive = true;
         }
         this.canvasContext.scale(1, 1);
         this.canvasContext.fillStyle = this.strokeColor;
         if (this.backgroundImage) {
             this.canvasContext.canvas.style.backgroundImage = 'url(' + this.backgroundImage + ')';
+            this.canvasContext.canvas.style.backgroundRepeat = "no-repeat";
         }
         else if (this.backgroundColor) {
             this.canvasContext.canvas.style.backgroundColor = this.backgroundColor;
@@ -13900,9 +13886,11 @@ var SignatureBase = /** @__PURE__ @class */ (function (_super) {
     SignatureBase.prototype.resizeHandler = function () {
         // eslint-disable-next-line @typescript-eslint/no-this-alias
         var proxy = this;
-        this.canvasContext.canvas.width = this.element.offsetWidth;
-        this.canvasContext.canvas.height = this.element.offsetHeight;
-        this.canvasContext.scale(1, 1);
+        if (this.isResponsive) {
+            this.canvasContext.canvas.width = this.element.offsetWidth;
+            this.canvasContext.canvas.height = this.element.offsetHeight;
+            this.canvasContext.scale(1, 1);
+        }
         var restoreImg = new Image();
         restoreImg.src = this.snapColl[this.incStep];
         restoreImg.onload = function () {
@@ -14390,6 +14378,9 @@ var SignatureBase = /** @__PURE__ @class */ (function (_super) {
         var proxy = this;
         var bitmapImage = new Image();
         bitmapImage.src = signature;
+        if (signature.slice(0, 4) !== 'data') {
+            bitmapImage.crossOrigin = 'anonymous';
+        }
         bitmapImage.onload = function () {
             Promise.all([
                 createImageBitmap(bitmapImage, 0, 0, width, height)
@@ -14398,6 +14389,9 @@ var SignatureBase = /** @__PURE__ @class */ (function (_super) {
                 tempCanvas.width = width;
                 tempCanvas.height = height;
                 tempCanvas.getContext('2d').drawImage(results[0], 0, 0);
+                if (signature.slice(0, 4) !== 'data') {
+                    proxy.canvasContext.globalCompositeOperation = 'source-over';
+                }
                 proxy.canvasContext.drawImage(tempCanvas, 0, 0, width, height, 0, 0, proxy.element.width, proxy.element.height);
                 proxy.updateSnapCollection();
             });