@cloud-ru/ds-tree 1.0.24 → 1.0.25

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cloud-ru/ds-tree",
-  "version": "1.0.24",
+  "version": "1.0.25",
   "description": "Иерархический список с раскрывающимися узлами, выбором (single/multiple), кастомными иконками, контекстными действиями и асинхронной подгрузкой потомков.",
   "repository": {
     "type": "git",
@@ -36,12 +36,12 @@
     "classnames": "^2.5.1",
     "react-transition-state": "^2.4.0",
     "@cloud-ru/ds-button": "^1.0.4",
-    "@cloud-ru/ds-list": "^2.2.7",
     "@cloud-ru/ds-icons": "^1.4.0",
+    "@cloud-ru/ds-list": "^2.2.8",
     "@cloud-ru/ds-loader": "^1.0.3",
-    "@cloud-ru/ds-materials": "^2.0.1",
+    "@cloud-ru/ds-truncate-string": "^1.0.11",
     "@cloud-ru/ds-toggles": "^1.1.8",
-    "@cloud-ru/ds-truncate-string": "^1.0.10",
+    "@cloud-ru/ds-materials": "^2.0.1",
     "@cloud-ru/ds-typography": "^1.0.1",
     "@cloud-ru/ds-utils": "^1.2.0"
   },

package/src/helperComponents/TreeNode/TreeNode.tsx

@@ -178,7 +178,14 @@ export const TreeNode = forwardRef<HTMLDivElement, TreeNodeComponentProps>(
       }
     };
 
-    const handleBlurActions = () => {
+    const handleBlurActions = (event: FocusEvent<HTMLElement>) => {
+      const nextTarget = event.relatedTarget;
+
+      // Фокус уходит на саму строку (возврат после закрытия дроплиста) — строку не блюрим.
+      if (nextTarget instanceof Node && contentRef.current?.contains(nextTarget)) {
+        return;
+      }
+
       if (isDroplistTriggerFocused && !isDroplistOpen) {
         setFocusDroplistTrigger(false);
 

package/src/helperComponents/TreeNode/components/TreeNodeActions.tsx

@@ -1,7 +1,7 @@
 import { Button } from '@cloud-ru/ds-button';
 import { KebabSVG } from '@cloud-ru/ds-icons/interface/system';
 import { Droplist, ItemProps } from '@cloud-ru/ds-list';
-import { Dispatch, KeyboardEventHandler, SetStateAction, useEffect, useRef } from 'react';
+import { Dispatch, FocusEvent, KeyboardEventHandler, SetStateAction, useEffect, useRef } from 'react';
 
 import { TEST_IDS } from '../../../constants';
 import { Size, TreeNodeProps } from '../../../types';
@@ -15,7 +15,7 @@ type TreeNodeActionsProps = {
   node: Omit<TreeNodeProps, 'href'>;
   isDroplistTriggerFocused: boolean;
   focusNode(): void;
-  onBlurActions(): void;
+  onBlurActions(event: FocusEvent<HTMLElement>): void;
   size: Size;
 };
 
@@ -32,6 +32,7 @@ export function TreeNodeActions({
   const droplistActions = getNodeActions(node);
 
   const localRef = useRef<HTMLButtonElement>(null);
+  const returnFocusTimerRef = useRef<ReturnType<typeof setTimeout>>();
 
   useEffect(() => {
     if (localRef.current && isDroplistTriggerFocused) {
@@ -39,6 +40,13 @@ export function TreeNodeActions({
     }
   }, [isDroplistTriggerFocused, localRef]);
 
+  useEffect(
+    () => () => {
+      clearTimeout(returnFocusTimerRef.current);
+    },
+    [],
+  );
+
   const handleKeyDown: KeyboardEventHandler<HTMLElement> = e => {
     switch (e.key) {
       case 'Tab': {
@@ -71,6 +79,8 @@ export function TreeNodeActions({
         return;
       }
       case 'ArrowUp': {
+        // onOpenChange уже поставил возврат фокуса на строку — здесь фокус остаётся на kebab.
+        clearTimeout(returnFocusTimerRef.current);
         setDroplistOpen(false);
         localRef.current?.focus();
 
@@ -99,14 +109,17 @@ export function TreeNodeActions({
         open={isDroplistOpen}
         onOpenChange={open => {
           setDroplistOpen(open);
-          // Закрытие дроплиста (по клику в пункт, ESC, outside-click) должно
-          // вернуть фокус на строку и снять `isDroplistTriggerFocused` —
-          // иначе kebab остаётся в visible-hover-состоянии. Tab и ArrowLeft
-          // уже делают это сами; для пути через `closeDroplistOnItemClick`
-          // ресет навешиваем здесь.
-          if (!open) {
-            focusNode();
+
+          if (open) {
+            return;
           }
+
+          // Droplist возвращает фокус на триггер после onOpenChange: синхронно
+          // при выборе пункта и через setTimeout(0) при Escape. Возврат на строку
+          // ставим следующим тиком, чтобы он шёл после обоих. Tab и ArrowLeft
+          // фокусируют строку сами и до onOpenChange не доходят.
+          clearTimeout(returnFocusTimerRef.current);
+          returnFocusTimerRef.current = setTimeout(focusNode);
         }}
         items={droplistActions}
         closeDroplistOnItemClick