@coreui/angular-pro 5.7.8 → 5.7.9

package/fesm2022/coreui-angular-pro.mjs

@@ -13276,7 +13276,7 @@ class ModalComponent {
             this.show = this.visible();
         });
     }
-    onKeyUpHandler(event) {
+    onKeyDownHandler(event) {
         if (event.key === 'Escape' && this.keyboard() && this.visible()) {
             if (this.backdrop() === 'static') {
                 this.setStaticBackdrop();
@@ -13357,7 +13357,7 @@ class ModalComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: ModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.0.7", type: ModalComponent, isStandalone: true, selector: "c-modal", inputs: { alignment: { classPropertyName: "alignment", publicName: "alignment", isSignal: true, isRequired: false, transformFunction: null }, backdrop: { classPropertyName: "backdrop", publicName: "backdrop", isSignal: true, isRequired: false, transformFunction: null }, fullscreen: { classPropertyName: "fullscreen", publicName: "fullscreen", isSignal: true, isRequired: false, transformFunction: null }, keyboard: { classPropertyName: "keyboard", publicName: "keyboard", isSignal: true, isRequired: false, transformFunction: null }, attrId: { classPropertyName: "attrId", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, transition: { classPropertyName: "transition", publicName: "transition", isSignal: true, isRequired: false, transformFunction: null }, role: { classPropertyName: "role", publicName: "role", isSignal: true, isRequired: false, transformFunction: null }, ariaModalInput: { classPropertyName: "ariaModalInput", publicName: "ariaModal", isSignal: true, isRequired: false, transformFunction: null }, scrollable: { classPropertyName: "scrollable", publicName: "scrollable", isSignal: true, isRequired: false, transformFunction: null }, visibleInput: { classPropertyName: "visibleInput", publicName: "visible", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { visibleChange: "visibleChange" }, host: { listeners: { "mousedown": "onMouseDownHandler($event)", "click": "onClickHandler($event)", "document:keyup": "onKeyUpHandler($event)" }, properties: { "class": "hostClasses()", "attr.role": "visible() ? role() : null", "attr.inert": "ariaHidden()", "attr.id": "id", "attr.aria-modal": "ariaModal()", "attr.aria-hidden": "ariaHidden()", "attr.tabindex": "-1" }, classAttribute: "modal" }, viewQueries: [{ propertyName: "modalContentRef", first: true, predicate: ["modalContentRef"], descendants: true, read: ElementRef, isSignal: true }, { propertyName: "modalDialogRef", first: true, predicate: ModalDialogComponent, descendants: true, read: ElementRef, isSignal: true }], exportAs: ["cModal"], ngImport: i0, template: "@let isVisible = visible();\n<c-modal-dialog\n  [alignment]=\"alignment()\"\n  [fullscreen]=\"fullscreen()\"\n  [scrollable]=\"scrollable()\"\n  [size]=\"size()\">\n  <c-modal-content>\n    <div #modalContentRef [cdkTrapFocusAutoCapture]=\"isVisible\" [cdkTrapFocus]=\"isVisible\" style=\"display: contents;\">\n      <ng-content />\n    </div>\n  </c-modal-content>\n</c-modal-dialog>\n", dependencies: [{ kind: "component", type: ModalDialogComponent, selector: "c-modal-dialog", inputs: ["alignment", "fullscreen", "scrollable", "size"] }, { kind: "component", type: ModalContentComponent, selector: "c-modal-content" }, { kind: "ngmodule", type: A11yModule }, { kind: "directive", type: i1$2.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.0.7", type: ModalComponent, isStandalone: true, selector: "c-modal", inputs: { alignment: { classPropertyName: "alignment", publicName: "alignment", isSignal: true, isRequired: false, transformFunction: null }, backdrop: { classPropertyName: "backdrop", publicName: "backdrop", isSignal: true, isRequired: false, transformFunction: null }, fullscreen: { classPropertyName: "fullscreen", publicName: "fullscreen", isSignal: true, isRequired: false, transformFunction: null }, keyboard: { classPropertyName: "keyboard", publicName: "keyboard", isSignal: true, isRequired: false, transformFunction: null }, attrId: { classPropertyName: "attrId", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, transition: { classPropertyName: "transition", publicName: "transition", isSignal: true, isRequired: false, transformFunction: null }, role: { classPropertyName: "role", publicName: "role", isSignal: true, isRequired: false, transformFunction: null }, ariaModalInput: { classPropertyName: "ariaModalInput", publicName: "ariaModal", isSignal: true, isRequired: false, transformFunction: null }, scrollable: { classPropertyName: "scrollable", publicName: "scrollable", isSignal: true, isRequired: false, transformFunction: null }, visibleInput: { classPropertyName: "visibleInput", publicName: "visible", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { visibleChange: "visibleChange" }, host: { listeners: { "mousedown": "onMouseDownHandler($event)", "click": "onClickHandler($event)", "document:keydown": "onKeyDownHandler($event)" }, properties: { "class": "hostClasses()", "attr.role": "visible() ? role() : null", "attr.inert": "ariaHidden()", "attr.id": "id", "attr.aria-modal": "ariaModal()", "attr.aria-hidden": "ariaHidden()", "attr.tabindex": "-1" }, classAttribute: "modal" }, viewQueries: [{ propertyName: "modalContentRef", first: true, predicate: ["modalContentRef"], descendants: true, read: ElementRef, isSignal: true }, { propertyName: "modalDialogRef", first: true, predicate: ModalDialogComponent, descendants: true, read: ElementRef, isSignal: true }], exportAs: ["cModal"], ngImport: i0, template: "@let isVisible = visible();\n<c-modal-dialog\n  [alignment]=\"alignment()\"\n  [fullscreen]=\"fullscreen()\"\n  [scrollable]=\"scrollable()\"\n  [size]=\"size()\">\n  <c-modal-content>\n    <div #modalContentRef [cdkTrapFocusAutoCapture]=\"isVisible\" [cdkTrapFocus]=\"isVisible\" style=\"display: contents;\">\n      <ng-content />\n    </div>\n  </c-modal-content>\n</c-modal-dialog>\n", dependencies: [{ kind: "component", type: ModalDialogComponent, selector: "c-modal-dialog", inputs: ["alignment", "fullscreen", "scrollable", "size"] }, { kind: "component", type: ModalContentComponent, selector: "c-modal-content" }, { kind: "ngmodule", type: A11yModule }, { kind: "directive", type: i1$2.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: ModalComponent, decorators: [{
             type: Component,
@@ -13372,7 +13372,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
                         '[attr.tabindex]': '-1',
                         '(mousedown)': 'onMouseDownHandler($event)',
                         '(click)': 'onClickHandler($event)',
-                        '(document:keyup)': 'onKeyUpHandler($event)'
+                        '(document:keydown)': 'onKeyDownHandler($event)'
                     }, template: "@let isVisible = visible();\n<c-modal-dialog\n  [alignment]=\"alignment()\"\n  [fullscreen]=\"fullscreen()\"\n  [scrollable]=\"scrollable()\"\n  [size]=\"size()\">\n  <c-modal-content>\n    <div #modalContentRef [cdkTrapFocusAutoCapture]=\"isVisible\" [cdkTrapFocus]=\"isVisible\" style=\"display: contents;\">\n      <ng-content />\n    </div>\n  </c-modal-content>\n</c-modal-dialog>\n" }]
         }], propDecorators: { alignment: [{ type: i0.Input, args: [{ isSignal: true, alias: "alignment", required: false }] }], backdrop: [{ type: i0.Input, args: [{ isSignal: true, alias: "backdrop", required: false }] }], fullscreen: [{ type: i0.Input, args: [{ isSignal: true, alias: "fullscreen", required: false }] }], keyboard: [{ type: i0.Input, args: [{ isSignal: true, alias: "keyboard", required: false }] }], attrId: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], transition: [{ type: i0.Input, args: [{ isSignal: true, alias: "transition", required: false }] }], role: [{ type: i0.Input, args: [{ isSignal: true, alias: "role", required: false }] }], ariaModalInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaModal", required: false }] }], scrollable: [{ type: i0.Input, args: [{ isSignal: true, alias: "scrollable", required: false }] }], visibleInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "visible", required: false }] }], visibleChange: [{ type: i0.Output, args: ["visibleChange"] }], modalContentRef: [{ type: i0.ViewChild, args: ['modalContentRef', { ...{ read: ElementRef }, isSignal: true }] }], modalDialogRef: [{ type: i0.ViewChild, args: [i0.forwardRef(() => ModalDialogComponent), { ...{ read: ElementRef }, isSignal: true }] }] } });
 
@@ -14695,6 +14695,25 @@ class PopoverDirective {
             this.visible() ? this.addTooltipElement() : this.removeTooltipElement();
         }
     });
+    #handleEscapeKey = (event) => {
+        if (event.key !== 'Escape') {
+            return;
+        }
+        event.preventDefault();
+        event.stopPropagation();
+        this.visible.set(false);
+    };
+    #escapeEffect = effect((onCleanup) => {
+        if (!this.visible()) {
+            return;
+        }
+        const useCapture = true;
+        this.#document.addEventListener('keydown', this.#handleEscapeKey, useCapture);
+        onCleanup(() => {
+            this.#document.removeEventListener('keydown', this.#handleEscapeKey, useCapture);
+        });
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "#escapeEffect" }] : /* istanbul ignore next */ []));
     get ariaDescribedBy() {
         return this.tooltipId ? this.tooltipId : null;
     }
@@ -15233,6 +15252,23 @@ class TooltipDirective {
             this.visible() ? this.addTooltipElement() : this.removeTooltipElement();
         }
     });
+    #handleEscapeKey = (event) => {
+        if (event.key !== 'Escape') {
+            return;
+        }
+        event.preventDefault();
+        event.stopPropagation();
+        this.visible.set(false);
+    };
+    #escapeEffect = effect((onCleanup) => {
+        if (!this.visible()) {
+            return;
+        }
+        const useCapture = true;
+        this.#document.addEventListener('keydown', this.#handleEscapeKey, useCapture);
+        onCleanup(() => this.#document.removeEventListener('keydown', this.#handleEscapeKey, useCapture));
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "#escapeEffect" }] : /* istanbul ignore next */ []));
     get ariaDescribedBy() {
         return this.tooltipId ? this.tooltipId : null;
     }