@orbit-work/ui 0.1.0

package/src/screens/Onboarding.stories.tsx

@@ -0,0 +1,155 @@
+import type { Meta, StoryObj } from "@storybook/react"
+import { useLayoutEffect, useRef, useState } from "react"
+import { Composer } from "../components/domain/chat/Composer"
+import { DesktopChatEmptyStateView } from "../components/domain/desktop/DesktopChatEmptyStateView"
+import { DesktopOnboardingTourView } from "../components/domain/desktop/DesktopOnboardingTourView"
+import { DesktopSidebarView } from "../components/domain/desktop/DesktopSidebarView"
+import { DesktopWorkbenchShell } from "../components/domain/desktop/DesktopWorkbenchShell"
+import { DesktopScreenFrame, SCREEN_PARAMETERS, noop, screenProjects, screenSidebarProps } from "./_screen"
+
+/**
+ * Onboarding 整屏（蓝图 06 · screens）——首启引导的组合证明。
+ *
+ * 组合件：Home 那一屏原样在底下（`DesktopWorkbenchShell` ＋ `DesktopSidebarView`
+ * ＋ `DesktopChatEmptyStateView` ＋ `Composer`），上面盖
+ * `domain/desktop/DesktopOnboardingTourView`（R2 T5b 新件，样式在 styles/onboarding.css）。
+ * 真机里引导层 `position: fixed` 贴 viewport；整屏 story 传 `position="absolute"`，
+ * 让它落在画框内，几何不变。
+ *
+ * R2 T5b：五步文案照原型 TOUR（template.dc.html 3295–3301），旧的三步与手搓
+ * `TourOverlay`（✕ ＋ 三点进度 ＋ 700/19 标题）整块退役。
+ *
+ * ## 荧黄逐处旁注
+ * - 左半屏：**0 处**。首启没有当前项，`.ownavitem.active svg .dot` 全灭。
+ * - 右半屏 · 引导卡「下一步 / 开始使用」= `Button variant="primary"` → **行动极 ×1**
+ *   （暗档 `--ow-btn-primary-bg` = `--ow-yellow`）。底层 Composer 的发送钮 disabled，
+ *   不点亮，不构成第二处行动极；底屏其余内容被两层遮罩压住，不参与本屏记账。
+ * - 高亮环走 `--ow-stage-accent`（§3 舞台色，登录/引导/分享三处专用），是装饰不占极；
+ *   两层遮罩（`--ow-scrim` ＋ `--ow-tour-veil`）是遮罩语义，同样不占极。
+ *   （原来借 `--ow-focus-ring` 画环，引导环与键盘焦点环不可区分；且只剩一层挖洞遮罩，
+ *   与原型的两层不同。）
+ */
+const meta = {
+  title: "Screens/Onboarding",
+  parameters: SCREEN_PARAMETERS,
+} satisfies Meta
+
+export default meta
+type Story = StoryObj<typeof meta>
+
+/**
+ * 原型 TOUR 五步（template.dc.html 3295–3301）。
+ *
+ * `anchor` 是 R2 的锚点契约（new-task / projects / plugins / workbench / composer）；
+ * `legacyAnchor` 是当前树上侧栏还挂着的旧键（skills→discover / sites 尚无键），
+ * 改键归 T4 的 L3-3-6，这里两个都试，谁在就量谁——story 不会因为改键的先后而空掉。
+ */
+const STEPS = [
+  {
+    id: "new-task",
+    title: "从这里开始一件事",
+    body: "每次新任务都是一段新会话；上面那排胶囊会把要用的专家、技能与连接器一起挂上。",
+  },
+  { id: "projects", title: "会话按项目收纳", body: "同一件事的多轮对话留在一个项目里；正在跑的那条行尾有一颗点。" },
+  {
+    id: "plugins",
+    title: "插件在这里安装",
+    body: "专家、技能、连接器三段，装过的才会出现在输入框的 / 与 @ 里。",
+    legacyAnchor: "discover",
+  },
+  {
+    id: "workbench",
+    title: "产物都落在工作台",
+    body: "会话里做出来的站点、图片、文档先是草稿，满意了再发布成可分享的链接。",
+    legacyAnchor: "workspace",
+  },
+  { id: "composer", title: "这里可以边说边挂", body: "/ 调技能与指令，@ 引连接器；⏎ 发送、⇧⏎ 换行。" },
+]
+
+/** 输入框还没有 `[data-tour-anchor]`（宿主接线待办），先按它的槽名兜底量。 */
+const COMPOSER_FALLBACK = '[data-slot="composer"]'
+
+/**
+ * 画框内量锚点：真机的 `useOnboardingTour` 按 `[data-tour-anchor]` 量 viewport 坐标，
+ * 这里量出来再减去画框自身的 rect，换成画框内坐标喂给受控件。
+ */
+function OnboardingScreen({ stepIndex }: { stepIndex: number }) {
+  const hostRef = useRef<HTMLDivElement>(null)
+  const [rect, setRect] = useState<{ left: number; top: number; width: number; height: number } | null>(null)
+  const step = STEPS[stepIndex]!
+
+  useLayoutEffect(() => {
+    const host = hostRef.current
+    if (!host) return
+    const doc = host.ownerDocument
+    const anchor =
+      doc.querySelector<HTMLElement>(`[data-tour-anchor="${step.id}"]`) ??
+      (step.legacyAnchor ? doc.querySelector<HTMLElement>(`[data-tour-anchor="${step.legacyAnchor}"]`) : null) ??
+      (step.id === "composer" ? doc.querySelector<HTMLElement>(COMPOSER_FALLBACK) : null)
+    if (!anchor) {
+      setRect(null)
+      return
+    }
+    const hostBox = host.getBoundingClientRect()
+    const box = anchor.getBoundingClientRect()
+    setRect({ left: box.left - hostBox.left, top: box.top - hostBox.top, width: box.width, height: box.height })
+  }, [step.id, step.legacyAnchor])
+
+  return (
+    <DesktopScreenFrame>
+      <div ref={hostRef} style={{ position: "absolute", inset: 0 }}>
+        <DesktopWorkbenchShell
+          contained
+          view="chat"
+          sidebar={
+            <DesktopSidebarView
+              {...screenSidebarProps({
+                projects: screenProjects.map((project) => ({
+                  ...project,
+                  threads: project.threads.map((thread) => ({ ...thread, active: false, running: false })),
+                })),
+              })}
+            />
+          }
+          chat={
+            <DesktopChatEmptyStateView
+              title="在下方输入你的问题或想法，Orbitwork 随时待命。"
+              composer={<Composer placeholder="今天帮你做些什么？ / 调用技能与指令 @ 引用专家和连接器" onSend={noop} />}
+            />
+          }
+          skills={null}
+          sites={null}
+          scheduledTasks={null}
+          workspace={null}
+          overlays={
+            <DesktopOnboardingTourView
+              steps={STEPS}
+              index={stepIndex}
+              anchorRect={rect}
+              position="absolute"
+              onNext={noop}
+              onPrev={noop}
+              onSkip={noop}
+              onDone={noop}
+            />
+          }
+        />
+      </div>
+    </DesktopScreenFrame>
+  )
+}
+
+/** 第 1 步：没有「上一步」，主钮「下一步」。 */
+export const FirstStep: Story = {
+  render: () => <OnboardingScreen stepIndex={0} />,
+}
+
+/** 第 3 步：三钮齐（跳过 / 上一步 / 下一步），锚在「插件」导航项。 */
+export const ThirdStep: Story = {
+  render: () => <OnboardingScreen stepIndex={2} />,
+}
+
+/** 第 5 步（末步）：主钮换「开始使用」，锚在输入框——气泡翻到锚点上方。 */
+export const LastStep: Story = {
+  render: () => <OnboardingScreen stepIndex={4} />,
+}

