import React, { memo } from 'react';
import { Handle } from 'reactflow';

const NodeWrapper = memo(({ id, data, selected }) => {
    return (
        <div
            style={{
                ...data.style,
                position: 'relative',
                display: 'flex',
                alignItems: 'center',
                justifyContent: 'center',
                overflow: 'hidden', // Чтобы текст не выходил за границы
                textOverflow: 'ellipsis', // Добавляем многоточие если текст не помещается
                whiteSpace: 'nowrap', // Запрещаем перенос строк
                padding: '0 8px', // Горизонтальный padding для текста
                boxSizing: 'border-box' // Учитываем padding в общей ширине
            }}
            title={data.label} // Простой tooltip при наведении
        >
            {/* Хендл для входящих соединений */}
            <Handle
                type="target"
                position="top"
                style={{ visibility: 'hidden' }}
            />

            {/* Обёртка для текста с ограничением ширины */}
            <div style={{
                maxWidth: '100%',
                overflow: 'hidden',
                textOverflow: 'ellipsis'
            }}>
                {data.label}
            </div>

            {data.hasChildren && (
                <span style={{
                    position: 'absolute',
                    top: 5,
                    right: 5,
                    fontSize: '12px',
                    cursor: 'pointer',
                    background: '#fff',
                    padding: '2px 5px',
                    borderRadius: '3px',
                    border: '1px solid #aaa'
                }}>
                    {data.collapsed ? '+' : '-'}
                </span>
            )}

            {/* Хендл для исходящих соединений */}
            <Handle
                type="source"
                position="bottom"
                style={{ visibility: 'hidden' }}
            />
        </div>
    );
});

export default NodeWrapper;