@orbit-work/ui 0.1.1 → 0.1.2

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

@@ -1,194 +0,0 @@
-"use client"
-
-import type { ReactNode } from "react"
-import { cn } from "../../../../lib/utils"
-import { AlertCircle } from "../../../composite/Icons"
-import { Checkbox } from "../../../primitives/Checkbox"
-
-/**
- * UserTurn — DS 2.0 用户轮（蓝图批次③ 合并件：ChatBubble /
- * DesktopChatUserTurnView 归口为同一配方）。
- *
- * 形态照锁定件 TranscriptSpine 的轮次语言（domain/chat/TranscriptSpine）：
- * 用户轮＝**空心环节点**（8px，1.5px `--ow-text-3` 描边，环心填所在地色断开脊线）
- * ＋**纯文字原话**：R3（2026-09-04，Terry 意见 2）撤掉井色气泡——原型 1176 的
- * `--ow-bubble-user` 底 ＋ 1px 边 ＋ 圆角 12 不再画，正文直接排在面上，与 AI 轮同一
- * 档字（`--ow-fs-ui` 13/1.7）；角色只由脊柱节点的形状区分（空心环 vs 实心点，
- * TranscriptSpine 卡「需要引用原话时不加气泡底」）。撤泡的原因：agent 正文里常有
- * 代码框、产物卡、执行卡，气泡套框是框套框。最宽 78% 保留（原话读作引用，短量度），
- * 不设头像，左对齐挂在脊柱上，缩进 26px＝脊线到正文的定距。
- * 时间读数挂**正文右侧同一行**（`time` 槽，mono＋tabular-nums＋`--ow-text-3`，
- * 与末行基线对齐），不排到下方操作行——原型 template.dc.html:1173-1178 的位置不变。
- * 皮肤的 userBubble* 三件（`--ow-chat-user-bubble-*`）随气泡一起失去落点；皮肤搁置（D1），
- * token 仍在 tokens.css 里，等皮肤重启时再定去留。
- *
- * 环心色取 `--ow-turn-ground`（由 Transcript 壳按自身地色注入，缺省 `--ow-surface`），
- * 保证环把贯穿线断开而不是叠在线上。
- *
- * 分享挑选模式（`selectable`）：行首长出一枚 16px 勾选框，排在 12px 脊柱列**之外**，
- * 正文整列右移 32px、长行重排（原型 template.dc.html:1142-1149）；选中行**不加底色**，
- * 选中态只由勾选框自己承担（原型 1159 的正文容器无 background）。
- *
- * 槽位：`leading`（来源 chip）· `attachments`（附件区）· `contexts`（上下文 chip）·
- * 正文（`text` 或 `children`）· `actions`（MessageActions，hover 浮现）· `trailing`。
- * 状态（§6）：默认 / 流式（尾点呼吸，reduced-motion 停）/ 错误（红点图标＋人话一句）。
- * 读数（§7）：时间等交给 MessageActions 的 `time`，mono＋tabular-nums。
- * R3 中性件：用户轮不含信标/荧黄。
- */
-export type UserTurnProps = {
-  /** 原话正文（纯文本）；与 `children` 二选一 */
-  text?: string
-  /** 富正文槽，给出时覆盖 `text` */
-  children?: ReactNode
-  /** 是否挂脊柱节点（空心环）。脱离 Transcript 单用时可关 */
-  node?: boolean
-  /** 滚动锚点（宿主定位轮次用） */
-  anchor?: string | number
-  /** 正文前的来源/身份槽（邮件来源 chip 等） */
-  leading?: ReactNode
-  /** 附件区槽 */
-  attachments?: ReactNode
-  /** 上下文 chip 槽（技能 / MCP） */
-  contexts?: ReactNode
-  /** 操作槽：MessageActions，hover / focus 才浮现 */
-  actions?: ReactNode
-  /** 轮次尾部追加槽 */
-  trailing?: ReactNode
-  /** 错误一句话（人话，§6）；给出即在正文前挂错误记号 */
-  error?: ReactNode
-  /** 流式输入中：正文尾部挂呼吸尾点 */
-  streaming?: boolean
-  /** 原话右侧同行的时间读数（mono＋tabular-nums，原型 1177；R3 撤泡后位置不变） */
-  time?: ReactNode
-  /** 分享挑选模式：行首长出一枚勾选框（原型 template.dc.html:1142-1149） */
-  selectable?: boolean
-  /** 已选入分享 */
-  checked?: boolean
-  /** 勾选切换；入参是切换后的状态 */
-  onToggle?: (checked: boolean) => void
-  /** 勾选框读屏名，缺省「选入分享」（原型 1145 的 title） */
-  selectLabel?: string
-  className?: string
-}
-
-/** 空心环：8px 环 + 1.5px text-3 描边，环心填所在地色（把脊线断开）。
- *  left 1 / top 7 ＝ 原型 template.dc.html:1155 的 12px 脊柱列坐标（环心 y=11）。 */
-const dotClass = [
-  "absolute left-[1px] top-[7px] w-[8px] h-[8px] shrink-0",
-  "[border-radius:var(--ow-radius-pill)] border-[1.5px] border-[color:var(--ow-text-3)]",
-  "bg-[color:var(--ow-turn-ground,var(--ow-surface))]",
-].join(" ")
-
-/** 行首勾选框（分享挑选模式）：16×16 走 primitives/Checkbox（§7 形状表：勾选框 16 见方 /
- *  1px / --ow-radius-2xs 4px），比原型的 18/1.5px 小一档，全库只留一种勾选语法。
- *  绝对定位在轮的行首（与脊柱节点同一套写法），top 3 让 16px 方框的心落在
- *  节点心那条 y=11 线上；正文靠 pl-[58px] 整列右移 32px（16 框 ＋ 16 沟），
- *  长行照原型重排——勾选框排在脊柱列**之外**，不占脊柱那 12px。 */
-const SELECT_BOX_CLASS = "absolute left-0 top-[3px] shrink-0"
-
-export function UserTurn({
-  text,
-  children,
-  node = true,
-  anchor,
-  leading,
-  attachments,
-  contexts,
-  actions,
-  trailing,
-  error,
-  streaming,
-  time,
-  selectable = false,
-  checked = false,
-  onToggle,
-  selectLabel = "选入分享",
-  className = "",
-}: UserTurnProps) {
-  const body = children ?? (text || null)
-
-  return (
-    <div
-      data-slot="user-turn"
-      data-ow-part="turn"
-      data-role="user"
-      data-chat-anchor={anchor}
-      data-selectable={selectable ? "on" : undefined}
-      className={cn(
-        "group/turn relative flex flex-col items-start gap-2",
-        node && "pl-[26px]",
-        // 分享模式：整列右移 32px 给行首勾选框（原型 1142 的 gap 14 + 18 框，我们是 16 + 16）
-        selectable && "pl-[58px]",
-        className,
-      )}
-    >
-      {selectable && (
-        <Checkbox className={SELECT_BOX_CLASS} checked={checked} onChange={onToggle} aria-label={selectLabel} />
-      )}
-      {node && <span data-ow-part="dot" aria-hidden="true" className={cn(dotClass, selectable && "left-[33px]")} />}
-      {leading}
-      {attachments}
-      {contexts}
-      {body != null && (
-        <div data-ow-part="quote-row" className="flex w-full min-w-0 items-end gap-2">
-          {error && (
-            <span
-              data-ow-part="error-mark"
-              title={typeof error === "string" ? error : undefined}
-              className={cn(
-                // 3px 视觉基线（R3 撤泡后没有 10px 内边了）与首行对齐；
-                // 行改 items-end 后靠 self-start 把记号钉回首行。
-                "self-start mt-[3px] inline-flex h-[17px] w-[17px] shrink-0 items-center justify-center",
-                "[border-radius:var(--ow-radius-pill)] bg-[var(--ow-error)] text-[color:var(--ow-on-fill)]",
-                "[&_svg]:w-3 [&_svg]:h-3",
-              )}
-            >
-              <AlertCircle aria-hidden="true" />
-            </span>
-          )}
-          <div
-            data-ow-part="quote"
-            className={cn(
-              "min-w-0 shrink max-w-[78%] whitespace-pre-wrap [overflow-wrap:anywhere] [text-wrap:pretty]",
-              // R3 撤泡：无底无边无内边，字与 AI 轮同档（--ow-fs-ui 13/1.7，--ow-text）
-              "text-ow-fs-ui leading-[1.7] text-[color:var(--ow-text)]",
-            )}
-          >
-            {body}
-            {streaming && (
-              <span
-                data-ow-part="caret"
-                aria-hidden="true"
-                className={cn(
-                  "ml-[7px] inline-block h-[7px] w-[7px] align-[0.08em]",
-                  "[border-radius:var(--ow-radius-pill)] bg-[var(--ow-text-3)]",
-                  "motion-safe:animate-[ow-skeleton_var(--ow-dur-spin)_var(--ow-ease-beacon)_infinite]",
-                )}
-              />
-            )}
-          </div>
-          {time != null && (
-            <span
-              data-ow-part="time"
-              className={cn(
-                // 末行行框 13×1.7≈22 高，字面基线约在底上 6px；读数 11px 行高 1 时基线在底上 ~2px，
-                // 抬 4px 让两条基线落同一线（R3 撤泡后不再有 10px 内边可借）。
-                "shrink-0 pb-[4px] leading-none font-[family-name:var(--ow-font-mono)] tabular-nums",
-                "text-ow-fs-caption text-[color:var(--ow-text-3)]",
-              )}
-            >
-              {time}
-            </span>
-          )}
-        </div>
-      )}
-      {error && (
-        <p data-ow-part="error" className="text-ow-fs-mark-md leading-[1.5] text-[color:var(--ow-error)]">
-          {error}
-        </p>
-      )}
-      {actions}
-      {trailing}
-    </div>
-  )
-}

