feat(ux): M1/M2 移动端可用 — 导航汉堡抽屉 + 写作工具条不溢出

M1 左导航响应式抽屉:抽出 lib/nav/items.ts(条目数据+激活判定,纯逻辑+vitest)
共用于桌面静态侧栏(hidden lg:block)与移动汉堡抽屉。新增通用 Drawer(遮罩/
Esc 关闭/打开聚焦,复用 CommandPalette a11y 模式)+ NavDrawer + NavItems;
LeftNav 改 <lg 隐藏,AppShell 顶栏加汉堡(aria-label 打开导航)。

M2 写作工具条不溢出 + 移动端可达章节/助手:Toolbar 改 flex-wrap,390px 不再
横切「尚未保存」;ChapterList/ChapterAssistant 抽出 *Content,Workbench 经
左/右 Drawer 在 <lg 触达目录/助手。

实景 390px 复验(browse):汉堡显示/静态导航隐藏/抽屉开合聚焦+Esc、工具条
两行不溢出、助手抽屉真注入面板。门禁:lint/typecheck 干净 · vitest 177 · build OK。
This commit is contained in:
Yaojia Wang
2026-06-20 11:26:14 +02:00
parent b18310bcb7
commit 9b893a6c61
10 changed files with 394 additions and 152 deletions

View File

@@ -0,0 +1,72 @@
import { describe, expect, it } from "vitest";
import {
GLOBAL_NAV_ITEMS,
isNavItemActive,
projectNavItems,
type NavItem,
} from "./items";
const PID = "p1";
describe("projectNavItems", () => {
it("builds the eight project entries scoped to the project id", () => {
const items = projectNavItems(PID);
expect(items).toHaveLength(8);
expect(items.map((i) => i.key)).toEqual([
"write",
"outline",
"foreshadow",
"review",
"style",
"codex",
"rules",
"skills",
]);
expect(items.every((i) => i.href.startsWith(`/projects/${PID}/`))).toBe(
true,
);
});
});
describe("isNavItemActive", () => {
const write: NavItem = {
href: `/projects/${PID}/write`,
label: "写作",
key: "write",
};
it("matches a project item by its activeNav key regardless of pathname", () => {
expect(
isNavItemActive(write, { pathname: "/anything", activeNav: "write" }),
).toBe(true);
});
it("matches a project item by exact pathname when no activeNav given", () => {
expect(isNavItemActive(write, { pathname: `/projects/${PID}/write` })).toBe(
true,
);
});
it("does not match a project item when neither key nor path align", () => {
expect(isNavItemActive(write, { pathname: "/", activeNav: "outline" })).toBe(
false,
);
});
it("matches a global item by exact pathname only", () => {
const works = GLOBAL_NAV_ITEMS[0];
expect(isNavItemActive(works, { pathname: "/" })).toBe(true);
expect(isNavItemActive(works, { pathname: "/projects/p1/write" })).toBe(
false,
);
});
it("ignores activeNav for global items (no key)", () => {
const settings = GLOBAL_NAV_ITEMS[1];
expect(
isNavItemActive(settings, { pathname: "/", activeNav: "write" }),
).toBe(false);
});
});