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

package/src/components/domain/chat/Chatbot/index.tsx

@@ -1,37 +0,0 @@
-import type { ReactNode } from "react"
-import { Transcript } from "../Transcript"
-
-export type ChatbotProps = {
-  /** Optional top area for title, agent identity, or conversation actions. */
-  header?: ReactNode
-  /** Conversation messages and rich response content. */
-  children?: ReactNode
-  /** Empty-state content shown when there are no messages. */
-  empty?: ReactNode
-  /** ChatSender or another conversation input. */
-  sender?: ReactNode
-  className?: string
-  maxWidth?: number | string
-}
-
-/**
- * @deprecated DS2 已把会话壳并入 `Transcript`（蓝图批次③：Chatbot +
- * ConversationView → Transcript 壳）。本件只作薄兼容层，转成脊线贯穿的
- * `Transcript`；新代码直接用 `Transcript`。
- */
-export function Chatbot({ header, children, empty, sender, className = "", maxWidth = 720 }: ChatbotProps) {
-  return (
-    <Transcript
-      header={header}
-      empty={empty}
-      sender={sender}
-      maxWidth={maxWidth}
-      /* W5 终扫修：原来还挂一个 `ow-chatbot` 类，全仓无任何样式消费（死钩子），已删。
-         R2 复审修：壳上那道 420px 最小高也已清——非设计值、不在任何度量表上，且会话壳的高度
-         本就归宿主（Transcript 是填充父容器的壳）。要撑高请由调用点传 className。 */
-      className={className}
-    >
-      {children}
-    </Transcript>
-  )
-}

package/src/components/domain/chat/Composer/Composer.stories.tsx

