feat: #10938 || Feature Request: Make activate-on-Enter optional for …

…inplace
primefaces · Sep 27, 2023 · 61f93cc · 61f93cc
1 parent e3a643c
commit 61f93cc
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 5 deletions.
diff --git a/src/app/components/inplace/inplace.ts b/src/app/components/inplace/inplace.ts
@@ -38,8 +38,8 @@ export class InplaceContent {}
                 <ng-container *ngTemplateOutlet="contentTemplate"></ng-container>
 
                 <ng-container *ngIf="closable">
-                    <button *ngIf="closeIcon" type="button" [icon]="closeIcon" pButton (click)="onDeactivateClick($event)" [attr.aria-label]="closeAriaLabel"></button>
-                    <button *ngIf="!closeIcon" type="button" pButton [ngClass]="'p-button-icon-only'" (click)="onDeactivateClick($event)" [attr.aria-label]="closeAriaLabel">
+                    <button *ngIf="closeIcon" type="button" [icon]="closeIcon" pButton (click)="onDeactivateClick($event)" (keydown)="onDeactivateClick($event)" [attr.aria-label]="closeAriaLabel"></button>
+                    <button *ngIf="!closeIcon" type="button" pButton [ngClass]="'p-button-icon-only'" (click)="onDeactivateClick($event)" (keydown)="onDeactivateClick($event)" [attr.aria-label]="closeAriaLabel">
                         <TimesIcon *ngIf="!closeIconTemplate" />
                         <ng-template *ngTemplateOutlet="closeIconTemplate"></ng-template>
                     </button>
@@ -75,6 +75,11 @@ export class Inplace implements AfterContentInit {
      * @group Props
      */
     @Input() preventClick: boolean | undefined;
+    /**
+     * Allows to prevent entering.
+     * @group Props
+     */
+    @Input() preventEnter: boolean | undefined;
     /**
      * Inline style of the element.
      * @group Props
@@ -142,9 +147,13 @@ export class Inplace implements AfterContentInit {
         if (!this.preventClick) this.activate(event);
     }
 
-    onDeactivateClick(event: MouseEvent) {
-        if (!this.preventClick) this.deactivate(event);
+    onDeactivateClick(event: MouseEvent | KeyboardEvent) {
+        if ('key' in event && event?.key === 'Enter') {
+            if (!this.preventEnter) this.deactivate(event);
+            event.preventDefault();
+        } else if (!this.preventClick) this.deactivate(event);
     }
+
     /**
      * Activates the content.
      * @param {Event} event - Browser event.
@@ -172,7 +181,7 @@ export class Inplace implements AfterContentInit {
     }
 
     onKeydown(event: KeyboardEvent) {
-        if (event.code === 'Enter') {
+        if (event.code === 'Enter' && !this.preventEnter) {
             this.activate(event);
             event.preventDefault();
         }

diff --git a/src/app/showcase/doc/apidoc/index.json b/src/app/showcase/doc/apidoc/index.json
@@ -11809,6 +11809,14 @@
                             "default": "false",
                             "description": "Allows to prevent clicking."
                         },
+                        {
+                            "name": "preventEnter",
+                            "optional": false,
+                            "readonly": false,
+                            "type": "boolean",
+                            "default": "false",
+                            "description": "Allows to prevent entering."
+                        },
                         {
                             "name": "style",
                             "optional": false,