diff --git a/src/OrgAst.module.css b/src/OrgAst.module.css index e12209d..c4c5eb9 100644 --- a/src/OrgAst.module.css +++ b/src/OrgAst.module.css @@ -38,7 +38,6 @@ .OrgAstNode.hovered:not(.selected) { > .OrgAstNodeType { background: #70f8ba; - cursor: pointer; } } @@ -46,6 +45,7 @@ background: #6ccff6; padding: 3px; overflow: hidden; + cursor: pointer; > span:first-child { font-size: 1.1rem; diff --git a/src/OrgAst.tsx b/src/OrgAst.tsx index 99dc827..cd72319 100644 --- a/src/OrgAst.tsx +++ b/src/OrgAst.tsx @@ -14,9 +14,16 @@ const OrgAst = (props: { const [hoveredNode, setHoveredNode] = useState(null); function selectNode(uid: string, start: number, end: number) { - const new_node: OrgNodeReference = { uid: uid, start: start, end: end }; - props.setHighlight([new_node, hoveredNode].filter((node) => node !== null)); - setSelectedNode({ uid: uid, start: start, end: end }); + if (selectedNode !== null && selectedNode.uid === uid) { + props.setHighlight([hoveredNode].filter((node) => node !== null)); + setSelectedNode(null); + } else { + const new_node: OrgNodeReference = { uid: uid, start: start, end: end }; + props.setHighlight( + [new_node, hoveredNode].filter((node) => node !== null), + ); + setSelectedNode({ uid: uid, start: start, end: end }); + } } function startHoverNode(uid: string, start: number, end: number) {