fix: sync ruler/grid/CC lane scroll via ccWrapperRef

2026-07-25 08:01:55 +07:00
parent eb805c04a4
commit 8dee5c8cdb
2 changed files with 7 additions and 2 deletions
@@ -4416,6 +4416,7 @@ const PianoRollTabEditor = ({ st, zoom, bpm, viewportWidth, onClose, onUpdateNot

  const canvasRef = React.useRef(null);
  const ccCanvasRef = React.useRef(null);
+  const ccWrapperRef = React.useRef(null);
  const gridScrollRef = React.useRef(null);
  const keybedRef = React.useRef(null);
  const rulerScrollRef = React.useRef(null);
@@ -5205,6 +5206,9 @@ const PianoRollTabEditor = ({ st, zoom, bpm, viewportWidth, onClose, onUpdateNot
    if (rulerScrollRef.current) {
      rulerScrollRef.current.scrollLeft = e.currentTarget.scrollLeft;
    }
+    if (ccWrapperRef.current) {
+      ccWrapperRef.current.scrollLeft = e.currentTarget.scrollLeft;
+    }
    const el = e.currentTarget;
    const THRESHOLD = 200;
    if (el.scrollLeft + el.clientWidth >= el.scrollWidth - THRESHOLD) {
@@ -5476,6 +5480,7 @@ const PianoRollTabEditor = ({ st, zoom, bpm, viewportWidth, onClose, onUpdateNot
  }, /*#__PURE__*/React.createElement("div", {
    className: "w-[60px] bg-[#222222] border-r border-zinc-900 flex items-center justify-center text-[10px] text-zinc-500 font-mono shrink-0 font-bold"
  }, ccMode.toUpperCase()), /*#__PURE__*/React.createElement("div", {
+    ref: ccWrapperRef,
    className: "flex-1 overflow-x-hidden min-w-0"
  }, /*#__PURE__*/React.createElement("div", {
    style: {