@syncfusion/ej2-splitbuttons 20.4.48 → 21.1.35

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

@@ -315,7 +315,7 @@ let DropDownButton = class DropDownButton extends Component {
             ['type']: 'button', ['aria-label']: this.element.textContent ? this.element.textContent : 'dropdownbutton'
         });
         if (this.cssClass) {
-            addClass([div], this.cssClass.split(' '));
+            addClass([div], this.cssClass.replace(/\s+/g, ' ').trim().split(' '));
         }
         this.isPopupCreated = true;
     }
@@ -594,6 +594,10 @@ let DropDownButton = class DropDownButton extends Component {
         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;
         }
@@ -805,19 +809,20 @@ let DropDownButton = class DropDownButton extends Component {
                     }
                     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();
                         }
                         const 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;
@@ -1024,7 +1029,7 @@ let SplitButton = class SplitButton extends DropDownButton {
             this.wrapper.classList.add(RTL);
         }
         if (this.cssClass) {
-            addClass([this.wrapper], this.cssClass.split(' '));
+            addClass([this.wrapper], this.cssClass.replace(/\s+/g, ' ').trim().split(' '));
         }
     }
     createPrimaryButton() {
@@ -1075,6 +1080,10 @@ let SplitButton = class SplitButton extends DropDownButton {
             this.trigger('select', args);
         };
         dropDownBtnModel.beforeOpen = (args) => {
+            if (this.createPopupOnClick && this.items.length == 0) {
+                this.secondaryBtnObj.dropDown.relateTo = this.wrapper;
+                this.dropDown = this.secondaryBtnObj.dropDown;
+            }
             const callBackPromise = new Deferred();
             this.trigger('beforeOpen', args, (observedArgs) => {
                 callBackPromise.resolve(observedArgs);
@@ -1157,7 +1166,8 @@ let SplitButton = class SplitButton extends DropDownButton {
         new KeyboardEvents(this.element, {
             keyAction: this.btnKeyBoardHandler.bind(this),
             keyConfigs: {
-                altdownarrow: 'alt+downarrow'
+                altdownarrow: 'alt+downarrow',
+                enter: 'enter'
             }
         });
     }
@@ -1173,6 +1183,16 @@ let SplitButton = class SplitButton extends DropDownButton {
             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;
         }
     }
     /**
@@ -1198,7 +1218,7 @@ let SplitButton = class SplitButton extends DropDownButton {
                     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) {