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

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

@@ -1,418 +0,0 @@
-import type { Meta, StoryObj } from "@storybook/react"
-import { SidebarShell } from "../../../Layout/SidebarShell"
-import { DesktopWorkbenchShell } from "./index"
-
-const meta = {
-  title: "Desktop/DesktopWorkbenchShell",
-  component: DesktopWorkbenchShell,
-  parameters: {
-    layout: "fullscreen",
-  },
-} satisfies Meta<typeof DesktopWorkbenchShell>
-
-export default meta
-type Story = StoryObj<typeof meta>
-
-const mockSidebar = (
-  <div style={{ width: 260, height: "100vh", background: "var(--ow-surface-2)", padding: 20 }}>侧边栏</div>
-)
-
-const mockHeader = (
-  <div
-    style={{
-      height: 60,
-      background: "var(--bg-tertiary)",
-      padding: 20,
-      borderBottom: "1px solid var(--border-primary)",
-    }}
-  >
-    顶部栏
-  </div>
-)
-
-const mockFooter = (
-  <div
-    style={{ height: 60, background: "var(--bg-tertiary)", padding: 20, borderTop: "1px solid var(--border-primary)" }}
-  >
-    底部栏
-  </div>
-)
-
-export const ChatView: Story = {
-  args: {
-    view: "chat",
-    sidebar: mockSidebar,
-    chat: (
-      <div style={{ padding: 40 }}>
-        <h1>对话视图</h1>
-        <p>当前任务的对话内容</p>
-      </div>
-    ),
-    skills: (
-      <div style={{ padding: 40 }}>
-        <h1>技能视图</h1>
-      </div>
-    ),
-    scheduledTasks: (
-      <div style={{ padding: 40 }}>
-        <h1>定时任务视图</h1>
-      </div>
-    ),
-    workspace: (
-      <div style={{ padding: 40 }}>
-        <h1>工作空间视图</h1>
-      </div>
-    ),
-    header: mockHeader,
-  },
-}
-
-export const SkillsView: Story = {
-  args: {
-    view: "skills",
-    sidebar: mockSidebar,
-    chat: (
-      <div style={{ padding: 40 }}>
-        <h1>对话视图</h1>
-      </div>
-    ),
-    skills: (
-      <div style={{ padding: 40 }}>
-        <h1>技能中心</h1>
-        <p>浏览和安装技能</p>
-      </div>
-    ),
-    scheduledTasks: (
-      <div style={{ padding: 40 }}>
-        <h1>定时任务视图</h1>
-      </div>
-    ),
-    workspace: (
-      <div style={{ padding: 40 }}>
-        <h1>工作空间视图</h1>
-      </div>
-    ),
-  },
-}
-
-export const SitesView: Story = {
-  args: {
-    view: "sites",
-    sidebar: mockSidebar,
-    chat: (
-      <div style={{ padding: 40 }}>
-        <h1>对话视图</h1>
-      </div>
-    ),
-    skills: (
-      <div style={{ padding: 40 }}>
-        <h1>技能视图</h1>
-      </div>
-    ),
-    sites: (
-      <div style={{ padding: 40 }}>
-        <h1>站点管理</h1>
-        <p>已发布的站点列表</p>
-      </div>
-    ),
-    scheduledTasks: (
-      <div style={{ padding: 40 }}>
-        <h1>定时任务视图</h1>
-      </div>
-    ),
-    workspace: (
-      <div style={{ padding: 40 }}>
-        <h1>工作空间视图</h1>
-      </div>
-    ),
-  },
-}
-
-export const ScheduledTasksView: Story = {
-  args: {
-    view: "scheduled-tasks",
-    sidebar: mockSidebar,
-    chat: (
-      <div style={{ padding: 40 }}>
-        <h1>对话视图</h1>
-      </div>
-    ),
-    skills: (
-      <div style={{ padding: 40 }}>
-        <h1>技能视图</h1>
-      </div>
-    ),
-    scheduledTasks: (
-      <div style={{ padding: 40 }}>
-        <h1>定时任务</h1>
-        <p>管理定时执行的任务</p>
-      </div>
-    ),
-    workspace: (
-      <div style={{ padding: 40 }}>
-        <h1>工作空间视图</h1>
-      </div>
-    ),
-  },
-}
-
-export const WorkspaceView: Story = {
-  args: {
-    view: "workspace",
-    sidebar: mockSidebar,
-    chat: (
-      <div style={{ padding: 40 }}>
-        <h1>对话视图</h1>
-      </div>
-    ),
-    skills: (
-      <div style={{ padding: 40 }}>
-        <h1>技能视图</h1>
-      </div>
-    ),
-    scheduledTasks: (
-      <div style={{ padding: 40 }}>
-        <h1>定时任务视图</h1>
-      </div>
-    ),
-    workspace: (
-      <div style={{ padding: 40 }}>
-        <h1>我的空间</h1>
-        <p>项目和文件管理</p>
-      </div>
-    ),
-  },
-}
-
-export const WithHeaderAndFooter: Story = {
-  args: {
-    view: "chat",
-    sidebar: mockSidebar,
-    chat: (
-      <div style={{ padding: 40 }}>
-        <h1>对话视图</h1>
-      </div>
-    ),
-    skills: (
-      <div style={{ padding: 40 }}>
-        <h1>技能视图</h1>
-      </div>
-    ),
-    scheduledTasks: (
-      <div style={{ padding: 40 }}>
-        <h1>定时任务视图</h1>
-      </div>
-    ),
-    workspace: (
-      <div style={{ padding: 40 }}>
-        <h1>工作空间视图</h1>
-      </div>
-    ),
-    header: mockHeader,
-    footer: mockFooter,
-  },
-}
-
-export const WithSettings: Story = {
-  args: {
-    view: "chat",
-    sidebar: mockSidebar,
-    chat: (
-      <div style={{ padding: 40 }}>
-        <h1>对话视图</h1>
-      </div>
-    ),
-    skills: (
-      <div style={{ padding: 40 }}>
-        <h1>技能视图</h1>
-      </div>
-    ),
-    scheduledTasks: (
-      <div style={{ padding: 40 }}>
-        <h1>定时任务视图</h1>
-      </div>
-    ),
-    workspace: (
-      <div style={{ padding: 40 }}>
-        <h1>工作空间视图</h1>
-      </div>
-    ),
-    settings: (
-      <div
-        style={{
-          position: "fixed",
-          inset: 0,
-          background: "rgba(0, 0, 0, 0.5)",
-          display: "flex",
-          alignItems: "center",
-          justifyContent: "center",
-          zIndex: 1000,
-        }}
-      >
-        <div style={{ background: "var(--ow-bg)", padding: 40, borderRadius: 8, minWidth: 400 }}>
-          <h2>设置</h2>
-          <p>设置对话框内容</p>
-        </div>
-      </div>
-    ),
-  },
-}
-
-export const WithTaskDetail: Story = {
-  args: {
-    view: "chat",
-    sidebar: mockSidebar,
-    chat: (
-      <div style={{ padding: 40 }}>
-        <h1>对话视图</h1>
-      </div>
-    ),
-    skills: (
-      <div style={{ padding: 40 }}>
-        <h1>技能视图</h1>
-      </div>
-    ),
-    scheduledTasks: (
-      <div style={{ padding: 40 }}>
-        <h1>定时任务视图</h1>
-      </div>
-    ),
-    workspace: (
-      <div style={{ padding: 40 }}>
-        <h1>工作空间视图</h1>
-      </div>
-    ),
-    taskDetail: (
-      <div
-        style={{
-          position: "fixed",
-          right: 0,
-          top: 0,
-          bottom: 0,
-          width: 400,
-          background: "var(--ow-surface-2)",
-          padding: 20,
-          borderLeft: "1px solid var(--border-primary)",
-          zIndex: 100,
-        }}
-      >
-        <h3>任务详情</h3>
-        <p>任务状态和进度</p>
-      </div>
-    ),
-  },
-}
-
-export const Contained: Story = {
-  args: {
-    view: "chat",
-    sidebar: mockSidebar,
-    chat: (
-      <div style={{ padding: 40 }}>
-        <h1>对话视图</h1>
-      </div>
-    ),
-    skills: (
-      <div style={{ padding: 40 }}>
-        <h1>技能视图</h1>
-      </div>
-    ),
-    scheduledTasks: (
-      <div style={{ padding: 40 }}>
-        <h1>定时任务视图</h1>
-      </div>
-    ),
-    workspace: (
-      <div style={{ padding: 40 }}>
-        <h1>工作空间视图</h1>
-      </div>
-    ),
-    contained: true,
-  },
-}
-
-/* ---------------- 窗口带（A10-B4 · 裁决 11 · R2 改判：带只属 windows） ---------------- */
-
-/** windows 用的侧栏：无顶行、折叠宽 0，钮在带里。 */
-const bandSidebar = (
-  <SidebarShell platform="windows">
-    <div style={{ padding: "0 9px 20px", font: "600 var(--ow-fs-ui) var(--ow-font-sans)" }}>orbitwork</div>
-    <div style={{ padding: "0 9px", color: "var(--ow-text-2)" }}>侧栏内容</div>
-  </SidebarShell>
-)
-const bandSidebarCollapsed = (
-  <SidebarShell platform="windows" collapsed>
-    <div style={{ padding: "0 9px 20px", font: "600 var(--ow-fs-ui) var(--ow-font-sans)" }}>orbitwork</div>
-    <div style={{ padding: "0 9px", color: "var(--ow-text-2)" }}>侧栏内容</div>
-  </SidebarShell>
-)
-/** mac 用的侧栏：无带，折叠钮住在侧栏顶行（48 高 ＋ 68 让位块 → 钮落 x=80）。 */
-const macSidebar = (
-  <SidebarShell platform="mac">
-    <div style={{ padding: "0 9px 20px", font: "600 var(--ow-fs-ui) var(--ow-font-sans)" }}>orbitwork</div>
-    <div style={{ padding: "0 9px", color: "var(--ow-text-2)" }}>侧栏内容</div>
-  </SidebarShell>
-)
-/** mac 折叠：整栏收成 rail 116，只剩顶行。 */
-const macSidebarRail = (
-  <SidebarShell platform="mac" collapsed>
-    <div style={{ padding: "0 9px 20px", font: "600 var(--ow-fs-ui) var(--ow-font-sans)" }}>orbitwork</div>
-    <div style={{ padding: "0 9px", color: "var(--ow-text-2)" }}>侧栏内容</div>
-  </SidebarShell>
-)
-
-const bandPages = {
-  chat: (
-    <div style={{ padding: 40 }}>
-      <h1>对话视图</h1>
-      <p>R2：只有 windows 缺省补那条 48 带（钮在带里）；mac/linux/web 无带，钮在侧栏顶行。</p>
-    </div>
-  ),
-  skills: <div style={{ padding: 40 }}>技能视图</div>,
-  scheduledTasks: <div style={{ padding: 40 }}>定时任务视图</div>,
-  workspace: <div style={{ padding: 40 }}>工作空间视图</div>,
-}
-
-/**
- * mac（R2）：`header` 缺省 → **不补带**。折叠钮住在侧栏顶行里：48 高、最左 68 让位块给红绿灯，
- * 钮落 x=80、y=10（28×28）；内容面顶到 y=0，那条左沿 1px 贯到窗口顶端。
- */
-export const NoBandMac: Story = {
-  args: { view: "chat", sidebar: macSidebar, platform: "mac", ...bandPages },
-}
-
-/** mac 折叠态：侧栏收成 rail 116（只剩顶行），钮仍在 x=80、y=10——同一枚钮、同一处坐标。 */
-export const NoBandMacRail: Story = {
-  args: {
-    view: "chat",
-    sidebar: macSidebarRail,
-    platform: "mac",
-    sidebarCollapsed: true,
-    ...bandPages,
-  },
-}
-
-/** windows（R2 唯一有带的平台）：无让位块，折叠钮吃左内距落在 x=8；右端三键各 44 × 满带高。 */
-export const WindowBandWindows: Story = {
-  args: {
-    view: "chat",
-    sidebar: bandSidebar,
-    platform: "windows",
-    onToggleSidebar: () => {},
-    windowControls: { onMinimize: () => {}, onToggleMaximize: () => {}, onClose: () => {} },
-    ...bandPages,
-  },
-}
-
-/** windows 折叠态：侧栏整条卸载（宽 0，无顶行），钮仍在带内 x=8、y=10。 */
-export const WindowBandWindowsCollapsed: Story = {
-  args: {
-    view: "chat",
-    sidebar: bandSidebarCollapsed,
-    platform: "windows",
-    sidebarCollapsed: true,
-    onToggleSidebar: () => {},
-    windowControls: { onMinimize: () => {}, onToggleMaximize: () => {}, onClose: () => {} },
-    ...bandPages,
-  },
-}

