@syncfusion/ej2-inputs 19.2.60 → 19.3.48

package/dist/global/index.d.ts

@@ -1,6 +1,6 @@
 /*!
 *  filename: index.d.ts
-*  version : 19.2.60
+*  version : 19.3.48
 *  Copyright Syncfusion Inc. 2001 - 2020. All rights reserved.
 *  Use of this code is subject to the terms of our license.
 *  A copy of the current license can be obtained at any time by e-mailing

package/helpers/e2e/colorpickerHelper.d.ts

@@ -0,0 +1,23 @@
+import { TestHelper } from '@syncfusion/ej2-base/helpers/e2e';
+/**
+ * E2E test helpers for Colorpicker to easily interact and the test the component
+ */
+export declare class ColorpickerHelper extends TestHelper {
+    id: string;
+    wrapperFn: Function;
+    /**
+     * Initialize the Colorpicker E2E helpers
+     * @param id Element id of the Colorpicker element
+     * @param wrapperFn Pass the wrapper function
+     */
+    constructor(id: string, wrapperFn: Function);
+    /**
+     * Used to get root element of the Colorpicker component
+     */
+    getElement(): any;
+    getSplitButtonElement(): any;
+    getSplitButtonPopupElement(): any;
+    setModel(property: any, value: any): any;
+    getModel(property: any): any;
+    invoke(fName: any, args?: any): any;
+}

package/helpers/e2e/colorpickerHelper.js

@@ -0,0 +1,53 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const e2e_1 = require("@syncfusion/ej2-base/helpers/e2e");
+/**
+ * E2E test helpers for Colorpicker to easily interact and the test the component
+ */
+class ColorpickerHelper extends e2e_1.TestHelper {
+    /**
+     * Initialize the Colorpicker E2E helpers
+     * @param id Element id of the Colorpicker element
+     * @param wrapperFn Pass the wrapper function
+     */
+    constructor(id, wrapperFn) {
+        super();
+        this.id = id;
+        if (wrapperFn !== undefined) {
+            this.wrapperFn = wrapperFn;
+        }
+        return this;
+    }
+    /**
+     * Used to get root element of the Colorpicker component
+     */
+    getElement() {
+        return this.selector('#' + this.id);
+    }
+    getSplitButtonElement() {
+        return this.selector('#' + this.id + '_dropdownbtn');
+    }
+    getSplitButtonPopupElement() {
+        return this.selector('#' + this.id + '_dropdownbtn_popup');
+    }
+    setModel(property, value) {
+        let cy;
+        return cy.get('#' + this.id).then((ele) => {
+            return ele[0].ej2_instances[0][property] = value;
+        });
+    }
+    getModel(property) {
+        let cy;
+        return cy.get('#' + this.id).then((ele) => {
+            return ele[0].ej2_instances[0][property];
+        });
+    }
+    invoke(fName, args = []) {
+        let cy;
+        return cy.get('#' + this.id).then((ele) => {
+            var inst = ele[0].ej2_instances[0];
+            return inst[fName].apply(inst, args);
+        });
+    }
+}
+exports.ColorpickerHelper = ColorpickerHelper;

package/package.json

