@orbit-work/ui 0.1.2-preview.0 → 0.1.3

package/src/components/domain/desktop/DesktopWorkspaceView/DesktopWorkspaceView.stories.tsx

@@ -1,227 +0,0 @@
-import type { Meta, StoryObj } from "@storybook/react"
-import {
-  DesktopWorkspaceEmptyState,
-  DesktopWorkspaceEntryRowView,
-  DesktopWorkspaceMemoryDetailDialog,
-  DesktopWorkspaceMemoryView,
-  DesktopWorkspaceProjectDetailView,
-  DesktopWorkspaceProjectRowView,
-} from "./index"
-
-/**
- * 「我的空间」件集 —— **整族待退役**（A11-B4 · 裁决 16）。原型里没有这一屏：项目文件归右栏
- * 「文件」页签（`Files/FileBrowser`、`Screens/Browser` 的 FilesTab），记忆归设置二级页第八段
- * （`Desktop/DesktopSettingsMemorySection`、`Screens/SettingsMemory`）。这些故事只作退役对照。
- * 连接器详情已搬去 `Desktop/DesktopConnectorDetailView`（它与「我的空间」无关，别一起删）。
- */
-const meta = {
-  title: "Desktop/DesktopWorkspaceView",
-  tags: ["deprecated"],
-  component: DesktopWorkspaceEmptyState,
-} satisfies Meta<typeof DesktopWorkspaceEmptyState>
-
-export default meta
-type Story = StoryObj<typeof meta>
-
-export const EmptyState: Story = {
-  args: {
-    // icon 入参已 @deprecated 且实现不解构（传了也不渲染）——空态母题固定为信标构型。
-    title: "还没有任何项目",
-    description: "创建项目后会显示在这里",
-  },
-}
-
-export const ProjectRow: StoryObj<typeof DesktopWorkspaceProjectRowView> = {
-  render: () => (
-    <div style={{ padding: 20, background: "var(--ow-bg)" }}>
-      <DesktopWorkspaceProjectRowView
-        name="orbit-fe"
-        path="/Users/zhangying/projects/orbit-fe"
-        onEnter={() => console.log("Enter project")}
-        onOpenDirectory={() => console.log("Open directory")}
-      />
-    </div>
-  ),
-}
-
-export const EntryRow: StoryObj<typeof DesktopWorkspaceEntryRowView> = {
-  render: () => (
-    <div style={{ padding: 20, background: "var(--ow-bg)" }}>
-      <DesktopWorkspaceEntryRowView
-        entry={{
-          id: "1",
-          name: "src",
-          kind: "folder",
-          size: "—",
-          modified: "2 小时前",
-        }}
-        onEnter={(entry) => console.log("Enter", entry)}
-        onOpen={(entry) => console.log("Open", entry)}
-      />
-      <DesktopWorkspaceEntryRowView
-        entry={{
-          id: "2",
-          name: "package.json",
-          kind: "file",
-          size: "2.4 KB",
-          modified: "1 小时前",
-        }}
-        onEnter={(entry) => console.log("Enter", entry)}
-        onOpen={(entry) => console.log("Open", entry)}
-      />
-    </div>
-  ),
-}
-
-const mockEntries = [
-  { id: "1", name: "src", kind: "folder" as const, modified: "2 小时前" },
-  { id: "2", name: "docs", kind: "folder" as const, modified: "1 天前" },
-  { id: "3", name: "package.json", kind: "file" as const, size: "2.4 KB", modified: "1 小时前" },
-  { id: "4", name: "README.md", kind: "file" as const, size: "5.2 KB", modified: "3 小时前" },
-]
-
-export const ProjectDetail: StoryObj<typeof DesktopWorkspaceProjectDetailView> = {
-  render: () => (
-    <div style={{ height: "100vh" }}>
-      <DesktopWorkspaceProjectDetailView
-        name="orbit-fe"
-        breadcrumbs={["packages", "ow-ui"]}
-        entries={mockEntries}
-        onBack={() => console.log("Back")}
-        onBreadcrumb={(index) => console.log("Breadcrumb", index)}
-        onEnter={(entry) => console.log("Enter", entry)}
-        onOpen={(entry) => console.log("Open", entry)}
-      />
-    </div>
-  ),
-}
-
-export const ProjectDetailEmpty: StoryObj<typeof DesktopWorkspaceProjectDetailView> = {
-  render: () => (
-    <div style={{ height: "100vh" }}>
-      <DesktopWorkspaceProjectDetailView name="empty-project" entries={[]} onBack={() => console.log("Back")} />
-    </div>
-  ),
-}
-
-export const ProjectDetailLoading: StoryObj<typeof DesktopWorkspaceProjectDetailView> = {
-  render: () => (
-    <div style={{ height: "100vh" }}>
-      <DesktopWorkspaceProjectDetailView
-        name="loading-project"
-        entries={[]}
-        loading
-        onBack={() => console.log("Back")}
-      />
-    </div>
-  ),
-}
-
-/** 错态：一句人话 ＋ mono 技术详情 ≤2 行 ＋ 重试（§6 容器三态最后一档）。 */
-export const ProjectDetailError: StoryObj<typeof DesktopWorkspaceProjectDetailView> = {
-  render: () => (
-    <div style={{ height: "100vh" }}>
-      <DesktopWorkspaceProjectDetailView
-        name="orbit-fe"
-        entries={[]}
-        error="读不到这个目录，可能已被移动或删除。"
-        errorDetail="ENOENT: no such file or directory, scandir '/Users/terry/Orbitwork/projects/orbit-fe'"
-        onRetry={() => console.log("Retry")}
-        onBack={() => console.log("Back")}
-      />
-    </div>
-  ),
-}
-
-const mockMemorySections = [
-  {
-    id: "user-profile",
-    title: "用户画像",
-    hint: "关于您的基本信息",
-    items: [
-      {
-        id: "1",
-        subject: "职业角色",
-        text: "前端开发工程师，擅长 React 和 TypeScript",
-        source: "user" as const,
-        sourceLabel: "用户提供",
-        when: "2 天前",
-        tags: ["职业", "技能"],
-      },
-      {
-        id: "2",
-        subject: "工作偏好",
-        text: "喜欢使用 pnpm 管理依赖，优先考虑类型安全",
-        source: "extractor" as const,
-        when: "1 天前",
-        tags: ["偏好"],
-      },
-    ],
-  },
-  {
-    id: "project-context",
-    title: "项目上下文",
-    items: [
-      {
-        id: "3",
-        text: "orbit-fe 项目使用 monorepo 结构，包含 desktop 和 server 两个主要应用",
-        source: "remember" as const,
-        sourceLabel: "手动记住",
-        when: "3 小时前",
-        tags: ["架构", "orbit-fe"],
-      },
-    ],
-  },
-]
-
-export const MemoryView: StoryObj<typeof DesktopWorkspaceMemoryView> = {
-  render: () => (
-    <div style={{ padding: 20, background: "var(--ow-bg)", minHeight: "100vh" }}>
-      <DesktopWorkspaceMemoryView sections={mockMemorySections} onOpenItem={(item) => console.log("Open item", item)} />
-    </div>
-  ),
-}
-
-export const MemoryViewEmpty: StoryObj<typeof DesktopWorkspaceMemoryView> = {
-  render: () => (
-    <div style={{ padding: 20, background: "var(--ow-bg)", minHeight: "100vh" }}>
-      <DesktopWorkspaceMemoryView sections={[]} />
-    </div>
-  ),
-}
-
-/** 载态：skeleton 行呼吸，不用 shimmer（§9）。 */
-export const MemoryViewLoading: StoryObj<typeof DesktopWorkspaceMemoryView> = {
-  render: () => (
-    <div style={{ padding: 20, background: "var(--ow-bg)", minHeight: "100vh" }}>
-      <DesktopWorkspaceMemoryView sections={[]} loading />
-    </div>
-  ),
-}
-
-/** 错态：一句人话 ＋ mono 详情 ＋ 重试。 */
-export const MemoryViewError: StoryObj<typeof DesktopWorkspaceMemoryView> = {
-  render: () => (
-    <div style={{ padding: 20, background: "var(--ow-bg)", minHeight: "100vh" }}>
-      <DesktopWorkspaceMemoryView
-        sections={[]}
-        error="记忆没能取回来，稍后再试。"
-        errorDetail="GET /v1/memory 503 Service Unavailable"
-        onRetry={() => console.log("Retry")}
-      />
-    </div>
-  ),
-}
-
-export const MemoryDetailDialog: StoryObj<typeof DesktopWorkspaceMemoryDetailDialog> = {
-  render: () => (
-    <DesktopWorkspaceMemoryDetailDialog
-      title="职业角色"
-      content="前端开发工程师，擅长 React 和 TypeScript"
-      meta="2 天前 · 用户提供"
-      onClose={() => console.log("Close")}
-      onDelete={() => console.log("Delete")}
-      onSave={(content) => console.log("Save", content)}
-    />
-  ),
-}

