@canvas-components/gantt-table 0.1.1 → 0.1.2

package/dist/index.cjs

@@ -4,10 +4,199 @@ var __defProp = Object.defineProperty;
 var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
 var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
 
+// src/domain/scroll.ts
+var GANTT_SCROLLBAR_SIZE = 10;
+function resolveGanttViewportLayout(layout, width, height) {
+  const timelineContentWidth = Math.max(
+    layout.totalWidth - layout.taskColumnWidth,
+    0
+  );
+  const bodyContentHeight = Math.max(
+    layout.totalHeight - layout.headerHeight,
+    0
+  );
+  let hasHorizontalScrollbar = timelineContentWidth > Math.max(width - layout.taskColumnWidth, 0);
+  let hasVerticalScrollbar = bodyContentHeight > Math.max(height - layout.headerHeight, 0);
+  for (let index = 0; index < 2; index += 1) {
+    const timelineViewportWidth2 = Math.max(
+      width - layout.taskColumnWidth - (hasVerticalScrollbar ? GANTT_SCROLLBAR_SIZE : 0),
+      0
+    );
+    const bodyViewportHeight2 = Math.max(
+      height - layout.headerHeight - (hasHorizontalScrollbar ? GANTT_SCROLLBAR_SIZE : 0),
+      0
+    );
+    hasHorizontalScrollbar = timelineContentWidth > timelineViewportWidth2 + 1;
+    hasVerticalScrollbar = bodyContentHeight > bodyViewportHeight2 + 1;
+  }
+  const contentRight = Math.max(
+    width - (hasVerticalScrollbar ? GANTT_SCROLLBAR_SIZE : 0),
+    layout.taskColumnWidth
+  );
+  const contentBottom = Math.max(
+    height - (hasHorizontalScrollbar ? GANTT_SCROLLBAR_SIZE : 0),
+    layout.headerHeight
+  );
+  const timelineViewportWidth = Math.max(
+    contentRight - layout.taskColumnWidth,
+    0
+  );
+  const bodyViewportHeight = Math.max(contentBottom - layout.headerHeight, 0);
+  return {
+    width,
+    height,
+    contentRight,
+    contentBottom,
+    timelineViewportWidth,
+    bodyViewportHeight,
+    hasHorizontalScrollbar,
+    hasVerticalScrollbar,
+    bounds: {
+      maxLeft: Math.max(timelineContentWidth - timelineViewportWidth, 0),
+      maxTop: Math.max(bodyContentHeight - bodyViewportHeight, 0)
+    }
+  };
+}
+function resolveGanttScrollBounds(layout, width, height) {
+  return resolveGanttViewportLayout(layout, width, height).bounds;
+}
+function clampGanttScroll(scroll, bounds) {
+  return {
+    left: Math.min(Math.max(scroll.left, 0), bounds.maxLeft),
+    top: Math.min(Math.max(scroll.top, 0), bounds.maxTop)
+  };
+}
+
+// src/domain/scrollbar.ts
+var MIN_THUMB_SIZE = 36;
+function computeGanttScrollbarLayout(params) {
+  const { layout, viewport, scroll } = params;
+  const result = {};
+  if (viewport.hasHorizontalScrollbar) {
+    const barX = layout.taskColumnWidth;
+    const barWidth = Math.max(viewport.contentRight - barX, 0);
+    const decreaseButton = {
+      x: barX,
+      y: viewport.contentBottom,
+      width: Math.min(GANTT_SCROLLBAR_SIZE, barWidth / 2),
+      height: GANTT_SCROLLBAR_SIZE
+    };
+    const increaseButton = {
+      x: Math.max(viewport.contentRight - GANTT_SCROLLBAR_SIZE, barX),
+      y: viewport.contentBottom,
+      width: Math.min(GANTT_SCROLLBAR_SIZE, barWidth / 2),
+      height: GANTT_SCROLLBAR_SIZE
+    };
+    const track = {
+      x: decreaseButton.x + decreaseButton.width,
+      y: viewport.contentBottom,
+      width: Math.max(
+        barWidth - decreaseButton.width - increaseButton.width,
+        0
+      ),
+      height: GANTT_SCROLLBAR_SIZE
+    };
+    const contentWidth = Math.max(
+      layout.totalWidth - layout.taskColumnWidth,
+      1
+    );
+    const thumbWidth = Math.min(
+      Math.max(
+        viewport.timelineViewportWidth / contentWidth * track.width,
+        MIN_THUMB_SIZE
+      ),
+      track.width
+    );
+    const available = Math.max(track.width - thumbWidth, 0);
+    result.horizontal = {
+      decreaseButton,
+      increaseButton,
+      track,
+      thumb: {
+        x: track.x + (viewport.bounds.maxLeft === 0 ? 0 : scroll.left / viewport.bounds.maxLeft * available),
+        y: track.y,
+        width: thumbWidth,
+        height: track.height
+      }
+    };
+  }
+  if (viewport.hasVerticalScrollbar) {
+    const barY = layout.headerHeight;
+    const barHeight = Math.max(viewport.contentBottom - barY, 0);
+    const decreaseButton = {
+      x: viewport.contentRight,
+      y: barY,
+      width: GANTT_SCROLLBAR_SIZE,
+      height: Math.min(GANTT_SCROLLBAR_SIZE, barHeight / 2)
+    };
+    const increaseButton = {
+      x: viewport.contentRight,
+      y: Math.max(viewport.contentBottom - GANTT_SCROLLBAR_SIZE, barY),
+      width: GANTT_SCROLLBAR_SIZE,
+      height: Math.min(GANTT_SCROLLBAR_SIZE, barHeight / 2)
+    };
+    const track = {
+      x: viewport.contentRight,
+      y: decreaseButton.y + decreaseButton.height,
+      width: GANTT_SCROLLBAR_SIZE,
+      height: Math.max(
+        barHeight - decreaseButton.height - increaseButton.height,
+        0
+      )
+    };
+    const contentHeight = Math.max(layout.totalHeight - layout.headerHeight, 1);
+    const thumbHeight = Math.min(
+      Math.max(
+        viewport.bodyViewportHeight / contentHeight * track.height,
+        MIN_THUMB_SIZE
+      ),
+      track.height
+    );
+    const available = Math.max(track.height - thumbHeight, 0);
+    result.vertical = {
+      decreaseButton,
+      increaseButton,
+      track,
+      thumb: {
+        x: track.x,
+        y: track.y + (viewport.bounds.maxTop === 0 ? 0 : scroll.top / viewport.bounds.maxTop * available),
+        width: track.width,
+        height: thumbHeight
+      }
+    };
+  }
+  return result;
+}
+function hitTestGanttScrollbar(x, y, layout) {
+  for (const axis of ["horizontal", "vertical"]) {
+    const scrollbar = layout[axis];
+    if (!scrollbar) continue;
+    for (const role of [
+      "thumb",
+      "decrease-button",
+      "increase-button",
+      "track"
+    ]) {
+      const rect = role === "decrease-button" ? scrollbar.decreaseButton : role === "increase-button" ? scrollbar.increaseButton : scrollbar[role];
+      if (isPointInRect(x, y, rect)) return { axis, role };
+    }
+  }
+  return null;
+}
+function isPointInRect(x, y, rect) {
+  return x >= rect.x && x <= rect.x + rect.width && y >= rect.y && y <= rect.y + rect.height;
+}
+
 // src/domain/date.ts
 var toTimestamp = (value) => {
-  const timestamp = value instanceof Date ? value.getTime() : new Date(value).getTime();
-  if (!Number.isFinite(timestamp)) throw new Error(`Invalid date value: ${String(value)}`);
+  const dateOnlyMatch = typeof value === "string" ? /^(\d{4})-(\d{2})-(\d{2})$/.exec(value) : null;
+  const timestamp = dateOnlyMatch ? new Date(
+    Number(dateOnlyMatch[1]),
+    Number(dateOnlyMatch[2]) - 1,
+    Number(dateOnlyMatch[3])
+  ).getTime() : value instanceof Date ? value.getTime() : new Date(value).getTime();
+  if (!Number.isFinite(timestamp))
+    throw new Error(`Invalid date value: ${String(value)}`);
   return timestamp;
 };
 var dayMs = 24 * 60 * 60 * 1e3;
@@ -16,35 +205,1944 @@ function startOfDay(timestamp) {
   date.setHours(0, 0, 0, 0);
   return date.getTime();
 }