@@ -1,8 +1,8 @@
 {
   "_from": "@syncfusion/ej2-inputs@*",
-  "_id": "@syncfusion/ej2-inputs@19.2.59",
+  "_id": "@syncfusion/ej2-inputs@19.3.47",
   "_inBundle": false,
-  "_integrity": "sha512-F+MxMdBzVz8bU2KJkCiOXcSV2wvi/xpHbEwW3JkD1vFfws/5KGm/nw4HcY36e1rVWzIe5YCBTNsw/6dhRJon9g==",
+  "_integrity": "sha512-BUXgFj1vRssJASTKICmjSiFogsKI8UryrRI+GhyvlJcHU/KdRLokVdlPa1SrEdcjDdNn06sB7vQEMOFA2msSPQ==",
   "_location": "/@syncfusion/ej2-inputs",
   "_phantomChildren": {},
   "_requested": {
@@ -38,8 +38,8 @@
     "/@syncfusion/ej2-schedule",
     "/@syncfusion/ej2-vue-inputs"
   ],
-  "_resolved": "http://nexus.syncfusion.com/repository/ej2-hotfix/@syncfusion/ej2-inputs/-/ej2-inputs-19.2.59.tgz",
-  "_shasum": "e2e52114c5a21395e28b9d270e9cc62bd7afbd54",
+  "_resolved": "http://nexus.syncfusion.com/repository/ej2-hotfix/@syncfusion/ej2-inputs/-/ej2-inputs-19.3.47.tgz",
+  "_shasum": "4af02f0dd9c7704862297cf9c8865c6a9a5e07b1",
   "_spec": "@syncfusion/ej2-inputs@*",
   "_where": "/jenkins/workspace/automation_release_19.1.0.1-ZPMUBNQ6AUYH6YGEFBPVYMEQLRRW2SLD4XCZ6GATNZJFYJ3RIAOA/packages/included",
   "author": {
@@ -47,10 +47,10 @@
   },
   "bundleDependencies": false,
   "dependencies": {
-    "@syncfusion/ej2-base": "~19.2.60",
-    "@syncfusion/ej2-buttons": "~19.2.60",
-    "@syncfusion/ej2-popups": "~19.2.60",
-    "@syncfusion/ej2-splitbuttons": "~19.2.60"
+    "@syncfusion/ej2-base": "~19.3.47",
+    "@syncfusion/ej2-buttons": "~19.3.44",
+    "@syncfusion/ej2-popups": "~19.3.47",
+    "@syncfusion/ej2-splitbuttons": "~19.3.48"
   },
   "deprecated": false,
   "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.",
@@ -118,6 +118,6 @@
     "url": "https://github.com/syncfusion/ej2-javascript-ui-controls/tree/master/controls/inputs"
   },
   "typings": "index.d.ts",
-  "version": "19.2.60",
+  "version": "19.3.48",
   "sideEffects": false
 }

package/src/color-picker/color-picker-model.d.ts

