@syncfusion/ej2-splitbuttons 20.4.42 → 20.4.50

package/dist/global/index.d.ts

@@ -1,6 +1,6 @@
 /*!
 *  filename: index.d.ts
-*  version : 20.4.42
+*  version : 20.4.50
 *  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/package.json

@@ -1,8 +1,8 @@
 {
   "_from": "@syncfusion/ej2-splitbuttons@*",
-  "_id": "@syncfusion/ej2-splitbuttons@20.4.40",
+  "_id": "@syncfusion/ej2-splitbuttons@20.4.48",
   "_inBundle": false,
-  "_integrity": "sha512-gwQMpFB0eptj4OvR+h81m2JoQjU/MWNxpudKCz59KwM2MqRC7hko4aS7HQXfFhe1ibOJbC+v3of25Y8xu6768Q==",
+  "_integrity": "sha512-GopDCpguhkscBfgaDrL1tsxlbNFwQHWZwzosBeswNc8AIW7aj1KNBIV2XwAWpvoDYrzD/canCrO6acmth0yv5Q==",
   "_location": "/@syncfusion/ej2-splitbuttons",
   "_phantomChildren": {},
   "_requested": {
@@ -32,8 +32,8 @@
     "/@syncfusion/ej2-richtexteditor",
     "/@syncfusion/ej2-vue-splitbuttons"
   ],
-  "_resolved": "https://nexus.syncfusion.com/repository/ej2-hotfix-new/@syncfusion/ej2-splitbuttons/-/ej2-splitbuttons-20.4.40.tgz",
-  "_shasum": "79574125f09cec61f8c96a0f96ff0b7ee4b4b89a",
+  "_resolved": "https://nexus.syncfusion.com/repository/ej2-hotfix-new/@syncfusion/ej2-splitbuttons/-/ej2-splitbuttons-20.4.48.tgz",
+  "_shasum": "a5a613d2a38d84e5ab555f50c7404a07ec8d7336",
   "_spec": "@syncfusion/ej2-splitbuttons@*",
   "_where": "/jenkins/workspace/ease-automation_release_19.1.0.1/packages/included",
   "author": {
@@ -44,8 +44,8 @@
   },
   "bundleDependencies": false,
   "dependencies": {
-    "@syncfusion/ej2-base": "~20.4.42",
-    "@syncfusion/ej2-popups": "~20.4.42"
+    "@syncfusion/ej2-base": "~20.4.48",
+    "@syncfusion/ej2-popups": "~20.4.49"
   },
   "deprecated": false,
   "description": "A package of feature-rich Essential JS 2 components such as DropDownButton, SplitButton, ProgressButton and ButtonGroup.",
@@ -88,6 +88,6 @@
     "url": "git+https://github.com/syncfusion/ej2-javascript-ui-controls.git"
   },
   "typings": "index.d.ts",
-  "version": "20.4.42",
+  "version": "20.4.50",
   "sideEffects": false
 }

package/src/common/common.d.ts

@@ -20,7 +20,7 @@ export declare function upDownKeyHandler(ul: HTMLElement, keyCode: number): void
  * @param {HTMLElement} popup - Specifies the popup element.
  * @returns {void}
  */
-export declare function setBlankIconStyle(popup: HTMLElement): void;
+export declare function setBlankIconStyle(popup: HTMLElement, blankIcon?: boolean): void;
 /**
  * Defines the items of Split Button/DropDownButton.
  */

package/src/common/common.js

