@ptsecurity/mosaic 11.6.1 → 11.6.2

package/_theming.scss

@@ -3846,21 +3846,22 @@ $fonts: (
     border-color: transparent;
     background-color: transparent;
 
-    &:hover,
-    &.mc-hover {
+    &:hover {
+        background-color: map-get($background, overlay-hover);
+
         & .mc-button-overlay {
-            background: map-get($background, overlay-hover);
+            background-color: transparent;
         }
     }
 
     &:active,
     &.mc-active {
         border-color: transparent;
-        background-color: transparent;
+        background-color: map-get($background, overlay-active);
         box-shadow: none;
 
         & .mc-button-overlay {
-            background: map-get($background, overlay-active);
+            background-color: transparent;
         }
     }
 
@@ -4187,6 +4188,10 @@ $mc-datepicker-today-fade-amount: 0.2;
         background: map-get($background, overlay-hover);
     }
 
+    .mc-dropdown-item-overlay {
+        background: transparent;
+    }
+
     .mc-dropdown__divider {
         background-color: map-get($foreground, divider);
     }

package/bundles/ptsecurity-mosaic-dropdown.umd.js

@@ -511,13 +511,20 @@
             }
             return ((_b = clone.textContent) === null || _b === void 0 ? void 0 : _b.trim()) || '';
         };
+        McDropdownItem.prototype.haltDisabledEvents = function (event) {
+            if (this.disabled) {
+                event.preventDefault();
+                event.stopImmediatePropagation();
+                event.stopPropagation();
+            }
+        };
         return McDropdownItem;
     }(McDropdownItemMixinBase));
     McDropdownItem.decorators = [
         { type: core.Component, args: [{
                     selector: 'mc-dropdown-item, [mc-dropdown-item]',
                     exportAs: 'mcDropdownItem',
-                    template: "<div class=\"mc-dropdown-item-wrapper\">\n    <ng-content></ng-content>\n</div>\n<i *ngIf=\"isNested\" mc-icon=\"mc-angle-right-M_16\" class=\"mc-dropdown-trigger__icon\"></i>\n",
+                    template: "<div class=\"mc-dropdown-item-wrapper\">\n    <ng-content></ng-content>\n</div>\n<i *ngIf=\"isNested\" mc-icon=\"mc-angle-right-M_16\" class=\"mc-dropdown-trigger__icon\"></i>\n<div class=\"mc-dropdown-item-overlay\" (click)=\"haltDisabledEvents($event)\"></div>\n",
                     inputs: ['disabled'],
                     host: {
                         class: 'mc-dropdown-item',
@@ -528,7 +535,7 @@
                     },
                     changeDetection: core.ChangeDetectionStrategy.OnPush,
                     encapsulation: core.ViewEncapsulation.None,
-                    styles: [".mc-dropdown-item{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:flex;align-items:center;position:relative;box-sizing:border-box;width:100%;border:1px solid transparent;outline:none;padding:0;text-align:left;white-space:nowrap}.mc-dropdown-item:not([disabled]){cursor:pointer}.mc-dropdown-item .mc-dropdown-item__caption{margin-top:4px}.mc-dropdown-item.mc-dropdown-item_with-icon .mc-dropdown-item__caption{margin-left:24px}.mc-dropdown-item .docs-navbar-version__num{margin-right:4px}.mc-dropdown-item-wrapper{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:var(--mc-dropdown-item-size-padding,5px 15px)}.mc-dropdown-item-wrapper [mc-icon]{padding:var(--mc-dropdown-item-size-icon-padding,0 8px 2px 0)}.mc-dropdown-trigger__icon{margin-left:auto;padding-right:var(--dropdown-trigger-size-icon-padding-right,8px)}.mc-dropdown__group-header{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;padding:var(--mc-dropdown-item-size-padding,6px 15px)}.mc-dropdown__group-header.mc-dropdown__group-header_small{padding:var(--mc-dropdown-item-size-padding,8px 15px)}.mc-dropdown__divider{height:var(--mc-dropdown-divider-size-height,1px);margin:var(--mc-dropdown-divider-size-margin,4px 0)}"]
+                    styles: [".mc-dropdown-item{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:flex;align-items:center;position:relative;box-sizing:border-box;width:100%;border:1px solid transparent;outline:none;padding:0;text-align:left;white-space:nowrap}.mc-dropdown-item:not([disabled]){cursor:pointer}.mc-dropdown-item .mc-dropdown-item__caption{margin-top:4px}.mc-dropdown-item.mc-dropdown-item_with-icon .mc-dropdown-item__caption{margin-left:24px}.mc-dropdown-item .docs-navbar-version__num{margin-right:4px}.mc-dropdown-item-wrapper{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:var(--mc-dropdown-item-size-padding,5px 15px)}.mc-dropdown-item-wrapper [mc-icon]{padding:var(--mc-dropdown-item-size-icon-padding,0 8px 2px 0)}.mc-dropdown-item-overlay{position:absolute;top:-1px;left:-1px;right:-1px;bottom:-1px;border-radius:inherit}.mc-dropdown-trigger__icon{margin-left:auto;padding-right:var(--dropdown-trigger-size-icon-padding-right,8px)}.mc-dropdown__group-header{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;padding:var(--mc-dropdown-item-size-padding,6px 15px)}.mc-dropdown__group-header.mc-dropdown__group-header_small{padding:var(--mc-dropdown-item-size-padding,8px 15px)}.mc-dropdown__divider{height:var(--mc-dropdown-divider-size-height,1px);margin:var(--mc-dropdown-divider-size-margin,4px 0)}"]
                 },] }
     ];
     /** @nocollapse */
@@ -1083,9 +1090,17 @@
         McDropdownTrigger.prototype.handleKeydown = function (event) {
             // tslint:disable-next-line:deprecation
             var keyCode = event.keyCode;
-            // Pressing enter on the trigger will trigger the click handler later.
             if (keyCode === keycodes$1.ENTER || keyCode === keycodes$1.SPACE) {
                 this.openedBy = 'keyboard';
+                event.preventDefault();
+                if (this.isNested()) {
+                    // Stop event propagation to avoid closing the parent dropdown.
+                    event.stopPropagation();
+                    this.open();
+                }
+                else {
+                    this.toggle();
+                }
             }
             if ((this.isNested() &&
                 ((keyCode === keycodes$1.RIGHT_ARROW && this.dir === 'ltr') || (keyCode === keycodes$1.LEFT_ARROW && this.dir === 'rtl'))) ||