package/src/components/domain/chat/index.ts

@@ -1,22 +0,0 @@
-export * from "./AgentLoopSegment"
-export * from "./AgentTurn"
-export * from "./ArtifactCard"
-export * from "./AuthorizationCard"
-export * from "./Attachment"
-export * from "./Chatbot"
-export * from "./ChatBubble"
-export * from "./ChatMessage"
-export * from "./ChatThinking"
-export * from "./Composer"
-export * from "./ContextUsage"
-export * from "./ExecutionSummary"
-export * from "./MessageActions"
-export * from "./PlanCard"
-export * from "./Message"
-export * from "./RichContent"
-export * from "./SubAgentThread"
-export * from "./Thinking"
-export * from "./ToolCallRow"
-export * from "./Transcript"
-export * from "./TranscriptSpine"
-export * from "./UserTurn"

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

@@ -1,116 +0,0 @@
-import type { Meta, StoryObj } from "@storybook/react"
-import { useState } from "react"
-import { DesktopAccountMenuView } from "."
-import type { Theme } from "../../../../lib/appearance"
-
-const noop = () => undefined
-
-/**
- * 账户菜单（R2 · Terry 意见 4）——点侧栏头像后弹出的那一面。
- *
- * 这是本轨的主证据面：件本身不 portal（定位与 backdrop 归 `DesktopSidebarView`），
- * 所以 story 里直接摆着就是开态，截图不用先把菜单点开。
- *
- * 荧黄配额（§4）：菜单内**零实底主钮**——「升级 / 充值」是 `secondary` 描边档。
- * 弹层不占所在半屏的行动极；主屏那一处已被 Composer 发送钮占掉。
- * 额度条 ≥80% 转 `--ow-warning`（永不荧黄），且颜色只是第二编码——数字读数一直在。
- */
-const meta = {
-  title: "Desktop/DesktopAccountMenuView",
-  component: DesktopAccountMenuView,
-  parameters: { layout: "centered" },
-} satisfies Meta<typeof DesktopAccountMenuView>
-
-export default meta
-type Story = StoryObj<typeof meta>
-
-const USER = { name: "张颖", email: "zhangying@orbitwork.ai", id: "usr_8f3a21c7" }
-
-/** 满配：头部 ＋ 套餐井 ＋ 七行 ＋ 行尾版本号。主题三格是活的（受控）。 */
-export const Full: Story = {
-  render: function FullMenu() {
-    const [theme, setTheme] = useState<Theme>("light")
-    const [pet, setPet] = useState(true)
-    return (
-      <DesktopAccountMenuView
-        user={USER}
-        plan={{ name: "体验版", action: { label: "升级", onClick: noop } }}
-        credits={{ used: 1240, limit: 2000 }}
-        version="v1.4.2"
-        theme={theme}
-        onThemeChange={setTheme}
-        petVisible={pet}
-        onPetVisibleChange={setPet}
-        onOpenSettings={noop}
-        onOpenMemory={noop}
-        onCopyUserId={noop}
-        onCheckUpdate={noop}
-        onFeedback={noop}
-        onLogout={noop}
-      />
-    )
-  },
-}
-
-/** 最简：没有套餐与积分（井整段不出）、没有 id（复制钮不出）、没有版本号。 */
-export const Minimal: Story = {
-  args: {
-    user: { name: "Terry" },
-    onOpenSettings: noop,
-    onFeedback: noop,
-    onLogout: noop,
-  },
-}
-
-/** 有更新：行尾从 mono 版本号换成三态文字（与账户行胶囊同一份 `updateRowText`）。 */
-export const UpdateReady: Story = {
-  args: {
-    user: USER,
-    plan: { name: "Pro", action: { label: "充值", onClick: noop } },
-    credits: { used: 420, limit: 2000 },
-    version: "v1.4.2",
-    update: { state: "ready", version: "1.5.0" },
-    theme: "dark",
-    onThemeChange: noop,
-    petVisible: false,
-    onPetVisibleChange: noop,
-    onOpenSettings: noop,
-    onOpenMemory: noop,
-    onCopyUserId: noop,
-    onCheckUpdate: noop,
-    onFeedback: noop,
-    onLogout: noop,
-  },
-}
-
-/** 长版本号：preview 构建号会顶爆 280 面宽——行尾截断＋省略号，title 保留全值（§7 读数口径）。 */
-export const LongVersion: Story = {
-  args: {
-    user: USER,
-    version: "v0.1.5-preview.20260906171447",
-    onOpenSettings: noop,
-    onCheckUpdate: noop,
-    onFeedback: noop,
-    onLogout: noop,
-  },
-}
-
-/** 额度告警：used/limit ≥80%，填充转 `--ow-warning`，读数仍在（R1 双编码）。 */
-export const CreditsWarning: Story = {
-  args: {
-    user: USER,
-    plan: { name: "体验版", action: { label: "升级", onClick: noop } },
-    credits: { used: 1880, limit: 2000 },
-    version: "v1.4.2",
-    theme: "system",
-    onThemeChange: noop,
-    petVisible: true,
-    onPetVisibleChange: noop,
-    onOpenSettings: noop,
-    onOpenMemory: noop,
-    onCopyUserId: noop,
-    onCheckUpdate: noop,
-    onFeedback: noop,
-    onLogout: noop,
-  },
-}

