35. Prosta mapa myśli

// Rekurencyjna struktura węzłów
// { id, text, children: [{ id, text, children: [...] }] }

function MindMapNode({ node, onAdd, onEdit, onDelete, depth = 0 }) {
  return (
    <div className={`node depth-${depth}`}>
      <div className="node-content">
        <span>{node.text}</span>
        <button onClick={() => onAdd(node.id)}>+</button>
        <button onClick={() => onEdit(node.id)}>✎</button>
        {depth > 0 && <button onClick={() => onDelete(node.id)}>✕</button>}
      </div>
      {node.children?.length > 0 && (
        <div className="node-children">
          {node.children.map((child) => (
            <MindMapNode
              key={child.id}
              node={child}
              onAdd={onAdd}
              onEdit={onEdit}
              onDelete={onDelete}
              depth={depth + 1}
            />
          ))}
        </div>
      )}
    </div>
  );
}