package/src/screens/ScheduledTasks.stories.tsx

@@ -0,0 +1,134 @@
+import type { Meta, StoryObj } from "@storybook/react"
+import { DesktopSidebarView } from "../components/domain/desktop/DesktopSidebarView"
+import { DesktopWorkbenchShell } from "../components/domain/desktop/DesktopWorkbenchShell"
+import { ScheduledTaskCardView } from "../components/domain/tasks/ScheduledTaskCardView"
+import type { ScheduledTaskCardViewModel } from "../components/domain/tasks/ScheduledTaskCardView"
+import { ScheduledTasksSpaceView } from "../components/domain/tasks/ScheduledTasksSpaceView"
+import { DesktopScreenFrame, SCREEN_PARAMETERS, noop, noopAsync, screenSidebarProps } from "./_screen"
+
+/**
+ * ScheduledTasks 整屏（蓝图 06 · screens）——定时任务空间的组合证明。
+ *
+ * 组合件：`DesktopWorkbenchShell`（view=`scheduled-tasks`）｜`DesktopSidebarView`
+ * ｜`ScheduledTasksSpaceView`（A3-B3 起页首＝`composite/PageHead`：眉标「自动化」／
+ * 32px 大标题「定时任务」／说明句＋句尾 mono 读数「N 个任务」，右上一枚主按钮；
+ * 无页签，页头之下直接进滚动区）｜`ScheduledTaskCardView`
+ * （四态卡：running / done / paused / failed）。
+ *
+ * ## 荧黄逐处旁注
+ * - 左半屏 · 侧栏「定时任务」nav 进 current → `.ownavitem.active svg .dot` 点亮
+ *   `--ow-accent-dot` → **位置极 ×1**。主编码是 `--ow-current-bg` 填充块＋500 字重，
+ *   信标点只是第二编码（R1）。
+ * - 右半屏 · 页头「新建任务」= `Button variant="primary"` → **行动极 ×1**
+ *   （暗档 `--ow-btn-primary-bg` = `--ow-yellow`）。
+ * - 右半屏 · **状态极 0 处**：任务卡的状态点按 §4 让形规则走形差＋文字——
+ *   running 是转子、done 是勾、paused 是暂停符、failed 是叉，配 `.cjc-stat` 文字标签，
+ *   一律不点荧黄（同屏位置极已占信标点形）。
+ * - 读数 mono：说明句尾的「N 个任务」走 PageHead 的 `meta` 槽（mono ＋ tabular-nums），
+ *   cron 表达式与下次执行时间同档；`activeCount`（进行中）A3-B3 起不再进页头，
+ *   进行中是卡上的运行态，不是屏级读数。
+ */
+const meta = {
+  title: "Screens/ScheduledTasks",
+  parameters: SCREEN_PARAMETERS,
+} satisfies Meta
+
+export default meta
+type Story = StoryObj<typeof meta>
+
+const TASKS: ScheduledTaskCardViewModel[] = [
+  {
+    id: "cron-review",
+    name: "每日代码审查",
+    prompt: "检查昨天合并的所有 PR，汇总潜在问题并生成审查报告，发到团队频道。",
+    scheduleLabel: "0 9 * * *",
+    nextLabel: "明天 09:00",
+    paused: false,
+    status: { key: "running", label: "运行中" },
+  },
+  {
+    id: "cron-weekly",
+    name: "周报生成",
+    prompt: "把本周合并的改动和已关闭的问题整理成一段周报。",
+    scheduleLabel: "0 17 * * 5",
+    nextLabel: "周五 17:00",
+    paused: false,
+    status: { key: "done", label: "上次成功" },
+  },
+  {
+    id: "cron-backup",
+    name: "数据备份",
+    prompt: "把工作区目录打包上传到对象存储，保留最近 14 天。",
+    scheduleLabel: "30 2 * * *",
+    nextLabel: "明天 02:30",
+    paused: true,
+    status: { key: "paused", label: "已暂停" },
+  },
+  {
+    id: "cron-metrics",
+    name: "性能监控",
+    prompt: "抓取首屏与接口 P95，超阈值就开一条会话跟进。",
+    scheduleLabel: "0 * * * *",
+    nextLabel: "今天 16:00",
+    paused: false,
+    status: { key: "failed", label: "上次失败" },
+  },
+]
+
+function ScheduledTasksScreen({ tasks, error }: { tasks: ScheduledTaskCardViewModel[]; error?: string }) {
+  const activeCount = tasks.filter((task) => !task.paused).length
+  return (
+    <DesktopScreenFrame>
+      <DesktopWorkbenchShell
+        contained
+        view="scheduled-tasks"
+        sidebar={<DesktopSidebarView {...screenSidebarProps({ activeNav: "cron" })} />}
+        chat={null}
+        skills={null}
+        sites={null}
+        workspace={null}
+        scheduledTasks={
+          <ScheduledTasksSpaceView
+            activeCount={activeCount}
+            totalCount={tasks.length}
+            loading={false}
+            error={error}
+            hasTasks={tasks.length > 0}
+            onCreate={noop}
+            onRetry={noop}
+            taskCards={tasks.map((task) => (
+              <ScheduledTaskCardView
+                key={task.id}
+                task={task}
+                onOpen={noop}
+                onEdit={noop}
+                onToggle={noopAsync}
+                onDelete={noop}
+              />
+            ))}
+          />
+        }
+      />
+    </DesktopScreenFrame>
+  )
+}
+
+/** 有任务：四张卡把 running / done / paused / failed 四态一次摆齐。 */
+export const WithTasks: Story = {
+  render: () => <ScheduledTasksScreen tasks={TASKS} />,
+}
+
+/**
+ * 空态：A5-B3 起是**一级 page 档**——信标 mono 母题 52×32 ＋ 16/500 标题「还没有定时任务」
+ * ＋ 14/1.75 副句 ＋ 一枚 32 高的钮，版心 `56px auto 0`、文字量度 440（原型 L1771–1780）。
+ * 禁插画禁 emoji。行动极仍只有页头那一枚：空态这枚是同一件事的第二个入口，落 secondary，
+ * 所以暗档整屏仍只有右上角一块荧黄（原型这里是两枚实底，属原型自己的行动极超额）。
+ */
+export const Empty: Story = {
+  render: () => <ScheduledTasksScreen tasks={[]} />,
+}
+
+/** 错误：§6 错误制式——一句人话贴在列表上方，已有内容不被清空。 */
+export const RefreshFailed: Story = {
+  render: () => <ScheduledTasksScreen tasks={TASKS} error="刷新任务列表失败，检查下本地服务还在不在。" />,
+}

