@syncfusion/ej2-ribbon 28.2.3 → 29.1.33

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

@@ -1458,7 +1458,9 @@ class RibbonButton {
             return;
         }
         const buttonObj = getComponent(buttonEle, Button);
-        buttonObj.click();
+        if (!buttonObj.disabled) {
+            buttonObj.click();
+        }
     }
     /**
      * Updates the button properties.
@@ -1615,7 +1617,9 @@ class RibbonCheckBox {
             return;
         }
         const checkBoxObj = getComponent(inputEle, CheckBox);
-        checkBoxObj.click();
+        if (!checkBoxObj.disabled) {
+            checkBoxObj.click();
+        }
     }
     /**
      * Updates the checkbox.
@@ -1824,7 +1828,9 @@ class RibbonColorPicker {
         if (!colorPickerObj) {
             return;
         }
-        colorPickerObj.toggle();
+        if (!colorPickerObj.disabled) {
+            colorPickerObj.toggle();
+        }
     }
     /**
      * Updates the colorpicker properties.
@@ -2451,7 +2457,13 @@ class RibbonDropDown {
      * @returns {void}
      */
     toggle(controlId) {
-        this.getDropDownObj(controlId).toggle();
+        const dropdownObj = this.getDropDownObj(controlId);
+        if (!dropdownObj) {
+            return;
+        }
+        if (!dropdownObj.disabled) {
+            dropdownObj.toggle();
+        }
     }
     /**
      * Updates the dropdown.
@@ -2720,7 +2732,13 @@ class RibbonSplitButton {
      * @returns {void}
      */
     toggle(controlId) {
-        this.getSplitButtonObj(controlId).toggle();
+        const splitBtnObj = this.getSplitButtonObj(controlId);
+        if (!splitBtnObj) {
+            return;
+        }
+        if (!splitBtnObj.disabled) {
+            splitBtnObj.toggle();
+        }
     }
     /**
      * Updates the splitbutton.
@@ -10509,7 +10527,8 @@ class RibbonKeyTip {
             if ((isPopUpItem && isPopUpPresent) || !isPopUpItem) {
                 const keytipElement = this.parent.createElement('div', {
                     className: RIBBON_KEYTIP,
-                    id: id + RIBBON_KEYTIP_ID
+                    id: id + RIBBON_KEYTIP_ID,
+                    attrs: { role: 'dialog', 'aria-label': 'ribbon-keytip' }
                 });
                 document.body.append(keytipElement);
                 const keytipPopup = new Popup(keytipElement, {
@@ -10518,7 +10537,8 @@ class RibbonKeyTip {
                     collision: { X: 'fit', Y: 'flip' },
                     targetType: 'relative',
                     position: { X: xOffset, Y: yOffset },
-                    enableRtl: this.parent.enableRtl
+                    enableRtl: this.parent.enableRtl,
+                    actionOnScroll: 'hide'
                 });
                 keytipPopup.show();
                 this.calculateKeyTipPosition(keyEle, keytipElement, type, yOffset);
@@ -10681,24 +10701,30 @@ class RibbonKeyTip {
                     break;
                 case 'combobox': {
                     const itemEle = document.querySelector('#' + itemID);
-                    setTimeout(() => {
-                        itemEle.focus();
-                    }, 100);
+                    if (this.isInteractableElement(itemEle)) {
+                        setTimeout(() => {
+                            itemEle.focus();
+                        }, 100);
+                    }
                     break;
                 }
                 case 'gallery': {
                     const galleryEle = document.querySelector('#' + itemID);
-                    galleryEle.click();
+                    if (this.isInteractableElement(galleryEle)) {
+                        galleryEle.click();
+                    }
                     break;
                 }
                 case 'template': {
                     const templateEle = document.querySelector('#' + itemID);
-                    templateEle.focus();
+                    if (this.isInteractableElement(templateEle)) {
+                        templateEle.focus();
+                    }
                     break;
                 }
                 case 'group-btn': {
                     const itemElement = document.querySelector('#' + itemID);
-                    if (itemElement) {
+                    if (this.isInteractableElement(itemElement)) {
                         const item = getInstance(itemElement, DropDownButton);
                         item.toggle();
                         for (let i = 0; i < itemProp.item.groupButtonSettings.items.length; i++) {
@@ -10712,6 +10738,9 @@ class RibbonKeyTip {
             }
         }
     }
+    isInteractableElement(element) {
+        return element && !element.closest('.e-ribbon-item').classList.contains('e-disabled');
+    }
     commonItemsKeyTipPress(keyPress, key, isMethod) {
         if (this.parent.keyTipElements[`${key}`]) {
             let isKeyPressed = false;