@@ -1,227 +0,0 @@
-import type { Meta, StoryObj } from "@storybook/react"
-import { useState } from "react"
-import { Clock, Doc, Shield } from "../../../composite/Icons"
-import { Button, Chip } from "../../../primitives"
-import { Composer } from "./index"
-import { ComposerAuthorization } from "./parts/ComposerAuthorization"
-import { ComposerMentions } from "./parts/ComposerMentions"
-import { ComposerProjectPicker } from "./parts/ComposerProjectPicker"
-import { ComposerQueue } from "./parts/ComposerQueue"
-import { ComposerVoiceInput } from "./parts/ComposerVoiceInput"
-
-const meta = {
-  title: "Chat/Composer",
-  component: Composer,
-  decorators: [
-    (Story) => (
-      <div style={{ padding: 40, background: "var(--ow-bg)", maxWidth: 720 }}>
-        <Story />
-      </div>
-    ),
-  ],
-} satisfies Meta<typeof Composer>
-
-export default meta
-type Story = StoryObj<typeof meta>
-
-const PROJECTS = [
-  { id: "orbit-fe", name: "orbit-fe", label: "orbit-fe", description: "前端主仓" },
-  { id: "design", name: "design", label: "design", description: "品牌与设计系统" },
-]
-
-/** 空态：什么都没输入，发送钮停在 disabled。 */
-export const Empty: Story = {
-  args: {
-    placeholder: "今天帮你做些什么？ / 调用技能与指令 @ 引用专家和连接器",
-    onSend: (text) => console.log("Send:", text),
-  },
-}
-
-/** 输入中：有内容，发送钮进 primary（行动极正规通道）。 */
-export const Typing: Story = {
-  render: () => {
-    const [value, setValue] = useState("帮我看下这周还有哪些待办没做完")
-    return (
-      <Composer
-        value={value}
-        onChange={setValue}
-        onSend={(text) => {
-          console.log("Send:", text)
-          setValue("")
-        }}
-      />
-    )
-  },
-}
-
-/** 带附件与上下文引用。 */
-export const WithAttachmentsAndContext: Story = {
-  args: {
-    defaultValue: "照这张图改一下首页",
-    attachments: (
-      <>
-        <Chip icon={<Doc />} label="screenshot.png" description="248 KB" onRemove={() => {}} removeLabel="移除附件" />
-        <Chip icon={<Doc />} label="需求说明.md" onRemove={() => {}} removeLabel="移除附件" />
-      </>
-    ),
-    context: <Chip icon={<Doc />} label="orbit-fe/src/app" onRemove={() => {}} removeLabel="移除引用" />,
-    mentions: (
-      <ComposerMentions
-        mentions={[
-          { id: "1", kind: "skill", name: "code-review" },
-          { id: "2", kind: "agent", name: "github" },
-        ]}
-        onRemove={(mention) => console.log("remove", mention)}
-      />
-    ),
-  },
-}
-
-/** 带队列：排队消息与队列通知都落在固定的队列区。 */
-export const WithQueue: Story = {
-  args: {
-    defaultValue: "顺便把 CI 也修一下",
-    queue: (
-      <ComposerQueue
-        label="排队中"
-        notices={[{ id: "paused", text: "上一条还没跑完，队列已暂停", tone: "warning" }]}
-        items={[
-          { id: "1", text: "把设置页的暗档对比度过一遍", icon: <Clock />, kind: "follow-up" },
-          {
-            id: "2",
-            text: "顺手补一版变更说明",
-            icon: <Clock />,
-            kind: "follow-up",
-            status: "submitting",
-            statusLabel: "发送中",
-          },
-        ]}
-      />
-    ),
-  },
-}
-
-/** 生成中：状态点＋「生成中」固定在工具条首位，发送钮变停止。 */
-export const Generating: Story = {
-  args: {
-    generating: true,
-    placeholder: "今天帮你做些什么？ / 调用技能与指令 @ 引用专家和连接器",
-    onStop: () => console.log("Stop"),
-  },
-}
-
-/** 处理中：空环＋「处理中」，发送钮走原语的 <20px 小转子。 */
-export const Busy: Story = {
-  args: {
-    submitState: "busy",
-    defaultValue: "停止中…",
-  },
-}
-
-/** 授权态：页脚右侧的授权模式选择。 */
-export const WithAuthorization: Story = {
-  render: () => {
-    const [mode, setMode] = useState("ask")
-    return (
-      <Composer
-        defaultValue="把这个分支合进 main"
-        authorization={
-          <ComposerAuthorization
-            value={mode}
-            onChange={setMode}
-            options={[
-              { value: "ask", label: "每次询问", description: "改动前都要你点头", icon: <Shield /> },
-              { value: "auto", label: "自动执行", description: "只在当前项目内生效", icon: <Shield /> },
-            ]}
-          />
-        }
-        contextUsage={<span className="font-[family-name:var(--ow-font-mono)] tabular-nums">45K / 200K</span>}
-      />
-    )
-  },
-}
-
-/** 语音态：录音时频谱撑开工具条，麦克风按钮进选中态。 */
-export const Voice: Story = {
-  args: {
-    voice: <ComposerVoiceInput active listening levels={[0.2, 0.6, 0.4, 0.9, 0.3, 0.7, 0.5, 0.8, 0.2, 0.6]} />,
-    placeholder: "正在听…",
-  },
-}
-
-/** 禁用：逐 token 的 disabled，不是整块压透明度。 */
-export const Disabled: Story = {
-  args: {
-    disabled: true,
-    defaultValue: "会话已结束",
-  },
-}
-
-/** 满配：队列 + 附件 + 上下文 + 项目 + 授权 + 用量读数。 */
-export const FullyLoaded: Story = {
-  render: () => {
-    const [value, setValue] = useState("把这周的进展整理成一段周报")
-    const [project, setProject] = useState("orbit-fe")
-    const [auth, setAuth] = useState("ask")
-    return (
-      <Composer
-        value={value}
-        onChange={setValue}
-        queue={<ComposerQueue items={[{ id: "1", text: "顺便把变更说明补上", icon: <Clock /> }]} />}
-        attachments={<Chip icon={<Doc />} label="周报模板.md" onRemove={() => {}} removeLabel="移除附件" />}
-        mentions={<ComposerMentions mentions={[{ id: "1", kind: "skill", name: "weekly" }]} />}
-        project={
-          <ComposerProjectPicker
-            value={project}
-            options={PROJECTS}
-            onChange={(option) => setProject(option.id)}
-            onCreate={(name) => console.log("create", name)}
-          />
-        }
-        footerStart={<span>内容由 AI 生成，请仔细核实回答内容。</span>}
-        authorization={
-          <ComposerAuthorization
-            value={auth}
-            onChange={setAuth}
-            options={[
-              { value: "ask", label: "每次询问", icon: <Shield /> },
-              { value: "auto", label: "自动执行", icon: <Shield /> },
-            ]}
-          />
-        }
-        contextUsage={<span className="font-[family-name:var(--ow-font-mono)] tabular-nums">45K / 200K</span>}
-        voice={<ComposerVoiceInput />}
-        onSend={(text) => {
-          console.log("Send:", text)
-          setValue("")
-        }}
-      />
-    )
-  },
-}
-
-/** 自定义工具条：整条工具条交给调用方，状态极的位置仍然搬不走。 */
-export const CustomToolbar: Story = {
-  args: {
-    generating: true,
-    toolbarStart: (
-      <Button variant="ghost" size="sm" icon={<Doc />}>
-        引用文件
-      </Button>
-    ),
-    toolbarEnd: (
-      <Button variant="ghost" size="sm">
-        深度思考
-      </Button>
-    ),
-    onStop: () => console.log("Stop"),
-  },
-}
-
-/** 长文本：超过 maxHeight 后输入区内部滚动。 */
-export const LongText: Story = {
-  args: {
-    defaultValue: "这是一段很长的文本\n".repeat(12),
-    maxHeight: 150,
-  },
-}

