@syncfusion/ej2-splitbuttons 20.4.48 → 21.1.35

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

@@ -348,7 +348,7 @@ var DropDownButton = /** @__PURE__ @class */ (function (_super) {
         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));
         if (this.cssClass) {
-            addClass([div], this.cssClass.split(' '));
+            addClass([div], this.cssClass.replace(/\s+/g, ' ').trim().split(' '));
         }
         this.isPopupCreated = true;
     };
@@ -628,6 +628,10 @@ var DropDownButton = /** @__PURE__ @class */ (function (_super) {
         if (this.target && (e.keyCode === 13 || e.keyCode === 9)) {
             return;
         }
+        if (e.keyCode === 13 && this.activeElem[0].classList.contains('e-split-btn')) {
+            this.activeElem[0].focus();
+            return;
+        }
         if (e.target && e.target.className.indexOf('e-edit-template') > -1 && e.keyCode === 32) {
             return;
         }
@@ -844,19 +848,20 @@ var DropDownButton = /** @__PURE__ @class */ (function (_super) {
                     }
                     break;
                 case 'cssClass':
-                    if (newProp.cssClass.indexOf(classNames.VERTICAL) > -1) {
+                    if (newProp.cssClass.indexOf(classNames.VERTICAL) > -1 || oldProp.cssClass.indexOf(classNames.VERTICAL) > -1) {
                         if (!this.element.querySelector('span.e-caret')) {
                             this.appendArrowSpan();
                         }
                         var arrowSpan = this.element.querySelector('span.e-caret');
-                        classList(arrowSpan, ['e-icon-bottom'], ['e-icon-right']);
+                        newProp.cssClass.indexOf(classNames.VERTICAL) > -1 ? classList(arrowSpan, ['e-icon-bottom'], ['e-icon-right'])
+                            : classList(arrowSpan, ['e-icon-right'], ['e-icon-bottom']);
                     }
                     if (this.isPopupCreated) {
                         if (oldProp.cssClass) {
                             removeClass([popupElement], oldProp.cssClass.split(' '));
                         }
                         if (newProp.cssClass) {
-                            addClass([popupElement], newProp.cssClass.split(' '));
+                            addClass([popupElement], newProp.cssClass.replace(/\s+/g, ' ').trim().split(' '));
                         }
                     }
                     break;
@@ -1078,7 +1083,7 @@ var SplitButton = /** @__PURE__ @class */ (function (_super) {
             this.wrapper.classList.add(RTL);
         }
         if (this.cssClass) {
-            addClass([this.wrapper], this.cssClass.split(' '));
+            addClass([this.wrapper], this.cssClass.replace(/\s+/g, ' ').trim().split(' '));
         }
     };
     SplitButton.prototype.createPrimaryButton = function () {
@@ -1130,6 +1135,10 @@ var SplitButton = /** @__PURE__ @class */ (function (_super) {
             _this.trigger('select', args);
         };
         dropDownBtnModel.beforeOpen = function (args) {
+            if (_this.createPopupOnClick && _this.items.length == 0) {
+                _this.secondaryBtnObj.dropDown.relateTo = _this.wrapper;
+                _this.dropDown = _this.secondaryBtnObj.dropDown;
+            }
             var callBackPromise = new Deferred();
             _this.trigger('beforeOpen', args, function (observedArgs) {
                 callBackPromise.resolve(observedArgs);
@@ -1213,7 +1222,8 @@ var SplitButton = /** @__PURE__ @class */ (function (_super) {
         new KeyboardEvents(this.element, {
             keyAction: this.btnKeyBoardHandler.bind(this),
             keyConfigs: {
-                altdownarrow: 'alt+downarrow'
+                altdownarrow: 'alt+downarrow',
+                enter: 'enter'
             }
         });
     };
@@ -1229,6 +1239,16 @@ var SplitButton = /** @__PURE__ @class */ (function (_super) {
             case 'altdownarrow':
                 this.clickHandler(e);
                 break;
+            case 'enter':
+                this.clickHandler(e);
+                if (!this.getPopUpElement().classList.contains('e-popup-close')) {
+                    this.element.classList.remove('e-active');
+                    this.secondaryBtnObj.element.classList.add('e-active');
+                }
+                else {
+                    this.secondaryBtnObj.element.classList.remove('e-active');
+                }
+                break;
         }
     };
     /**
@@ -1255,7 +1275,7 @@ var SplitButton = /** @__PURE__ @class */ (function (_super) {
                     if (oldProp.cssClass) {
                         removeClass([this.wrapper], oldProp.cssClass.split(' '));
                     }
-                    addClass([this.wrapper], newProp.cssClass.split(' '));
+                    addClass([this.wrapper], newProp.cssClass.replace(/\s+/g, ' ').trim().split(' '));
                     break;
                 case 'enableRtl':
                     if (newProp.enableRtl) {