diff --git a/src/components/DualSpreadsheet/DualSpreadsheet.tsx b/src/components/DualSpreadsheet/DualSpreadsheet.tsx index ec0c892..cf53781 100644 --- a/src/components/DualSpreadsheet/DualSpreadsheet.tsx +++ b/src/components/DualSpreadsheet/DualSpreadsheet.tsx @@ -214,9 +214,16 @@ const Cell = memo( onCellValueChange(e.target.value)} - onBlur={() => stopEditing(true)} + onBlur={(e) => { + // Проверяем, не переходит ли фокус в formula bar + const relatedTarget = e.relatedTarget as HTMLElement + if (relatedTarget && relatedTarget.closest('.formula-bar')) { + return // Не завершаем редактирование + } + stopEditing(true) + }} onKeyDown={(e) => { if (e.key === 'Enter') { e.preventDefault() @@ -266,7 +273,7 @@ interface FormulaBarProps { isEditing: boolean onValueChange: (value: string) => void onFocus: () => void - onBlur: () => void + onBlur: (e: React.FocusEvent) => void onKeyDown: (e: React.KeyboardEvent) => void formulaBarRef: (el: HTMLInputElement | null) => void } @@ -286,7 +293,7 @@ const FormulaBar = memo( // Теперь FormulaBar всегда отображается, так как он один return ( -
+
@@ -321,7 +328,17 @@ const FormulaBar = memo( value={formulaBarValue} onChange={(e) => onValueChange(e.target.value)} onFocus={onFocus} - onBlur={onBlur} + onBlur={(e) => { + // Проверяем, не переходит ли фокус в ячейку редактирования + const relatedTarget = e.relatedTarget as HTMLElement + if ( + relatedTarget && + relatedTarget.closest('input[type="text"]') + ) { + return // Не завершаем редактирование + } + onBlur(e) + }} onKeyDown={onKeyDown} /> {isCalculating && ( @@ -848,6 +865,13 @@ const DualSpreadsheet: FC = ({ } }, [isEditing]) + // Синхронизация между formula bar и ячейкой при редактировании + useEffect(() => { + if (isEditing && formulaBarRef.current) { + formulaBarRef.current.value = editingValue + } + }, [editingValue, isEditing]) + const startEditing = useCallback(() => { if (!selectedCell) return const sheetName = SHEET_NAMES[activeSheet] @@ -1015,11 +1039,20 @@ const DualSpreadsheet: FC = ({ } }, [selectedCell, isEditing, startEditing]) - const handleFormulaBarBlur = useCallback(() => { - if (isEditing) { - stopEditing(true) - } - }, [isEditing, stopEditing]) + const handleFormulaBarBlur = useCallback( + (e: React.FocusEvent) => { + // Проверяем, не переходит ли фокус в ячейку редактирования + const relatedTarget = e.relatedTarget as HTMLElement + if (relatedTarget && relatedTarget.closest('input[type="text"]')) { + return // Не завершаем редактирование + } + // Завершаем редактирование только если фокус ушел полностью + if (isEditing) { + stopEditing(true) + } + }, + [isEditing, stopEditing], + ) const handleFormulaBarKeyDown = useCallback( (e: React.KeyboardEvent) => {