-function formatDate(timestamp) {
-  return new Intl.DateTimeFormat("zh-CN", { month: "2-digit", day: "2-digit" }).format(new Date(timestamp));
+
+// src/domain/task-rows.ts
+function resolveGanttRowTasks(row, multiTask) {
+  return multiTask ? row.tasks ?? [] : [row];
+}
+function findGanttTaskById(rows, taskId) {
+  if (!taskId) return null;
+  for (const row of rows) {
+    if (row.id === taskId) return row;
+    const task = row.tasks?.find((item) => item.id === taskId);
+    if (task) return task;
+  }
+  return null;
+}
+function findGanttLayoutTask(layout, taskId) {
+  if (!taskId) return null;
+  for (const row of layout.rows) {
+    const task = row.tasks.find((item) => item.id === taskId);
+    if (task) return { row, task };
+  }
+  return null;
 }
 
 // src/domain/layout.ts
 function resolveDayWidth(scale) {
-  return scale === "month" ? 42 : scale === "week" ? 28 : 80;
+  return scale === "month" ? 12 : scale === "week" ? 28 : 80;
 }
-function buildGanttLayout(options, width) {
-  const timestamps = options.tasks.flatMap((task) => [toTimestamp(task.start), toTimestamp(task.end)]);
-  const start = startOfDay(toTimestamp(options.startDate ?? Math.min(...timestamps, Date.now())));
-  const end = startOfDay(toTimestamp(options.endDate ?? Math.max(...timestamps, Date.now()) + dayMs));
-  const dayWidth = resolveDayWidth(options.scale ?? "day");
+function buildGanttLayout(options, _width) {
+  const timestamps = options.tasks.flatMap(
+    (row) => resolveGanttRowTasks(row, options.multiTask === true).flatMap(
+      (task) => task.start != null && task.end != null ? [toTimestamp(task.start), toTimestamp(task.end)] : []
+    )
+  );
+  const fallbackStart = timestamps.length > 0 ? Math.min(...timestamps) : Date.now();
+  const fallbackEnd = timestamps.length > 0 ? Math.max(...timestamps) : fallbackStart + dayMs;
+  const rawStart = startOfDay(toTimestamp(options.startDate ?? fallbackStart));
+  const rawEnd = startOfDay(
+    toTimestamp(options.endDate ?? fallbackEnd + dayMs)
+  );
+  const scale = options.scale ?? "day";
+  const { start, end } = resolveScaleRange(rawStart, rawEnd, scale);
+  const dayWidth = resolveDayWidth(scale);
   const days = Math.max(1, Math.ceil((end - start) / dayMs));
   const taskColumnWidth = options.taskColumnWidth ?? 220;
-  const rows = options.tasks.map((task, index) => ({ task, index, y: (options.headerHeight ?? 56) + index * (options.rowHeight ?? 36) }));
-  return { start, end, dayWidth, rowHeight: options.rowHeight ?? 36, headerHeight: options.headerHeight ?? 56, taskColumnWidth, rows, totalWidth: taskColumnWidth + days * dayWidth, totalHeight: (options.headerHeight ?? 56) + options.tasks.length * (options.rowHeight ?? 36) };
+  const headerLevels = resolveHeaderLevelLayouts(options, scale);
+  const headerHeight = headerLevels.reduce(
+    (total, level) => total + level.height,
+    0
+  );
+  const rows = options.tasks.map((task, index) => ({
+    task,
+    tasks: resolveGanttRowTasks(task, options.multiTask === true),
+    index,
+    y: headerHeight + index * (options.rowHeight ?? 36)
+  }));
+  return {
+    scale,
+    start,
+    end,
+    dayWidth,
+    rowHeight: options.rowHeight ?? 36,
+    headerHeight,
+    headerLevels,
+    taskColumnWidth,
+    rows,
+    totalWidth: taskColumnWidth + days * dayWidth,
+    totalHeight: headerHeight + options.tasks.length * (options.rowHeight ?? 36)
+  };
+}
+function fitGanttLayoutToTimelineWidth(layout, timelineViewportWidth) {
+  const timelineWidth = Math.max(layout.totalWidth - layout.taskColumnWidth, 0);
+  if (timelineViewportWidth <= timelineWidth || timelineViewportWidth <= 0) {
+    return layout;
+  }
+  const days = Math.max(1, Math.ceil((layout.end - layout.start) / dayMs));
+  return {
+    ...layout,
+    dayWidth: timelineViewportWidth / days,
+    totalWidth: layout.taskColumnWidth + timelineViewportWidth
+  };
+}
+function resolveHeaderLevelLayouts(options, scale) {
+  const defaultHeight = Math.max(options.headerHeight ?? 56, 1);
+  const levels = options.headerLevels?.length ? options.headerLevels : [{ unit: scale }];
+  let y = 0;
+  return levels.map((level) => {
+    const height = Math.max(level.height ?? defaultHeight, 1);
+    const result = { ...level, y, height };
+    y += height;
+    return result;
+  });
+}
+function resolveScaleRange(start, end, scale) {
+  if (scale === "day") return { start, end };
+  const startDate = new Date(start);
+  const endDate = new Date(end);
+  if (scale === "week") {
+    const startDay = (startDate.getDay() + 6) % 7;
+    startDate.setDate(startDate.getDate() - startDay);
+    const endDay = (endDate.getDay() + 6) % 7;
+    if (endDay !== 0) endDate.setDate(endDate.getDate() + 7 - endDay);
+    return { start: startDate.getTime(), end: endDate.getTime() };
+  }
+  startDate.setDate(1);
+  if (endDate.getDate() !== 1) {
+    endDate.setMonth(endDate.getMonth() + 1, 1);
+  }
+  return { start: startDate.getTime(), end: endDate.getTime() };
 }
 function xForDate(timestamp, layout) {
   return layout.taskColumnWidth + (timestamp - layout.start) / dayMs * layout.dayWidth;
 }
 
-// src/interaction/hit-test.ts
-function hitTestTask(x, y, layout) {
-  const row = layout.rows.find((item) => y >= item.y && y < item.y + layout.rowHeight);
+// src/domain/task-geometry.ts
+var RESIZE_HANDLE_HIT_WIDTH = 8;
+function hasTaskSchedule(task) {
+  return task.start != null && task.end != null;
+}
+function clearTaskSchedule(task) {
+  delete task.start;
+  delete task.end;
+}
+function resolveTaskBarRect(task, rowY, layout) {
+  if (!hasTaskSchedule(task)) {
+    throw new Error(`Task ${task.id} does not have a schedule.`);
+  }
+  const start = toTimestamp(task.start);
+  const end = Math.max(start + dayMs, toTimestamp(task.end));
+  return {
+    x: xForDate(start, layout),
+    y: rowY + 8,
+    width: Math.max(8, (end - start) / dayMs * layout.dayWidth),
+    height: Math.max(layout.rowHeight - 16, 4)
+  };
+}
+function hitTestTaskBar(params) {
+  const row = params.layout.rows.find(
+    (item) => params.y >= item.y && params.y < item.y + params.layout.rowHeight
+  );
   if (!row) return null;
-  const start = xForDate(toTimestamp(row.task.start), layout);
-  const end = xForDate(toTimestamp(row.task.end), layout);
-  return x >= start && x <= end ? row.task : null;
+  for (let index = row.tasks.length - 1; index >= 0; index -= 1) {
+    const task = row.tasks[index];
+    if (!task || !hasTaskSchedule(task)) continue;
+    const rect = resolveTaskBarRect(task, row.y, params.layout);
+    if (params.y < rect.y || params.y > rect.y + rect.height || params.x < rect.x - RESIZE_HANDLE_HIT_WIDTH / 2 || params.x > rect.x + rect.width + RESIZE_HANDLE_HIT_WIDTH / 2) {
+      continue;
+    }
+    if (params.resizable && task.id === params.selectedId) {
+      if (Math.abs(params.x - rect.x) <= RESIZE_HANDLE_HIT_WIDTH) {
+        return { task, role: "resize-start" };
+      }
+      if (Math.abs(params.x - (rect.x + rect.width)) <= RESIZE_HANDLE_HIT_WIDTH) {
+        return { task, role: "resize-end" };
+      }
+    }
+    return { task, role: "body" };
+  }
+  return null;
+}
+function resolveTaskCreateRange(params) {
+  const lastDayStart = Math.max(params.layout.end - dayMs, params.layout.start);
+  const timestampForX = (x) => {
+    const dayIndex = Math.floor(
+      (x - params.layout.taskColumnWidth) / params.layout.dayWidth
+    );
+    return Math.min(
+      Math.max(params.layout.start + dayIndex * dayMs, params.layout.start),
+      lastDayStart
+    );
+  };
+  const anchor = timestampForX(params.anchorX);
+  const current = timestampForX(params.currentX);
+  return {
+    start: Math.min(anchor, current),
+    end: Math.min(Math.max(anchor, current) + dayMs, params.layout.end)
+  };
+}
+function resolveTaskTimeDelta(deltaX, layout, snapToColumn, anchorTimestamp) {
+  const rawDays = deltaX / layout.dayWidth;
+  const rawDelta = rawDays * dayMs;
+  if (!snapToColumn) return rawDelta;
+  const anchor = anchorTimestamp ?? layout.start;
+  const target = anchor + rawDelta;
+  const snappedTarget = layout.start + Math.round((target - layout.start) / dayMs) * dayMs;
+  return snappedTarget - anchor;
+}
+function resolveTaskDragRange(params) {
+  const { mode, originalStart, originalEnd } = params;
+  const minStart = params.minStart ?? Number.NEGATIVE_INFINITY;
+  const maxEnd = params.maxEnd ?? Number.POSITIVE_INFINITY;
+  if (mode === "resize-start") {
+    return {
+      start: Math.max(
+        minStart,
+        Math.min(originalStart + params.delta, originalEnd - dayMs)
+      ),
+      end: originalEnd
+    };
+  }
+  if (mode === "resize-end") {
+    return {
+      start: originalStart,
+      end: Math.min(
+        maxEnd,
+        Math.max(originalEnd + params.delta, originalStart + dayMs)
+      )
+    };
+  }
+  const delta = Math.min(
+    Math.max(params.delta, minStart - originalStart),
+    maxEnd - originalEnd
+  );
+  return {
+    start: originalStart + delta,
+    end: originalEnd + delta
+  };
+}
+
+// src/domain/dependency-geometry.ts
+var CONNECTOR_GAP = 12;
+function resolveDependencyRoute(params) {
+  const type = params.type ?? "finish-to-start";
+  const fromY = params.from.y + params.from.height / 2;
+  const toY = params.to.y + params.to.height / 2;
+  const fromLeft = params.from.x;
+  const fromRight = params.from.x + params.from.width;
+  const toLeft = params.to.x;
+  const toRight = params.to.x + params.to.width;
+  if (type === "start-to-start") {
+    const outerX = Math.min(fromLeft, toLeft) - CONNECTOR_GAP;
+    return {
+      points: [
+        { x: fromLeft, y: fromY },
+        { x: outerX, y: fromY },
+        { x: outerX, y: toY },
+        { x: toLeft, y: toY }
+      ],
+      arrowDirection: "right"
+    };
+  }
+  if (type === "finish-to-finish") {
+    const outerX = Math.max(fromRight, toRight) + CONNECTOR_GAP;
+    return {
+      points: [
+        { x: fromRight, y: fromY },
+        { x: outerX, y: fromY },
+        { x: outerX, y: toY },
+        { x: toRight, y: toY }
+      ],
+      arrowDirection: "left"
+    };
+  }
+  const sourceExitX = fromRight + CONNECTOR_GAP;
+  const targetEntryX = toLeft - CONNECTOR_GAP;
+  if (sourceExitX <= targetEntryX) {
+    const middleX = (sourceExitX + targetEntryX) / 2;
+    return {
+      points: [
+        { x: fromRight, y: fromY },
+        { x: middleX, y: fromY },
+        { x: middleX, y: toY },
+        { x: toLeft, y: toY }
+      ],
+      arrowDirection: "right"
+    };
+  }
+  const rowDirection = toY >= fromY ? 1 : -1;
+  const channelY = fromY === toY ? fromY - Math.max(params.rowHeight / 2, CONNECTOR_GAP) : fromY + params.rowHeight / 2 * rowDirection;
+  return {
+    points: [
+      { x: fromRight, y: fromY },
+      { x: sourceExitX, y: fromY },
+      { x: sourceExitX, y: channelY },
+      { x: targetEntryX, y: channelY },
+      { x: targetEntryX, y: toY },
+      { x: toLeft, y: toY }
+    ],
+    arrowDirection: "right"
+  };
+}
+function resolveDependencyLayoutRoute(dependency, layout, rowOffsets) {
+  const from = findGanttLayoutTask(layout, dependency.from);
+  const to = findGanttLayoutTask(layout, dependency.to);
+  if (!from || !to || !hasTaskSchedule(from.task) || !hasTaskSchedule(to.task)) {
+    return null;
+  }
+  return resolveDependencyRoute({
+    from: resolveTaskBarRect(
+      from.task,
+      from.row.y + (rowOffsets?.get(from.row.task.id) ?? 0),
+      layout
+    ),
+    to: resolveTaskBarRect(
+      to.task,
+      to.row.y + (rowOffsets?.get(to.row.task.id) ?? 0),
+      layout
+    ),
+    rowHeight: layout.rowHeight,
+    type: dependency.type
+  });
+}
+function hitTestGanttDependency(params) {
+  const tolerance = params.tolerance ?? 6;
+  for (let index = params.dependencies.length - 1; index >= 0; index -= 1) {
+    const dependency = params.dependencies[index];
+    if (!dependency) continue;
+    const route = resolveDependencyLayoutRoute(dependency, params.layout);
+    if (!route) continue;
+    for (let pointIndex = 1; pointIndex < route.points.length; pointIndex += 1) {
+      const start = route.points[pointIndex - 1];
+      const end = route.points[pointIndex];
+      if (start && end && distanceToSegment(params.x, params.y, start.x, start.y, end.x, end.y) <= tolerance) {
+        return { dependency, index, route };
+      }
+    }
+  }
+  return null;
+}
+function distanceToSegment(x, y, startX, startY, endX, endY) {
+  const deltaX = endX - startX;
+  const deltaY = endY - startY;
+  const lengthSquared = deltaX * deltaX + deltaY * deltaY;
+  if (lengthSquared === 0) return Math.hypot(x - startX, y - startY);
+  const ratio = Math.min(
+    Math.max(
+      ((x - startX) * deltaX + (y - startY) * deltaY) / lengthSquared,
+      0
+    ),
+    1
+  );
+  return Math.hypot(
+    x - (startX + ratio * deltaX),
+    y - (startY + ratio * deltaY)
+  );
+}
+
+// src/domain/dependency-edit.ts
+var CONNECTOR_OFFSET = 10;
+var CONNECTOR_HIT_RADIUS = 8;
+function resolveTaskDependencyAnchors(task, rowY, layout) {
+  if (!hasTaskSchedule(task)) return null;
+  const rect = resolveTaskBarRect(task, rowY, layout);
+  const y = rect.y + rect.height / 2;
+  return [
+    { task, side: "start", x: rect.x - CONNECTOR_OFFSET, y },
+    {
+      task,
+      side: "finish",
+      x: rect.x + rect.width + CONNECTOR_OFFSET,
+      y
+    }
+  ];
+}
+function hitTestTaskDependencyAnchor(params) {
+  const result = findGanttLayoutTask(params.layout, params.selectedTaskId);
+  if (!result) return null;
+  const anchors = resolveTaskDependencyAnchors(
+    result.task,
+    result.row.y,
+    params.layout
+  );
+  return anchors?.find(
+    (anchor) => Math.hypot(params.x - anchor.x, params.y - anchor.y) <= CONNECTOR_HIT_RADIUS
+  ) ?? null;
+}
+function resolveDependencyType(sourceSide, targetSide) {
+  if (sourceSide === "start") {
+    return targetSide === "start" ? "start-to-start" : null;
+  }
+  return targetSide === "finish" ? "finish-to-finish" : "finish-to-start";
+}
+function resolveDependencyDropTarget(params) {
+  const row = params.layout.rows.find(
+    (item) => params.y >= item.y && params.y < item.y + params.layout.rowHeight
+  );
+  if (!row) return null;
+  for (let index = row.tasks.length - 1; index >= 0; index -= 1) {
+    const task = row.tasks[index];
+    if (!task || task.id === params.sourceTaskId || !hasTaskSchedule(task)) {
+      continue;
+    }
+    const rect = resolveTaskBarRect(task, row.y, params.layout);
+    if (params.x < rect.x - CONNECTOR_HIT_RADIUS || params.x > rect.x + rect.width + CONNECTOR_HIT_RADIUS) {
+      continue;
+    }
+    const targetSide = params.x < rect.x + rect.width / 2 ? "start" : "finish";
+    const type = resolveDependencyType(params.sourceSide, targetSide);
+    if (!type) continue;
+    return {
+      task,
+      side: targetSide,
+      type,
+      x: targetSide === "start" ? rect.x : rect.x + rect.width,
+      y: rect.y + rect.height / 2
+    };
+  }
+  return null;
+}
+function upsertGanttDependency(dependencies, dependency) {
+  const index = dependencies.findIndex(
+    (item) => item.from === dependency.from && item.to === dependency.to
+  );
+  if (index < 0) {
+    return {
+      dependencies: [...dependencies, dependency],
+      index: dependencies.length
+    };
+  }
+  const next = dependencies.slice();
+  next[index] = { ...dependencies[index], ...dependency };
+  return { dependencies: next, index };
+}
+function removeGanttDependency(dependencies, index) {
+  return dependencies.filter((_, itemIndex) => itemIndex !== index);
+}
+
+// src/domain/row-drag.ts
+function resolveRowDragTargetIndex(params) {
+  const rowHeight = Math.max(params.rowHeight, 1);
+  return Math.min(
+    Math.max(
+      Math.round(params.fromIndex + params.pointerDeltaY / rowHeight),
+      0
+    ),
+    Math.max(params.rowCount - 1, 0)
+  );
+}
+function resolveRowDragTargetOffset(params) {
+  const { rowIndex, fromIndex, targetIndex, rowHeight } = params;
+  if (rowIndex === fromIndex) return 0;
+  if (targetIndex > fromIndex && rowIndex > fromIndex && rowIndex <= targetIndex) {
+    return -rowHeight;
+  }
+  if (targetIndex < fromIndex && rowIndex >= targetIndex && rowIndex < fromIndex) {
+    return rowHeight;
+  }
+  return 0;
+}
+function reorderGanttTasks(tasks, fromIndex, targetIndex) {
+  if (fromIndex === targetIndex || fromIndex < 0 || fromIndex >= tasks.length || targetIndex < 0 || targetIndex >= tasks.length) {
+    return tasks.slice();
+  }
+  const reordered = tasks.slice();
+  const [task] = reordered.splice(fromIndex, 1);
+  if (task) reordered.splice(targetIndex, 0, task);
+  return reordered;
+}
+
+// src/interaction/wheel-scroll.ts
+var WHEEL_DELTA_MODE_PIXEL = 0;
+var WHEEL_DELTA_MODE_LINE = 1;
+var WHEEL_DELTA_MODE_PAGE = 2;
+function normalizeWheelDeltaToPixels(params) {
+  const delta = Number.isFinite(params.delta) ? params.delta : 0;
+  const lineHeight = Math.max(params.lineHeight, 1);
+  const pageSize = Math.max(params.pageSize, 1);
+  if (params.deltaMode === WHEEL_DELTA_MODE_LINE) return delta * lineHeight;
+  if (params.deltaMode === WHEEL_DELTA_MODE_PAGE) return delta * pageSize;
+  return delta;
+}
+function softenWheelDeltaPixels(params) {
+  const { delta } = params;
+  if (delta === 0) return 0;
+  const absoluteDelta = Math.abs(delta);
+  const lineHeight = Math.max(params.lineHeight, 1);
+  if (params.deltaMode === WHEEL_DELTA_MODE_PIXEL && absoluteDelta >= 80 && absoluteDelta <= 160) {
+    return delta * 0.42;
+  }
+  if (params.deltaMode === WHEEL_DELTA_MODE_LINE) {
+    const maxStep = Math.max(lineHeight * 0.75, 24);
+    if (absoluteDelta <= maxStep) return delta * 0.72;
+    return Math.sign(delta) * (maxStep + (absoluteDelta - maxStep) * 0.35);
+  }
+  const softThreshold = Math.max(lineHeight * 1.25, 48);
+  if (absoluteDelta <= softThreshold) return delta;
+  return Math.sign(delta) * (softThreshold + (absoluteDelta - softThreshold) * 0.4);
+}
+function resolveWheelScrollDelta(params) {
+  const rawX = softenWheelDeltaPixels({
+    delta: normalizeWheelDeltaToPixels({
+      delta: params.deltaX,
+      deltaMode: params.deltaMode,
+      lineHeight: params.lineHeight,
+      pageSize: params.pageWidth
+    }),
+    deltaMode: params.deltaMode,
+    lineHeight: params.lineHeight
+  });
+  const rawY = softenWheelDeltaPixels({
+    delta: normalizeWheelDeltaToPixels({
+      delta: params.deltaY,
+      deltaMode: params.deltaMode,
+      lineHeight: params.lineHeight,
+      pageSize: params.pageHeight
+    }),
+    deltaMode: params.deltaMode,
+    lineHeight: params.lineHeight
+  });
+  return params.shiftKey ? { left: rawX + rawY, top: 0 } : { left: rawX, top: rawY };
+}
+function shouldApplyWheelDeltaImmediately(params) {
+  if (params.deltaMode !== WHEEL_DELTA_MODE_PIXEL) return false;
+  return Math.abs(params.deltaX) < 40 && Math.abs(params.deltaY) < 40;
+}
+function advanceWheelScrollSmoothing(params) {
+  const timeConstant = Math.max(params.timeConstantMs ?? 92, 1);
+  const deltaMs = Math.max(Math.min(params.deltaMs, 64), 0);
+  const alpha = 1 - Math.exp(-deltaMs / timeConstant);
+  const nextLeft = params.current.left + (params.target.left - params.current.left) * alpha;
+  const nextTop = params.current.top + (params.target.top - params.current.top) * alpha;
+  const done = Math.abs(params.target.left - nextLeft) < 0.35 && Math.abs(params.target.top - nextTop) < 0.35;
+  return {
+    nextScroll: done ? { left: params.target.left, top: params.target.top } : { left: nextLeft, top: nextTop },
+    done
+  };
+}
+
+// src/engine/wheel-scroll-controller.ts
+var GanttWheelScrollController = class {
+  constructor(host) {
+    __publicField(this, "host", host);
+  }
+  /** 消费滚轮输入，并根据设备特征选择即时或平滑滚动。 */
+  handleWheel(event) {
+    const { runtime } = this.host;
+    if (!runtime.layout || !runtime.viewport) return;
+    event.preventDefault();
+    const lineHeight = this.host.getOptions().rowHeight ?? 36;
+    const delta = resolveWheelScrollDelta({
+      deltaX: event.deltaX,
+      deltaY: event.deltaY,
+      deltaMode: event.deltaMode,
+      shiftKey: event.shiftKey,
+      lineHeight,
+      pageWidth: runtime.viewport.timelineViewportWidth,
+      pageHeight: runtime.viewport.bodyViewportHeight
+    });
+    if (delta.left === 0 && delta.top === 0) return;
+    const base = runtime.wheelScrollTarget ?? runtime.scroll;
+    const target = clampGanttScroll(
+      { left: base.left + delta.left, top: base.top + delta.top },
+      runtime.viewport.bounds
+    );
+    if (shouldApplyWheelDeltaImmediately({
+      deltaX: event.deltaX,
+      deltaY: event.deltaY,
+      deltaMode: event.deltaMode
+    })) {
+      this.stop();
+      if (target.left !== runtime.scroll.left || target.top !== runtime.scroll.top) {
+        runtime.scroll = target;
+        this.host.render();
+      }
+      return;
+    }
+    if (target.left === runtime.scroll.left && target.top === runtime.scroll.top && runtime.wheelScrollFrameId == null) {
+      return;
+    }
+    runtime.wheelScrollTarget = target;
+    if (runtime.wheelScrollFrameId == null) {
+      runtime.wheelScrollLastTime = performance.now();
+      this.scheduleNextFrame();
+    }
+  }
+  /** 停止尚未完成的滚轮缓动。 */
+  stop() {
+    const { runtime } = this.host;
+    if (runtime.wheelScrollFrameId != null) {
+      cancelAnimationFrame(runtime.wheelScrollFrameId);
+    }
+    runtime.wheelScrollFrameId = null;
+    runtime.wheelScrollTarget = null;
+    runtime.wheelScrollLastTime = 0;
+  }
+  scheduleNextFrame() {
+    this.host.runtime.wheelScrollFrameId = requestAnimationFrame(() => {
+      this.advanceFrame();
+    });
+  }
+  advanceFrame() {
+    const { runtime } = this.host;
+    runtime.wheelScrollFrameId = null;
+    const pendingTarget = runtime.wheelScrollTarget;
+    if (!pendingTarget || !runtime.viewport) return;
+    const target = clampGanttScroll(pendingTarget, runtime.viewport.bounds);
+    runtime.wheelScrollTarget = target;
+    const now = performance.now();
+    const { nextScroll, done } = advanceWheelScrollSmoothing({
+      current: runtime.scroll,
+      target,
+      deltaMs: now - runtime.wheelScrollLastTime
+    });
+    runtime.wheelScrollLastTime = now;
+    runtime.scroll = nextScroll;
+    this.host.render();
+    if (done) {
+      runtime.wheelScrollTarget = null;
+      runtime.wheelScrollLastTime = 0;
+      return;
+    }
+    this.scheduleNextFrame();
+  }
+};
+
+// src/engine/event-controller.ts
+var GanttEventController = class {
+  constructor(host) {
+    __publicField(this, "host", host);
+    __publicField(this, "wheelScrollController");
+    __publicField(this, "rowDragFrameId", null);
+    __publicField(this, "handlePointerDown", (event) => {
+      this.wheelScrollController.stop();
+      const { runtime } = this.host;
+      if (!runtime.layout || !runtime.viewport) return;
+      const point = this.point(event);
+      this.host.canvas.focus({ preventScroll: true });
+      const scrollbarHit = hitTestGanttScrollbar(
+        point.x,
+        point.y,
+        runtime.scrollbars
+      );
+      if (scrollbarHit) {
+        this.handleScrollbarPointerDown(
+          event,
+          scrollbarHit.axis,
+          scrollbarHit.role,
+          scrollbarHit.axis === "horizontal" ? point.x : point.y
+        );
+        return;
+      }
+      if (this.isTaskColumnResizeHandle(point.x, point.y)) {
+        const options2 = this.host.getOptions();
+        const startWidth = runtime.layout.taskColumnWidth;
+        runtime.columnResize = {
+          startX: point.x,
+          startWidth,
+          minWidth: Math.max(options2.taskColumnMinWidth ?? 120, 48),
+          maxWidth: Math.max(
+            Math.min(
+              options2.taskColumnMaxWidth ?? 480,
+              runtime.viewport.width - 80
+            ),
+            options2.taskColumnMinWidth ?? 120
+          )
+        };
+        this.host.canvas.style.cursor = "col-resize";
+        this.host.canvas.setPointerCapture(event.pointerId);
+        return;
+      }
+      if (this.startRowDrag(event, point.x, point.y)) return;
+      if (point.x < runtime.layout.taskColumnWidth || point.x >= runtime.viewport.contentRight || point.y < runtime.layout.headerHeight || point.y >= runtime.viewport.contentBottom) {
+        return;
+      }
+      const contentX = point.x + runtime.scroll.left;
+      const contentY = point.y + runtime.scroll.top;
+      const options = this.host.getOptions();
+      if (options.editable === true) {
+        const anchor = hitTestTaskDependencyAnchor({
+          x: contentX,
+          y: contentY,
+          layout: runtime.layout,
+          selectedTaskId: runtime.selectedId
+        });
+        if (anchor) {
+          runtime.dependencyDrag = {
+            sourceTaskId: anchor.task.id,
+            sourceSide: anchor.side,
+            sourceX: anchor.x,
+            sourceY: anchor.y,
+            currentX: anchor.x,
+            currentY: anchor.y,
+            targetTaskId: null,
+            targetSide: null
+          };
+          runtime.selectedDependencyIndex = null;
+          this.host.canvas.style.cursor = "crosshair";
+          this.host.canvas.setPointerCapture(event.pointerId);
+          this.host.render();
+          return;
+        }
+      }
+      const hit = hitTestTaskBar({
+        x: contentX,
+        y: contentY,
+        layout: runtime.layout,
+        selectedId: runtime.selectedId,
+        resizable: options.editable === true && options.taskResizable !== false
+      });
+      if (!hit) {
+        const dependencyHit = hitTestGanttDependency({
+          x: contentX,
+          y: contentY,
+          layout: runtime.layout,
+          dependencies: options.dependencies ?? []
+        });
+        if (dependencyHit) {
+          runtime.selectedId = null;
+          runtime.selectedDependencyIndex = dependencyHit.index;
+          options.onDependencyClick?.(
+            dependencyHit.dependency,
+            dependencyHit.index
+          );
+          this.host.render();
+          return;
+        }
+        runtime.selectedDependencyIndex = null;
+        if (options.editable === true) {
+          this.startTaskCreate(event, contentX, contentY);
+        }
+        this.host.render();
+        return;
+      }
+      runtime.selectedId = hit.task.id;
+      runtime.selectedDependencyIndex = null;
+      options.onTaskClick?.(hit.task);
+      if (options.editable !== true || !hasTaskSchedule(hit.task)) {
+        this.host.render();
+        return;
+      }
+      runtime.taskDrag = {
+        task: hit.task,
+        mode: hit.role === "body" ? "move" : hit.role === "resize-start" ? "resize-start" : "resize-end",
+        startX: contentX,
+        originalStart: toTimestamp(hit.task.start),
+        originalEnd: toTimestamp(hit.task.end)
+      };
+      this.host.canvas.style.cursor = hit.role === "body" ? "grabbing" : "ew-resize";
+      this.host.canvas.setPointerCapture(event.pointerId);
+      this.host.render();
+    });
+    __publicField(this, "handlePointerMove", (event) => {
+      const { runtime } = this.host;
+      const point = this.point(event);
+      if (runtime.scrollbarDrag) {
+        const drag = runtime.scrollbarDrag;
+        const coordinate = drag.axis === "horizontal" ? point.x : point.y;
+        const availableTrack = Math.max(drag.trackLength - drag.thumbLength, 1);
+        const next = (coordinate - drag.pointerOffset - drag.trackStart) / availableTrack * drag.maxScroll;
+        this.scrollAxisTo(drag.axis, next, true);
+        return;
+      }
+      if (runtime.columnResize) {
+        const drag = runtime.columnResize;
+        runtime.taskColumnWidth = Math.round(
+          Math.min(
+            Math.max(drag.startWidth + point.x - drag.startX, drag.minWidth),
+            drag.maxWidth
+          )
+        );
+        this.host.render();
+        return;
+      }
+      if (runtime.rowDrag) {
+        this.updateRowDrag(point.y + runtime.scroll.top);
+        return;
+      }
+      if (runtime.dependencyDrag && runtime.layout) {
+        this.updateDependencyDrag(
+          point.x + runtime.scroll.left,
+          point.y + runtime.scroll.top
+        );
+        return;
+      }
+      if (runtime.taskDrag && runtime.layout) {
+        this.updateTaskDrag(point.x + runtime.scroll.left, false);
+        return;
+      }
+      this.updateCursor(point.x, point.y);
+    });
+    __publicField(this, "handlePointerUp", (event) => {
+      const { runtime } = this.host;
+      if (runtime.dependencyDrag) {
+        this.finishDependencyDrag();
+        runtime.dependencyDrag = null;
+        this.host.render();
+      }
+      if (runtime.rowDrag) {
+        this.finishRowDrag();
+      }
+      if (runtime.taskDrag) {
+        if (this.host.getOptions().snapToColumn === true) {
+          const point = this.point(event);
+          this.updateTaskDrag(point.x + runtime.scroll.left, true);
+        }
+        this.host.getOptions().onTaskChange?.(runtime.taskDrag.task);
+      }
+      if (runtime.columnResize && runtime.taskColumnWidth != null) {
+        this.host.getOptions().onTaskColumnResize?.(runtime.taskColumnWidth);
+      }
+      runtime.taskDrag = null;
+      runtime.dependencyDrag = null;
+      runtime.scrollbarDrag = null;
+      runtime.columnResize = null;
+      this.host.canvas.style.cursor = "default";
+      if (this.host.canvas.hasPointerCapture(event.pointerId)) {
+        this.host.canvas.releasePointerCapture(event.pointerId);
+      }
+    });
+    __publicField(this, "handlePointerLeave", () => {
+      if (!this.host.runtime.taskDrag && !this.host.runtime.dependencyDrag && !this.host.runtime.scrollbarDrag && !this.host.runtime.columnResize && !this.host.runtime.rowDrag) {
+        this.host.canvas.style.cursor = "default";
+      }
+    });
+    __publicField(this, "handleWheel", (event) => {
+      this.wheelScrollController.handleWheel(event);
+    });
+    __publicField(this, "handleKeyDown", (event) => {
+      if (this.host.getOptions().editable !== true || event.key !== "Delete" && event.key !== "Backspace") {
+        return;
+      }
+      const { runtime } = this.host;
+      const options = this.host.getOptions();
+      if (runtime.selectedDependencyIndex != null) {
+        const dependencies = options.dependencies ?? [];
+        if (dependencies[runtime.selectedDependencyIndex]) {
+          event.preventDefault();
+          const next = removeGanttDependency(
+            dependencies,
+            runtime.selectedDependencyIndex
+          );
+          options.dependencies = next;
+          runtime.selectedDependencyIndex = null;
+          options.onDependenciesChange?.(next);
+          this.host.render();
+        }
+        return;
+      }
+      const task = findGanttTaskById(options.tasks, runtime.selectedId);
+      if (!task || !hasTaskSchedule(task)) return;
+      event.preventDefault();
+      clearTaskSchedule(task);
+      runtime.selectedId = null;
+      this.host.getOptions().onTaskChange?.(task);
+      this.host.render();
+    });
+    this.wheelScrollController = new GanttWheelScrollController(host);
+  }
+  /** 停止控制器持有的异步交互。 */
+  destroy() {
+    this.wheelScrollController.stop();
+    this.stopRowDragAnimation();
+  }
+  /** 停止尚未完成的滚轮缓动。 */
+  stopWheelScroll() {
+    this.wheelScrollController.stop();
+  }
+  handleScrollbarPointerDown(event, axis, role, coordinate) {
+    const { runtime } = this.host;
+    const scrollbar = runtime.scrollbars[axis];
+    if (!scrollbar || !runtime.layout || !runtime.viewport) return;
+    event.preventDefault();
+    this.host.canvas.style.cursor = role === "thumb" ? "grabbing" : "pointer";
+    if (role === "decrease-button" || role === "increase-button") {
+      const direction = role === "decrease-button" ? -1 : 1;
+      const step = axis === "horizontal" ? runtime.layout.dayWidth : runtime.layout.rowHeight;
+      this.scrollAxisBy(axis, direction * step);
+      return;
+    }
+    if (role === "track") {
+      this.jumpToTrackPosition(axis, coordinate, scrollbar);
+      return;
+    }
+    const trackStart = axis === "horizontal" ? scrollbar.track.x : scrollbar.track.y;
+    const trackLength = axis === "horizontal" ? scrollbar.track.width : scrollbar.track.height;
+    const thumbStart = axis === "horizontal" ? scrollbar.thumb.x : scrollbar.thumb.y;
+    const thumbLength = axis === "horizontal" ? scrollbar.thumb.width : scrollbar.thumb.height;
+    runtime.scrollbarDrag = {
+      axis,
+      pointerOffset: coordinate - thumbStart,
+      trackStart,
+      trackLength,
+      thumbLength,
+      maxScroll: axis === "horizontal" ? runtime.viewport.bounds.maxLeft : runtime.viewport.bounds.maxTop
+    };
+    this.host.canvas.setPointerCapture(event.pointerId);
+  }
+  jumpToTrackPosition(axis, coordinate, scrollbar) {
+    const { viewport } = this.host.runtime;
+    if (!viewport) return;
+    const trackStart = axis === "horizontal" ? scrollbar.track.x : scrollbar.track.y;
+    const trackLength = axis === "horizontal" ? scrollbar.track.width : scrollbar.track.height;
+    const thumbLength = axis === "horizontal" ? scrollbar.thumb.width : scrollbar.thumb.height;
+    const maxScroll = axis === "horizontal" ? viewport.bounds.maxLeft : viewport.bounds.maxTop;
+    const ratio = (coordinate - trackStart - thumbLength / 2) / Math.max(trackLength - thumbLength, 1);
+    this.scrollAxisTo(axis, Math.min(Math.max(ratio, 0), 1) * maxScroll);
+  }
+  updateTaskDrag(contentX, snapToColumn) {
+    const { runtime } = this.host;
+    const drag = runtime.taskDrag;
+    if (!drag || !runtime.layout) return;
+    if (drag.mode === "create") {
+      const range2 = resolveTaskCreateRange({
+        anchorX: drag.startX,
+        currentX: contentX,
+        layout: runtime.layout
+      });
+      drag.task.start = new Date(range2.start);
+      drag.task.end = new Date(range2.end);
+      this.host.scheduleRender();
+      return;
+    }
+    const delta = resolveTaskTimeDelta(
+      contentX - drag.startX,
+      runtime.layout,
+      snapToColumn,
+      drag.mode === "resize-end" ? drag.originalEnd : drag.originalStart
+    );
+    const range = resolveTaskDragRange({
+      mode: drag.mode,
+      originalStart: drag.originalStart,
+      originalEnd: drag.originalEnd,
+      delta,
+      minStart: runtime.layout.start,
+      maxEnd: runtime.layout.end
+    });
+    drag.task.start = new Date(range.start);
+    drag.task.end = new Date(range.end);
+    this.host.scheduleRender();
+  }
+  updateDependencyDrag(contentX, contentY) {
+    const { runtime } = this.host;
+    const drag = runtime.dependencyDrag;
+    if (!drag || !runtime.layout) return;
+    const target = resolveDependencyDropTarget({
+      x: contentX,
+      y: contentY,
+      layout: runtime.layout,
+      sourceTaskId: drag.sourceTaskId,
+      sourceSide: drag.sourceSide
+    });
+    drag.currentX = target?.x ?? contentX;
+    drag.currentY = target?.y ?? contentY;
+    drag.targetTaskId = target?.task.id ?? null;
+    drag.targetSide = target?.side ?? null;
+    this.host.scheduleRender();
+  }
+  finishDependencyDrag() {
+    const { runtime } = this.host;
+    const drag = runtime.dependencyDrag;
+    if (!drag || !drag.targetTaskId || !drag.targetSide) return;
+    const type = resolveDependencyType(drag.sourceSide, drag.targetSide);
+    if (!type) return;
+    const options = this.host.getOptions();
+    const dependency = {
+      from: drag.sourceTaskId,
+      to: drag.targetTaskId,
+      type
+    };
+    const result = upsertGanttDependency(
+      options.dependencies ?? [],
+      dependency
+    );
+    options.dependencies = result.dependencies;
+    runtime.selectedId = null;
+    runtime.selectedDependencyIndex = result.index;
+    options.onDependenciesChange?.(result.dependencies);
+  }
+  startTaskCreate(event, contentX, contentY) {
+    const { runtime } = this.host;
+    if (!runtime.layout) return false;
+    const row = runtime.layout.rows.find(
+      (item) => contentY >= item.y && contentY < item.y + runtime.layout.rowHeight
+    );
+    const task = row?.tasks.find((item) => !hasTaskSchedule(item));
+    if (!row || !task) return false;
+    const range = resolveTaskCreateRange({
+      anchorX: contentX,
+      currentX: contentX,
+      layout: runtime.layout
+    });
+    task.start = new Date(range.start);
+    task.end = new Date(range.end);
+    runtime.selectedId = task.id;
+    runtime.taskDrag = {
+      task,
+      mode: "create",
+      startX: contentX,
+      originalStart: range.start,
+      originalEnd: range.end
+    };
+    this.host.canvas.style.cursor = "ew-resize";
+    this.host.canvas.setPointerCapture(event.pointerId);
+    this.host.getOptions().onTaskClick?.(task);
+    this.host.render();
+    return true;
+  }
+  startRowDrag(event, pointerX, pointerY) {
+    const { runtime } = this.host;
+    if (this.host.getOptions().editable !== true || this.host.getOptions().rowDraggable !== true || !runtime.layout || !runtime.viewport || pointerX < 0 || pointerX >= runtime.layout.taskColumnWidth || pointerY < runtime.layout.headerHeight || pointerY >= runtime.viewport.contentBottom) {
+      return false;
+    }
+    const contentY = pointerY + runtime.scroll.top;
+    const row = runtime.layout.rows.find(
+      (item) => contentY >= item.y && contentY < item.y + runtime.layout.rowHeight
+    );
+    if (!row) return false;
+    const multiTask = this.host.getOptions().multiTask === true;
+    runtime.selectedId = multiTask ? null : row.task.id;
+    runtime.rowDrag = {
+      phase: "potential",
+      pointerId: event.pointerId,
+      taskId: row.task.id,
+      fromIndex: row.index,
+      targetIndex: row.index,
+      startY: contentY,
+      currentY: contentY,
+      offsets: /* @__PURE__ */ new Map()
+    };
+    this.host.canvas.style.cursor = "grab";
+    this.host.canvas.setPointerCapture(event.pointerId);
+    if (!multiTask) this.host.getOptions().onTaskClick?.(row.task);
+    this.host.render();
+    return true;
+  }
+  updateRowDrag(contentY) {
+    const { runtime } = this.host;
+    const drag = runtime.rowDrag;
+    if (!drag || !runtime.layout) return;
+    const deltaY = contentY - drag.startY;
+    if (drag.phase === "potential") {
+      if (Math.abs(deltaY) < 5) return;
+      drag.phase = "dragging";
+      this.host.canvas.style.cursor = "grabbing";
+    }
+    drag.currentY = contentY;
+    drag.targetIndex = resolveRowDragTargetIndex({
+      pointerDeltaY: deltaY,
+      fromIndex: drag.fromIndex,
+      rowHeight: runtime.layout.rowHeight,
+      rowCount: runtime.layout.rows.length
+    });
+    drag.offsets.set(drag.taskId, deltaY);
+    this.host.scheduleRender();
+    this.scheduleRowDragAnimation();
+  }
+  finishRowDrag() {
+    const drag = this.host.runtime.rowDrag;
+    if (!drag) return;
+    this.stopRowDragAnimation();
+    if (drag.phase === "dragging" && drag.fromIndex !== drag.targetIndex) {
+      const options = this.host.getOptions();
+      const tasks = reorderGanttTasks(
+        options.tasks,
+        drag.fromIndex,
+        drag.targetIndex
+      );
+      options.tasks = tasks;
+      options.onTaskReorder?.(tasks, drag.fromIndex, drag.targetIndex);
+    }
+    this.host.runtime.rowDrag = null;
+    this.host.render();
+  }
+  scheduleRowDragAnimation() {
+    if (this.rowDragFrameId != null) return;
+    this.rowDragFrameId = requestAnimationFrame(() => {
+      this.rowDragFrameId = null;
+      this.advanceRowDragAnimation();
+    });
+  }
+  advanceRowDragAnimation() {
+    const { runtime } = this.host;
+    const drag = runtime.rowDrag;
+    if (!drag || drag.phase !== "dragging" || !runtime.layout) return;
+    let done = true;
+    runtime.layout.rows.forEach((row) => {
+      if (row.task.id === drag.taskId) return;
+      const target = resolveRowDragTargetOffset({
+        rowIndex: row.index,
+        fromIndex: drag.fromIndex,
+        targetIndex: drag.targetIndex,
+        rowHeight: runtime.layout.rowHeight
+      });
+      const current = drag.offsets.get(row.task.id) ?? 0;
+      const next = current + (target - current) * 0.28;
+      if (Math.abs(target - next) < 0.35) {
+        drag.offsets.set(row.task.id, target);
+      } else {
+        drag.offsets.set(row.task.id, next);
+        done = false;
+      }
+    });
+    this.host.render();
+    if (!done) this.scheduleRowDragAnimation();
+  }
+  stopRowDragAnimation() {
+    if (this.rowDragFrameId != null) cancelAnimationFrame(this.rowDragFrameId);
+    this.rowDragFrameId = null;
+  }
+  updateCursor(x, y) {
+    const { runtime } = this.host;
+    const scrollbarHit = hitTestGanttScrollbar(x, y, runtime.scrollbars);
+    if (scrollbarHit) {
+      this.host.canvas.style.cursor = scrollbarHit.role === "thumb" ? "grab" : "pointer";
+      return;
+    }
+    if (this.isTaskColumnResizeHandle(x, y)) {
+      this.host.canvas.style.cursor = "col-resize";
+      return;
+    }
+    if (this.host.getOptions().editable === true && this.host.getOptions().rowDraggable === true && !!runtime.layout && !!runtime.viewport && x >= 0 && x < runtime.layout.taskColumnWidth && y >= runtime.layout.headerHeight && y < runtime.viewport.contentBottom) {
+      this.host.canvas.style.cursor = "grab";
+      return;
+    }
+    if (!runtime.layout || !runtime.viewport || x < runtime.layout.taskColumnWidth || x >= runtime.viewport.contentRight || y < runtime.layout.headerHeight || y >= runtime.viewport.contentBottom) {
+      this.host.canvas.style.cursor = "default";
+      return;
+    }
+    const hit = hitTestTaskBar({
+      x: x + runtime.scroll.left,
+      y: y + runtime.scroll.top,
+      layout: runtime.layout,
+      selectedId: runtime.selectedId,
+      resizable: this.host.getOptions().editable === true && this.host.getOptions().taskResizable !== false
+    });
+    if (this.host.getOptions().editable === true) {
+      const anchor = hitTestTaskDependencyAnchor({
+        x: x + runtime.scroll.left,
+        y: y + runtime.scroll.top,
+        layout: runtime.layout,
+        selectedTaskId: runtime.selectedId
+      });
+      if (anchor) {
+        this.host.canvas.style.cursor = "crosshair";
+        return;
+      }
+    }
+    if (hit) {
+      this.host.canvas.style.cursor = this.host.getOptions().editable !== true ? "pointer" : hit.role === "body" ? "grab" : "ew-resize";
+      return;
+    }
+    const dependencyHit = hitTestGanttDependency({
+      x: x + runtime.scroll.left,
+      y: y + runtime.scroll.top,
+      layout: runtime.layout,
+      dependencies: this.host.getOptions().dependencies ?? []
+    });
+    if (dependencyHit) {
+      this.host.canvas.style.cursor = "pointer";
+      return;
+    }
+    const contentY = y + runtime.scroll.top;
+    const row = runtime.layout.rows.find(
+      (item) => contentY >= item.y && contentY < item.y + runtime.layout.rowHeight
+    );
+    this.host.canvas.style.cursor = this.host.getOptions().editable === true && !!row && row.tasks.some((task) => !hasTaskSchedule(task)) ? "crosshair" : "default";
+  }
+  scrollAxisBy(axis, delta) {
+    const current = axis === "horizontal" ? this.host.runtime.scroll.left : this.host.runtime.scroll.top;
+    this.scrollAxisTo(axis, current + delta);
+  }
+  isTaskColumnResizeHandle(x, y) {
+    const { layout, viewport } = this.host.runtime;
+    return this.host.getOptions().taskColumnResizable !== false && !!layout && !!viewport && y >= 0 && y < viewport.contentBottom && x >= layout.taskColumnWidth - 5 && x <= layout.taskColumnWidth;
+  }
+  scrollAxisTo(axis, value, scheduleRender = false) {
+    if (scheduleRender) {
+      const { runtime } = this.host;
+      if (!runtime.viewport) return;
+      const next = clampGanttScroll(
+        axis === "horizontal" ? { left: value, top: runtime.scroll.top } : { left: runtime.scroll.left, top: value },
+        runtime.viewport.bounds
+      );
+      if (next.left === runtime.scroll.left && next.top === runtime.scroll.top) {
+        return;
+      }
+      runtime.scroll = next;
+      this.host.scheduleRender();
+      return;
+    }
+    if (axis === "horizontal") {
+      this.host.scrollTo(value, this.host.runtime.scroll.top);
+    } else {
+      this.host.scrollTo(this.host.runtime.scroll.left, value);
+    }
+  }
+  point(event) {
+    const rect = this.host.canvas.getBoundingClientRect();
+    return { x: event.clientX - rect.left, y: event.clientY - rect.top };
+  }
+};
+
+// src/domain/timeline-headers.ts
+function buildTimelineHeaderCells(layout, level) {
+  const cells = [];
+  for (let start = layout.start; start < layout.end; start = resolveNextHeaderStart(start, level.unit)) {
+    const end = Math.min(resolveNextHeaderStart(start, level.unit), layout.end);
+    cells.push({
+      start,
+      end,
+      x: xForDate(start, layout),
+      width: (end - start) / dayMs * layout.dayWidth,
+      label: level.formatter?.(new Date(start), new Date(end)) ?? formatHeaderLabel(start, end, level.unit)
+    });
+  }
+  return cells;
+}
+function resolveNextHeaderStart(timestamp, unit) {
+  if (unit === "day") return timestamp + dayMs;
+  if (unit === "week") {
+    const date2 = new Date(timestamp);
+    const daysUntilNextMonday = 7 - (date2.getDay() + 6) % 7;
+    return timestamp + daysUntilNextMonday * dayMs;
+  }
+  const date = new Date(timestamp);
+  if (unit === "month") {
+    date.setMonth(date.getMonth() + 1, 1);
+  } else if (unit === "quarter") {
+    date.setMonth((Math.floor(date.getMonth() / 3) + 1) * 3, 1);
+  } else {
+    date.setFullYear(date.getFullYear() + 1, 0, 1);
+  }
+  return date.getTime();
+}
+function formatHeaderLabel(start, end, unit) {
+  const date = new Date(start);
+  if (unit === "year") return `${date.getFullYear()}\u5E74`;
+  if (unit === "quarter") {
+    return `${date.getFullYear()} Q${Math.floor(date.getMonth() / 3) + 1}`;
+  }
+  if (unit === "month") {
+    return new Intl.DateTimeFormat("zh-CN", {
+      year: "numeric",
+      month: "long"
+    }).format(date);
+  }
+  const short = (timestamp) => new Intl.DateTimeFormat("zh-CN", {
+    month: "2-digit",
+    day: "2-digit"
+  }).format(new Date(timestamp));
+  if (unit === "week") return `${short(start)} - ${short(end - dayMs)}`;
+  return short(start);
+}
+
+// src/rendering/primitives/dependencies.ts
+function drawDependencies(context, layout, dependencies, theme, rowOffsets, selectedIndex) {
+  dependencies.forEach((dependency, index) => {
+    const route = resolveDependencyLayoutRoute(dependency, layout, rowOffsets);
+    if (!route) return;
+    const color = dependency.color ?? theme.milestoneColor;
+    context.strokeStyle = color;
+    context.fillStyle = color;
+    const [firstPoint, ...remainingPoints] = route.points;
+    const lastPoint = route.points[route.points.length - 1];
+    if (!firstPoint || !lastPoint) return;
+    context.save();
+    context.lineJoin = "round";
+    context.lineCap = "round";
+    const selected = selectedIndex === index;
+    context.lineWidth = selected ? 2.5 : 1.5;
+    if (selected) {
+      context.shadowColor = theme.selectionColor;
+      context.shadowBlur = 5;
+    }
+    context.beginPath();
+    context.moveTo(firstPoint.x, firstPoint.y);
+    remainingPoints.forEach((point) => context.lineTo(point.x, point.y));
+    context.stroke();
+    drawDependencyArrow(context, lastPoint, route.arrowDirection);
+    context.restore();
+  });
+}
+function drawDependencyArrow(context, point, direction) {
+  const baseX = point.x + (direction === "right" ? -7 : 7);
+  context.beginPath();
+  context.moveTo(point.x, point.y);
+  context.lineTo(baseX, point.y - 4.5);
+  context.lineTo(baseX, point.y + 4.5);
+  context.closePath();
+  context.fill();
+}
+
+// src/rendering/primitives/dependency-editor.ts
+function drawDependencyEditor(params) {
+  const { context, layout, selectedTaskId, drag, theme } = params;
+  const result = findGanttLayoutTask(layout, selectedTaskId);
+  if (result) {
+    const anchors = resolveTaskDependencyAnchors(
+      result.task,
+      result.row.y,
+      layout
+    );
+    anchors?.forEach((anchor) => {
+      context.save();
+      context.strokeStyle = theme.selectionColor;
+      context.fillStyle = theme.backgroundColor;
+      context.lineWidth = 1.5;
+      context.beginPath();
+      context.moveTo(
+        anchor.side === "start" ? anchor.x + 4 : anchor.x - 4,
+        anchor.y
+      );
+      context.lineTo(
+        anchor.side === "start" ? anchor.x + 10 : anchor.x - 10,
+        anchor.y
+      );
+      context.stroke();
+      context.beginPath();
+      context.arc(anchor.x, anchor.y, 4, 0, Math.PI * 2);
+      context.fill();
+      context.stroke();
+      context.restore();
+    });
+  }
+  if (!drag) return;
+  context.save();
+  context.strokeStyle = theme.milestoneColor;
+  context.fillStyle = theme.milestoneColor;
+  context.lineWidth = 1.5;
+  context.setLineDash([5, 4]);
+  const middleX = (drag.sourceX + drag.currentX) / 2;
+  context.beginPath();
+  context.moveTo(drag.sourceX, drag.sourceY);
+  context.lineTo(middleX, drag.sourceY);
+  context.lineTo(middleX, drag.currentY);
+  context.lineTo(drag.currentX, drag.currentY);
+  context.stroke();
+  context.setLineDash([]);
+  if (drag.targetTaskId && drag.targetSide) {
+    context.beginPath();
+    context.arc(drag.currentX, drag.currentY, 5, 0, Math.PI * 2);
+    context.fill();
+  }
+  context.restore();
+}
+
+// src/domain/timeline-columns.ts
+function buildTimelineColumns(layout) {
+  const result = [];
+  for (let start = layout.start; start < layout.end; start = resolveNextColumnStart(start, layout.scale)) {
+    const end = Math.min(
+      resolveNextColumnStart(start, layout.scale),
+      layout.end
+    );
+    const x = xForDate(start, layout);
+    result.push({
+      start,
+      end,
+      x,
+      width: (end - start) / dayMs * layout.dayWidth,
+      label: formatTimelineColumnLabel(start, end, layout.scale)
+    });
+  }
+  return result;
+}
+function resolveNextColumnStart(timestamp, scale) {
+  if (scale === "day") return timestamp + dayMs;
+  if (scale === "week") return timestamp + 7 * dayMs;
+  const date = new Date(timestamp);
+  date.setMonth(date.getMonth() + 1, 1);
+  return date.getTime();
+}
+function formatTimelineColumnLabel(start, end, scale) {
+  const short = (timestamp) => new Intl.DateTimeFormat("zh-CN", {
+    month: "2-digit",
+    day: "2-digit"
+  }).format(new Date(timestamp));
+  if (scale === "day") return short(start);
+  if (scale === "week") return `${short(start)} - ${short(end - dayMs)}`;
+  return new Intl.DateTimeFormat("zh-CN", {
+    year: "numeric",
+    month: "long"
+  }).format(new Date(start));
+}
+
+// src/rendering/primitives/grid.ts
+function drawTimelineBodyGrid(context, layout, theme, showWeekendBackground = true) {
+  if (showWeekendBackground) {
+    for (let timestamp = layout.start; timestamp < layout.end; timestamp += dayMs) {
+      const x = xForDate(timestamp, layout);
+      const date = new Date(timestamp);
+      if (date.getDay() === 0 || date.getDay() === 6) {
+        context.fillStyle = theme.weekendBackgroundColor;
+        context.fillRect(
+          x,
+          layout.headerHeight,
+          layout.dayWidth,
+          layout.totalHeight - layout.headerHeight
+        );
+      }
+    }
+  }
+  buildTimelineColumns(layout).forEach(
+    (column) => drawVerticalLine(
+      context,
+      column.x,
+      layout.headerHeight,
+      layout.totalHeight,
+      theme.borderColor
+    )
+  );
+  drawVerticalLine(
+    context,
+    layout.totalWidth,
+    layout.headerHeight,
+    layout.totalHeight,
+    theme.borderColor
+  );
+  drawRowLines(
+    context,
+    layout,
+    layout.taskColumnWidth,
+    layout.totalWidth,
+    theme
+  );
+}
+function drawTaskColumnGrid(context, layout, theme) {
+  drawRowLines(context, layout, 0, layout.taskColumnWidth, theme);
+}
+function drawVerticalLine(context, x, top, bottom, color) {
+  context.strokeStyle = color;
+  context.lineWidth = 1;
+  context.beginPath();
+  context.moveTo(Math.round(x) + 0.5, top);
+  context.lineTo(Math.round(x) + 0.5, bottom);
+  context.stroke();
+}
+function drawHorizontalLine(context, y, left, right, color) {
+  context.strokeStyle = color;
+  context.lineWidth = 1;
+  context.beginPath();
+  context.moveTo(left, Math.round(y) + 0.5);
+  context.lineTo(right, Math.round(y) + 0.5);
+  context.stroke();
+}
+function drawRowLines(context, layout, left, right, theme) {
+  layout.rows.forEach(
+    ({ y }) => drawHorizontalLine(context, y, left, right, theme.borderColor)
+  );
+  drawHorizontalLine(
+    context,
+    layout.totalHeight,
+    left,
+    right,
+    theme.borderColor
+  );
+}
+
+// src/rendering/primitives/scrollbars.ts
+function drawGanttScrollbars(params) {
+  const { context, viewport, layout, theme, headerHeight } = params;
+  context.save();
+  if (viewport.hasHorizontalScrollbar) {
+    context.fillStyle = theme.backgroundColor;
+    context.fillRect(
+      0,
+      viewport.contentBottom,
+      viewport.width,
+      viewport.height - viewport.contentBottom
+    );
+    drawHorizontalLine2(
+      context,
+      viewport.contentBottom,
+      0,
+      viewport.width,
+      theme.borderColor
+    );
+  }
+  if (viewport.hasVerticalScrollbar) {
+    context.fillStyle = theme.headerBackgroundColor;
+    context.fillRect(
+      viewport.contentRight,
+      0,
+      viewport.width - viewport.contentRight,
+      headerHeight
+    );
+    context.fillStyle = theme.backgroundColor;
+    context.fillRect(
+      viewport.contentRight,
+      headerHeight,
+      viewport.width - viewport.contentRight,
+      viewport.contentBottom - headerHeight
+    );
+    drawVerticalLine2(
+      context,
+      viewport.contentRight,
+      0,
+      viewport.height,
+      theme.borderColor
+    );
+  }
+  if (layout.horizontal) {
+    drawAxisScrollbar(context, layout.horizontal, "horizontal", theme);
+  }
+  if (layout.vertical) {
+    drawAxisScrollbar(context, layout.vertical, "vertical", theme);
+  }
+  context.restore();
+}
+function drawAxisScrollbar(context, layout, axis, theme) {
+  drawButton(context, layout.decreaseButton, axis, "decrease");
+  drawButton(context, layout.increaseButton, axis, "increase");
+  context.fillStyle = "rgba(100, 116, 139, 0.8)";
+  context.beginPath();
+  context.roundRect(
+    layout.thumb.x,
+    layout.thumb.y,
+    layout.thumb.width,
+    layout.thumb.height,
+    Math.min(layout.thumb.width, layout.thumb.height) / 2
+  );
+  context.fill();
+  if (axis === "horizontal") {
+    drawHorizontalLine2(
+      context,
+      layout.track.y,
+      layout.track.x,
+      layout.track.x + layout.track.width,
+      theme.borderColor
+    );
+  } else {
+    drawVerticalLine2(
+      context,
+      layout.track.x,
+      layout.track.y,
+      layout.track.y + layout.track.height,
+      theme.borderColor
+    );
+  }
+}
+function drawButton(context, rect, axis, direction) {
+  context.save();
+  context.fillStyle = "rgba(71, 85, 105, 0.88)";
+  context.beginPath();
+  const centerX = rect.x + rect.width / 2;
+  const centerY = rect.y + rect.height / 2;
+  const iconSize = Math.min(rect.width, rect.height) * 0.64;
+  const directionOffset = iconSize * 0.4;
+  const crossAxisOffset = iconSize / 2;
+  if (axis === "horizontal") {
+    const tipX = centerX + (direction === "decrease" ? -1 : 1) * directionOffset;
+    const tailX = centerX + (direction === "decrease" ? 1 : -1) * directionOffset;
+    context.moveTo(tipX, centerY);
+    context.lineTo(tailX, centerY - crossAxisOffset);
+    context.lineTo(tailX, centerY + crossAxisOffset);
+  } else {
+    const tipY = centerY + (direction === "decrease" ? -1 : 1) * directionOffset;
+    const tailY = centerY + (direction === "decrease" ? 1 : -1) * directionOffset;
+    context.moveTo(centerX, tipY);
+    context.lineTo(centerX - crossAxisOffset, tailY);
+    context.lineTo(centerX + crossAxisOffset, tailY);
+  }
+  context.closePath();
+  context.fill();
+  context.restore();
+}
+function drawHorizontalLine2(context, y, left, right, color) {
+  context.strokeStyle = color;
+  context.lineWidth = 1;
+  context.beginPath();
+  context.moveTo(left, Math.round(y) + 0.5);
+  context.lineTo(right, Math.round(y) + 0.5);
+  context.stroke();
+}
+function drawVerticalLine2(context, x, top, bottom, color) {
+  context.strokeStyle = color;
+  context.lineWidth = 1;
+  context.beginPath();
+  context.moveTo(Math.round(x) + 0.5, top);
+  context.lineTo(Math.round(x) + 0.5, bottom);
+  context.stroke();
+}
+
+// src/domain/task-content.ts
+function resolveGanttTaskContentStyle(style, fallback) {
+  return {
+    color: style?.color ?? fallback.color,
+    fontSize: style?.fontSize ?? fallback.fontSize,
+    fontWeight: style?.fontWeight ?? fallback.fontWeight,
+    fontFamily: style?.fontFamily ?? fallback.fontFamily,
+    textAlign: style?.textAlign ?? fallback.textAlign
+  };
+}
+function normalizeGanttTaskContent(result) {
+  return result == null ? null : String(result);
+}
+function ellipsizeGanttTaskText(context, text, maxWidth) {
+  if (maxWidth <= 0) return "";
+  if (context.measureText(text).width <= maxWidth) return text;
+  const ellipsis = "\u2026";
+  if (context.measureText(ellipsis).width > maxWidth) return "";
+  let left = 0;
+  let right = text.length;
+  while (left < right) {
+    const middle = Math.ceil((left + right) / 2);
+    if (context.measureText(`${text.slice(0, middle)}${ellipsis}`).width <= maxWidth) {
+      left = middle;
+    } else {
+      right = middle - 1;
+    }
+  }
+  return `${text.slice(0, left)}${ellipsis}`;
+}
+
+// src/rendering/primitives/task-bars.ts
+var HANDLE_WIDTH = 6;
+function drawTaskBars(params) {
+  const { context, layout, selectedId, theme, resizable } = params;
+  layout.rows.forEach((row) => {
+    const isDragging = row.task.id === params.draggedRowId;
+    const visualY = row.y + (params.rowOffsets?.get(row.task.id) ?? 0);
+    row.tasks.forEach((task) => {
+      if (!hasTaskSchedule(task)) return;
+      const rect = resolveTaskBarRect(task, visualY, layout);
+      if (isDragging) {
+        context.save();
+        context.globalAlpha = 0.82;
+        context.shadowColor = "rgba(31, 35, 41, 0.2)";
+        context.shadowBlur = 8;
+        context.shadowOffsetY = 3;
+      }
+      context.fillStyle = task.color ?? theme.taskColor;
+      context.beginPath();
+      context.roundRect(rect.x, rect.y, rect.width, rect.height, 4);
+      context.fill();
+      if ((task.progress ?? 0) > 0) {
+        context.fillStyle = task.progressColor ?? theme.taskProgressColor;
+        context.beginPath();
+        context.roundRect(
+          rect.x,
+          rect.y,
+          rect.width * Math.min(100, Math.max(0, task.progress ?? 0)) / 100,
+          rect.height,
+          4
+        );
+        context.fill();
+      }
+      const content = task.render ? normalizeGanttTaskContent(task.render(task, row.index)) : null;
+      if (content != null) {
+        drawTaskBarContent(context, rect, content, task.style, theme);
+      }
+      if (isDragging) context.restore();
+      if (selectedId !== task.id) return;
+      context.strokeStyle = theme.selectionColor;
+      context.lineWidth = 2;
+      context.strokeRect(
+        rect.x - 1,
+        rect.y - 1,
+        rect.width + 2,
+        rect.height + 2
+      );
+      context.lineWidth = 1;
+      if (!resizable) return;
+      drawResizeHandle(context, rect.x, rect.y, rect.height, theme);
+      drawResizeHandle(
+        context,
+        rect.x + rect.width,
+        rect.y,
+        rect.height,
+        theme
+      );
+    });
+  });
+}
+function drawTaskBarContent(context, rect, content, taskStyle, theme) {
+  if (!content || rect.width <= 0) return;
+  const horizontalPadding = 8;
+  const contentWidth = Math.max(rect.width - horizontalPadding * 2, 0);
+  if (contentWidth <= 0) return;
+  context.save();
+  context.beginPath();
+  context.roundRect(rect.x, rect.y, rect.width, rect.height, 4);
+  context.clip();
+  context.textBaseline = "middle";
+  const style = resolveGanttTaskContentStyle(taskStyle, {
+    color: theme.backgroundColor,
+    fontSize: Math.min(theme.fontSize, rect.height - 6),
+    fontWeight: 500,
+    fontFamily: theme.fontFamily,
+    textAlign: "left"
+  });
+  context.font = `${style.fontWeight} ${style.fontSize}px ${style.fontFamily}`;
+  context.fillStyle = style.color;
+  context.textAlign = style.textAlign;
+  const x = style.textAlign === "center" ? rect.x + rect.width / 2 : style.textAlign === "right" ? rect.x + rect.width - horizontalPadding : rect.x + horizontalPadding;
+  context.fillText(
+    ellipsizeGanttTaskText(context, content, contentWidth),
+    x,
+    rect.y + rect.height / 2
+  );
+  context.restore();
+}
+function drawResizeHandle(context, centerX, y, height, theme) {
+  const handleHeight = Math.max(Math.min(height - 4, 18), 8);
+  const handleY = y + (height - handleHeight) / 2;
+  context.fillStyle = theme.backgroundColor;
+  context.strokeStyle = theme.selectionColor;
+  context.lineWidth = 1;
+  context.beginPath();
+  context.roundRect(
+    centerX - HANDLE_WIDTH / 2,
+    handleY,
+    HANDLE_WIDTH,
+    handleHeight,
+    2
+  );
+  context.fill();
+  context.stroke();
+}
+
+// src/rendering/canvas-renderer.ts
+function renderGantt(context, layout, dependencies, selectedId, theme, renderViewport) {
+  const viewport = renderViewport?.viewport ?? resolveGanttViewportLayout(
+    layout,
+    context.canvas.clientWidth || context.canvas.width,
+    context.canvas.clientHeight || context.canvas.height
+  );
+  const scroll = renderViewport?.scroll ?? { left: 0, top: 0 };
+  context.clearRect(0, 0, viewport.width, viewport.height);
+  context.fillStyle = theme.backgroundColor;
+  context.fillRect(0, 0, viewport.width, viewport.height);
+  context.font = `${theme.fontSize}px ${theme.fontFamily}`;
+  context.textBaseline = "middle";
+  drawTimelineBody({
+    context,
+    layout,
+    dependencies,
+    selectedId,
+    theme,
+    viewport,
+    scroll,
+    taskResizable: renderViewport?.taskResizable !== false,
+    weekendBackground: renderViewport?.weekendBackground !== false,
+    rowDrag: renderViewport?.rowDrag,
+    selectedDependencyIndex: renderViewport?.selectedDependencyIndex,
+    dependencyDrag: renderViewport?.dependencyDrag,
+    dependencyEditable: renderViewport?.dependencyEditable === true
+  });
+  drawTaskColumnBody(
+    context,
+    layout,
+    theme,
+    viewport,
+    scroll.top,
+    renderViewport?.rowDrag
+  );
+  drawRowDragInsertionIndicator(
+    context,
+    layout,
+    viewport,
+    scroll.top,
+    renderViewport?.rowDrag
+  );
+  drawTimelineHeader(context, layout, theme, viewport, scroll.left);
+  drawCornerHeader(
+    context,
+    layout,
+    theme,
+    renderViewport?.taskColumnTitle ?? "\u4EFB\u52A1"
+  );
+  drawGanttScrollbars({
+    context,
+    viewport,
+    layout: renderViewport?.scrollbars ?? {},
+    theme,
+    headerHeight: layout.headerHeight
+  });
+  drawFixedBoundaries(context, layout, theme, viewport);
+}
+function drawTimelineBody(params) {
+  const { context, layout, theme, viewport, scroll } = params;
+  context.save();
+  context.beginPath();
+  context.rect(
+    layout.taskColumnWidth,
+    layout.headerHeight,
+    viewport.timelineViewportWidth,
+    viewport.bodyViewportHeight
+  );
+  context.clip();
+  context.translate(-scroll.left, -scroll.top);
+  drawTimelineBodyGrid(context, layout, theme, params.weekendBackground);
+  drawTaskBars({
+    context,
+    layout,
+    selectedId: params.selectedId,
+    theme,
+    resizable: params.taskResizable,
+    rowOffsets: params.rowDrag?.offsets,
+    draggedRowId: params.rowDrag?.phase === "dragging" ? params.rowDrag.taskId : void 0
+  });
+  drawDependencies(
+    context,
+    layout,
+    params.dependencies,
+    theme,
+    params.rowDrag?.offsets,
+    params.selectedDependencyIndex
+  );
+  if (params.dependencyEditable) {
+    drawDependencyEditor({
+      context,
+      layout,
+      selectedTaskId: params.selectedId,
+      drag: params.dependencyDrag ?? null,
+      theme
+    });
+  }
+  context.restore();
+}
+function drawTaskColumnBody(context, layout, theme, viewport, scrollTop, rowDrag) {
+  context.save();
+  context.beginPath();
+  context.rect(
+    0,
+    layout.headerHeight,
+    layout.taskColumnWidth,
+    viewport.bodyViewportHeight
+  );
+  context.clip();
+  context.fillStyle = theme.backgroundColor;
+  context.fillRect(
+    0,
+    layout.headerHeight,
+    layout.taskColumnWidth,
+    viewport.bodyViewportHeight
+  );
+  context.translate(0, -scrollTop);
+  drawTaskColumnGrid(context, layout, theme);
+  layout.rows.forEach(({ task, y }) => {
+    const visualY = y + (rowDrag?.offsets.get(task.id) ?? 0);
+    const isDragging = rowDrag?.phase === "dragging" && rowDrag.taskId === task.id;
+    if (isDragging) {
+      context.save();
+      context.globalAlpha = 0.94;
+      context.shadowColor = "rgba(31, 35, 41, 0.16)";
+      context.shadowBlur = 8;
+      context.shadowOffsetY = 3;
+      context.fillStyle = theme.backgroundColor;
+      context.fillRect(0, visualY, layout.taskColumnWidth, layout.rowHeight);
+      context.restore();
+    }
+    context.fillStyle = theme.textColor;
+    context.fillText(task.title, 16, visualY + layout.rowHeight / 2);
+  });
+  context.restore();
+}
+function drawRowDragInsertionIndicator(context, layout, viewport, scrollTop, rowDrag) {
+  if (!rowDrag || rowDrag.phase !== "dragging") return;
+  const y = layout.headerHeight + rowDrag.targetIndex * layout.rowHeight - scrollTop;
+  if (y < layout.headerHeight || y > viewport.contentBottom) return;
+  context.save();
+  context.strokeStyle = "#1677ff";
+  context.fillStyle = "#1677ff";
+  context.lineWidth = 2;
+  context.beginPath();
+  context.moveTo(0, Math.round(y) + 0.5);
+  context.lineTo(viewport.contentRight, Math.round(y) + 0.5);
+  context.stroke();
+  context.beginPath();
+  context.arc(5, Math.round(y) + 0.5, 4, 0, Math.PI * 2);
+  context.fill();
+  context.restore();
+}
+function drawTimelineHeader(context, layout, theme, viewport, scrollLeft) {
+  context.save();
+  context.beginPath();
+  context.rect(
+    layout.taskColumnWidth,
+    0,
+    viewport.timelineViewportWidth,
+    layout.headerHeight
+  );
+  context.clip();
+  context.fillStyle = theme.headerBackgroundColor;
+  context.fillRect(
+    layout.taskColumnWidth,
+    0,
+    viewport.timelineViewportWidth,
+    layout.headerHeight
+  );
+  context.translate(-scrollLeft, 0);
+  context.font = `600 ${theme.fontSize}px ${theme.fontFamily}`;
+  const visibleLeft = layout.taskColumnWidth + scrollLeft;
+  const visibleRight = visibleLeft + viewport.timelineViewportWidth;
+  context.textAlign = "center";
+  layout.headerLevels.forEach((level) => {
+    buildTimelineHeaderCells(layout, level).forEach((cell) => {
+      drawVerticalLine(
+        context,
+        cell.x,
+        level.y,
+        level.y + level.height,
+        theme.borderColor
+      );
+      const cellRight = cell.x + cell.width;
+      const clippedLeft = Math.max(cell.x, visibleLeft);
+      const clippedRight = Math.min(cellRight, visibleRight);
+      if (clippedRight <= clippedLeft) return;
+      const availableWidth = clippedRight - clippedLeft - 16;
+      if (availableWidth < 24) return;
+      context.fillStyle = theme.mutedTextColor;
+      context.fillText(
+        cell.label,
+        (clippedLeft + clippedRight) / 2,
+        level.y + level.height / 2,
+        availableWidth
+      );
+    });
+    drawVerticalLine(
+      context,
+      layout.totalWidth,
+      level.y,
+      level.y + level.height,
+      theme.borderColor
+    );
+    drawHorizontalLine(
+      context,
+      level.y + level.height,
+      layout.taskColumnWidth,
+      layout.totalWidth,
+      theme.borderColor
+    );
+  });
+  context.textAlign = "left";
+  context.restore();
+}
+function drawCornerHeader(context, layout, theme, title) {
+  context.fillStyle = theme.headerBackgroundColor;
+  context.fillRect(0, 0, layout.taskColumnWidth, layout.headerHeight);
+  context.font = `600 ${theme.fontSize}px ${theme.fontFamily}`;
+  context.fillStyle = theme.textColor;
+  context.fillText(title, 16, layout.headerHeight / 2);
+}
+function drawFixedBoundaries(context, layout, theme, viewport) {
+  drawVerticalLine(
+    context,
+    layout.taskColumnWidth,
+    0,
+    viewport.contentBottom,
+    theme.borderColor
+  );
+  drawHorizontalLine(
+    context,
+    layout.headerHeight,
+    0,
+    viewport.contentRight,
+    theme.borderColor
+  );
 }
 
 // src/schema/options.ts
@@ -64,199 +2162,261 @@ var defaultGanttTheme = {
   fontSize: 14
 };
 
-// src/rendering/canvas-renderer.ts
-function renderGantt(context, layout, dependencies, selectedId, theme) {
-  context.clearRect(0, 0, context.canvas.width, context.canvas.height);
-  context.fillStyle = theme.backgroundColor;
-  context.fillRect(0, 0, context.canvas.width, context.canvas.height);
-  context.font = `${theme.fontSize}px ${theme.fontFamily}`;
-  context.textBaseline = "middle";
-  context.fillStyle = theme.headerBackgroundColor;
-  context.fillRect(0, 0, layout.totalWidth, layout.headerHeight);
-  context.strokeStyle = theme.borderColor;
-  context.beginPath();
-  context.moveTo(layout.taskColumnWidth, 0);
-  context.lineTo(layout.taskColumnWidth, layout.totalHeight);
-  context.stroke();
-  for (let t = layout.start, day = 0; t < layout.end; t += dayMs, day++) {
-    const x = layout.taskColumnWidth + day * layout.dayWidth;
-    const date = new Date(t);
-    const weekend = date.getDay() === 0 || date.getDay() === 6;
-    if (weekend) {
-      context.fillStyle = theme.weekendBackgroundColor;
-      context.fillRect(x, layout.headerHeight, layout.dayWidth, layout.totalHeight - layout.headerHeight);
-    }
-    context.strokeStyle = theme.gridColor;
-    context.beginPath();
-    context.moveTo(x, 0);
-    context.lineTo(x, layout.totalHeight);
-    context.stroke();
-    context.fillStyle = theme.mutedTextColor;
-    context.fillText(formatDate(t), x + 6, layout.headerHeight / 2);
-  }
-  context.fillStyle = theme.textColor;
-  context.fillText("\u4EFB\u52A1", 16, layout.headerHeight / 2);
-  layout.rows.forEach(({ task, y }) => {
-    context.strokeStyle = theme.gridColor;
-    context.beginPath();
-    context.moveTo(0, y);
-    context.lineTo(layout.totalWidth, y);
-    context.stroke();
-    context.fillStyle = theme.textColor;
-    context.fillText(task.title, 16, y + layout.rowHeight / 2);
-    const start = toTimestamp(task.start);
-    const end = Math.max(start + dayMs, toTimestamp(task.end));
-    const x = xForDate(start, layout);
-    const w = Math.max(8, (end - start) / dayMs * layout.dayWidth - 4);
-    const barY = y + 8;
-    const barH = layout.rowHeight - 16;
-    context.fillStyle = task.color ?? theme.taskColor;
-    context.beginPath();
-    context.roundRect(x, barY, w, barH, 4);
-    context.fill();
-    if (task.progress) {
-      context.fillStyle = theme.taskProgressColor;
-      context.beginPath();
-      context.roundRect(x, barY, w * Math.min(100, Math.max(0, task.progress)) / 100, barH, 4);
-      context.fill();
-    }
-    if (selectedId === task.id) {
-      context.strokeStyle = theme.selectionColor;
-      context.lineWidth = 2;
-      context.strokeRect(x - 1, barY - 1, w + 2, barH + 2);
-      context.lineWidth = 1;
+// src/engine/render-service.ts
+function renderGanttFrame(params) {
+  const { container, canvas, context, options, runtime } = params;
+  const theme = { ...defaultGanttTheme, ...options.theme };
+  container.style.boxSizing = "border-box";
+  container.style.border = `1px solid ${theme.borderColor}`;
+  container.style.borderRadius = "8px";
+  const width = container.clientWidth || options.taskColumnWidth || 800;
+  const height = container.clientHeight || 480;
+  const ratio = window.devicePixelRatio || 1;
+  const resolvedOptions = runtime.taskColumnWidth == null ? options : { ...options, taskColumnWidth: runtime.taskColumnWidth };
+  let layout = buildGanttLayout(resolvedOptions);
+  let viewport = resolveGanttViewportLayout(layout, width, height);
+  layout = fitGanttLayoutToTimelineWidth(
+    layout,
+    viewport.timelineViewportWidth
+  );
+  viewport = resolveGanttViewportLayout(layout, width, height);
+  const scroll = clampGanttScroll(runtime.scroll, viewport.bounds);
+  const scrollbars = computeGanttScrollbarLayout({ layout, viewport, scroll });
+  runtime.layout = layout;
+  runtime.viewport = viewport;
+  runtime.scroll = scroll;
+  runtime.scrollbars = scrollbars;
+  const pixelWidth = Math.max(Math.round(width * ratio), 1);
+  const pixelHeight = Math.max(Math.round(height * ratio), 1);
+  if (canvas.width !== pixelWidth) canvas.width = pixelWidth;
+  if (canvas.height !== pixelHeight) canvas.height = pixelHeight;
+  const cssWidth = `${width}px`;
+  const cssHeight = `${height}px`;
+  if (canvas.style.width !== cssWidth) canvas.style.width = cssWidth;
+  if (canvas.style.height !== cssHeight) canvas.style.height = cssHeight;
+  context.setTransform(ratio, 0, 0, ratio, 0, 0);
+  renderGantt(
+    context,
+    layout,
+    resolvedOptions.dependencies ?? [],
+    runtime.selectedId,
+    { ...defaultGanttTheme, ...resolvedOptions.theme },
+    {
+      viewport,
+      scroll,
+      scrollbars,
+      taskColumnTitle: resolvedOptions.taskColumnTitle,
+      taskResizable: resolvedOptions.editable === true && resolvedOptions.taskResizable !== false,
+      weekendBackground: resolvedOptions.weekendBackground !== false,
+      rowDrag: runtime.rowDrag,
+      selectedDependencyIndex: runtime.selectedDependencyIndex,
+      dependencyDrag: runtime.dependencyDrag,
+      dependencyEditable: resolvedOptions.editable === true
     }
-  });
-  const rowMap = new Map(layout.rows.map((row) => [row.task.id, row]));
-  context.strokeStyle = theme.milestoneColor;
-  context.fillStyle = theme.milestoneColor;
-  dependencies.forEach((dependency) => {
-    const from = rowMap.get(dependency.from);
-    const to = rowMap.get(dependency.to);
-    if (!from || !to) return;
-    const fromX = xForDate(toTimestamp(from.task.end), layout);
-    const fromY = from.y + layout.rowHeight / 2;
-    const toX = xForDate(toTimestamp(to.task.start), layout);
-    const toY = to.y + layout.rowHeight / 2;
-    context.beginPath();
-    context.moveTo(fromX, fromY);
-    context.lineTo((fromX + toX) / 2, fromY);
-    context.lineTo((fromX + toX) / 2, toY);
-    context.lineTo(toX, toY);
-    context.stroke();
-    context.beginPath();
-    context.moveTo(toX, toY);
-    context.lineTo(toX - 5, toY - 4);
-    context.lineTo(toX - 5, toY + 4);
-    context.closePath();
-    context.fill();
-  });
+  );
+}
+
+// src/engine/runtime.ts
+function createGanttRuntime() {
+  return {
+    layout: null,
+    viewport: null,
+    scrollbars: {},
+    scroll: { left: 0, top: 0 },
+    selectedId: null,
+    selectedDependencyIndex: null,
+    dependencyDrag: null,
+    taskDrag: null,
+    scrollbarDrag: null,
+    columnResize: null,
+    taskColumnWidth: null,
+    wheelScrollTarget: null,
+    wheelScrollFrameId: null,
+    wheelScrollLastTime: 0,
+    rowDrag: null
+  };
 }
 
 // src/gantt.ts
 var Gantt = class {
   constructor(container, options) {
-    __publicField(this, "container");
+    __publicField(this, "container", container);
     __publicField(this, "canvas");
     __publicField(this, "context");
+    __publicField(this, "runtime", createGanttRuntime());
+    __publicField(this, "eventController");
     __publicField(this, "options");
-    __publicField(this, "layout", null);
-    __publicField(this, "selectedId", null);
-    __publicField(this, "scrollLeft", 0);
-    __publicField(this, "scrollTop", 0);
     __publicField(this, "resizeObserver", null);
-    __publicField(this, "drag", null);
-    __publicField(this, "handlePointerDown", (event) => {
-      if (!this.layout) return;
-      const point = this.point(event);
-      const task = hitTestTask(point.x, point.y, this.layout);
-      if (!task) return;
-      this.selectedId = task.id;
-      this.drag = { task, startX: point.x, originalStart: new Date(task.start).getTime(), originalEnd: new Date(task.end).getTime() };
-      this.canvas.setPointerCapture(event.pointerId);
-      this.options.onTaskClick?.(task);
-      this.render();
-    });
-    __publicField(this, "handlePointerMove", (event) => {
-      if (!this.drag || !this.layout) return;
-      const delta = Math.round((this.point(event).x - this.drag.startX) / this.layout.dayWidth) * 864e5;
-      this.drag.task.start = new Date(this.drag.originalStart + delta);
-      this.drag.task.end = new Date(this.drag.originalEnd + delta);
-      this.render();
-    });
-    __publicField(this, "handlePointerUp", (event) => {
-      if (!this.drag) return;
-      this.options.onTaskChange?.(this.drag.task);
-      this.drag = null;
-      this.canvas.releasePointerCapture(event.pointerId);
-    });
-    __publicField(this, "handleWheel", (event) => {
-      event.preventDefault();
-      this.scrollLeft = Math.max(0, this.scrollLeft + event.deltaX + (event.shiftKey ? event.deltaY : 0));
-      this.scrollTop = Math.max(0, this.scrollTop + (event.shiftKey ? 0 : event.deltaY));
-      this.render();
-    });
+    __publicField(this, "renderFrameId", null);
     const context = document.createElement("canvas").getContext("2d");
-    if (!context) throw new Error("Canvas 2D context is not supported in the current environment.");
-    this.container = container;
+    if (!context) {
+      throw new Error(
+        "Canvas 2D context is not supported in the current environment."
+      );
+    }
     this.canvas = context.canvas;
     this.context = context;
     this.options = options;
     this.canvas.style.display = "block";
     this.canvas.style.touchAction = "none";
+    this.canvas.style.outline = "none";
+    this.canvas.tabIndex = 0;
     this.container.style.overflow = "hidden";
+    this.container.style.borderRadius = "8px";
+    this.eventController = new GanttEventController({
+      canvas: this.canvas,
+      runtime: this.runtime,
+      getOptions: () => this.options,
+      render: () => this.render(),
+      scheduleRender: () => this.scheduleRender(),
+      scrollTo: (left, top) => this.scrollTo(left, top)
+    });
   }
   /** 挂载并开始渲染。 */
   mount() {
     if (!this.canvas.parentElement) this.container.appendChild(this.canvas);
-    this.canvas.addEventListener("pointerdown", this.handlePointerDown);
-    this.canvas.addEventListener("pointermove", this.handlePointerMove);
-    this.canvas.addEventListener("pointerup", this.handlePointerUp);
-    this.canvas.addEventListener("wheel", this.handleWheel, { passive: false });
+    this.canvas.addEventListener(
+      "pointerdown",
+      this.eventController.handlePointerDown
+    );
+    this.canvas.addEventListener(
+      "pointermove",
+      this.eventController.handlePointerMove
+    );
+    this.canvas.addEventListener(
+      "pointerup",
+      this.eventController.handlePointerUp
+    );
+    this.canvas.addEventListener(
+      "pointercancel",
+      this.eventController.handlePointerUp
+    );
+    this.canvas.addEventListener(
+      "pointerleave",
+      this.eventController.handlePointerLeave
+    );
+    this.canvas.addEventListener("wheel", this.eventController.handleWheel, {
+      passive: false
+    });
+    this.canvas.addEventListener("keydown", this.eventController.handleKeyDown);
     this.resizeObserver = typeof ResizeObserver === "undefined" ? null : new ResizeObserver(() => this.render());
     this.resizeObserver?.observe(this.container);
     this.render();
   }
   /** 更新配置并重绘。 */
   updateOptions(options) {
+    this.eventController.stopWheelScroll();
+    if (options.scale !== this.options.scale) {
+      this.runtime.scroll.left = 0;
+    }
+    if (options.taskColumnWidth !== this.options.taskColumnWidth) {
+      this.runtime.taskColumnWidth = null;
+    }
     this.options = options;
-    this.selectedId = null;
+    if (this.runtime.selectedDependencyIndex != null && this.runtime.selectedDependencyIndex >= (options.dependencies?.length ?? 0)) {
+      this.runtime.selectedDependencyIndex = null;
+    }
     this.render();
   }
   /** 获取当前选中任务。 */
   getSelectedTask() {
-    return this.options.tasks.find((task) => task.id === this.selectedId) ?? null;
+    return findGanttTaskById(this.options.tasks, this.runtime.selectedId);
+  }
+  /** 获取当前选中的依赖连线。 */
+  getSelectedDependency() {
+    return this.runtime.selectedDependencyIndex == null ? null : this.options.dependencies?.[this.runtime.selectedDependencyIndex] ?? null;
+  }
+  /** 滚动到指定位置，超出内容范围的坐标会被自动约束。 */
+  scrollTo(left, top = this.runtime.scroll.top) {
+    this.eventController.stopWheelScroll();
+    const viewport = this.runtime.viewport;
+    if (!viewport) return;
+    this.runtime.scroll = clampGanttScroll({ left, top }, viewport.bounds);
+    this.render();
   }
   /** 销毁实例。 */
   destroy() {
+    this.eventController.destroy();
+    if (this.renderFrameId != null) {
+      cancelAnimationFrame(this.renderFrameId);
+      this.renderFrameId = null;
+    }
     this.resizeObserver?.disconnect();
     this.resizeObserver = null;
+    this.canvas.removeEventListener(
+      "pointerdown",
+      this.eventController.handlePointerDown
+    );
+    this.canvas.removeEventListener(
+      "pointermove",
+      this.eventController.handlePointerMove
+    );
+    this.canvas.removeEventListener(
+      "pointerup",
+      this.eventController.handlePointerUp
+    );
+    this.canvas.removeEventListener(
+      "pointercancel",
+      this.eventController.handlePointerUp
+    );
+    this.canvas.removeEventListener(
+      "pointerleave",
+      this.eventController.handlePointerLeave
+    );
+    this.canvas.removeEventListener("wheel", this.eventController.handleWheel);
+    this.canvas.removeEventListener(
+      "keydown",
+      this.eventController.handleKeyDown
+    );
     this.canvas.remove();
   }
   render() {
-    const width = this.container.clientWidth || this.options.taskColumnWidth || 800;
-    const height = this.container.clientHeight || 480;
-    const ratio = window.devicePixelRatio || 1;
-    this.layout = buildGanttLayout(this.options);
-    this.canvas.width = width * ratio;
-    this.canvas.height = height * ratio;
-    this.canvas.style.width = `${width}px`;
-    this.canvas.style.height = `${height}px`;
-    this.context.setTransform(ratio, 0, 0, ratio, -this.scrollLeft * ratio, -this.scrollTop * ratio);
-    renderGantt(this.context, this.layout, this.options.dependencies ?? [], this.selectedId, { ...defaultGanttTheme, ...this.options.theme });
+    if (this.renderFrameId != null) {
+      cancelAnimationFrame(this.renderFrameId);
+      this.renderFrameId = null;
+    }
+    renderGanttFrame({
+      container: this.container,
+      canvas: this.canvas,
+      context: this.context,
+      options: this.options,
+      runtime: this.runtime
+    });
   }
-  point(event) {
-    const rect = this.canvas.getBoundingClientRect();
-    return { x: event.clientX - rect.left + this.scrollLeft, y: event.clientY - rect.top + this.scrollTop };
+  scheduleRender() {
+    if (this.renderFrameId != null) return;
+    this.renderFrameId = requestAnimationFrame(() => {
+      this.renderFrameId = null;
+      this.render();
+    });
   }
 };
 
+// src/interaction/hit-test.ts
+function hitTestTask(x, y, layout) {
+  return hitTestTaskBar({
+    x,
+    y,
+    layout,
+    selectedId: null,
+    resizable: false
+  })?.task ?? null;
+}
+
 exports.Gantt = Gantt;
 exports.buildGanttLayout = buildGanttLayout;
+exports.clampGanttScroll = clampGanttScroll;
+exports.computeGanttScrollbarLayout = computeGanttScrollbarLayout;
 exports.defaultGanttTheme = defaultGanttTheme;
+exports.hitTestGanttDependency = hitTestGanttDependency;
+exports.hitTestGanttScrollbar = hitTestGanttScrollbar;
 exports.hitTestTask = hitTestTask;
 exports.renderGantt = renderGantt;
 exports.resolveDayWidth = resolveDayWidth;
+exports.resolveDependencyLayoutRoute = resolveDependencyLayoutRoute;
+exports.resolveDependencyRoute = resolveDependencyRoute;
+exports.resolveGanttScrollBounds = resolveGanttScrollBounds;
+exports.resolveGanttViewportLayout = resolveGanttViewportLayout;
 exports.xForDate = xForDate;
 //# sourceMappingURL=index.cjs.map
 //# sourceMappingURL=index.cjs.map