package/src/screens/ScreenFrameSource.test.mjs

@@ -0,0 +1,77 @@
+import assert from "node:assert/strict"
+import { readFile, readdir } from "node:fs/promises"
+import test from "node:test"
+
+const scaffold = await readFile(new URL("./_screen.tsx", import.meta.url), "utf8")
+
+/*
+ * R2（Terry 2026-09-03 第 1 条）：**画框顶端只有 windows 才有窗口带**。
+ * windows 是 frame:false、三键必须自绘，钮跟着住在带里；mac/linux/web 缺省无带，
+ * 折叠钮住进侧栏顶行（SidebarShell 的 data-slot="sidebar-toprow"），坐标口径不变。
+ */
+test("desktop screen frame bands only on windows (R2)", () => {
+  assert.match(scaffold, /import \{ WindowBand, type WindowBandPlatform, WindowChrome \}/)
+  assert.match(scaffold, /titlebar === undefined \? \(\s*platform === "windows" \? \(\s*<WindowBand/)
+  // mac/linux/web 缺省无带
+  assert.match(scaffold, /\) : undefined\s*\) : \(\s*titlebar\s*\)/)
+  // 平台默认 mac（顶行让位块 68 → 钮落 x=80），可用 URL 开关切 windows（钮在带里，落 x=8）
+  assert.match(scaffold, /platform = screenPlatform\(\)/)
+  assert.match(
+    scaffold,
+    /return raw === "windows" \|\| raw === "linux" \|\| raw === "web" \|\| raw === "mac" \? raw : "mac"/,
+  )
+  // 三键随带走，只在 windows 挂
+  assert.match(scaffold, /chrome=\{<WindowChrome onMinimize=\{noop\} onToggleMaximize=\{noop\} onClose=\{noop\} \/>\}/)
+  assert.doesNotMatch(scaffold, /platform === "windows" \|\| platform === "linux"/)
+})
+
+/* 找茬 L3-3-3：库 CSS 里有一批 `.owshell.is-*` 规则只有宿主 App.tsx 会触发，
+   画框不打同名类就永远证不到那一半——平台截图取证必须建立在这几枚类上。 */
+test("frame stamps the host's shell state classes (L3-3-3)", () => {
+  assert.match(scaffold, /platform === "mac" \? "is-mac" : null/)
+  assert.match(scaffold, /platform === "windows" \? "is-windows" : null/)
+  assert.match(scaffold, /fullscreen \? "is-fullscreen" : null/)
+  assert.match(scaffold, /collapsed \? "collapsed" : null/)
+  assert.match(scaffold, /<div className=\{shellClass\}>/)
+})
+
+/* R2·P3：画框是 `position: fixed` 后代的包含块——`Dialog portal={false}` 的遮罩靠它留在画框内。
+   删掉这条 transform 不会有任何布局报错，画框内弹窗只会静默铺满整个 storybook 视口，所以用源码锁住。
+   （T1 按新口径重写本文件时保留这一条。） */
+test("screen frame is the containing block for fixed descendants (R2·P3)", () => {
+  assert.match(scaffold, /transform: "translateZ\(0\)"/)
+})
+
+test("frame and sidebar mock read the same platform / collapsed / fullscreen switches", () => {
+  assert.match(
+    scaffold,
+    /export function screenCollapsed\(\): boolean \{\s*return screenOption\("ow-collapsed"\) === "1"/,
+  )
+  assert.match(
+    scaffold,
+    /export function screenFullscreen\(\): boolean \{\s*return screenOption\("ow-fullscreen"\) === "1"/,
+  )
+  assert.match(scaffold, /collapsed = screenCollapsed\(\)/)
+  assert.match(scaffold, /fullscreen = screenFullscreen\(\)/)
+  assert.match(scaffold, /collapsed: screenCollapsed\(\),/)
+  // R2：侧栏顶行与 rail 宽全靠这两枚值派生，整屏 mock 必须与画框读同一套开关
+  assert.match(scaffold, /platform: screenPlatform\(\),/)
+  assert.match(scaffold, /fullscreen: screenFullscreen\(\),/)
+})
+
+/* 整屏卡不许自己再造一条带：带只有画框（DesktopScreenFrame）这一个出处，且 R2 起
+   只有 `?ow-platform=windows` 时才真的出一条。画框内的 DesktopWorkbenchShell 一律
+   contained（contained 的壳不自带带），所以 mac 缺省画面里一条带都没有。 */
+test("every desktop screen story rides the frame's single band", async () => {
+  const dir = new URL("./", import.meta.url)
+  const files = (await readdir(dir)).filter((f) => f.endsWith(".stories.tsx"))
+  assert.ok(files.length >= 13)
+  for (const file of files) {
+    const src = await readFile(new URL(file, dir), "utf8")
+    if (!src.includes("<DesktopScreenFrame")) continue
+    const shells = src.match(/<DesktopWorkbenchShell/g)?.length ?? 0
+    const containedCount = src.match(/^\s+contained$/gm)?.length ?? 0
+    assert.equal(containedCount, shells, `${file}: 画框内的整屏壳必须 contained（窗口带归画框）`)
+    assert.doesNotMatch(src, /<TitleBar\b/, `${file}: 不要自造第二条带`)
+  }
+})

package/src/screens/SettingsAppearance.stories.tsx

@@ -0,0 +1,117 @@
+import type { Meta, StoryObj } from "@storybook/react"
+import { DesktopAppearanceSettings } from "../components/domain/desktop/DesktopAppearanceSettings"
+import { DesktopSettingsView } from "../components/domain/desktop/DesktopSettingsView"
+import { DesktopSidebarView } from "../components/domain/desktop/DesktopSidebarView"
+import { DesktopWorkbenchShell } from "../components/domain/desktop/DesktopWorkbenchShell"
+import { screenHomeChat } from "./_home"
+import { DesktopScreenFrame, SCREEN_PARAMETERS, noop, screenSidebarProps } from "./_screen"
+import { SETTINGS_NAV } from "./_settingsNav"
+
+/**
+ * Settings · 常规 整屏（蓝图 06 · screens）。
+ *
+ * R2（Terry 2026-09-03 第 3 条）：设置**改回弹窗**——上一版那张铺满窗口带以下的整幅
+ * 二级页撤回，十段导航撑不满一屏，右栏几张卡之外全是空地。现在是 `composite/Dialog`
+ * 的 `bare` 档：`--ow-scrim` 遮罩 ＋ 960×640 定尺立面（`--ow-radius-modal` 16 · 1px
+ * `--ow-border` · `--ow-shadow-modal` · z `--ow-z-modal`），立面内部复刻壳的表面三档
+ * ——左栏 216 宽 `--ow-bg` 地色（栏底一行 mono 版本号），右栏 `--ow-surface` 纸面 ＋
+ * 左沿 1px 分栏线。取焦落在当前段项（`autoFocus`），Escape / 点遮罩 / ✕ 三条出口。
+ * 底下是主屏（`_home.tsx` 的 `screenHomeChat()`）：模态要证的是「压住了什么」，
+ * 底下留空就等于没证。story 里 `portal={false}`，遮罩才留在 1440×800 画框内可截图。
+ *
+ * 十段导航逐字照原型（`SET_SECTIONS`），左栏行高 32、无图标槽；
+ * 右栏头是 22px display 大标题 ＋ 说明句 ＋ 右上 28 的 ✕。
+ *
+ * 常规段（`DesktopAppearanceSettings`）本轮瘦了三处（裁决 10「皮肤不做」＋ Terry
+ * 「其他一并优化」）：**皮肤整段撤**（连带「导入主题」钮）、**聊天背景段撤**（取值本来
+ * 全靠皮肤 tokens）、**「显示模式跟随系统」开关卡撤** → 换成主题三格分段器
+ * 浅色 / 深色 / 自动（`system` 就是第三格，选项取 `lib/appearance` 的 `THEME_OPTIONS`，
+ * 与侧栏账户菜单「外观」行共用一份）。
+ *
+ * R3（Terry 意见 5）作废 A2-B2「一条设置一张卡」（原型 2422–2461 的卡形）：段内改 `.set-row`
+ * 分隔线行（贴边零内距、上下 12、行间 1px `--ow-border`，无底无圆角）。主题与字体缩放是内联
+ * 分段器（`SegmentedControl size="sm"`＝28 档，选中底在设置弹窗内指 `--ow-current-bg`）；
+ * 三条「暂未支持」是**真禁用**行（逐 token：字
+ * `--ow-disabled-text`、右槽 disabled 开关），不是画一个假开关；默认工作目录是 mono 读数。
+ *
+ * ## 荧黄逐处旁注
+ * - **位置极 ×1**：`.snav.active` 是设置面自己的当前项——它按 §4 让形规则走
+ *   `--ow-current-bg` 填充块，**不点信标点**（信标点形归侧栏 nav 一处，同屏不重复用形）。
+ * - **行动极 ×1**：在**底屏**上——Composer 的发送钮（空草稿下 disabled，逐 token 降调）。
+ *   弹窗里 0 处：全是切换与选择，「更改」是 secondary，不占行动极。
+ *   遮罩把底屏压暗，同屏两层各自只有一处极位，不打架。
+ * - **状态极 0 处**：R3 中性面，不加信标。
+ * - 皮肤色板那块「暗档会亮出一块荧黄」的旧账随皮肤段一起销掉了。
+ * - 双主题：本屏就是主题切换的入口，浅暗两档都要能读——`data-theme` 由 storybook
+ *   工具栏翻，选中态与卡边框全部走语义 token。
+ */
+const meta = {
+  title: "Screens/SettingsAppearance",
+  parameters: SCREEN_PARAMETERS,
+} satisfies Meta
+
+export default meta
+type Story = StoryObj<typeof meta>
+
+/** 「暂未支持」的三条开关，逐字照原型（template.dc.html L4126–4130 `offRows`）。 */
+const UNSUPPORTED_TOGGLES = [
+  { id: "boot", title: "开机自启动", description: "系统启动时自动运行（暂未支持）" },
+  { id: "awake", title: "任务运行时阻止自动休眠", description: "任务处理期间阻止电脑因空闲自动进入睡眠（暂未支持）" },
+  { id: "sound", title: "完成提示音", description: "任务完成时播放提示音（暂未支持）" },
+]
+
+function AppearanceScreen({ theme }: { theme: "light" | "dark" | "system" }) {
+  return (
+    <DesktopScreenFrame>
+      <DesktopWorkbenchShell
+        contained
+        view="chat"
+        sidebar={<DesktopSidebarView {...screenSidebarProps()} />}
+        chat={screenHomeChat()}
+        skills={null}
+        sites={null}
+        scheduledTasks={null}
+        workspace={null}
+        settings={
+          <DesktopSettingsView
+            items={SETTINGS_NAV}
+            activeId="general"
+            version="v1.4.2"
+            portal={false}
+            onChange={noop}
+            onClose={noop}
+          >
+            <DesktopAppearanceSettings
+              theme={theme}
+              resolvedTheme={theme === "dark" ? "dark" : "light"}
+              skinId="default"
+              skins={[]}
+              fontScale="md"
+              onFontScaleChange={noop}
+              unsupportedToggles={UNSUPPORTED_TOGGLES}
+              workRoot="/Users/terry/Coding/orbitwork"
+              onPickWorkRoot={noop}
+              onThemeChange={noop}
+              onSkinChange={noop}
+              onImport={noop}
+              onDeleteCustom={noop}
+              onChooseChatBackground={noop}
+              onClearChatBackground={noop}
+              onChatBackgroundMaskColorChange={noop}
+            />
+          </DesktopSettingsView>
+        }
+      />
+    </DesktopScreenFrame>
+  )
+}
+
+/** 缺省：主题分段器停在第三格「自动」（`theme === "system"`）。 */
+export const Default: Story = {
+  render: () => <AppearanceScreen theme="system" />,
+}
+
+/** 固定深色：三格停在「深色」——原 `SkinSelected` 那张随皮肤段退役，改演三格的另一端。 */
+export const ThemeDark: Story = {
+  render: () => <AppearanceScreen theme="dark" />,
+}

package/src/screens/SettingsMemory.stories.tsx

@@ -0,0 +1,128 @@
+import type { Meta, StoryObj } from "@storybook/react"
+import type { ReactNode } from "react"
+import { DesktopSettingsMemorySection } from "../components/domain/desktop/DesktopSettingsMemorySection"
+import { DesktopSettingsView } from "../components/domain/desktop/DesktopSettingsView"
+import { DesktopSidebarView } from "../components/domain/desktop/DesktopSidebarView"
+import { DesktopWorkbenchShell } from "../components/domain/desktop/DesktopWorkbenchShell"
+import { screenHomeChat } from "./_home"
+import { DesktopScreenFrame, SCREEN_PARAMETERS, noop, screenSidebarProps } from "./_screen"
+import { SETTINGS_NAV } from "./_settingsNav"
+
+/**
+ * Settings · 记忆段（蓝图 06 · screens）。
+ *
+ * A11-B2（裁决 16 · 原型 template.dc.html 2636–2673）：「我的空间 · 记忆」整段退位，
+ * 落到设置二级页的**第八段**。这一屏证的就是那次搬家的成品：
+ *
+ * - 顶上一条**常驻**的 32 高搜索条（`Field` md 档 ＋ 16 放大镜 ＋「搜索记忆」）；
+ * - 两段分区「用户画像 / 通用记忆」——眉标 ＋ caption 说明 ＋ 右端 mono「N 条」；
+ *   一期**没有项目级段**（裁决：一期不做）；
+ * - 一张张记忆卡：正文 ＋ mono 时间，行末 28×28 的编辑 / 删除两枚 ghost 图标钮。
+ *   R2 找茬 L1-3-6：整屏 seed 去掉 `sourceLabel`——原型（模板 2660–2665）的记忆条目
+ *   只有「正文 ＋ mono 时间」两行，我们每条多挂一枚灰底来源签，五条就是五块多余的面。
+ *   组件的 `sourceLabel` 可选 prop 保留给宿主（不传就不出徽章）；
+ * - `Editing` 故事停在**行内编辑态**：卡的正文位就地换成 rows=2 的 textarea ＋
+ *   保存 / 取消，不再跳 `DesktopWorkspaceMemoryDetailDialog` 那个弹层（已 deprecated）。
+ *
+ * ## 荧黄逐处旁注
+ * - **位置极 ×1**：`.snav.active`（第八段「记忆」的 `--ow-current-bg` 填充块）。
+ *   底层侧栏被二级页整幅盖住，左半屏零荧黄。
+ * - **行动极**：`Default` 0 处（段内全是 ghost 图标钮）；`Editing` 1 处
+ *   ——编辑卡里那枚「保存」，同屏没有第二枚主钮。
+ * - **状态极 0 处**：段内没有正在跑的事；来源徽章（`StatusTag mute`）这一轮已从 seed 里撤掉。
+ */
+const meta = {
+  title: "Screens/SettingsMemory",
+  parameters: SCREEN_PARAMETERS,
+} satisfies Meta
+
+export default meta
+type Story = StoryObj<typeof meta>
+
+const SECTIONS = [
+  {
+    id: "profile",
+    title: "用户画像",
+    description: "关于你本人的长期事实",
+    items: [
+      {
+        id: "p1",
+        text: "在一家做跨境电商 SaaS 的公司带增长团队，日常汇报对象是 CEO。",
+        when: "2026-08-30 14:20",
+      },
+      {
+        id: "p2",
+        text: "看数据只认周同比，月度环比一律换算成周口径再给结论。",
+        when: "2026-08-24 09:05",
+      },
+    ],
+  },
+  {
+    id: "general",
+    title: "通用记忆",
+    description: "跨会话都用得上的偏好与约定",
+    items: [
+      {
+        id: "g1",
+        text: "写周报先给三条结论再展开，正文控制在 400 字以内，不要用感叹号。",
+        when: "2026-08-28 21:47",
+      },
+      {
+        id: "g2",
+        text: "涉及金额一律用人民币，保留到万元，超过一亿改写成「x.x 亿」。",
+        when: "2026-08-19 11:32",
+      },
+      {
+        id: "g3",
+        text: "生成图表时默认走浅色底，导出前先问一句要不要暗色版本。",
+        when: "2026-08-11 16:08",
+      },
+    ],
+  },
+]
+
+function MemoryScreen({ body }: { body: ReactNode }) {
+  return (
+    <DesktopScreenFrame>
+      <DesktopWorkbenchShell
+        contained
+        view="chat"
+        sidebar={<DesktopSidebarView {...screenSidebarProps()} />}
+        chat={screenHomeChat()}
+        skills={null}
+        sites={null}
+        scheduledTasks={null}
+        workspace={null}
+        settings={
+          <DesktopSettingsView
+            items={SETTINGS_NAV}
+            activeId="memory"
+            version="v1.4.2"
+            portal={false}
+            onChange={noop}
+            onClose={noop}
+          >
+            {body}
+          </DesktopSettingsView>
+        }
+      />
+    </DesktopScreenFrame>
+  )
+}
+
+/** 读态：搜索条 ＋ 两段分区 ＋ 五张记忆卡。 */
+export const Default: Story = {
+  render: () => <MemoryScreen body={<DesktopSettingsMemorySection sections={SECTIONS} onSave={noop} />} />,
+}
+
+/** 行内编辑：第二段第一条停在编辑态，弹层这一跳没有了。 */
+export const Editing: Story = {
+  render: () => (
+    <MemoryScreen body={<DesktopSettingsMemorySection sections={SECTIONS} editingId="g1" onSave={noop} />} />
+  ),
+}
+
+/** 空态：page 档一级空态（母题 ＋ 标题 ＋ 一句），搜索条让位。 */
+export const Empty: Story = {
+  render: () => <MemoryScreen body={<DesktopSettingsMemorySection sections={[]} />} />,
+}