@@ -108,8 +108,16 @@ function isValidLI(ul, li, index, keyCode, count) {
  * @param {HTMLElement} popup - Specifies the popup element.
  * @returns {void}
  */
-export function setBlankIconStyle(popup) {
+export function setBlankIconStyle(popup, blankIcon) {
     var blankIconList = [].slice.call(popup.getElementsByClassName('e-blank-icon'));
+    if (blankIcon) {
+        var menuItem = [].slice.call(popup.getElementsByClassName('e-item'));
+        menuItem.forEach(function (li) {
+            if (li.style.paddingLeft || li.style.paddingRight) {
+                li.removeAttribute('style');
+            }
+        });
+    }
     if (!blankIconList.length) {
         return;
     }

package/src/drop-down-button/drop-down-button-model.d.ts

@@ -1,4 +1,4 @@
-import { Collection, Event, NotifyPropertyChanges, detach, Property, EventHandler, EmitType } from '@syncfusion/ej2-base';import { addClass, INotifyPropertyChanged, getUniqueID, rippleEffect, getComponent } from '@syncfusion/ej2-base';import { attributes, Component, closest, select, KeyboardEventArgs, SanitizeHtmlHelper } from '@syncfusion/ej2-base';import { classList, removeClass } from '@syncfusion/ej2-base';import { Button } from '@syncfusion/ej2-buttons';import { Popup } from '@syncfusion/ej2-popups';import { SplitButton } from '../split-button/split-button';import { MenuEventArgs, BeforeOpenCloseMenuEventArgs, OpenCloseMenuEventArgs, upDownKeyHandler } from './../common/common';import { getModel, SplitButtonIconPosition, Item, setBlankIconStyle } from './../common/common';import { ItemModel } from './../common/common-model';
+import { Collection, Event, NotifyPropertyChanges, detach, Property, EventHandler, EmitType, isRippleEnabled } from '@syncfusion/ej2-base';import { addClass, INotifyPropertyChanged, getUniqueID, rippleEffect, getComponent } from '@syncfusion/ej2-base';import { attributes, Component, closest, select, KeyboardEventArgs, SanitizeHtmlHelper } from '@syncfusion/ej2-base';import { classList, removeClass } from '@syncfusion/ej2-base';import { Button } from '@syncfusion/ej2-buttons';import { Popup } from '@syncfusion/ej2-popups';import { SplitButton } from '../split-button/split-button';import { MenuEventArgs, BeforeOpenCloseMenuEventArgs, OpenCloseMenuEventArgs, upDownKeyHandler } from './../common/common';import { getModel, SplitButtonIconPosition, Item, setBlankIconStyle } from './../common/common';import { ItemModel } from './../common/common-model';
 import {ComponentModel} from '@syncfusion/ej2-base';
 
 /**

package/src/drop-down-button/drop-down-button.js

@@ -17,7 +17,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
-import { Collection, Event, NotifyPropertyChanges, detach, Property, EventHandler } from '@syncfusion/ej2-base';
+import { Collection, Event, NotifyPropertyChanges, detach, Property, EventHandler, isRippleEnabled } from '@syncfusion/ej2-base';
 import { addClass, getUniqueID, rippleEffect, getComponent } from '@syncfusion/ej2-base';
 import { attributes, Component, closest, select, SanitizeHtmlHelper } from '@syncfusion/ej2-base';
 import { classList, removeClass } from '@syncfusion/ej2-base';
@@ -409,6 +409,9 @@ var DropDownButton = /** @class */ (function (_super) {
                 EventHandler.remove(popupElement, this.closeActionEvents, this.focusoutHandler);
             }
         }
+        if (isRippleEnabled && this.rippleFn) {
+            this.rippleFn();
+        }
     };
     /**
      * Handles the keyboard interactions.
@@ -671,9 +674,13 @@ var DropDownButton = /** @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) {

package/src/progress-button/progress-button-model.d.ts

@@ -96,7 +96,7 @@ export interface ProgressButtonModel {
      *
      * @default "Left"
      */
-    iconPosition?: IconPosition | string;
+    iconPosition?: string | IconPosition;
 
     /**
      * Defines class/multiple classes separated by a space for the progress button that is used to include an icon.

package/src/progress-button/progress-button.d.ts

@@ -102,7 +102,7 @@ export declare class ProgressButton extends Button implements INotifyPropertyCha
      *
      * @default "Left"
      */
-    iconPosition: IconPosition | string;
+    iconPosition: string | IconPosition;
     /**
      * Defines class/multiple classes separated by a space for the progress button that is used to include an icon.
      * Progress button can also include font icon and sprite image.

package/src/split-button/split-button.js

@@ -183,6 +183,10 @@ var SplitButton = /** @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);

package/styles/drop-down-button/_layout.scss

@@ -34,6 +34,9 @@
 
     .e-caret {
       font-size: $drop-down-btn-caret-icon-font-size;
+      @if $skin-name == 'FluentUI' or $skin-name == 'highcontrast' {
+        margin-top: 0;
+      }
     }
 
     &.e-vertical {

package/styles/drop-down-button/fluent-dark.css

@@ -30,6 +30,7 @@
 .e-dropdown-btn .e-caret,
 .e-dropdown-btn.e-btn .e-caret {
   font-size: 16px;
+  margin-top: 0;
 }
 .e-dropdown-btn.e-vertical,
 .e-dropdown-btn.e-btn.e-vertical {

package/styles/drop-down-button/fluent.css

@@ -30,6 +30,7 @@
 .e-dropdown-btn .e-caret,
 .e-dropdown-btn.e-btn .e-caret {
   font-size: 16px;
+  margin-top: 0;
 }
 .e-dropdown-btn.e-vertical,
 .e-dropdown-btn.e-btn.e-vertical {

package/styles/drop-down-button/highcontrast.css

@@ -29,6 +29,7 @@
 .e-dropdown-btn .e-caret,
 .e-dropdown-btn.e-btn .e-caret {
   font-size: 8px;
+  margin-top: 0;
 }
 .e-dropdown-btn.e-vertical,
 .e-dropdown-btn.e-btn.e-vertical {

package/styles/fluent-dark.css

@@ -30,6 +30,7 @@
 .e-dropdown-btn .e-caret,
 .e-dropdown-btn.e-btn .e-caret {
   font-size: 16px;
+  margin-top: 0;
 }
 .e-dropdown-btn.e-vertical,
 .e-dropdown-btn.e-btn.e-vertical {

package/styles/fluent.css

@@ -30,6 +30,7 @@
 .e-dropdown-btn .e-caret,
 .e-dropdown-btn.e-btn .e-caret {
   font-size: 16px;
+  margin-top: 0;
 }
 .e-dropdown-btn.e-vertical,
 .e-dropdown-btn.e-btn.e-vertical {

package/styles/highcontrast.css

@@ -29,6 +29,7 @@
 .e-dropdown-btn .e-caret,
 .e-dropdown-btn.e-btn .e-caret {
   font-size: 8px;
+  margin-top: 0;
 }
 .e-dropdown-btn.e-vertical,
 .e-dropdown-btn.e-btn.e-vertical {