package/src/components/domain/desktop/DesktopWorkbenchShell/DesktopWorkbenchShellSource.test.mjs

@@ -1,151 +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")
-
-test("workbench shell declares its client component boundary", () => {
-  assert.ok(/^['"]use client['"]/.test(source))
-})
-
-test("workbench shell rides the AppLayout facade (DS2 P6 §5)", () => {
-  /* 三栏骨架落在基座件上：header→窗口带槽、sidebar→SidebarShell 槽、中栏 .owcenter；
-     本件自身不画影不加渐变，页面切换只切 hidden（§9 禁位移缩放）。 */
-  assert.match(source, /import \{ AppLayout \} from "\.\.\/\.\.\/\.\.\/Layout"/)
-  assert.match(source, /<AppLayout header=\{resolvedHeader\} footer=\{footer\} sidebar=\{sidebar\}/)
-  assert.doesNotMatch(source, /box-shadow|linear-gradient/)
-})
-
-/* R2（Terry 2026-09-03 第 1 条）：**窗口带只属 windows**——那边 frame:false、三键必须自绘。
-   header 缺省时只有 platform==="windows" 且非 contained 才补一条 WindowBand；
-   mac（系统红绿灯）/ linux（系统边框）/ web（无窗口条）缺省无带，折叠钮住进侧栏顶行。
-   显式传值（含 null）永远优先。 */
-test("desktop shell only auto-bands on windows (R2)", () => {
-  assert.match(source, /import \{ WindowBand, type WindowBandPlatform, WindowChrome, type WindowChromeProps \}/)
-  assert.match(source, /const defaultBand =\s*\n?\s*contained \|\| platform !== "windows" \? null : \(/)
-  assert.match(source, /<WindowBand\n\s+platform=\{platform\}/)
-  assert.match(source, /fullscreen=\{fullscreen\}/)
-  assert.match(source, /collapsed=\{sidebarCollapsed\}/)
-  assert.match(source, /onToggle=\{onToggleSidebar\}/)
-  assert.match(source, /const resolvedHeader = header === undefined \? defaultBand : header/)
-  // 旧口径「两平台恒在」的写法不许回来
-  assert.doesNotMatch(source, /const defaultBand = contained \? null : \(/)
-  // 平台是受控 prop，库侧不嗅探
-  assert.doesNotMatch(source, /navigator\.(userAgent|platform)/)
-})
-
-// R2：linux 有系统边框，三键随带一起摘掉；mac 走系统红绿灯（带在时才是让位块）。
-test("window chrome rides only on windows (R2)", () => {
-  assert.match(
-    source,
-    /const chrome = platform === "windows" \? <WindowChrome \{\.\.\.windowControls\} \/> : undefined/,
-  )
-  assert.doesNotMatch(source, /platform === "windows" \|\| platform === "linux"/)
-  assert.match(source, /windowControls\?: WindowChromeProps/)
-})
-
-/* 裁决 1（原型模板 L653/L815）：中心区从「圆角卡」改回「一整面纸」——
-   地(--ow-bg) → 纸(--ow-surface) → 井(--ow-surface-2) 三档靠底色分层，不靠边框圆角。
-   旧断言压的是 border-strong 一圈 + radius-xl，本轮按新口径反过来断言：只有左沿 1px。 */
-test("center panel is a flat sheet, not a floating rounded card (裁决 1)", () => {
-  const center = styles.match(/\.owcenter \{[^}]*\}/s)?.[0] ?? ""
-  assert.match(center, /background-color: var\(--ow-surface\)/)
-  assert.match(center, /border: 0/)
-  assert.match(center, /border-left: var\(--ow-border-width-thin, 1px\) solid var\(--ow-border\)/)
-  assert.match(center, /border-radius: 0/)
-  assert.match(center, /box-shadow: none/)
-  assert.doesNotMatch(center, /--ow-radius-xl|--ow-border-strong/)
-  // 沟槽归零：中心面贴满四边，折叠态不再需要拆边特判
-  assert.match(styles, /\.owshell \[data-slot="app-layout-main"\] \{ padding: 0;/)
-  assert.doesNotMatch(styles, /\.owshell\.collapsed \.owcenter/)
-  assert.doesNotMatch(styles, /\.owshell\.collapsed \[data-slot="app-layout-main"\]/)
-  // .owmain 全仓无产出，死选择器已删（只余注释里的一处出处说明，故压规则头而非字面量）
-  assert.doesNotMatch(styles, /\.owmain[^{}\n]*\{/)
-})
-
-test("shell, band and sheet split the three grounds (裁决 1 · 原型 L653/L657/L815)", () => {
-  const shell = styles.match(/\.owshell \{[^}]*\}/s)?.[0] ?? ""
-  assert.match(shell, /background: var\(--ow-bg\)/)
-})
-
-test("workbench pages stay mounted after their first visit", () => {
-  assert.ok(source.includes("const [visitedViews, setVisitedViews] = useState"))
-  assert.ok(source.includes("if (pageView !== view && !visitedViews.has(pageView)) return null"))
-  assert.ok(source.includes("key={pageView}"))
-  assert.ok(source.includes("hidden={!active}"))
-  assert.ok(!source.includes('<div className="owcenter">{pages[view]}</div>'))
-})
-
-test("current workbench page renders immediately before its visit is recorded", () => {
-  assert.ok(source.includes("pageView !== view && !visitedViews.has(pageView)"))
-  assert.ok(source.includes("setVisitedViews((current) =>"))
-  assert.ok(source.includes("next.add(view)"))
-})
-
-test("workbench includes the library page in its mounted view set", () => {
-  assert.match(source, /DesktopWorkbenchView = [^\n]*"library"/)
-  assert.match(source, /workspace,\s+library,/)
-})
-
-test("workbench page wrapper fills the center panel and hides inactive pages", () => {
-  assert.ok(styles.includes(".desktop-workbench-page {"))
-  assert.ok(styles.includes("flex: 1; min-width: 0; min-height: 0; height: 100%;"))
-  assert.ok(styles.includes("display: flex; flex-direction: column;"))
-  assert.ok(styles.includes(".desktop-workbench-page[hidden] { display: none; }"))
-})
-
-test("chat background belongs to the chat surface and never exceeds its height", () => {
-  assert.ok(source.includes('<div className="owcenter" data-view={view}>'))
-  assert.doesNotMatch(styles, /\.owcenter\[data-view="chat"\] \{/)
-  assert.match(styles, /\.chat \{[^}]*background-image: var\(--ow-chat-bg-image, none\);/s)
-  assert.match(styles, /\.chat \{[^}]*background-position: right center;/s)
-  assert.match(styles, /\.chat \{[^}]*background-size: auto 100%;/s)
-  assert.doesNotMatch(styles, /\.chat \{[^}]*var\(--ow-chat-bg-overlay/s)
-  assert.match(styles, /\.chat__scroll \{[^}]*background: transparent;/s)
-  assert.doesNotMatch(styles, /\.chat__scroll \{[^}]*var\(--ow-chat-bg-image/s)
-})
-
-// W5 去痕（共享 CSS）：窗口带与转录加载/空态的 V1 残迹。这三族由 apps/desktop 的
-// 外壳与 ChatSurface 渲染，packages/ui 只持有样式，所以断言压 desktop-surfaces.css。
-test("windows titlebar keeps the 48px ground band without a divider", () => {
-  const band = styles.match(/\.windows-titlebar \{[^}]*\}/)?.[0] ?? ""
-  assert.match(band, /height: var\(--ow-titlebar-h\)/)
-  assert.match(band, /background: var\(--ow-bg\)/)
-  // 2.0 判断表：与地同色、无分隔线（.owshell 同取 --ow-bg）
-  assert.doesNotMatch(band, /border-bottom/)
-})
-
-test("history skeleton mirrors the 2.0 transcript: user well, no agent bubble", () => {
-  const base = styles.match(/\.history-skeleton__bubble \{[^}]*\}/)?.[0] ?? ""
-  assert.match(base, /background: transparent/)
-  assert.match(base, /border: none/)
-  const user = styles.match(/\.history-skeleton__turn--user \.history-skeleton__bubble \{[^}]*\}/)?.[0] ?? ""
-  assert.match(user, /background: var\(--ow-bubble-user\)/)
-  assert.match(user, /border-radius: var\(--ow-radius-lg\)/)
-  assert.match(user, /width: min\(78%, 620px\)/)
-  // AI 侧不再另立气泡尾角
-  assert.doesNotMatch(styles, /\.history-skeleton__turn--agent/)
-})
-
-test("history empty state drops the V1 tiled icon for the G5 mark", () => {
-  const icon = styles.match(/\.history-empty__icon \{[^}]*\}/)?.[0] ?? ""
-  assert.match(icon, /background: transparent/)
-  assert.match(icon, /border-radius: 0/)
-  assert.match(icon, /color: var\(--ow-empty-mark\)/)
-  assert.doesNotMatch(icon, /var\(--ow-surface-2\)/)
-  // 一句 text-2，不再是 600 粗标题
-  assert.match(styles, /\.history-empty__title \{[^}]*font: 400 var\(--ow-fs-ui\)[^}]*color: var\(--ow-text-2\)/)
-})
-
-test("shared entrance keyframes carry no scale or translate (§9)", () => {
-  assert.match(styles, /@keyframes fade \{ from \{ opacity: 0; \} to \{ opacity: 1; \} \}/)
-  assert.match(styles, /@keyframes io-rise \{ from \{ opacity: 0; \} to \{ opacity: 1; \} \}/)
-  // W5 移交 B③：@keyframes pop-in 整帧退役（与 fade 同帧体的重名分叉），全库消费方改挂 fade。
-  // 墓碑注释里仍写着帧名（记录撤除理由），所以断言压的是剥掉注释后的规则文本。
-  const rules = styles.replace(/\/\*[\s\S]*?\*\//g, "")
-  assert.doesNotMatch(rules, /@keyframes pop-in/)
-  assert.doesNotMatch(rules, /animation: pop-in/)
-  // §9 唯一缓动：--ow-ease-out 已从本表退场
-  assert.doesNotMatch(styles, /var\(--ow-ease-out\)/)
-})