@clr/angular 13.11.0 → 13.11.1

package/fesm2020/clr-angular.mjs

@@ -20317,11 +20317,9 @@ const BASIC_FOCUSABLE_ITEM_PROVIDER = [
  * The full license information can be found in LICENSE in the root directory of this project.
  */
 class ClrDropdownItem {
-    constructor(dropdown, el, _dropdownService, renderer, focusableItem) {
+    constructor(dropdown, _dropdownService, focusableItem) {
         this.dropdown = dropdown;
-        this.el = el;
         this._dropdownService = _dropdownService;
-        this.renderer = renderer;
         this.focusableItem = focusableItem;
         this.setByDeprecatedDisabled = false;
     }
@@ -20352,22 +20350,28 @@ class ClrDropdownItem {
     get dropdownItemId() {
         return this.focusableItem.id;
     }
-    ngAfterViewInit() {
-        this.unlisten = this.renderer.listen(this.el.nativeElement, 'click', () => this.onDropdownItemClick());
-    }
     onDropdownItemClick() {
-        if (this.dropdown.isMenuClosable && !this.el.nativeElement.classList.contains('disabled')) {
-            this._dropdownService.closeMenus();
-        }
+        // Ensure that the dropdown is closed after custom dropdown item click event handlers have run.
+        setTimeout(() => {
+            if (this.dropdown.isMenuClosable && !this.disabled) {
+                this._dropdownService.closeMenus();
+            }
+        });
     }
-    ngOnDestroy() {
-        if (this.unlisten) {
-            this.unlisten();
+    onSpaceKeydown($event) {
+        this.stopImmediatePropagationIfDisabled($event);
+    }
+    onEnterKeydown($event) {
+        this.stopImmediatePropagationIfDisabled($event);
+    }
+    stopImmediatePropagationIfDisabled($event) {
+        if (this.disabled) {
+            $event.stopImmediatePropagation();
         }
     }
 }
-ClrDropdownItem.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ClrDropdownItem, deps: [{ token: ClrDropdown }, { token: i0.ElementRef }, { token: RootDropdownService }, { token: i0.Renderer2 }, { token: FocusableItem }], target: i0.ɵɵFactoryTarget.Directive });
-ClrDropdownItem.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.11", type: ClrDropdownItem, selector: "[clrDropdownItem]", inputs: { disabled: ["clrDisabled", "disabled"], disabledDeprecated: ["disabled", "disabledDeprecated"], dropdownItemId: ["id", "dropdownItemId"] }, host: { properties: { "class.disabled": "disabled", "class.dropdown-item": "true", "attr.role": "\"menuitem\"", "attr.aria-disabled": "disabled", "attr.disabled": "(disabled && setByDeprecatedDisabled)? '' : null", "attr.id": "dropdownItemId" } }, providers: [BASIC_FOCUSABLE_ITEM_PROVIDER], ngImport: i0 });
+ClrDropdownItem.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ClrDropdownItem, deps: [{ token: ClrDropdown }, { token: RootDropdownService }, { token: FocusableItem }], target: i0.ɵɵFactoryTarget.Directive });
+ClrDropdownItem.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.11", type: ClrDropdownItem, selector: "[clrDropdownItem]", inputs: { disabled: ["clrDisabled", "disabled"], disabledDeprecated: ["disabled", "disabledDeprecated"], dropdownItemId: ["id", "dropdownItemId"] }, host: { listeners: { "click": "onDropdownItemClick()", "keydown.space": "onSpaceKeydown($event)", "keydown.enter": "onEnterKeydown($event)" }, properties: { "class.disabled": "disabled", "class.dropdown-item": "true", "attr.role": "\"menuitem\"", "attr.aria-disabled": "disabled", "attr.disabled": "(disabled && setByDeprecatedDisabled)? '' : null", "attr.id": "dropdownItemId" } }, providers: [BASIC_FOCUSABLE_ITEM_PROVIDER], ngImport: i0 });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ClrDropdownItem, decorators: [{
             type: Directive,
             args: [{
@@ -20382,7 +20386,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                     },
                     providers: [BASIC_FOCUSABLE_ITEM_PROVIDER],
                 }]
-        }], ctorParameters: function () { return [{ type: ClrDropdown }, { type: i0.ElementRef }, { type: RootDropdownService }, { type: i0.Renderer2 }, { type: FocusableItem }]; }, propDecorators: { disabled: [{
+        }], ctorParameters: function () { return [{ type: ClrDropdown }, { type: RootDropdownService }, { type: FocusableItem }]; }, propDecorators: { disabled: [{
                 type: Input,
                 args: ['clrDisabled']
             }], disabledDeprecated: [{
@@ -20391,6 +20395,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
             }], dropdownItemId: [{
                 type: Input,
                 args: ['id']
+            }], onDropdownItemClick: [{
+                type: HostListener,
+                args: ['click']
+            }], onSpaceKeydown: [{
+                type: HostListener,
+                args: ['keydown.space', ['$event']]
+            }], onEnterKeydown: [{
+                type: HostListener,
+                args: ['keydown.enter', ['$event']]
             }] } });
 
 /*