@syncfusion/ej2-splitbuttons 22.2.8 → 23.1.41

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

@@ -1,4 +1,4 @@
-import { Animation, ChildProperty, Collection, Complex, Component, Event, EventHandler, KeyboardEvents, NotifyPropertyChanges, Property, SanitizeHtmlHelper, addClass, attributes, classList, closest, createElement, deleteObject, detach, extend, getComponent, getInstance, getUniqueID, getValue, isNullOrUndefined, isRippleEnabled, remove, removeClass, rippleEffect, select, setValue } from '@syncfusion/ej2-base';
+import { Animation, ChildProperty, Collection, Complex, Component, Event, EventHandler, KeyboardEvents, NotifyPropertyChanges, Property, SanitizeHtmlHelper, addClass, animationMode, attributes, classList, closest, createElement, deleteObject, detach, extend, getComponent, getInstance, getUniqueID, getValue, isNullOrUndefined, isRippleEnabled, remove, removeClass, rippleEffect, select, setValue } from '@syncfusion/ej2-base';
 import { Button } from '@syncfusion/ej2-buttons';
 import { Popup, createSpinner, hideSpinner, showSpinner } from '@syncfusion/ej2-popups';
 
@@ -346,17 +346,23 @@ var DropDownButton = /** @__PURE__ @class */ (function (_super) {
             content: this.target ? this.getTargetElement() : '',
             enableRtl: this.enableRtl
         });
+        if (!isNullOrUndefined(this.popupContent)) {
+            this.popupContent.style.display = '';
+        }
         if (this.dropDown.element.style.position === 'fixed') {
             this.dropDown.refreshPosition(this.element);
         }
         this.dropDown.hide();
-        attributes(this.element, (_a = {}, _a['aria-haspopup'] = this.items.length || this.target ? 'true' : 'false', _a['aria-expanded'] = 'false', _a['type'] = 'button', _a['aria-label'] = this.element.textContent ? this.element.textContent : 'dropdownbutton', _a));
+        attributes(this.element, (_a = {}, _a['aria-haspopup'] = this.items.length || this.target ? 'true' : 'false', _a['aria-expanded'] = 'false', _a['type'] = 'button', _a));
         if (this.cssClass) {
             addClass([div], this.cssClass.replace(/\s+/g, ' ').trim().split(' '));
         }
         this.isPopupCreated = true;
     };
     DropDownButton.prototype.getTargetElement = function () {
+        if (this.createPopupOnClick && !this.isColorPicker() && !isNullOrUndefined(this.popupContent)) {
+            return this.popupContent;
+        }
         return typeof (this.target) === 'string' ? select(this.target) : this.target;
     };
     DropDownButton.prototype.createItems = function (appendItems) {
@@ -446,11 +452,16 @@ var DropDownButton = /** @__PURE__ @class */ (function (_super) {
         }
         this.appendArrowSpan();
         this.setActiveElem([this.element]);
-        if ((this.target && !this.isColorPicker()) || !this.createPopupOnClick) {
+        this.element.setAttribute('aria-label', this.element.textContent ? this.element.textContent : 'dropdownbutton');
+        if ((this.target && !this.isColorPicker() && !this.createPopupOnClick) || !this.createPopupOnClick) {
             this.createPopup();
         }
         else {
             this.isPopupCreated = false;
+            if (this.target && !this.isColorPicker() && this.createPopupOnClick) {
+                this.popupContent = this.getTargetElement();
+                this.popupContent.style.display = 'none';
+            }
         }
     };
     DropDownButton.prototype.isColorPicker = function () {
@@ -691,7 +702,7 @@ var DropDownButton = /** @__PURE__ @class */ (function (_super) {
     DropDownButton.prototype.clickHandler = function (e) {
         var trgt = e.target;
         if (closest(trgt, '[id="' + this.element.id + '"]')) {
-            if (!this.createPopupOnClick || (this.target && this.target !== '' && !this.isColorPicker())) {
+            if (!this.createPopupOnClick || (this.target && this.target !== '' && !this.isColorPicker() && !this.createPopupOnClick)) {
                 if (this.getPopUpElement().classList.contains('e-popup-close')) {
                     this.openPopUp(e);
                 }
@@ -814,7 +825,7 @@ var DropDownButton = /** @__PURE__ @class */ (function (_super) {
                 if (!_this.target && ul_2) {
                     detach(ul_2);
                 }
-                if (!_this.target || _this.isColorPicker()) {
+                if (!_this.target || _this.isColorPicker() || (_this.target && !_this.isColorPicker())) {
                     if (_this.createPopupOnClick) {
                         _this.destroyPopup();
                     }
@@ -1196,7 +1207,7 @@ var SplitButton = /** @__PURE__ @class */ (function (_super) {
     SplitButton.prototype.setAria = function () {
         attributes(this.element, {
             'aria-expanded': 'false', 'aria-haspopup': 'true',
-            'aria-label': this.element.textContent + ' splitbutton', 'aria-owns': this.element.id + '_dropdownbtn-popup'
+            'aria-label': this.element.textContent ? this.element.textContent + ' splitbutton' : 'splitbutton', 'aria-owns': this.element.id + '_dropdownbtn-popup'
         });
     };
     /**
@@ -1241,6 +1252,7 @@ var SplitButton = /** @__PURE__ @class */ (function (_super) {
                 this.unWireEvents();
             }
         }
+        this.wrapper = null;
         this.primaryBtnObj.destroy();
         this.secondaryBtnObj.destroy();
         _super.prototype.destroy.call(this);
@@ -1828,7 +1840,7 @@ var ProgressButton = /** @__PURE__ @class */ (function (_super) {
         var ele = this.element.getElementsByClassName(CONTENTCLS)[0];
         if (this.animationSettings.effect !== 'None') {
             (new Animation({})).animate(ele, {
-                duration: this.animationSettings.duration,
+                duration: (this.animationSettings.duration === 0 && animationMode === 'Enable') ? 400 : this.animationSettings.duration,
                 name: 'Progress' + this.animationSettings.effect,
                 timingFunction: this.animationSettings.easing,
                 begin: function () {