interface ChapterListProps {
  currentChapterNo: number;
}

// 左栏目录（UX §6.3）。M1 无章节列表端点 → 仅展示当前章占位。
// 桌面 aside 包裹；移动端经 Workbench 抽屉复用 ChapterListContent。
export function ChapterList({ currentChapterNo }: ChapterListProps) {
  return (
    <aside className="hidden border-r border-line bg-panel py-4 lg:block">
      <ChapterListContent currentChapterNo={currentChapterNo} />
    </aside>
  );
}

export function ChapterListContent({ currentChapterNo }: ChapterListProps) {
  return (
    <>
      <h2 className="px-4 text-xs font-semibold uppercase tracking-wide text-ink-soft">
        目录
      </h2>
      <ul className="mt-2">
        <li>
          <span className="flex items-center gap-2 border-l-2 border-cinnabar bg-[var(--color-cinnabar-wash)] px-4 py-2 text-sm text-cinnabar">
            <span aria-hidden="true">●</span>第 {currentChapterNo} 章
          </span>
        </li>
      </ul>
      <p className="mt-4 px-4 text-xs text-ink-soft/70">
        多卷多章目录将在大纲模块开放（后续里程碑）。
      </p>
    </>
  );
}