[UIK-4055][data-table] fixed case with few interactive elements in cell

semcore/data-table/CHANGELOG.md

@@ -7,6 +7,7 @@ CHANGELOG.md standards are inspired by [keepachangelog.com](https://keepachangel
 ### Fixed
 
 - Keyboard interaction after mouse clicking in Safari.
+- Keyboard interaction after mouse clicking in cell with few interactive elements.
 
 ## [16.4.1] - 2025-10-17
 

semcore/data-table/src/components/Body/Cell.tsx

@@ -1,6 +1,7 @@
 import { Box, Flex } from '@semcore/base-components';
 import { Component, Root, sstyled, createComponent } from '@semcore/core';
 import { isFocusInside } from '@semcore/core/lib/utils/focus-lock/isFocusInside';
+import { isInteractiveElement } from '@semcore/ui/core/lib/utils/isInteractiveElement';
 import * as React from 'react';
 
 import type { CellPropsInner, DataTableCellProps } from './Cell.types';
@@ -74,6 +75,11 @@ class CellRoot<Data extends DataTableData, UniqKeyType> extends Component<DataTa
   handleClickCell = (e: React.SyntheticEvent) => {
     const { rowIndex, columnIndex, onClick, row } = this.asProps;
 
+    if (isInteractiveElement(e.target) && this.cellRef.current) {
+      this.lockedCell[0] = this.cellRef.current;
+      this.lockedCell[1] = true;
+    }
+
     onClick(e, { rowIndex, colIndex: columnIndex, row });
   };
 

stories/components/data-table/tests/examples/accordion-tests/accrodion-with-select.tsx

@@ -12,10 +12,6 @@ const options = Array(6)
     children: `Option ${index}`,
   }));
 
-const stopPropagation = (event: React.SyntheticEvent) => {
-  event.stopPropagation();
-};
-
 const CustomSelect = () => {
   const [isVisible, setIsVisible] = React.useState(false);
   return (
@@ -35,7 +31,6 @@ const CustomSelect = () => {
           e.stopPropagation();
         }
       }}
-      onClick={stopPropagation}
     />
   );
 };