I added the crosshairs tool with the custom button, and then I want to click the button again to remove the crosshairs function and restore the original style, but now I can’t restore the state without crosshairs.
my code:
- this is add crosshairs, is successful
 
// add crosshairs
const addedToolNames = [
            StackScrollMouseWheelTool,
            WindowLevelTool,
            ZoomTool,
            MagnifyTool,
            PanTool,
            LengthTool,
            ProbeTool,
            RectangleROITool,
            EllipticalROITool,
            CircleROITool,
            BidirectionalTool,
            AngleTool,
            CobbAngleTool,
            PlanarFreehandROITool,
            SegmentationDisplayTool,
            RectangleScissorsTool,
            CircleScissorsTool,
            SphereScissorsTool,
            BrushTool,
            StackScrollTool
 ];
const toolGroup = ToolGroupManager.getToolGroup(toolGroupId.current);
addedToolNames.forEach(item => {
      cornerstoneTools.removeTool(item);
      toolGroup?.setToolPassive(item.toolName);
  });
  // toolGroup?.setToolPassive(WindowLevelTool.toolName);
  cornerstoneTools.addTool(CrosshairsTool);
  addManipulationBindings(toolGroup);
  // 添加十字工具
  const isMobile = window.matchMedia('(any-pointer:coarse)').matches;
  toolGroup?.addTool(CrosshairsTool.toolName, {
      getReferenceLineColor,
      getReferenceLineControllable,
      getReferenceLineDraggableRotatable,
      getReferenceLineSlabThicknessControlsOn,
      mobile: {
          enabled: isMobile,
          opacity: 0.8,
          handleRadius: 9,
      },
  });
  toolGroup?.setToolActive(CrosshairsTool.toolName, {
      bindings: [{ mouseButton: MouseBindings.Primary }],
  });
  setUpSynchronizers();
- this is remove crosshairs tool, but failed
 
  toolGroup?.setToolPassive(CrosshairsTool.toolName);
  cornerstoneTools.removeTool(CrosshairsTool);
  addedToolNames.forEach(item => {
      toolGroup?.setToolActive(item.toolName);
  });
  addManipulationBindings(toolGroup);