package/src/components/domain/desktop/DesktopWorkspaceView/DesktopWorkspaceViewSource.test.mjs

@@ -1,175 +0,0 @@
-import assert from "node:assert/strict"
-import { readFile } from "node:fs/promises"
-import test from "node:test"
-
-const source = await readFile(new URL("./index.tsx", import.meta.url), "utf8")
-const styles = await readFile(new URL("../../../../../styles/desktop-surfaces.css", import.meta.url), "utf8")
-
-/* A11-B4（裁决 16）：连接器详情已搬去 ../DesktopConnectorDetailView，
-   它的四条断言（发现内容槽 / 连接器行不再暴露 / 工具区计数只出一处）随件迁到
-   DesktopConnectorDetailViewSource.test.mjs，本文件只留「我的空间」自己的断言。 */
-
-test("workspace containers carry all three states (DS2 P6 §6)", () => {
-  /* 载＝skeleton 呼吸 · 错＝一句人话＋mono 详情＋重试 · 空＝EmptyState 信标母题 */
-  assert.match(source, /function WorkspaceListSkeleton/)
-  assert.match(source, /<Skeleton key=\{index\} variant="block"/)
-  assert.equal(source.match(/<WorkspaceListSkeleton/g)?.length, 2)
-  assert.equal(source.match(/<InlineMessage\s+variant="error"/g)?.length, 2)
-  assert.equal(source.match(/errorDetail\?: string/g)?.length, 2)
-  assert.equal(source.match(/onRetry\?: \(\) => void/g)?.length, 2)
-  assert.match(source, /<EmptyState\s+className="mem-empty"/)
-  assert.doesNotMatch(source, /mem-empty__icon/)
-  assert.doesNotMatch(styles, /^\s*\.mem-empty__icon/m)
-})
-
-test("workspace readouts run mono (DS2 P6 §7)", () => {
-  /* 项目路径 / 文件体积 / 修改时间都是读数 */
-  assert.match(styles, /\.fs-row \.meta \.sub \{[^}]*font-family: var\(--ow-font-mono\)/)
-  assert.match(styles, /\.fs-row \.col \{[^}]*var\(--ow-font-mono\)[^}]*tabular-nums/)
-})
-
-test("workspace rows keep semantic surfaces instead of gray primitives", () => {
-  /* §2 语义优先：字形底 / 缩略图底 / 私有徽标底改 --ow-surface-2，来源点走 --ow-border-strong */
-  assert.match(styles, /\.fs-row \.g \{[^}]*background: var\(--ow-surface-2\)/)
-  assert.match(styles, /\.fs-row img\.g \{[^}]*background: var\(--ow-surface-2\)/)
-  assert.match(styles, /\.fs-row \.badge-mine \{[^}]*background: var\(--ow-surface-2\)/)
-  assert.match(styles, /\.mem-note \.tick \{[^}]*background: var\(--ow-border-strong\)/)
-  assert.doesNotMatch(styles, /\.fs-row [^{\n]*\{[^}]*var\(--ow-gray-/)
-  assert.doesNotMatch(styles, /\.mem-note[^{\n]*\{[^}]*var\(--ow-gray-/)
-})
-
-// W5 去痕（共享 CSS）：挂件面板三族的 V1 残迹。这些标记由 apps/desktop 的 WidgetCards
-// 渲染，packages/ui 只持有样式，所以断言只压 desktop-surfaces.css。
-test("widget panel drops the V1 decorative pulses, pill checkbox and four-colour tags", () => {
-  // §9：注意点/横幅点原来挂 pulse 1.4s ease-in-out（档外时长＋档外缓动＋装饰闪烁）
-  assert.doesNotMatch(styles, /\.attn-count \.dp \{[^}]*animation:/)
-  assert.doesNotMatch(styles, /\.attn-banner \.dp \{[^}]*animation:/)
-  // §7：勾选框走 4px 档，999 只留给带状态点/计数的 chip
-  assert.match(styles, /\.wtodo \.ck \{[^}]*border-radius: var\(--ow-radius-2xs\)/)
-  // 分类标：sky/violet/green/warm 四色收敛到 info tint ＋ 6px 直角
-  assert.match(
-    styles,
-    /\.wtodo \.wtag \{[^}]*border-radius: var\(--ow-radius-tag\)[^}]*background: var\(--ow-mention-bg\)/,
-  )
-  assert.doesNotMatch(styles, /\.wtodo \.wtag\.(green|warm) \{[^}]*var\(--ow-(success|warning)/)
-  // §6：拖拽源槽不用整块 opacity；荧黄的 --ow-drop-* 只留给落点槽
-  assert.doesNotMatch(styles, /\.wc-slot\.dragging \{[^}]*opacity:/)
-  assert.match(styles, /\.wc-slot\.dragging > \.wc \{[^}]*background: var\(--ow-surface-2\)/)
-  // §4 R2：墨底纸字的 CTA hover 不得跳到行动极族（暗档＝荧黄）
-  assert.match(styles, /\.wsub \.attn-line \.cta:hover \{ background: var\(--ow-text-2\); \}/)
-})
-
-// W5 残留清扫片 14（共享 CSS）：文件空间 / 记忆 / 对话框表单三片的形状、显影与死族。
-test("file & memory surfaces settle the tag shape, focus reveal and timeline token", () => {
-  // §7 形状：纯分类/计数标签一律 6px 直角，999 只留给带状态点的 chip
-  for (const rule of [
-    /\.fs-row \.badge-mine \{[^}]*border-radius: var\(--ow-radius-tag\)/,
-    /\.folder-card \.tag \{[^}]*border-radius: var\(--ow-radius-tag\)/,
-    /\.fd-head \.tag \{[^}]*border-radius: var\(--ow-radius-tag\)/,
-    /\.fs-group__lbl \.ct \{[^}]*border-radius: var\(--ow-radius-tag\)/,
-    // W5 移交 B②：.fs-row .prio-pill 全族零消费方已整族撤，形状断言随之退场
-    // （反向断言见下方「dead desktop-surfaces families」清单）。
-    /\.src-pill \{[^}]*border-radius: var\(--ow-radius-tag\)/,
-    /\.tag-input \.tp \{[^}]*border-radius: var\(--ow-radius-tag\)/,
-  ]) {
-    assert.match(styles, rule)
-  }
-  // §7 读数：分组计数标是计数，mono ＋ tabular-nums
-  assert.match(styles, /\.fs-group__lbl \.ct \{[^}]*var\(--ow-font-mono\)[^}]*tabular-nums/)
-  // §6：hover-only 显影一律补键盘兜底，否则 Tab/触屏摸不到这些按钮
-  // R2 L2-2-6：四处显影同批补 pointer-events——隐形（opacity:0）却可点的按钮不算显影控制。
-  assert.match(styles, /\.fs-row \.more:focus-visible \{ opacity: 1; pointer-events: auto; \}/)
-  assert.match(styles, /\.fs-row \.open\.hover-only:focus-visible \{ opacity: 1; pointer-events: auto; \}/)
-  assert.match(styles, /\.fs-row \.row-acts:focus-within \{ opacity: 1; pointer-events: auto; \}/)
-  assert.match(styles, /\.file-card \.acts:focus-within \{ opacity: 1; pointer-events: auto; \}/)
-  for (const re of [
-    /\.fs-row \.more \{[^}]*opacity: 0; pointer-events: none;/s,
-    /\.fs-row \.open\.hover-only \{ opacity: 0; pointer-events: none;/,
-    /\.fs-row \.row-acts \{[^}]*opacity: 0; pointer-events: none;/s,
-    /\.file-card \.acts \{[^}]*opacity: 0; pointer-events: none;/s,
-    /\.file-row \.more \{[^}]*opacity: 0; pointer-events: none;/s,
-  ]) {
-    assert.match(styles, re)
-  }
-  // 时间轴脊线走语义位而不是直接引边框色
-  assert.match(styles, /\.mem-day__list \{[^}]*border-left: 1\.5px solid var\(--ow-timeline\)/)
-})
-
-test("one segmented-control shape survives, and the workspace rail follows SidebarCurrent", () => {
-  // 判据「分段器/页签只留一套形状」：.seg--prio 不再重画外壳/段边/选中面
-  assert.match(styles, /\.seg--prio \{ display: flex; \}/)
-  assert.doesNotMatch(styles, /\.seg--prio \.seg__opt \{[^}]*border:/)
-  assert.doesNotMatch(styles, /\.seg--prio \.seg__opt\.prio-\w+\.on/)
-  // §6 四态：合并后的唯一一套要自带 hover / press / focus / disabled
-  assert.match(styles, /\.seg__opt:hover:not\(\.on\):not\(:disabled\)/)
-  assert.match(styles, /\.seg__opt:active:not\(:disabled\)/)
-  assert.match(styles, /\.seg__opt:focus-visible \{[^}]*var\(--ow-focus-ring\)/)
-  assert.match(styles, /\.seg__opt:disabled \{[^}]*var\(--ow-disabled-text\)/)
-  // §5/§6：导航当前项＝--ow-current-bg（同 .snav.active），图标位无彩且归 32 档
-  assert.match(styles, /\.rail-item\.active \{ background: var\(--ow-current-bg\); \}/)
-  assert.doesNotMatch(styles, /\.rail-item\.active \.ico \{[^}]*var\(--ow-info/)
-  assert.match(styles, /\.rail-item \.ico \{[^}]*width: 32px; height: 32px/)
-})
-
-test("dead desktop-surfaces families are gone for good", () => {
-  /* 墓碑注释里还写着这些族名（记录撤除理由），所以断言压的是剥掉注释后的规则文本。 */
-  const rules = styles.replace(/\/\*[\s\S]*?\*\//g, "")
-  for (const selector of [
-    "\\.setup-head",
-    "\\.fs-row \\.prio-pill",
-    "\\.tier-filter",
-    "\\.model-row",
-    "\\.model-list",
-    "\\.setup-foot",
-    "\\.btn--icon",
-    "\\.files2__head",
-    "\\.files2__search",
-    "\\.ftable__row",
-    "\\.fskill",
-    "\\.task-row",
-    // W5 移交 B②（共享 CSS 死码清除批）
-    "\\.cbtn-count",
-    "\\.json-err",
-    "\\.permission-badge",
-    "\\.mem-search",
-    "\\.cmd-list",
-    "\\.cmd-group",
-    "\\.cmd-opt",
-    "\\.cmd-empty",
-    "\\.cpop--cmd",
-    "\\.skill-import-result__list",
-    "\\.skill-import-result__item",
-    "\\.skill-import-result__status",
-  ]) {
-    assert.doesNotMatch(rules, new RegExp(`^\\s*${selector}[\\s.:,{]`, "m"))
-  }
-})
-
-test("R2：「返回」归口 composite/BackButton，‹ 字符排版与它的备料 CSS 一并退役", () => {
-  // B0 核对：`fs-back` 是 e2e 定位钩子（workspace-interactions.spec.ts 按 .fs-back + '项目' 点返回），
-  // 8dd59a6 换 BackButton 时丢了，补回；CSS 侧仍不得有 .fs-back 形状规则（下一条断言）。
-  assert.match(source, /<BackButton className="fs-back" label="返回项目" onClick=\{onBack\}>/)
-  assert.doesNotMatch(source, /‹/)
-  // 只认选择器（行首），注释里提到旧类名不算残留
-  assert.doesNotMatch(styles, /^\s*\.fs-back[\s.:{,]/m)
-})
-
-test("R2：§8 中文眉标——分组标题不加 uppercase，走 eyebrow-cjk 档", () => {
-  const lbl = styles.match(/^\.fs-group__lbl \{[^\n]*\}$/m)?.[0] ?? ""
-  assert.match(lbl, /font: 500 var\(--ow-fs-eyebrow-cjk\)/)
-  assert.match(lbl, /color: var\(--ow-eyebrow\)/)
-  assert.match(lbl, /letter-spacing: 0\.08em/)
-  assert.doesNotMatch(lbl, /text-transform: uppercase/)
-})
-
-test("R2：记忆卡回到卡骨架——容器 14 内距 ＋ 语义圆角档", () => {
-  const note = styles.match(/^\.mem-note \{ display: flex;[^\n]*\}$/m)?.[0] ?? ""
-  assert.match(note, /padding: 14px;/)
-  assert.match(note, /border-radius: var\(--ow-radius-card\)/)
-  assert.doesNotMatch(note, /15px|17px|--ow-radius-lg/)
-})
-
-test("R2：.fs-row .memo-ic 死族整族撤（含族内混着的两套 tint 口径）", () => {
-  assert.doesNotMatch(styles, /^\s*\.fs-row \.memo-ic[\s.:{,]/m)
-  assert.doesNotMatch(source, /memo-ic/)
-})