@syncfusion/ej2-inputs 19.2.60 → 19.3.48

package/src/slider/slider.js

@@ -308,11 +308,19 @@ var Slider = /** @class */ (function (_super) {
      * @private
      */
     Slider.prototype.render = function () {
+        var _this = this;
         this.initialize();
         this.initRender();
         this.wireEvents();
         this.setZindex();
         this.renderComplete();
+        if (this.element.tagName === 'EJS-SLIDER') {
+            if (this.getTheme(this.sliderContainer) == "none") {
+                setTimeout(function () {
+                    _this.refresh();
+                }, 0);
+            }
+        }
     };
     Slider.prototype.initialize = function () {
         addClass([this.element], classNames.root);
@@ -431,6 +439,7 @@ var Slider = /** @class */ (function (_super) {
             || this.getTheme(this.sliderContainer) === 'bootstrap-dark';
         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.isMaterialTooltip = this.isMaterial && this.type !== 'Range' && this.tooltip.isVisible;
     };
     Slider.prototype.createRangeBar = function () {
@@ -921,7 +930,7 @@ var Slider = /** @class */ (function (_super) {
     };
     Slider.prototype.renderTooltip = function () {
         this.tooltipObj = new Tooltip({
-            showTipPointer: this.isBootstrap || this.isMaterial || this.isBootstrap4 || this.isTailwind,
+            showTipPointer: this.isBootstrap || this.isMaterial || this.isBootstrap4 || this.isTailwind || this.isBootstrap5,
             cssClass: classNames.sliderTooltip,
             height: this.isMaterial ? 30 : 'auto',
             animation: { open: { effect: 'None' }, close: { effect: 'FadeOut', duration: 500 } },

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

@@ -1,4 +1,4 @@
-import { Component, Property, Event, EmitType, EventHandler, L10n, setValue, getValue, isNullOrUndefined } from '@syncfusion/ej2-base';import { NotifyPropertyChanges, INotifyPropertyChanged, detach, Internationalization, getUniqueID, closest } from '@syncfusion/ej2-base';import { addClass, removeClass, isBlazor } from '@syncfusion/ej2-base';import { FloatLabelType, Input, InputObject } from '../input/input';
+import { Component, Property, Event, EmitType, EventHandler, L10n, setValue, getValue, isNullOrUndefined } from '@syncfusion/ej2-base';import { NotifyPropertyChanges, INotifyPropertyChanged, detach, Internationalization, getUniqueID, closest } from '@syncfusion/ej2-base';import { addClass, removeClass } from '@syncfusion/ej2-base';import { FloatLabelType, Input, InputObject } from '../input/input';
 import {ChangedEventArgs,FocusOutEventArgs,FocusInEventArgs,InputEventArgs} from "./textbox";
 import {ComponentModel} from '@syncfusion/ej2-base';
 
@@ -114,7 +114,6 @@ export interface TextBoxModel extends ComponentModel{
      * Triggers when the TextBox component is created.
      *
      * @event created
-     * @blazorProperty 'Created'
      */
     created?: EmitType<Object>;
 
@@ -122,7 +121,6 @@ export interface TextBoxModel extends ComponentModel{
      * Triggers when the TextBox component is destroyed.
      *
      * @event destroyed
-     * @blazorProperty 'Destroyed'
      */
     destroyed?: EmitType<Object>;
 
@@ -130,7 +128,6 @@ export interface TextBoxModel extends ComponentModel{
      * Triggers when the content of TextBox has changed and gets focus-out.
      *
      * @event change
-     * @blazorProperty 'ValueChange'
      */
     change?: EmitType<ChangedEventArgs>;
 

package/src/textbox/textbox.d.ts

@@ -155,21 +155,18 @@ export declare class TextBox extends Component<HTMLInputElement | HTMLTextAreaEl
      * Triggers when the TextBox component is created.
      *
      * @event created
-     * @blazorProperty 'Created'
      */
     created: EmitType<Object>;
     /**
      * Triggers when the TextBox component is destroyed.
      *
      * @event destroyed
-     * @blazorProperty 'Destroyed'
      */
     destroyed: EmitType<Object>;
     /**
      * Triggers when the content of TextBox has changed and gets focus-out.
      *
      * @event change
-     * @blazorProperty 'ValueChange'
      */
     change: EmitType<ChangedEventArgs>;
     /**

package/src/textbox/textbox.js

@@ -19,7 +19,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 };
 import { Component, Property, Event, EventHandler, L10n, setValue, getValue, isNullOrUndefined } from '@syncfusion/ej2-base';
 import { NotifyPropertyChanges, detach, Internationalization, getUniqueID, closest } from '@syncfusion/ej2-base';
-import { addClass, removeClass, isBlazor } from '@syncfusion/ej2-base';
+import { addClass, removeClass } from '@syncfusion/ej2-base';
 import { Input } from '../input/input';
 var HIDE_CLEAR = 'e-clear-icon-hide';
 var TEXTBOX_FOCUS = 'e-input-focus';
@@ -165,72 +165,70 @@ var TextBox = /** @class */ (function (_super) {
         return (!str || /^\s*$/.test(str));
     };
     TextBox.prototype.preRender = function () {
-        if (!(isBlazor() && this.isServerRendered)) {
-            this.cloneElement = this.element.cloneNode(true);
-            this.formElement = closest(this.element, 'form');
-            if (!isNullOrUndefined(this.formElement)) {
-                this.isForm = true;
-            }
-            /* istanbul ignore next */
-            if (this.element.tagName === 'EJS-TEXTBOX') {
-                var ejInstance = getValue('ej2_instances', this.element);
-                var inputElement = this.multiline ?
-                    this.createElement('textarea') :
-                    this.createElement('input');
-                var index = 0;
-                for (index; index < this.element.attributes.length; index++) {
-                    var attributeName = this.element.attributes[index].nodeName;
-                    if (attributeName !== 'id') {
-                        inputElement.setAttribute(attributeName, this.element.attributes[index].nodeValue);
-                        inputElement.innerHTML = this.element.innerHTML;
-                        if (attributeName === 'name') {
-                            this.element.removeAttribute('name');
-                        }
+        this.cloneElement = this.element.cloneNode(true);
+        this.formElement = closest(this.element, 'form');
+        if (!isNullOrUndefined(this.formElement)) {
+            this.isForm = true;
+        }
+        /* istanbul ignore next */
+        if (this.element.tagName === 'EJS-TEXTBOX') {
+            var ejInstance = getValue('ej2_instances', this.element);
+            var inputElement = this.multiline ?
+                this.createElement('textarea') :
+                this.createElement('input');
+            var index = 0;
+            for (index; index < this.element.attributes.length; index++) {
+                var attributeName = this.element.attributes[index].nodeName;
+                if (attributeName !== 'id') {
+                    inputElement.setAttribute(attributeName, this.element.attributes[index].nodeValue);
+                    inputElement.innerHTML = this.element.innerHTML;
+                    if (attributeName === 'name') {
+                        this.element.removeAttribute('name');
                     }
                 }
-                this.element.appendChild(inputElement);
-                this.element = inputElement;
-                setValue('ej2_instances', ejInstance, this.element);
-            }
-            this.updateHTMLAttrToElement();
-            this.checkAttributes(false);
-            if (this.element.tagName !== 'TEXTAREA') {
-                this.element.setAttribute('type', this.type);
-            }
-            this.element.setAttribute('role', 'textbox');
-            this.globalize = new Internationalization(this.locale);
-            var localeText = { placeholder: this.placeholder };
-            this.l10n = new L10n('textbox', localeText, this.locale);
-            if (this.l10n.getConstant('placeholder') !== '') {
-                this.setProperties({ placeholder: this.placeholder || this.l10n.getConstant('placeholder') }, true);
             }
-            if (!this.element.hasAttribute('id')) {
-                this.element.setAttribute('id', getUniqueID('textbox'));
-            }
-            if (!this.element.hasAttribute('name')) {
-                this.element.setAttribute('name', this.element.getAttribute('id'));
-            }
-            if (this.element.tagName === 'INPUT' && this.multiline) {
-                this.isHiddenInput = true;
-                this.textarea = this.createElement('textarea');
-                this.element.parentNode.insertBefore(this.textarea, this.element);
-                this.element.setAttribute('type', 'hidden');
-                this.textarea.setAttribute('name', this.element.getAttribute('name'));
-                this.element.removeAttribute('name');
-                this.textarea.setAttribute('role', this.element.getAttribute('role'));
-                this.element.removeAttribute('role');
-                this.textarea.setAttribute('id', getUniqueID('textarea'));
-                var apiAttributes = ['placeholder', 'disabled', 'value', 'readonly', 'type', 'autocomplete'];
-                for (var index = 0; index < this.element.attributes.length; index++) {
-                    var attributeName = this.element.attributes[index].nodeName;
-                    if (this.element.hasAttribute(attributeName) && containerAttr.indexOf(attributeName) < 0 &&
-                        !(attributeName === 'id' || attributeName === 'type' || attributeName === 'e-mappinguid')) {
-                        // e-mappinguid attribute is handled for Grid component.
-                        this.textarea.setAttribute(attributeName, this.element.attributes[index].nodeValue);
-                        if (apiAttributes.indexOf(attributeName) < 0) {
-                            this.element.removeAttribute(attributeName);
-                            index--;
-                        }
+            this.element.appendChild(inputElement);
+            this.element = inputElement;
+            setValue('ej2_instances', ejInstance, this.element);
+        }
+        this.updateHTMLAttrToElement();
+        this.checkAttributes(false);
+        if (this.element.tagName !== 'TEXTAREA') {
+            this.element.setAttribute('type', this.type);
+        }
+        this.element.setAttribute('role', 'textbox');
+        this.globalize = new Internationalization(this.locale);
+        var localeText = { placeholder: this.placeholder };
+        this.l10n = new L10n('textbox', localeText, this.locale);
+        if (this.l10n.getConstant('placeholder') !== '') {
+            this.setProperties({ placeholder: this.placeholder || this.l10n.getConstant('placeholder') }, true);
+        }
+        if (!this.element.hasAttribute('id')) {
+            this.element.setAttribute('id', getUniqueID('textbox'));
+        }
+        if (!this.element.hasAttribute('name')) {
+            this.element.setAttribute('name', this.element.getAttribute('id'));
+        }
+        if (this.element.tagName === 'INPUT' && this.multiline) {
+            this.isHiddenInput = true;
+            this.textarea = this.createElement('textarea');
+            this.element.parentNode.insertBefore(this.textarea, this.element);
+            this.element.setAttribute('type', 'hidden');
+            this.textarea.setAttribute('name', this.element.getAttribute('name'));
+            this.element.removeAttribute('name');
+            this.textarea.setAttribute('role', this.element.getAttribute('role'));
+            this.element.removeAttribute('role');
+            this.textarea.setAttribute('id', getUniqueID('textarea'));
+            var apiAttributes = ['placeholder', 'disabled', 'value', 'readonly', 'type', 'autocomplete'];
+            for (var index = 0; index < this.element.attributes.length; index++) {
+                var attributeName = this.element.attributes[index].nodeName;
+                if (this.element.hasAttribute(attributeName) && containerAttr.indexOf(attributeName) < 0 &&
+                    !(attributeName === 'id' || attributeName === 'type' || attributeName === 'e-mappinguid')) {
+                    // e-mappinguid attribute is handled for Grid component.
+                    this.textarea.setAttribute(attributeName, this.element.attributes[index].nodeValue);
+                    if (apiAttributes.indexOf(attributeName) < 0) {
+                        this.element.removeAttribute(attributeName);
+                        index--;
                     }
                 }
             }
@@ -293,37 +291,22 @@ var TextBox = /** @class */ (function (_super) {
         if (!isNullOrUndefined(this.cssClass) && this.cssClass !== '') {
             updatedCssClassValue = this.getInputValidClassList(this.cssClass);
         }
-        if (!(isBlazor() && this.isServerRendered)) {
-            this.respectiveElement = (this.isHiddenInput) ? this.textarea : this.element;
-            this.textboxWrapper = Input.createInput({
-                element: this.respectiveElement,
-                floatLabelType: this.floatLabelType,
-                properties: {
-                    enabled: this.enabled,
-                    enableRtl: this.enableRtl,
-                    cssClass: updatedCssClassValue,
-                    readonly: this.readonly,
-                    placeholder: this.placeholder,
-                    showClearButton: this.showClearButton
-                }
-            });
-            this.updateHTMLAttrToWrapper();
-            if (this.isHiddenInput) {
-                this.respectiveElement.parentNode.insertBefore(this.element, this.respectiveElement);
-            }
-        }
-        else {
-            this.respectiveElement = this.element;
-            this.textboxWrapper = { container: this.element.parentElement };
-            if (this.showClearButton && !this.multiline) {
-                this.textboxWrapper.clearButton = this.textboxWrapper.container.querySelector('.e-clear-icon');
-                Input.wireClearBtnEvents(this.respectiveElement, this.textboxWrapper.clearButton, this.textboxWrapper.container);
-            }
-            if (this.floatLabelType === 'Auto') {
-                Input.wireFloatingEvents(this.respectiveElement);
-            }
-            // eslint-disable-next-line max-len, @typescript-eslint/no-explicit-any
-            Input.bindInitialEvent({ element: this.respectiveElement, buttons: null, customTag: null, floatLabelType: this.floatLabelType, properties: this.properties });
+        this.respectiveElement = (this.isHiddenInput) ? this.textarea : this.element;
+        this.textboxWrapper = Input.createInput({
+            element: this.respectiveElement,
+            floatLabelType: this.floatLabelType,
+            properties: {
+                enabled: this.enabled,
+                enableRtl: this.enableRtl,
+                cssClass: updatedCssClassValue,
+                readonly: this.readonly,
+                placeholder: this.placeholder,
+                showClearButton: this.showClearButton
+            }
+        });
+        this.updateHTMLAttrToWrapper();
+        if (this.isHiddenInput) {
+            this.respectiveElement.parentNode.insertBefore(this.element, this.respectiveElement);
         }
         this.wireEvents();
         if (!isNullOrUndefined(this.value)) {
@@ -520,7 +503,7 @@ var TextBox = /** @class */ (function (_super) {
     };
     TextBox.prototype.resetInputHandler = function (event) {
         event.preventDefault();
-        if (!(this.textboxWrapper.clearButton.classList.contains(HIDE_CLEAR))) {
+        if (!(this.textboxWrapper.clearButton.classList.contains(HIDE_CLEAR)) || this.textboxWrapper.container.classList.contains('e-static-clear')) {
             Input.setValue('', this.respectiveElement, this.floatLabelType, this.showClearButton);
             if (this.isHiddenInput) {
                 this.element.value = this.respectiveElement.value;
@@ -560,25 +543,20 @@ var TextBox = /** @class */ (function (_super) {
      */
     TextBox.prototype.destroy = function () {
         this.unWireEvents();
-        if (!(isBlazor() && this.isServerRendered)) {
-            if (this.element.tagName === 'INPUT' && this.multiline) {
-                detach(this.textboxWrapper.container.getElementsByTagName('textarea')[0]);
-                this.respectiveElement = this.element;
-                this.element.removeAttribute('type');
-            }
-            this.respectiveElement.value = this.respectiveElement.defaultValue;
-            this.respectiveElement.classList.remove('e-input');
-            this.removeAttributes(['aria-placeholder', 'aria-disabled', 'aria-readonly', 'aria-labelledby']);
-            if (!isNullOrUndefined(this.textboxWrapper)) {
-                this.textboxWrapper.container.insertAdjacentElement('afterend', this.respectiveElement);
-                detach(this.textboxWrapper.container);
-            }
-            this.textboxWrapper = null;
-            _super.prototype.destroy.call(this);
+        if (this.element.tagName === 'INPUT' && this.multiline) {
+            detach(this.textboxWrapper.container.getElementsByTagName('textarea')[0]);
+            this.respectiveElement = this.element;
+            this.element.removeAttribute('type');
         }
-        else {
-            this.textboxWrapper = null;
+        this.respectiveElement.value = this.respectiveElement.defaultValue;
+        this.respectiveElement.classList.remove('e-input');
+        this.removeAttributes(['aria-placeholder', 'aria-disabled', 'aria-readonly', 'aria-labelledby']);
+        if (!isNullOrUndefined(this.textboxWrapper)) {
+            this.textboxWrapper.container.insertAdjacentElement('afterend', this.respectiveElement);
+            detach(this.textboxWrapper.container);
         }
+        this.textboxWrapper = null;
+        _super.prototype.destroy.call(this);
     };
     /**
      * Adding the icons to the TextBox component.

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

@@ -1,4 +1,4 @@
-import { Component, Property, Event, EmitType, EventHandler, L10n, compile, isNullOrUndefined} from '@syncfusion/ej2-base';import { NotifyPropertyChanges, INotifyPropertyChanged, detach, append, Animation } from '@syncfusion/ej2-base';import { addClass, removeClass, KeyboardEvents, KeyboardEventArgs, setValue, getValue, ChildProperty } from '@syncfusion/ej2-base';import { Collection, Complex, Browser, Ajax, BeforeSendEventArgs, getUniqueID, closest, remove } from '@syncfusion/ej2-base';import { createSpinner, showSpinner, hideSpinner } from '@syncfusion/ej2-popups';import { updateBlazorTemplate, resetBlazorTemplate, isBlazor, select, selectAll } from '@syncfusion/ej2-base';
+import { Component, Property, Event, EmitType, EventHandler, L10n, compile, isNullOrUndefined} from '@syncfusion/ej2-base';import { NotifyPropertyChanges, INotifyPropertyChanged, detach, append, Animation } from '@syncfusion/ej2-base';import { addClass, removeClass, KeyboardEvents, KeyboardEventArgs, setValue, getValue, ChildProperty } from '@syncfusion/ej2-base';import { Collection, Complex, Browser, Ajax, BeforeSendEventArgs, getUniqueID, closest, remove } from '@syncfusion/ej2-base';import { createSpinner, showSpinner, hideSpinner } from '@syncfusion/ej2-popups';import { select, selectAll } from '@syncfusion/ej2-base';
 import {DropEffect,ActionCompleteEventArgs,RenderingEventArgs,BeforeUploadEventArgs,FileListRenderingEventArgs,SelectedEventArgs,UploadingEventArgs,RemovingEventArgs,BeforeRemoveEventArgs,ClearingEventArgs,CancelEventArgs,PauseResumeEventArgs} from "./uploader";
 import {ComponentModel} from '@syncfusion/ej2-base';
 
@@ -270,7 +270,6 @@ export interface UploaderModel extends ComponentModel{
      * Triggers when the component is created.
      *
      * @event created
-     * @blazorProperty 'Created'
      */
     created?: EmitType<Object>;
 
@@ -278,7 +277,6 @@ export interface UploaderModel extends ComponentModel{
      * Triggers after all the selected files has processed to upload successfully or failed to server.
      *
      * @event actionComplete
-     * @blazorProperty 'OnActionComplete'
      */
     actionComplete?: EmitType<ActionCompleteEventArgs>;
 
@@ -294,7 +292,6 @@ export interface UploaderModel extends ComponentModel{
      * Triggers when the upload process before. This event is used to add additional parameter with upload request.
      *
      * @event beforeUpload
-     * @blazorProperty 'BeforeUpload'
      */
     beforeUpload?: EmitType<BeforeUploadEventArgs>;
 
@@ -303,7 +300,6 @@ export interface UploaderModel extends ComponentModel{
      * It helps to customize specific file item structure.
      *
      * @event fileListRendering
-     * @blazorProperty 'OnFileListRender'
      */
     fileListRendering?: EmitType<FileListRenderingEventArgs>;
 
@@ -311,7 +307,6 @@ export interface UploaderModel extends ComponentModel{
      * Triggers after selecting or dropping the files by adding the files in upload queue.
      *
      * @event selected
-     * @blazorProperty 'FileSelected'
      */
     selected?: EmitType<SelectedEventArgs>;
 
@@ -319,7 +314,6 @@ export interface UploaderModel extends ComponentModel{
      * Triggers when the upload process gets started. This event is used to add additional parameter with upload request.
      *
      * @event uploading
-     * @blazorProperty 'OnUploadStart'
      */
     uploading?: EmitType<UploadingEventArgs>;
 
@@ -350,8 +344,6 @@ export interface UploaderModel extends ComponentModel{
      * </table>
      *
      * @event success
-     * @blazorProperty 'Success'
-     * @blazorType SuccessEventArgs
      */
     success?: EmitType<Object>;
 
@@ -382,8 +374,6 @@ export interface UploaderModel extends ComponentModel{
      * </table>
      *
      * @event failure
-     * @blazorProperty 'OnFailured'
-     * @blazorType FailureEventArgs
      */
     failure?: EmitType<Object>;
 
@@ -391,7 +381,6 @@ export interface UploaderModel extends ComponentModel{
      * Triggers on removing the uploaded file. The event used to get confirm before removing the file from server.
      *
      * @event removing
-     * @blazorProperty 'OnRemove'
      */
     removing?: EmitType<RemovingEventArgs>;
 
@@ -399,7 +388,6 @@ export interface UploaderModel extends ComponentModel{
      * Triggers on remove the uploaded file. The event used to get confirm before remove the file from server.
      *
      * @event beforeRemove
-     * @blazorProperty 'BeforeRemove'
      */
     beforeRemove?: EmitType<BeforeRemoveEventArgs>;
 
@@ -407,7 +395,6 @@ export interface UploaderModel extends ComponentModel{
      * Triggers before clearing the items in file list when clicking “clear”.
      *
      * @event clearing
-     * @blazorProperty 'OnClear'
      */
     clearing?: EmitType<ClearingEventArgs>;
 
@@ -434,8 +421,6 @@ export interface UploaderModel extends ComponentModel{
      * </table>
      *
      * @event progress
-     * @blazorProperty 'Progressing'
-     * @blazorType ProgressEventArgs
      */
     progress?: EmitType<Object>;
 
@@ -458,8 +443,6 @@ export interface UploaderModel extends ComponentModel{
      * </table>
      *
      * @event change
-     * @blazorProperty 'ValueChange'
-     * @blazorType UploadChangeEventArgs
      */
     change?: EmitType<Object>;
 
@@ -490,8 +473,6 @@ export interface UploaderModel extends ComponentModel{
      * </table>
      *
      * @event chunkSuccess
-     * @blazorProperty 'OnChunkSuccess'
-     * @blazorType SuccessEventArgs
      */
     chunkSuccess?: EmitType<Object>;
 
@@ -530,8 +511,6 @@ export interface UploaderModel extends ComponentModel{
      * </table>
      *
      * @event chunkFailure
-     * @blazorProperty 'OnChunkFailured'
-     * @blazorType FailureEventArgs
      */
     chunkFailure?: EmitType<Object>;
 
@@ -539,7 +518,6 @@ export interface UploaderModel extends ComponentModel{
      * Fires when every chunk upload process gets started. This event is used to add additional parameter with upload request.
      *
      * @event chunkUploading
-     * @blazorProperty 'OnChunkUploadStart'
      */
     chunkUploading?: EmitType<UploadingEventArgs>;
 
@@ -547,7 +525,6 @@ export interface UploaderModel extends ComponentModel{
      * Fires if cancel the chunk file uploading.
      *
      * @event canceling
-     * @blazorProperty 'OnCancel'
      */
     canceling?: EmitType<CancelEventArgs>;
 
@@ -555,7 +532,6 @@ export interface UploaderModel extends ComponentModel{
      * Fires if pause the chunk file uploading.
      *
      * @event pausing
-     * @blazorProperty 'Paused'
      */
     pausing?: EmitType<PauseResumeEventArgs>;
 
@@ -563,7 +539,6 @@ export interface UploaderModel extends ComponentModel{
      * Fires if resume the paused chunk file upload.
      *
      * @event resuming
-     * @blazorProperty 'OnResume'
      */
     resuming?: EmitType<PauseResumeEventArgs>;