package/src/components/domain/desktop/DesktopAccountMenuView/DesktopAccountMenuViewSource.test.mjs

@@ -1,80 +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")
-
-test("面走 MenuSurface 基座：280 宽 ＋ bare 头部 ＋ banner 井（不新造弹层立面）", () => {
-  assert.match(source, /export const DESKTOP_ACCOUNT_MENU_WIDTH = 280/)
-  assert.match(source, /width=\{DESKTOP_ACCOUNT_MENU_WIDTH\}/)
-  assert.match(source, /\bheaderBare\b/)
-  assert.match(source, /banner=\{/)
-  assert.match(source, /ariaLabel="账户菜单"/)
-  // 立面（底/边/影/圆角）一律由基座给，本件不得自写
-  assert.doesNotMatch(source, /--ow-popover-bg/)
-  assert.doesNotMatch(source, /--ow-shadow-pop/)
-})
-
-test("§4 菜单内零实底主钮：升级/充值只走 secondary 描边档", () => {
-  assert.match(source, /<Button size="sm" variant="secondary"/)
-  assert.doesNotMatch(source, /variant="primary"/)
-  // 三极：弹层里不许出现荧黄族与 primary 族 token
-  assert.doesNotMatch(source, /var\(--ow-(?:yellow|beacon|accent-dot|primary)[^)]*\)/)
-})
-
-test("套餐井坐在 --ow-surface-2 上 ＋ 1px --ow-border，圆角走 --ow-radius-md（不是卡片化）", () => {
-  // 边不是装饰：§14 已知坑——暗档 surface-2 与 popover-bg 逐通道差 ≤2，只靠底色井会消失。
-  assert.match(
-    source,
-    /bg-\[var\(--ow-surface-2\)\] border border-\[color:var\(--ow-border\)\] \[border-radius:var\(--ow-radius-md\)\]/,
-  )
-})
-
-test("额度条走 ProgressBar 原语（6px md 档），不自画第三套进度条", () => {
-  assert.match(source, /<ProgressBar\s+size="md"/s)
-  assert.match(source, /tone=\{creditsWarn \? "warning" : "default"\}/)
-  assert.match(source, /export const ACCOUNT_CREDITS_WARN_RATIO = 0\.8/)
-  // 手搓轨/填充一律不许（.usage-bar 那族绑着设置页布局，8px 且阈值另算）
-  assert.doesNotMatch(source, /usage-bar/)
-})
-
-test("§7 读数：积分与版本号都是 mono ＋ tabular-nums", () => {
-  assert.match(source, /font-\[family-name:var\(--ow-font-mono\)\] tabular-nums/)
-  assert.match(source, /hintMono: !updateText/)
-})
-
-test("主题三格取 lib/appearance 的 THEME_OPTIONS（与设置·常规段同一份常量）", () => {
-  assert.match(source, /import \{ THEME_OPTIONS, type Theme \} from "\.\.\/\.\.\/\.\.\/\.\.\/lib\/appearance"/)
-  assert.match(source, /options=\{THEME_OPTIONS\}/)
-})
-
-test("行尾交互控件走 P2 的 control 槽（不是 button 套 button）", () => {
-  assert.match(source, /key: "pet"[\s\S]{0,200}control: \(\s*<Switch/)
-  assert.match(source, /key: "theme"[\s\S]{0,300}control: \(\s*<SegmentedControl/)
-  // pet / theme 两行不关面：用户还要接着调
-  assert.match(source, /if \(key === "pet"\) return onPetVisibleChange\?\.\(!petVisible\)/)
-  assert.match(source, /if \(key === "theme"\) return/)
-})
-
-test("头像走 primitives/Avatar，无图回落姓名末字（不再是空灰盘）", () => {
-  assert.match(source, /<Avatar size=\{32\} id=\{identity\}>/)
-  assert.match(source, /user\.name\.slice\(-1\)/)
-})
-
-test("退出登录是 danger 行；复制 ID 点后 2 秒内换 Check（双编码含文字）", () => {
-  assert.match(source, /key: "logout", label: "退出登录", icon: <Logout \/>, danger: true/)
-  assert.match(source, /setTimeout\(\(\) => setCopied\(false\), 2000\)/)
-  assert.match(source, /copied \? <Check className="w-4 h-4" \/> : <Copy className="w-4 h-4" \/>/)
-  assert.match(source, /aria-label=\{copied \? "已复制 ID" : "复制 ID"\}/)
-})
-
-test("更新三态文案是一份纯函数，账户行胶囊与菜单行共用；有更新时行尾是 info 点＋文字", () => {
-  assert.match(source, /export function updateRowText\(update: DesktopAccountMenuUpdate\)/)
-  assert.match(source, /long:\s*"重启安装"/)
-  assert.match(source, /title: `安装 Orbitwork \$\{update\.version\} 并重启`/)
-  // R1 双编码：点是第二编码，三态文字本身已把状态说全；点与账户行胶囊同走主题色 accent
-  assert.match(source, /bg-\[var\(--ow-accent\)\]/)
-  assert.match(source, /hint: updateText \? \(/)
-  // 下载中行不可点（与账户行更新胶囊 disabled 同口径）——核对修
-  assert.match(source, /disabled: update\?\.state === "downloading"/)
-})