package/src/components/domain/chat/Composer/ComposerSource.test.mjs

@@ -1,175 +0,0 @@
-import assert from "node:assert/strict"
-import { readFile, readdir } from "node:fs/promises"
-import test from "node:test"
-
-const source = await readFile(new URL("./index.tsx", import.meta.url), "utf8")
-const desktop = await readFile(new URL("../../desktop/DesktopComposer/index.tsx", import.meta.url), "utf8")
-const chatBarrel = await readFile(new URL("../index.ts", import.meta.url), "utf8")
-const chatEntries = await readdir(new URL("../", import.meta.url), { withFileTypes: true })
-
-const PARTS = [
-  "ComposerAudioSpectrum",
-  "ComposerAuthorization",
-  "ComposerMentions",
-  "ComposerMenu",
-  "ComposerMenuPopover",
-  "ComposerPopover",
-  "ComposerProjectPicker",
-  "ComposerQueue",
-  "ComposerVoiceInput",
-]
-
-test("十件簇合并：九个 Composer* 子件并入 Composer/parts，出口仍从组合器走", () => {
-  for (const part of PARTS) {
-    assert.ok(source.includes(`export * from "./parts/${part}"`), `${part} 未从组合器再导出`)
-    assert.ok(
-      !chatEntries.some((entry) => entry.isDirectory() && entry.name === part),
-      `${part}/ 旧目录仍在，应已并入 Composer/parts`,
-    )
-    assert.ok(!chatBarrel.includes(`"./${part}"`), `chat 桶仍在导出退役目录 ${part}`)
-  }
-  assert.ok(chatBarrel.includes('export * from "./Composer"'))
-})
-
-test("状态极位置固定，不做可配置插槽（品牌拍板）", () => {
-  // 状态点由组合器自渲染在工具条首位；没有任何 prop 能把它搬走或替换。
-  assert.ok(source.includes('data-ow-part="state"'))
-  assert.ok(source.includes('data-ow-part="state-dot"'))
-  assert.doesNotMatch(source, /\bstatePole\??:/)
-  assert.doesNotMatch(source, /\bstateSlot\??:/)
-  assert.doesNotMatch(source, /\bbeacon\??:\s*ReactNode/)
-  // R1 双编码：形（实心/空环）＋文字，颜色只是第二编码。
-  assert.ok(source.includes("bg-[var(--ow-progress-fill)]"))
-  assert.ok(source.includes('border border-[color:var(--ow-border-strong)]"'))
-  assert.ok(source.includes("生成中"))
-  assert.ok(source.includes("处理中"))
-})
-
-test("R2：组合器默认样式里 grep 不到荧黄", () => {
-  assert.doesNotMatch(source, /--ow-beacon/)
-  assert.doesNotMatch(source, /--ow-accent-dot/)
-  assert.doesNotMatch(source, /--ow-data-today/)
-})
-
-test("输入区走 Field 语法，三态边框挂整个 composer 壳（§6 输入类 · R3 无外环）", () => {
-  assert.match(source, /<Field\b[\s\S]*multiline[\s\S]*standalone=\{false\}/)
-  assert.ok(source.includes("border border-[color:var(--ow-composer-border,var(--ow-input-border))]"))
-  // 输入底＝surface-2 经 --ow-input-bg（§5 / ui-controls-inputs 卡）；--ow-composer-bg 为 §15 皮肤钩子。
-  assert.ok(source.includes("bg-[var(--ow-composer-bg,var(--ow-input-bg))]"))
-  assert.ok(source.includes("[&:hover:not(:focus-within)]:border-[color:var(--ow-input-border-hover)]"))
-  assert.ok(source.includes("focus-within:border-[color:var(--ow-input-border-focus)]"))
-  // R3（2026-09-04，Terry 意见 1）：输入类 focus 只换 1px 边框色，--ow-focus-shadow 的 2px
-  // 外环整枚撤（井本身就有 1px 边，再套一圈环读成两层框）。键盘环只属按钮与链接。
-  assert.doesNotMatch(source, /focus-within:\[box-shadow:/)
-  // disabled 逐 token，禁整块统一透明度。
-  assert.ok(source.includes("border-[color:var(--ow-disabled-border)] bg-[var(--ow-input-disabled-bg)]"))
-  assert.doesNotMatch(source, /opacity-\[?\.?\d/)
-})
-
-test("发送钮＝Button primary（行动极正规通道），stop/busy 另走形编码", () => {
-  assert.ok(source.includes('variant={resolvedSubmitState === "send" ? "primary" : "secondary"}'))
-  assert.ok(source.includes('loading={resolvedSubmitState === "busy"}'))
-  // 处理中的转子由原语出（§9 <20px 小转子），不得再手搓 animate-spin 环。
-  assert.doesNotMatch(source, /animate-spin/)
-})
-
-test("工具条/上下文/队列/语音/授权/提及/项目全部插槽化，位置由组合器定死", () => {
-  for (const slot of [
-    "queue",
-    "status",
-    "attachments",
-    "mentions",
-    "context",
-    "input",
-    "overlay",
-    "toolbarStart",
-    "toolbarEnd",
-    "voice",
-    "project",
-    "footerStart",
-    "footerEnd",
-    "authorization",
-    "contextUsage",
-  ]) {
-    assert.ok(source.includes(`  ${slot},`), `组合器缺插槽 ${slot}`)
-  }
-  assert.ok(source.includes('data-ow-part="queue"'))
-  assert.ok(source.includes('data-ow-part="context"'))
-})
-
-test("模式选择走 Menu 基座（-pop 档由原语承担），不再自绘 absolute 菜单", () => {
-  assert.match(source, /import \{ Menu \} from ['"](?:\.\.\/)+primitives\/Menu['"]/)
-  assert.ok(source.includes("<Menu"))
-  assert.doesNotMatch(source, /data-ow-part="mode-menu"/)
-  // 立面由 Menu 出，组合器不自己画弹层。
-  assert.doesNotMatch(source, /shadow-\[var\(--ow-shadow-pop\)\]/)
-  assert.doesNotMatch(source, /bg-\[var\(--ow-popover-bg\)\]/)
-})
-
-test("Tailwind 任意值 var() 一律带类型标注（防 tailwind-merge 吞类）", () => {
-  for (const file of [source, desktop]) {
-    assert.doesNotMatch(file, /(?:text|border)-\[var\(--ow-/)
-    assert.doesNotMatch(file, /font-\[var\(--ow-font-/)
-  }
-})
-
-test("DesktopComposer 是 Composer 的桌面配方：具名位由组合器负责", () => {
-  assert.match(desktop, /import \{ Composer, type ComposerProps \} from ['"]\.\.\/\.\.\/chat\/Composer['"]/)
-  assert.ok(desktop.includes("voice={voiceControl}"))
-  assert.ok(desktop.includes("project={projectControl}"))
-  assert.ok(desktop.includes("authorization={authorizationControl}"))
-  assert.ok(desktop.includes("contextUsage={contextUsage}"))
-  // 配方不得再自己拼 footerEnd —— 页脚顺序是组合器的事。
-  assert.doesNotMatch(desktop, /footerEnd=/)
-  // 桌面自建 .cbtn 手搓钮退役，换 Button 正规变体（§6 状态由原语补齐）。
-  assert.doesNotMatch(desktop, /cbtn/)
-})
-
-/* ── R2 复审批 ───────────────────────────────────────────────── */
-
-// 「打进去 14px、发出来 13px」：输入面原走 --ow-fs-body(14)，而同屏转录正文
-// （UserTurn / AgentTurn）是 --ow-fs-ui(13)。两面同一句话不能两个字号。
-//
-// 「同一句话在两面不能两个字号」——A9-B2 曾把用户气泡先行提到 fs-body(14)，本条因此被拆成
-// 半条（只断言「输入面 ≡ agent 正文」）。R3（2026-09-04，Terry 意见 2）撤掉气泡后，用户原话
-// 与 agent 正文并档到 --ow-fs-ui(13)/1.7，输入面本就在这一档——三处归一，本条回到一句话。
-test("R3 §7：输入面 / agent 正文 / 用户原话三处同一档字（text-ow-fs-ui）", async () => {
-  const composer = await readFile(new URL("./index.tsx", import.meta.url), "utf8")
-  assert.match(composer, /data-ow-part="textarea"[\s\S]{0,400}?text-ow-fs-ui/)
-  assert.doesNotMatch(composer, /data-ow-part="textarea"[\s\S]{0,400}?text-ow-fs-body[^-]/)
-  const agentTurn = await readFile(new URL("../AgentTurn/index.tsx", import.meta.url), "utf8")
-  assert.match(agentTurn, /data-ow-part="body"[\s\S]{0,200}?text-ow-fs-ui/)
-  const userTurn = await readFile(new URL("../UserTurn/index.tsx", import.meta.url), "utf8")
-  assert.match(userTurn, /data-ow-part="quote"[\s\S]{0,400}?text-ow-fs-ui leading-\[1\.7\]/)
-  assert.doesNotMatch(userTurn, /data-ow-part="quote"[\s\S]{0,400}?text-ow-fs-body[^-]/)
-})
-
-/* ── A1-B5：井度量与工具行归位（原型模板 863–1063） ───────────── */
-
-test("A1-B5 §7 井度量：padding 12/10/8、纵向 gap 10、工具行 gap 6", () => {
-  assert.ok(source.includes('"relative min-h-20 px-2.5 pt-3 pb-2 flex flex-col gap-2.5"'))
-  assert.ok(source.includes('<div data-ow-part="bar" className="flex items-center gap-1.5 min-h-7">'))
-  assert.doesNotMatch(source, /data-ow-part="bar(-start|-end)?" className="[^"]*gap-1[^.\d]/)
-  // 材质三件（surface-2 底 ＋ 1px 边 ＋ radius-card ＝ 12）现状即原型，无影。
-  assert.ok(source.includes("[border-radius:var(--ow-radius-card)]"))
-  assert.doesNotMatch(source, /data-ow-part="surface"[\s\S]{0,600}?shadow-\[var\(--ow-shadow/)
-})
-
-// R2 · L1-3-2：技能钮走闪电字形，盾牌只留给授权模式（原型 template.dc.html:1462 vs :1508）
-test("技能钮＝Zap 闪电，Composer 本体不再引 Shield（盾牌专属授权控件）", () => {
-  assert.match(source, /icon=\{<Zap \/>\}[\s\S]{0,60}?技能/)
-  assert.doesNotMatch(source, /Shield/)
-})
-
-test("A1-B5 井外不留行：项目/授权/上下文用量三件收进井内工具行，页脚只剩兼容槽", () => {
-  const bar = source.slice(source.indexOf('data-ow-part="bar"'), source.indexOf('data-ow-part="footer"'))
-  // 左段：附件 → 技能 → 授权 → 项目（原型 L928-1062 同序）
-  assert.match(bar, /\{authorization\}\s*\n\s*\{project\}/)
-  // 右段：上下文用量排在模型档之前
-  assert.match(bar, /data-ow-part="bar-end"[\s\S]{0,160}?\{contextUsage\}\s*\n\s*\{toolbarEnd \?\?/)
-  // 页脚不再承载这三件
-  const footer = source.slice(source.indexOf('data-ow-part="footer"'))
-  assert.doesNotMatch(footer, /\{project\}|\{authorization\}|\{contextUsage\}/)
-  // 三槽都不传时整条页脚不渲染（免责句归每轮转录，不归输入井）
-  assert.ok(source.includes("const hasFooter = footerStart !== undefined || footerEnd !== undefined"))
-})