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

semcore/base-trigger/CHANGELOG.md

@@ -2,6 +2,8 @@
 
 CHANGELOG.md standards are inspired by [keepachangelog.com](https://keepachangelog.com/en/1.0.0/).
 
+## [16.4.4] - 2025-11-03
+
 ## [16.4.3] - 2025-10-29
 
 ### Changed

semcore/base-trigger/src/BaseTrigger.jsx

@@ -64,7 +64,7 @@ class RootBaseTrigger extends Component {
               state={theme}
             >
               {state === 'invalid' && <SInvalidPattern size={size} />}
-              <SInner>
+              <SInner data-ui-name={`${this.asProps['data-ui-name']}.InnerTriggerWrapper`}>
                 {addonTextChildren(Children, BaseTrigger.Text, BaseTrigger.Addon, empty)}
               </SInner>
             </SBaseTrigger>,

semcore/button/CHANGELOG.md

@@ -2,6 +2,8 @@
 
 CHANGELOG.md standards are inspired by [keepachangelog.com](https://keepachangelog.com/en/1.0.0/).
 
+## [16.0.12] - 2025-11-03
+
 ## [16.0.11] - 2025-10-29
 
 ### Changed

semcore/button/src/component/AbstractButton/AbstractButton.tsx

@@ -142,7 +142,7 @@ export abstract class AbstractButton extends Component<Props, {}, {}> {
           const children = sstyled(styles)(
             <>
               {/* @ts-ignore */}
-              <SInner tag='span' loading={loading}>
+              <SInner tag='span' loading={loading} data-ui-name={`${this.asProps['data-ui-name']}.InnerWrapper`}>
                 {AddonLeft
                   ? (
                       <Button.Addon>

semcore/color-picker/src/style/color-picker.shadow.css

@@ -58,7 +58,7 @@ SItemContainer:not([value]) {
     transform: translate(-50%, -50%) rotate(45deg);
     width: 1px;
     height: 22px;
-    background: var(--intergalactic-border-secondary);
+    background: var(--intergalactic-border-secondary, #e0e1e9);
     z-index: 0;
   }
 }

semcore/data-table/CHANGELOG.md

@@ -14,6 +14,7 @@ CHANGELOG.md standards are inspired by [keepachangelog.com](https://keepachangel
 
 - Low performance when opening an accordion with a large number of rows.
 - 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 { Root, sstyled, createComponent, Component } from '@semcore/core';
 import { isFocusInside } from '@semcore/core/lib/utils/focus-lock/isFocusInside';
+import { isInteractiveElement } from '@semcore/core/lib/utils/isInteractiveElement';
 import * as React from 'react';
 
 import type { DataTableCellProps } from './Cell.types';
@@ -36,6 +37,11 @@ class CellRoot<Data extends DataTableData, UniqKeyType> extends Component<DataTa
   handleClickCell = (e: React.SyntheticEvent<HTMLElement>) => {
     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}
     />
   );
 };