diff --git a/apps/client/src/widgets/type_widgets/MindMap.tsx b/apps/client/src/widgets/type_widgets/MindMap.tsx
index a20c3bf86..6f4bb5fe7 100644
--- a/apps/client/src/widgets/type_widgets/MindMap.tsx
+++ b/apps/client/src/widgets/type_widgets/MindMap.tsx
@@ -136,22 +136,21 @@ function MindElixir({ content, containerProps, apiRef: externalApiRef, onChange,
 
     // On change listener.
     useEffect(() => {
-        if (!onChange) return;
+        const bus = apiRef.current?.bus;
+        if (!onChange || !bus) return;
 
-        const listener = (operation: Operation) => {
+        const operationListener = (operation: Operation) => {
             if (operation.name !== "beginEdit") {
                 onChange();
             }
         }
-        apiRef.current?.bus.addListener("operation", listener);
 
-        // Direction change buttons don't report change, so we have to hook in manually.
-        const $container = refToJQuerySelector(containerRef);
-        $container.on("click", ".mind-elixir-toolbar.lt", onChange);
+        bus.addListener("operation", operationListener);
+        bus.addListener("changeDirection", onChange);
 
         return () => {
-            $container.off("click", ".mind-elixir-toolbar.lt", onChange);
-            apiRef.current?.bus?.removeListener("operation", listener);
+            bus.removeListener("operation", operationListener);
+            bus.removeListener("changeDirection", onChange);
         };
     }, [ onChange ]);