@@ -92,6 +92,13 @@ export interface ColorPickerModel extends ComponentModel{
      */
     enableOpacity?: boolean;
 
+    /**
+    * Specifies the popup element creation on open.
+    *
+    * @default false
+    */
+    createPopupOnClick?: boolean;
+
     /**
      * Triggers while selecting the color in picker / palette, when showButtons property is enabled.
      *

package/src/color-picker/color-picker.d.ts

@@ -108,6 +108,12 @@ export declare class ColorPicker extends Component<HTMLInputElement> implements
      * @default true
      */
     enableOpacity: boolean;
+    /**
+    * Specifies the popup element creation on open.
+    *
+    * @default false
+    */
+    createPopupOnClick: boolean;
     /**
      * Triggers while selecting the color in picker / palette, when showButtons property is enabled.
      *

package/src/color-picker/color-picker.js

@@ -188,6 +188,7 @@ var ColorPicker = /** @class */ (function (_super) {
             target: this.container,
             disabled: this.disabled,
             enableRtl: this.enableRtl,
+            createPopupOnClick: this.createPopupOnClick,
             open: this.onOpen.bind(this),
             click: function () {
                 _this.trigger('change', {
@@ -1335,7 +1336,12 @@ var ColorPicker = /** @class */ (function (_super) {
         if (!this.showButtons && !isKey) {
             this.trigger('change', { currentValue: { hex: hex, rgba: rgba },
                 previousValue: { hex: this.value.slice(0, 7), rgba: this.convertToRgbString(this.hexToRgb(this.value)) }, value: cValue });
-            this.setProperties({ 'value': cValue }, true);
+            if (this.enableOpacity) {
+                this.setProperties({ 'value': cValue }, true);
+            }
+            else {
+                this.setProperties({ 'value': hex }, true);
+            }
             this.element.value = hex ? hex : '#000000';
         }
         else {
@@ -1857,6 +1863,9 @@ var ColorPicker = /** @class */ (function (_super) {
     __decorate([
         Property(true)
     ], ColorPicker.prototype, "enableOpacity", void 0);
+    __decorate([
+        Property(false)
+    ], ColorPicker.prototype, "createPopupOnClick", void 0);
     __decorate([
         Event()
     ], ColorPicker.prototype, "select", void 0);

package/src/maskedtextbox/base/mask-base.js

@@ -180,7 +180,7 @@ export function bindClearEvent() {
 }
 function resetHandler(e) {
     e.preventDefault();
-    if (!this.inputObj.clearButton.classList.contains('e-clear-icon-hide')) {
+    if (!this.inputObj.clearButton.classList.contains('e-clear-icon-hide') || (this.inputObj.container.classList.contains('e-static-clear'))) {
         clear.call(this, e);
         this.value = '';
     }

package/src/maskedtextbox/maskedtextbox/maskedtextbox-model.d.ts

@@ -1,4 +1,4 @@
-import { Component, Event, Property, EmitType, NotifyPropertyChanges, INotifyPropertyChanged, BaseEventArgs } from '@syncfusion/ej2-base';import { isNullOrUndefined, formatUnit, getValue, setValue, addClass, detach } from '@syncfusion/ej2-base';import { removeClass , Browser, closest, isBlazor} from '@syncfusion/ej2-base';import { Input, InputObject, FloatLabelType } from '../../input/input';import { regularExpressions, createMask, applyMask, wireEvents, unwireEvents, unstrippedValue, strippedValue } from '../base/index';import { setMaskValue, MaskUndo, setElementValue, bindClearEvent } from '../base/index';import { maskInputBlurHandler } from '../base/mask-base';
+import { Component, Event, Property, EmitType, NotifyPropertyChanges, INotifyPropertyChanged, BaseEventArgs } from '@syncfusion/ej2-base';import { isNullOrUndefined, formatUnit, getValue, setValue, addClass, detach } from '@syncfusion/ej2-base';import { removeClass , Browser, closest} from '@syncfusion/ej2-base';import { Input, InputObject, FloatLabelType } from '../../input/input';import { regularExpressions, createMask, applyMask, wireEvents, unwireEvents, unstrippedValue, strippedValue } from '../base/index';import { setMaskValue, MaskUndo, setElementValue, bindClearEvent } from '../base/index';import { maskInputBlurHandler } from '../base/mask-base';
 import {MaskChangeEventArgs,MaskFocusEventArgs,MaskBlurEventArgs} from "./maskedtextbox";
 import {ComponentModel} from '@syncfusion/ej2-base';
 
@@ -132,7 +132,6 @@ export interface MaskedTextBoxModel extends ComponentModel{
      * Triggers when the MaskedTextBox component is created.
      *
      * @event created
-     * @blazorProperty 'Created'
      */
     created?: EmitType<Object>;
 
@@ -140,7 +139,6 @@ export interface MaskedTextBoxModel extends ComponentModel{
      * Triggers when the MaskedTextBox component is destroyed.
      *
      * @event destroyed
-     * @blazorProperty 'Destroyed'
      */
     destroyed?: EmitType<Object>;
 
@@ -148,7 +146,6 @@ export interface MaskedTextBoxModel extends ComponentModel{
      * Triggers when the value of the MaskedTextBox changes.
      *
      * @event change
-     * @blazorProperty 'ValueChange'
      */
     change?: EmitType <MaskChangeEventArgs>;
 

package/src/maskedtextbox/maskedtextbox/maskedtextbox.d.ts

@@ -155,21 +155,18 @@ export declare class MaskedTextBox extends Component<HTMLInputElement> implement
      * Triggers when the MaskedTextBox component is created.
      *
      * @event created
-     * @blazorProperty 'Created'
      */
     created: EmitType<Object>;
     /**
      * Triggers when the MaskedTextBox component is destroyed.
      *
      * @event destroyed
-     * @blazorProperty 'Destroyed'
      */
     destroyed: EmitType<Object>;
     /**
      * Triggers when the value of the MaskedTextBox changes.
      *
      * @event change
-     * @blazorProperty 'ValueChange'
      */
     change: EmitType<MaskChangeEventArgs>;
     /**

package/src/maskedtextbox/maskedtextbox/maskedtextbox.js

@@ -19,7 +19,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 };
 import { Component, Event, Property, NotifyPropertyChanges } from '@syncfusion/ej2-base';
 import { isNullOrUndefined, formatUnit, getValue, setValue, addClass, detach } from '@syncfusion/ej2-base';
-import { removeClass, Browser, closest, isBlazor } from '@syncfusion/ej2-base';
+import { removeClass, Browser, closest } from '@syncfusion/ej2-base';
 import { Input } from '../../input/input';
 import { regularExpressions, createMask, applyMask, wireEvents, unwireEvents, unstrippedValue, strippedValue } from '../base/index';
 import { setMaskValue, setElementValue, bindClearEvent } from '../base/index';
@@ -133,9 +133,7 @@ var MaskedTextBox = /** @class */ (function (_super) {
      * @private
      */
     MaskedTextBox.prototype.render = function () {
-        var _this = this;
         if (this.element.tagName.toLowerCase() === 'input') {
-            var checkBlazor = isBlazor() && this.isServerRendered;
             if (this.floatLabelType === 'Never') {
                 addClass([this.element], INPUT);
             }
@@ -145,14 +143,7 @@ var MaskedTextBox = /** @class */ (function (_super) {
                 this.element.setAttribute('name', this.element.id);
             }
             this.isInitial = true;
-            if (checkBlazor && Browser.isIE === true) {
-                setTimeout(function () {
-                    _this.resetMaskedTextBox();
-                });
-            }
-            else {
-                this.resetMaskedTextBox();
-            }
+            this.resetMaskedTextBox();
             this.isInitial = false;
             this.setMaskPlaceholder(true, false);
             this.setWidth(this.width);

package/src/numerictextbox/numerictextbox-model.d.ts

@@ -1,4 +1,4 @@
-import { Component, EventHandler, Property, Event, Browser, L10n, EmitType } from '@syncfusion/ej2-base';import { NotifyPropertyChanges, INotifyPropertyChanged, BaseEventArgs } from '@syncfusion/ej2-base';import { attributes, addClass, removeClass, detach, closest } from '@syncfusion/ej2-base';import { isNullOrUndefined, getValue, formatUnit, setValue, merge } from '@syncfusion/ej2-base';import { Internationalization, NumberFormatOptions, getNumericObject, isBlazor } from '@syncfusion/ej2-base';import { Input, InputObject, FloatLabelType } from '../input/input';
+import { Component, EventHandler, Property, Event, Browser, L10n, EmitType } from '@syncfusion/ej2-base';import { NotifyPropertyChanges, INotifyPropertyChanged, BaseEventArgs } from '@syncfusion/ej2-base';import { attributes, addClass, removeClass, detach, closest } from '@syncfusion/ej2-base';import { isNullOrUndefined, getValue, formatUnit, setValue, merge } from '@syncfusion/ej2-base';import { Internationalization, NumberFormatOptions, getNumericObject } from '@syncfusion/ej2-base';import { Input, InputObject, FloatLabelType } from '../input/input';
 import {ChangeEventArgs,NumericFocusEventArgs,NumericBlurEventArgs} from "./numerictextbox";
 import {ComponentModel} from '@syncfusion/ej2-base';
 
@@ -32,7 +32,6 @@ export interface NumericTextBoxModel extends ComponentModel{
      * @default null
      * @aspType object
      * @isGenericType true
-     * @blazorDefaultValue SfBase.GetNumericValue<TValue>("MinValue")
 
      */
     min?: number;
@@ -45,7 +44,6 @@ export interface NumericTextBoxModel extends ComponentModel{
      * @default null
      * @aspType object
      * @isGenericType true
-     * @blazorDefaultValue SfBase.GetNumericValue<TValue>("MaxValue")
 
      */
     max?: number;
@@ -57,7 +55,6 @@ export interface NumericTextBoxModel extends ComponentModel{
      *
      * @default 1
      * @isGenericType true
-     * @blazorDefaultValue SfBase.GetNumericValue<TValue>("Step")
      */
     step?: number;
 
@@ -137,9 +134,6 @@ export interface NumericTextBoxModel extends ComponentModel{
      * [decimals](../../numerictextbox/formats/#precision-of-numbers).
      *
      * @default null
-     * @isBlazorNullableType true
-     * @blazorDefaultValue
-     * @blazorType int
      */
     decimals?: number;
 
@@ -195,7 +189,6 @@ export interface NumericTextBoxModel extends ComponentModel{
      * Triggers when the NumericTextBox component is created.
      *
      * @event created
-     * @blazorProperty 'Created'
      */
     created?: EmitType<Object>;
 
@@ -203,7 +196,6 @@ export interface NumericTextBoxModel extends ComponentModel{
      * Triggers when the NumericTextBox component is destroyed.
      *
      * @event destroyed
-     * @blazorProperty 'Destroyed'
      */
     destroyed?: EmitType<Object>;
 
@@ -211,7 +203,6 @@ export interface NumericTextBoxModel extends ComponentModel{
      * Triggers when the value of the NumericTextBox changes.
      *
      * @event change
-     * @blazorProperty 'ValueChange'
      */
     change?: EmitType<ChangeEventArgs>;
 

package/src/numerictextbox/numerictextbox.d.ts

@@ -74,7 +74,6 @@ export declare class NumericTextBox extends Component<HTMLInputElement> implemen
      * @default null
      * @aspType object
      * @isGenericType true
-     * @blazorDefaultValue SfBase.GetNumericValue<TValue>("MinValue")
 
      */
     min: number;
@@ -86,7 +85,6 @@ export declare class NumericTextBox extends Component<HTMLInputElement> implemen
      * @default null
      * @aspType object
      * @isGenericType true
-     * @blazorDefaultValue SfBase.GetNumericValue<TValue>("MaxValue")
 
      */
     max: number;
@@ -97,7 +95,6 @@ export declare class NumericTextBox extends Component<HTMLInputElement> implemen
      *
      * @default 1
      * @isGenericType true
-     * @blazorDefaultValue SfBase.GetNumericValue<TValue>("Step")
      */
     step: number;
     /**
@@ -169,9 +166,6 @@ export declare class NumericTextBox extends Component<HTMLInputElement> implemen
      * [decimals](../../numerictextbox/formats/#precision-of-numbers).
      *
      * @default null
-     * @isBlazorNullableType true
-     * @blazorDefaultValue
-     * @blazorType int
      */
     decimals: number;
     /**
@@ -221,21 +215,18 @@ export declare class NumericTextBox extends Component<HTMLInputElement> implemen
      * Triggers when the NumericTextBox component is created.
      *
      * @event created
-     * @blazorProperty 'Created'
      */
     created: EmitType<Object>;
     /**
      * Triggers when the NumericTextBox component is destroyed.
      *
      * @event destroyed
-     * @blazorProperty 'Destroyed'
      */
     destroyed: EmitType<Object>;
     /**
      * Triggers when the value of the NumericTextBox changes.
      *
      * @event change
-     * @blazorProperty 'ValueChange'
      */
     change: EmitType<ChangeEventArgs>;
     /**

package/src/numerictextbox/numerictextbox.js

@@ -21,7 +21,7 @@ import { Component, EventHandler, Property, Event, Browser, L10n } from '@syncfu
 import { NotifyPropertyChanges } from '@syncfusion/ej2-base';
 import { attributes, addClass, removeClass, detach, closest } from '@syncfusion/ej2-base';
 import { isNullOrUndefined, getValue, formatUnit, setValue, merge } from '@syncfusion/ej2-base';
-import { Internationalization, getNumericObject, isBlazor } from '@syncfusion/ej2-base';
+import { Internationalization, getNumericObject } from '@syncfusion/ej2-base';
 import { Input } from '../input/input';
 var ROOT = 'e-control-wrapper e-numeric';
 var SPINICON = 'e-input-group-icon';
@@ -96,15 +96,13 @@ var NumericTextBox = /** @class */ (function (_super) {
             this.element = input;
             setValue('ej2_instances', ejInstance, this.element);
         }
-        if (!(isBlazor() && this.isServerRendered)) {
-            attributes(this.element, { 'role': 'spinbutton', 'tabindex': '0', 'autocomplete': 'off', 'aria-live': 'assertive' });
-            var localeText = {
-                incrementTitle: 'Increment value', decrementTitle: 'Decrement value', placeholder: this.placeholder
-            };
-            this.l10n = new L10n('numerictextbox', localeText, this.locale);
-            if (this.l10n.getConstant('placeholder') !== '') {
-                this.setProperties({ placeholder: this.placeholder || this.l10n.getConstant('placeholder') }, true);
-            }
+        attributes(this.element, { 'role': 'spinbutton', 'tabindex': '0', 'autocomplete': 'off', 'aria-live': 'assertive' });
+        var localeText = {
+            incrementTitle: 'Increment value', decrementTitle: 'Decrement value', placeholder: this.placeholder
+        };
+        this.l10n = new L10n('numerictextbox', localeText, this.locale);
+        if (this.l10n.getConstant('placeholder') !== '') {
+            this.setProperties({ placeholder: this.placeholder || this.l10n.getConstant('placeholder') }, true);
         }
         this.isValidState = true;
         this.inputStyle = null;
@@ -113,16 +111,14 @@ var NumericTextBox = /** @class */ (function (_super) {
         this.initCultureInfo();
         this.initCultureFunc();
         this.prevValue = this.value;
-        if (!(isBlazor() && this.isServerRendered)) {
-            this.updateHTMLAttrToElement();
-            this.checkAttributes(false);
-            if (this.formEle) {
-                this.inputEleValue = this.value;
-            }
+        this.updateHTMLAttrToElement();
+        this.checkAttributes(false);
+        if (this.formEle) {
+            this.inputEleValue = this.value;
         }
         this.validateMinMax();
         this.validateStep();
-        if (this.placeholder === null && !(isBlazor() && this.isServerRendered)) {
+        if (this.placeholder === null) {
             this.updatePlaceholder();
         }
     };
@@ -134,47 +130,26 @@ var NumericTextBox = /** @class */ (function (_super) {
      */
     NumericTextBox.prototype.render = function () {
         if (this.element.tagName.toLowerCase() === 'input') {
-            if (!(isBlazor() && this.isServerRendered)) {
-                this.createWrapper();
-                if (this.showSpinButton) {
-                    this.spinBtnCreation();
-                }
-                this.setElementWidth(this.width);
-                if (!this.container.classList.contains('e-input-group')) {
-                    this.container.classList.add('e-input-group');
-                }
-                this.changeValue(this.value === null || isNaN(this.value) ?
-                    null : this.strictMode ? this.trimValue(this.value) : this.value);
+            this.createWrapper();
+            if (this.showSpinButton) {
+                this.spinBtnCreation();
             }
-            else {
-                this.container = this.element.parentElement;
-                this.inputWrapper = { container: this.container };
-                this.hiddenInput = this.container.querySelector('input[type="hidden"]');
-                if (this.showClearButton) {
-                    this.inputWrapper.clearButton = this.container.querySelector('.e-clear-icon');
-                    Input.wireClearBtnEvents(this.element, this.inputWrapper.clearButton, this.inputWrapper.container);
-                }
-                if (this.showSpinButton) {
-                    this.spinDown = this.container.querySelector('.' + SPINDOWN);
-                    this.spinUp = this.container.querySelector('.' + SPINUP);
-                    this.wireSpinBtnEvents();
-                }
-                Input.bindInitialEvent({
-                    element: this.element, buttons: null, customTag: null, floatLabelType: this.floatLabelType, properties: this.properties
-                });
+            this.setElementWidth(this.width);
+            if (!this.container.classList.contains('e-input-group')) {
+                this.container.classList.add('e-input-group');
             }
+            this.changeValue(this.value === null || isNaN(this.value) ?
+                null : this.strictMode ? this.trimValue(this.value) : this.value);
             this.wireEvents();
-            if (!(isBlazor() && this.isServerRendered)) {
-                if (this.value !== null && !isNaN(this.value)) {
-                    if (this.decimals) {
-                        this.setProperties({ value: this.roundNumber(this.value, this.decimals) }, true);
-                    }
-                }
-                if (this.element.getAttribute('value') || this.value) {
-                    this.element.setAttribute('value', this.element.value);
-                    this.hiddenInput.setAttribute('value', this.hiddenInput.value);
+            if (this.value !== null && !isNaN(this.value)) {
+                if (this.decimals) {
+                    this.setProperties({ value: this.roundNumber(this.value, this.decimals) }, true);
                 }
             }
+            if (this.element.getAttribute('value') || this.value) {
+                this.element.setAttribute('value', this.element.value);
+                this.hiddenInput.setAttribute('value', this.hiddenInput.value);
+            }
             this.elementPrevValue = this.element.value;
             if (this.element.hasAttribute('data-val')) {
                 this.element.setAttribute('data-val', 'false');
@@ -441,7 +416,7 @@ var NumericTextBox = /** @class */ (function (_super) {
     };
     NumericTextBox.prototype.resetHandler = function (e) {
         e.preventDefault();
-        if (!(this.inputWrapper.clearButton.classList.contains('e-clear-icon-hide'))) {
+        if (!(this.inputWrapper.clearButton.classList.contains('e-clear-icon-hide')) || this.inputWrapper.container.classList.contains('e-static-clear')) {
             this.clear(e);
         }
         this.isInteract = true;
@@ -1089,25 +1064,23 @@ var NumericTextBox = /** @class */ (function (_super) {
      */
     NumericTextBox.prototype.destroy = function () {
         this.unwireEvents();
-        if (!(isBlazor() && this.isServerRendered)) {
-            detach(this.hiddenInput);
-            if (this.showSpinButton) {
-                this.unwireSpinBtnEvents();
-                detach(this.spinUp);
-                detach(this.spinDown);
-            }
-            var attrArray = ['aria-labelledby', 'role', 'autocomplete', 'aria-readonly',
-                'autocorrect', 'aria-disabled', 'aria-placeholder', 'autocapitalize',
-                'spellcheck', 'aria-autocomplete', 'tabindex', 'aria-valuemin',
-                'aria-valuemax', 'aria-live', 'aria-valuenow', 'aria-invalid'];
-            for (var i = 0; i < attrArray.length; i++) {
-                this.element.removeAttribute(attrArray[i]);
-            }
-            this.element.classList.remove('e-input');
-            this.container.insertAdjacentElement('afterend', this.element);
-            detach(this.container);
-            _super.prototype.destroy.call(this);
-        }
+        detach(this.hiddenInput);
+        if (this.showSpinButton) {
+            this.unwireSpinBtnEvents();
+            detach(this.spinUp);
+            detach(this.spinDown);
+        }
+        var attrArray = ['aria-labelledby', 'role', 'autocomplete', 'aria-readonly',
+            'autocorrect', 'aria-disabled', 'aria-placeholder', 'autocapitalize',
+            'spellcheck', 'aria-autocomplete', 'tabindex', 'aria-valuemin',
+            'aria-valuemax', 'aria-live', 'aria-valuenow', 'aria-invalid'];
+        for (var i = 0; i < attrArray.length; i++) {
+            this.element.removeAttribute(attrArray[i]);
+        }
+        this.element.classList.remove('e-input');
+        this.container.insertAdjacentElement('afterend', this.element);
+        detach(this.container);
+        _super.prototype.destroy.call(this);
     };
     /* eslint-disable valid-jsdoc, jsdoc/require-returns */
     /**
@@ -1261,33 +1234,16 @@ var NumericTextBox = /** @class */ (function (_super) {
         }
     };
     NumericTextBox.prototype.updateClearButton = function (newProp) {
-        if (isBlazor()) {
-            if (this.showClearButton) {
-                this.inputWrapper.clearButton = this.container.querySelector('.e-clear-icon');
-                Input.wireClearBtnEvents(this.element, this.inputWrapper.clearButton, this.inputWrapper.container);
-            }
-        }
-        else {
-            Input.setClearButton(newProp.showClearButton, this.element, this.inputWrapper, undefined, this.createElement);
-            this.bindClearEvent();
-        }
+        Input.setClearButton(newProp.showClearButton, this.element, this.inputWrapper, undefined, this.createElement);
+        this.bindClearEvent();
     };
     NumericTextBox.prototype.updateSpinButton = function (newProp) {
-        if (isBlazor()) {
-            if (this.showSpinButton) {
-                this.spinDown = this.container.querySelector('.' + SPINDOWN);
-                this.spinUp = this.container.querySelector('.' + SPINUP);
-                this.wireSpinBtnEvents();
-            }
+        if (newProp.showSpinButton) {
+            this.spinBtnCreation();
         }
         else {
-            if (newProp.showSpinButton) {
-                this.spinBtnCreation();
-            }
-            else {
-                detach(this.spinUp);
-                detach(this.spinDown);
-            }
+            detach(this.spinUp);
+            detach(this.spinDown);
         }
     };
     /**

package/src/slider/slider.d.ts

@@ -285,6 +285,7 @@ export declare class Slider extends Component<HTMLElement> implements INotifyPro
     private isBootstrap;
     private isBootstrap4;
     private isTailwind;
+    private isBootstrap5;
     private zIndex;
     private l10n;
     private internationalization;