fix(treetable): allow space in editable row fields

packages/primeng/src/treetable/treetable.spec.ts

@@ -26,7 +26,7 @@ describe('TreeTable', () => {
 
     beforeEach(async () => {
         await TestBed.configureTestingModule({
-            declarations: [TestBasicTreeTableComponent, TestTemplatesTreeTableComponent, TestDynamicTreeTableComponent],
+            declarations: [TestBasicTreeTableComponent, TestTemplatesTreeTableComponent, TestDynamicTreeTableComponent, TestSelectableRowKeyboardComponent],
             imports: [FormsModule, TreeTableModule],
             providers: [provideZonelessChangeDetection()]
         }).compileComponents();
@@ -431,6 +431,64 @@ describe('TreeTable', () => {
 
             expect(treetable.onContextMenuSelect.emit).toHaveBeenCalled();
         });
+
+        it('should not prevent Space keydown from editable row descendants', async () => {
+            const keyboardFixture = TestBed.createComponent(TestSelectableRowKeyboardComponent);
+            keyboardFixture.changeDetectorRef.markForCheck();
+            await keyboardFixture.whenStable();
+            keyboardFixture.detectChanges();
+
+            const keyboardTreetable = keyboardFixture.debugElement.query(By.directive(TreeTable)).componentInstance as TreeTable;
+            const editableSelectors = ['input', 'textarea', 'select', 'button', '[contenteditable="true"]'];
+            const selectionChangeEmitSpy = spyOn(keyboardTreetable.selectionChange, 'emit');
+
+            for (const selector of editableSelectors) {
+                const editableElement = keyboardFixture.nativeElement.querySelector(selector) as HTMLElement;
+                const event = new KeyboardEvent('keydown', { code: 'Space', bubbles: true, cancelable: true });
+
+                editableElement.dispatchEvent(event);
+
+                expect(event.defaultPrevented).withContext(`${selector} Space keydown should not be prevented`).toBe(false);
+                expect(selectionChangeEmitSpy).withContext(`${selector} Space keydown should not select a row`).not.toHaveBeenCalled();
+                selectionChangeEmitSpy.calls.reset();
+            }
+        });
+
+        it('should prevent Space keydown on selectable row', async () => {
+            const keyboardFixture = TestBed.createComponent(TestSelectableRowKeyboardComponent);
+            keyboardFixture.changeDetectorRef.markForCheck();
+            await keyboardFixture.whenStable();
+            keyboardFixture.detectChanges();
+
+            const keyboardTreetable = keyboardFixture.debugElement.query(By.directive(TreeTable)).componentInstance as TreeTable;
+            const row = keyboardFixture.nativeElement.querySelector('tbody tr') as HTMLElement;
+            const event = new KeyboardEvent('keydown', { code: 'Space', bubbles: true, cancelable: true });
+
+            spyOn(keyboardTreetable.selectionChange, 'emit');
+
+            row.dispatchEvent(event);
+
+            expect(event.defaultPrevented).toBe(true);
+            expect(keyboardTreetable.selectionChange.emit).toHaveBeenCalled();
+        });
+
+        it('should preserve Enter key selection on selectable row', async () => {
+            const keyboardFixture = TestBed.createComponent(TestSelectableRowKeyboardComponent);
+            keyboardFixture.changeDetectorRef.markForCheck();
+            await keyboardFixture.whenStable();
+            keyboardFixture.detectChanges();
+
+            const keyboardTreetable = keyboardFixture.debugElement.query(By.directive(TreeTable)).componentInstance as TreeTable;
+            const row = keyboardFixture.nativeElement.querySelector('tbody tr') as HTMLElement;
+            const event = new KeyboardEvent('keydown', { code: 'Enter', bubbles: true, cancelable: true });
+
+            spyOn(keyboardTreetable.selectionChange, 'emit');
+
+            row.dispatchEvent(event);
+
+            expect(event.defaultPrevented).toBe(true);
+            expect(keyboardTreetable.selectionChange.emit).toHaveBeenCalled();
+        });
     });
 
     describe('Node Expansion/Collapse', () => {
@@ -3127,6 +3185,41 @@ class TestBasicTreeTableComponent {
     onSelectionKeysChange(event: any) {}
 }
 
+@Component({
+    standalone: false,
+    template: `
+        <p-treetable [value]="value" [columns]="columns" [selectionMode]="selectionMode">
+            <ng-template #header let-columns>
+                <tr>
+                    <th *ngFor="let col of columns">{{ col.header }}</th>
+                </tr>
+            </ng-template>
+            <ng-template #body let-rowNode let-rowData="rowData">
+                <tr [ttRow]="rowNode" [ttSelectableRow]="rowNode">
+                    <td>
+                        <input type="text" />
+                        <textarea></textarea>
+                        <select>
+                            <option>Option</option>
+                        </select>
+                        <button type="button">Button</button>
+                        <span contenteditable="true">Editable</span>
+                    </td>
+                    <td>{{ rowData.name }}</td>
+                </tr>
+            </ng-template>
+        </p-treetable>
+    `
+})
+class TestSelectableRowKeyboardComponent {
+    value: TreeNode[] = [{ data: { name: 'Root' } }];
+    columns = [
+        { field: 'controls', header: 'Controls' },
+        { field: 'name', header: 'Name' }
+    ];
+    selectionMode: string = 'single';
+}
+
 @Component({
     standalone: false,
     template: `

packages/primeng/src/treetable/treetable.ts

@@ -3167,10 +3167,15 @@ export class TTSelectableRow extends BaseComponent {
     onKeyDown(event: KeyboardEvent) {
         switch (event.code) {
             case 'Enter':
-            case 'Space':
                 this.onEnterKey(event);
                 break;
 
+            case 'Space':
+                if (!this.isKeydownFromInteractiveElement(event)) {
+                    this.onEnterKey(event);
+                }
+                break;
+
             default:
                 break;
         }
@@ -3195,6 +3200,18 @@ export class TTSelectableRow extends BaseComponent {
         event.preventDefault();
     }
 
+    private isKeydownFromInteractiveElement(event: KeyboardEvent): boolean {
+        const target = event.target;
+        const currentTarget = event.currentTarget;
+
+        return (
+            target instanceof HTMLElement &&
+            currentTarget instanceof HTMLElement &&
+            !target.isSameNode(currentTarget) &&
+            (target.isContentEditable || !!target.closest('input, textarea, select, button, a, area, summary, [contenteditable="true"]') || isClickable(target))
+        );
+    }
+
     isEnabled() {
         return this.ttSelectableRowDisabled !== true;
     }