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

package/src/components/domain/desktop/DesktopAppearanceSettings/index.tsx

@@ -1,155 +0,0 @@
-"use client"
-
-import { type OrbitworkSkin, type ResolvedTheme, THEME_OPTIONS, type Theme } from "../../../../lib/appearance"
-import { ListRow } from "../../../composite/ListRow"
-import { Button, Switch } from "../../../primitives"
-import { SegmentedControl } from "../../../primitives/SegmentedControl"
-
-/** 界面字号档（原型 4124：小 / 标准 / 大）。 */
-export type DesktopFontScale = "sm" | "md" | "lg"
-
-/** 「暂未支持」的真禁用开关（原型 4126–4130）：逐 token 变灰，不是假开关图形。 */
-export interface DesktopUnsupportedToggle {
-  id: string
-  title: string
-  description?: string
-}
-
-export interface DesktopAppearanceSettingsProps {
-  theme: Theme
-  /**
-   * @deprecated R2 起本件不再用它：主题三格直接读 `theme`（`system` 就是「自动」格），
-   * 皮肤与聊天背景两段都已撤，没有别的地方需要「解析后的明暗」。
-   * 字段保留只为包外宿主零改动。
-   */
-  resolvedTheme: ResolvedTheme
-  /** @deprecated 裁决 10「皮肤不做」：R2 撤皮肤整段，本件不渲染它。 */
-  skinId: string
-  /** @deprecated 同上。 */
-  skins: readonly OrbitworkSkin[]
-  /** @deprecated 同上。 */
-  customSkinIds?: readonly string[]
-  /** @deprecated 同上（「导入主题」钮随皮肤段一起撤）。 */
-  importing?: boolean
-  /** @deprecated 聊天背景段随皮肤段一并撤（取值本来就全靠 skins）。 */
-  backgroundBusy?: boolean
-  /** 界面字号档；不传 `onFontScaleChange` 就不出这一行 */
-  fontScale?: DesktopFontScale
-  onFontScaleChange?: (scale: DesktopFontScale) => void
-  /** 「暂未支持」的三条开关；空数组＝不出 */
-  unsupportedToggles?: readonly DesktopUnsupportedToggle[]
-  /** 默认工作目录（mono 读数）；不传 `onPickWorkRoot` 就不出这一行 */
-  workRoot?: string
-  onPickWorkRoot?: () => void
-  onThemeChange: (theme: Theme) => void
-  /** @deprecated 皮肤段已撤，回调不再触发。 */
-  onSkinChange: (skinId: string) => void
-  /** @deprecated 同上。 */
-  onImport: () => void
-  /** @deprecated 同上。 */
-  onDeleteCustom: (skinId: string) => void
-  /** @deprecated 聊天背景段已撤，回调不再触发。 */
-  onChooseChatBackground: () => void
-  /** @deprecated 同上。 */
-  onClearChatBackground: () => void
-  /** @deprecated 同上。 */
-  onChatBackgroundMaskColorChange: (color: string) => void
-}
-
-const FONT_SCALES: Array<{ value: DesktopFontScale; label: string }> = [
-  { value: "sm", label: "小" },
-  { value: "md", label: "标准" },
-  { value: "lg", label: "大" },
-]
-
-/**
- * Desktop 设置「常规」段的唯一视觉实现。宿主只负责读取和持久化设置。
- *
- * R2（Terry 2026-09-03 「其他一并优化」＋ 裁决 10「皮肤不做」）——本段瘦了三处：
- * 1. **皮肤整段撤**（连带右上角那枚「导入主题」钮）：皮肤是一条没落地的功能，
- *    色卡网格却占掉半屏，还在暗档亮出一块荧黄色样（那是「在展示 primary 这枚色本身」，
- *    不是行动极，但屏上确实是一块荧黄）。七件皮肤 props 保留签名标 `@deprecated`。
- * 2. **聊天背景段撤**：它的取值（图、遮罩色与强度）全部从皮肤的 `activeTokens` 里取，
- *    皮肤一撤就没有数据源了。功能仍在宿主数据里，只是入口先收起来。
- * 3. **「显示模式跟随系统」开关卡撤**，换成主题**三格**分段器 浅色 / 深色 / 自动
- *    （`system` 就是第三格）——原来「选哪档色」与「要不要跟系统」分两张卡，
- *    用户要点两处才说得清一件事。选项取 `lib/appearance` 的 `THEME_OPTIONS`，
- *    与侧栏账户菜单的「外观」行是同一份常量，两处不许分叉。
- *
- * 段内改行式（R3 · Terry 意见 5：`.set-row` 分隔线行，作废原型 2422–2461 的卡形）：主题 / 字体缩放两枚内联
- * 分段器（§7 sm=28 档，选中底在设置弹窗内由 desktop-surfaces.css 指到 `--ow-current-bg`）、
- * 三条「暂未支持」的真禁用行（§6 逐 token，不用整体透明度）、默认工作目录的 mono 读数。
- * §6 选中态一律走无彩极色，不用 primary（btn-primary 是行动极，暗档为荧黄）。
- */
-export function DesktopAppearanceSettings({
-  theme,
-  fontScale,
-  onFontScaleChange,
-  unsupportedToggles = [],
-  workRoot,
-  onPickWorkRoot,
-  onThemeChange,
-}: DesktopAppearanceSettingsProps) {
-  return (
-    <div className="appearance-settings">
-      <div className="flex flex-col gap-0">
-        <ListRow
-          title="主题"
-          description="选择浅色、深色，或跟随系统自动切换"
-          className="set-row"
-          action={
-            <SegmentedControl
-              size="sm"
-              options={THEME_OPTIONS}
-              value={theme}
-              onChange={(value) => onThemeChange(value as Theme)}
-              aria-label="主题"
-            />
-          }
-        />
-        {onFontScaleChange && (
-          <ListRow
-            title="字体缩放"
-            description="调整界面文字和元素的显示大小"
-            className="set-row"
-            action={
-              <SegmentedControl
-                size="sm"
-                options={FONT_SCALES}
-                value={fontScale ?? "md"}
-                onChange={(value) => onFontScaleChange(value as DesktopFontScale)}
-                aria-label="字体缩放"
-              />
-            }
-          />
-        )}
-        {/* 真禁用（§6 逐 token，不用整体透明度）：主副文由 ListRow 给 --ow-disabled-text，
-            右槽是 disabled 的真 Switch 而不是画一个假开关；行式无卡边，分隔线不变色。 */}
-        {unsupportedToggles.map((toggle) => (
-          <ListRow
-            key={toggle.id}
-            title={toggle.title}
-            description={toggle.description}
-            className="set-row"
-            disabled
-            action={<Switch checked={false} disabled aria-label={toggle.title} />}
-          />
-        ))}
-        {onPickWorkRoot && (
-          <ListRow
-            title="默认工作目录"
-            description={
-              <span className="block truncate [font-family:var(--ow-font-mono)]">{workRoot ?? "尚未设置"}</span>
-            }
-            className="set-row"
-            action={
-              <Button variant="secondary" size="sm" onClick={onPickWorkRoot}>
-                更改
-              </Button>
-            }
-          />
-        )}
-      </div>
-    </div>
-  )
-}

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

@@ -1,275 +0,0 @@
-import type { Meta, StoryObj } from "@storybook/react"
-import { DesktopAssistantConfigView } from "./index"
-import type { DesktopAssistantConfigValue } from "./index"
-
-const meta = {
-  title: "Desktop/DesktopAssistantConfigView",
-  component: DesktopAssistantConfigView,
-  parameters: {
-    layout: "centered",
-  },
-  decorators: [
-    (Story) => (
-      <div style={{ width: 600, padding: 20, background: "var(--ow-bg)" }}>
-        <Story />
-      </div>
-    ),
-  ],
-} satisfies Meta<typeof DesktopAssistantConfigView>
-
-export default meta
-type Story = StoryObj<typeof meta>
-
-const defaultValue: DesktopAssistantConfigValue = {
-  inputMethod: "scan",
-  clientId: "",
-  clientSecret: "",
-  projectId: "",
-  deviceId: "",
-  modelId: null,
-  groupRequireMention: true,
-  showReasoning: false,
-  showToolProgress: false,
-}
-
-const mockProjects = [
-  { value: "project-1", label: "默认项目" },
-  { value: "project-2", label: "移动端项目" },
-  { value: "project-3", label: "后端服务" },
-]
-
-const mockDevices = [
-  { value: "device-1", label: "我的 MacBook Pro" },
-  { value: "device-2", label: "办公室台式机" },
-]
-
-const mockModels = [
-  { id: "claude-opus-5", name: "Claude Opus 5", provider: "Anthropic" },
-  { id: "claude-sonnet-5", name: "Claude Sonnet 5", provider: "Anthropic" },
-  { id: "gpt-4", name: "GPT-4", provider: "OpenAI" },
-]
-
-export const DingTalkScan: Story = {
-  args: {
-    platform: "dingtalk",
-    value: defaultValue,
-    projects: mockProjects,
-    devices: mockDevices,
-    models: mockModels,
-    qrCode: (
-      <div
-        style={{
-          width: 200,
-          height: 200,
-          background: "var(--bg-tertiary)",
-          display: "flex",
-          alignItems: "center",
-          justifyContent: "center",
-          borderRadius: 8,
-        }}
-      >
-        QR Code
-      </div>
-    ),
-    onChange: () => {},
-    onCancel: () => {},
-    onSave: () => {},
-    onRefreshQr: () => {},
-  },
-}
-
-export const DingTalkManual: Story = {
-  args: {
-    platform: "dingtalk",
-    value: {
-      ...defaultValue,
-      inputMethod: "manual",
-      clientId: "dingxxxxxxxxxxxxxxxx",
-      clientSecret: "",
-      projectId: "project-1",
-      deviceId: "device-1",
-      modelId: "claude-opus-5",
-    },
-    projects: mockProjects,
-    devices: mockDevices,
-    models: mockModels,
-    onChange: () => {},
-    onCancel: () => {},
-    onSave: () => {},
-  },
-}
-
-export const FeishuScan: Story = {
-  args: {
-    platform: "feishu",
-    value: defaultValue,
-    projects: mockProjects,
-    devices: mockDevices,
-    models: mockModels,
-    qrCode: (
-      <div
-        style={{
-          width: 200,
-          height: 200,
-          background: "var(--bg-tertiary)",
-          display: "flex",
-          alignItems: "center",
-          justifyContent: "center",
-          borderRadius: 8,
-        }}
-      >
-        QR Code
-      </div>
-    ),
-    onChange: () => {},
-    onCancel: () => {},
-    onSave: () => {},
-  },
-}
-
-export const WeComScan: Story = {
-  args: {
-    platform: "wecom",
-    value: defaultValue,
-    projects: mockProjects,
-    devices: mockDevices,
-    models: mockModels,
-    qrCode: (
-      <div
-        style={{
-          width: 200,
-          height: 200,
-          background: "var(--bg-tertiary)",
-          display: "flex",
-          alignItems: "center",
-          justifyContent: "center",
-          borderRadius: 8,
-        }}
-      >
-        QR Code
-      </div>
-    ),
-    onChange: () => {},
-    onCancel: () => {},
-    onSave: () => {},
-  },
-}
-
-export const Editing: Story = {
-  args: {
-    platform: "dingtalk",
-    value: {
-      ...defaultValue,
-      inputMethod: "manual",
-      clientId: "dingxxxxxxxxxxxxxxxx",
-      clientSecret: "",
-      projectId: "project-1",
-      deviceId: "device-1",
-      modelId: "claude-opus-5",
-    },
-    projects: mockProjects,
-    devices: mockDevices,
-    models: mockModels,
-    editing: true,
-    onChange: () => {},
-    onCancel: () => {},
-    onSave: () => {},
-  },
-}
-
-export const Saving: Story = {
-  args: {
-    platform: "dingtalk",
-    value: {
-      ...defaultValue,
-      inputMethod: "manual",
-      clientId: "dingxxxxxxxxxxxxxxxx",
-      clientSecret: "secret123",
-      projectId: "project-1",
-      deviceId: "device-1",
-      modelId: "claude-opus-5",
-    },
-    projects: mockProjects,
-    devices: mockDevices,
-    models: mockModels,
-    saving: true,
-    onChange: () => {},
-    onCancel: () => {},
-    onSave: () => {},
-  },
-}
-
-export const WithError: Story = {
-  args: {
-    platform: "dingtalk",
-    value: {
-      ...defaultValue,
-      inputMethod: "manual",
-      clientId: "dingxxxxxxxxxxxxxxxx",
-      clientSecret: "invalid",
-      projectId: "project-1",
-      deviceId: "device-1",
-      modelId: "claude-opus-5",
-    },
-    projects: mockProjects,
-    devices: mockDevices,
-    models: mockModels,
-    error: "凭据验证失败，请检查 Client ID 和 Secret",
-    onChange: () => {},
-    onCancel: () => {},
-    onSave: () => {},
-  },
-}
-
-export const WithAdvancedOptions: Story = {
-  args: {
-    platform: "dingtalk",
-    value: {
-      ...defaultValue,
-      inputMethod: "manual",
-      clientId: "dingxxxxxxxxxxxxxxxx",
-      projectId: "project-1",
-      deviceId: "device-1",
-      modelId: "claude-opus-5",
-      groupRequireMention: false,
-      showReasoning: true,
-      showToolProgress: true,
-    },
-    projects: mockProjects,
-    devices: mockDevices,
-    models: mockModels,
-    onChange: () => {},
-    onCancel: () => {},
-    onSave: () => {},
-  },
-}
-
-export const NoDevices: Story = {
-  args: {
-    platform: "dingtalk",
-    value: defaultValue,
-    projects: mockProjects,
-    devices: [],
-    models: mockModels,
-    onChange: () => {},
-    onCancel: () => {},
-    onSave: () => {},
-  },
-}
-
-export const NoModels: Story = {
-  args: {
-    platform: "dingtalk",
-    value: {
-      ...defaultValue,
-      projectId: "project-1",
-      deviceId: "device-1",
-    },
-    projects: mockProjects,
-    devices: mockDevices,
-    models: [],
-    onChange: () => {},
-    onCancel: () => {},
-    onSave: () => {},
-  },
-}

package/src/components/domain/desktop/DesktopAssistantConfigView/DesktopAssistantConfigViewSource.test.mjs

@@ -1,37 +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/assistant-settings.css", import.meta.url), "utf8")
-
-test("表单控件归口原语：单行文本 Field、选择 Select 配方、开关行 ListRow", () => {
-  assert.match(source, /import \{ Field \} from "\.\.\/\.\.\/\.\.\/primitives\/Field"/)
-  assert.doesNotMatch(source, /TextField/)
-  assert.match(source, /<Select\b/)
-  assert.match(source, /<ProjectSelect\b/)
-  assert.match(source, /<ModelSelect\b/)
-  assert.match(source, /<ListRow[\s\S]*control="switch"/)
-  // 必填位有星号记号（形状编码，不只靠颜色）
-  assert.match(source, /assistant-field__required/)
-})
-
-test("assistant-settings.css 全文件 token 化：无裸色、无 V1 回退值", () => {
-  assert.doesNotMatch(styles, /#[0-9a-fA-F]{3,8}\b/)
-  assert.doesNotMatch(styles, /rgba?\(/)
-  // token 不带裸色兜底（兜底裸值＝V1 残余；--ow-space-*/--ow-border-width-* 的数值兜底不在此列）
-  assert.doesNotMatch(styles, /var\(--ow-[a-z0-9-]+,\s*(#|rgb)/)
-})
-
-test("§9 唯一缓动 ease-beacon；§6 交互态与焦点环齐备；链接色不落荧黄", () => {
-  assert.match(styles, /transition: transform var\(--ow-dur-1\) var\(--ow-ease-beacon\);/)
-  assert.doesNotMatch(styles, /var\(--ow-ease,\s*ease\)/)
-  assert.doesNotMatch(styles, /var\(--ow-primary\b/)
-  assert.match(styles, /\.assistant-field-state button \{[^}]*color: var\(--ow-link\);/s)
-  assert.match(styles, /\.assistant-field-state button:hover:not\(:disabled\) \{[^}]*var\(--ow-link-hover\)/s)
-  assert.match(
-    styles,
-    /\.assistant-advanced > summary:focus-visible \{[^}]*outline: var\(--ow-focus-ring-w\) solid var\(--ow-focus-ring\)/s,
-  )
-  assert.match(styles, /\.assistant-advanced > summary:hover \{[^}]*background: var\(--ow-hover\)/s)
-})

package/src/components/domain/desktop/DesktopAssistantConfigView/index.tsx

@@ -1,221 +0,0 @@
-"use client"
-
-import { type ReactNode, useState } from "react"
-import { ChevDown } from "../../../composite/Icons"
-import { ListRow } from "../../../composite/ListRow"
-import { ModelSelect, type ModelSelectOption } from "../../../composite/ModelSelect"
-import { ProjectSelect } from "../../../composite/ProjectSelect"
-import { Button } from "../../../primitives"
-import { Field } from "../../../primitives/Field"
-import { Select, type SelectOption } from "../../../primitives/Select"
-import { Tabs } from "../../../primitives/Tabs"
-
-export type DesktopAssistantPlatform = "dingtalk" | "feishu" | "wecom"
-
-export interface DesktopAssistantConfigValue {
-  inputMethod: "scan" | "manual"
-  clientId: string
-  clientSecret: string
-  projectId: string
-  deviceId: string
-  modelId: string | null
-  groupRequireMention: boolean
-  showReasoning: boolean
-  showToolProgress: boolean
-}
-
-export interface DesktopAssistantConfigViewProps {
-  platform: DesktopAssistantPlatform
-  value: DesktopAssistantConfigValue
-  projects: SelectOption[]
-  devices: SelectOption[]
-  models: ModelSelectOption[]
-  editing?: boolean
-  saving?: boolean
-  error?: string | null
-  qrCode?: ReactNode
-  onRefreshQr?: () => void
-  onCreateProject?: (name: string) => Promise<string>
-  onChange: (value: DesktopAssistantConfigValue) => void
-  onCancel: () => void
-  onSave: () => void
-}
-
-const PLATFORM_COPY: Record<DesktopAssistantPlatform, { name: string; id: string; secret: string; scanVerb: string }> =
-{
-  dingtalk: { name: "钉钉", id: "Client ID", secret: "Client Secret", scanVerb: "自动创建应用并回填凭据" },
-  feishu: { name: "飞书", id: "Client ID", secret: "Client Secret", scanVerb: "绑定应用并回填凭据" },
-  wecom: { name: "企业微信", id: "Bot ID", secret: "Secret", scanVerb: "获取机器人凭据" },
-}
-
-/** Desktop 助手渠道的完整配置视图；扫码和保存能力由宿主注入。 */
-export function DesktopAssistantConfigView({
-  platform,
-  value,
-  projects,
-  devices,
-  models,
-  editing = false,
-  saving = false,
-  error,
-  qrCode,
-  onRefreshQr,
-  onCreateProject,
-  onChange,
-  onCancel,
-  onSave,
-}: DesktopAssistantConfigViewProps) {
-  const [advancedOpen, setAdvancedOpen] = useState(false)
-  const copy = PLATFORM_COPY[platform]
-  const update = (patch: Partial<DesktopAssistantConfigValue>) => onChange({ ...value, ...patch })
-  const advancedActive = value.showReasoning || value.showToolProgress || !value.groupRequireMention
-  const saveDisabled =
-    saving ||
-    !value.projectId ||
-    !value.deviceId ||
-    !value.modelId ||
-    (value.inputMethod === "manual" && (!value.clientId.trim() || (!editing && !value.clientSecret.trim())))
-
-  return (
-    <div className="assistant-config-page">
-      <div className="assistant-config-page__content">
-        <div className="assistant-config-fields">
-          <Tabs
-            items={[
-              { key: "scan", label: editing ? "扫码更换" : platform === "wecom" ? "扫码获取" : "扫码创建" },
-              { key: "manual", label: "手动填写" },
-            ]}
-            activeKey={value.inputMethod}
-            onChange={(key) => update({ inputMethod: key as DesktopAssistantConfigValue["inputMethod"] })}
-          />
-          {value.inputMethod === "scan" ? (
-            <div className="assistant-scan-create">
-              <span className="assistant-scan-create__hint">
-                {editing
-                  ? `用${copy.name}扫码可更换当前绑定；不扫码则保持现有配置。`
-                  : `用${copy.name}扫码${copy.scanVerb}。`}
-              </span>
-              <div className="assistant-bind-card">
-                {qrCode ?? (
-                  <div className="assistant-bind-card__qr assistant-bind-card__qr--placeholder">
-                    {copy.name}
-                    <br />
-                    扫码二维码
-                  </div>
-                )}
-              </div>
-              {onRefreshQr && (
-                <Button variant="text" onClick={onRefreshQr}>
-                  刷新二维码
-                </Button>
-              )}
-            </div>
-          ) : (
-            <>
-              {/* 单行文本控件归口 Field 原语（壳承担三态边框＋focus 环）；NativeControls 的旧文本件在产品面已退役 */}
-              <label className="assistant-field">
-                <span className="assistant-field__required">{copy.id}</span>
-                <Field
-                  value={value.clientId}
-                  onChange={(clientId) => update({ clientId })}
-                  placeholder={`请输入 ${copy.id}`}
-                />
-              </label>
-              <label className="assistant-field">
-                {/* 改配置时留空＝沿用现有密钥，此时不是必填 */}
-                <span className={editing ? undefined : "assistant-field__required"}>{copy.secret}</span>
-                <Field
-                  type="password"
-                  value={value.clientSecret}
-                  onChange={(clientSecret) => update({ clientSecret })}
-                  placeholder={editing ? "留空则保持现有密钥" : `请输入 ${copy.secret}`}
-                />
-              </label>
-            </>
-          )}
-          <div className="assistant-field assistant-field--select">
-            <span>默认项目</span>
-            <ProjectSelect
-              value={value.projectId}
-              options={projects}
-              onChange={(projectId) => update({ projectId })}
-              onCreate={onCreateProject}
-              placeholder="选择项目"
-            />
-          </div>
-          <div className="assistant-field assistant-field--select">
-            <span>目标设备</span>
-            <Select
-              value={value.deviceId}
-              options={devices}
-              onChange={(deviceId) => update({ deviceId })}
-              placeholder="选择设备"
-              disabled={devices.length === 0}
-            />
-          </div>
-          <div className="assistant-field assistant-field--model">
-            <span className="assistant-field__required">模型</span>
-            <ModelSelect
-              value={value.modelId}
-              options={models}
-              onChange={(modelId) => update({ modelId })}
-              placeholder="选择模型"
-              emptyLabel="暂无可用模型"
-            />
-          </div>
-        </div>
-        <details
-          className="assistant-advanced"
-          open={advancedOpen}
-          onToggle={(event) => setAdvancedOpen(event.currentTarget.open)}
-        >
-          <summary>
-            <b>高级选项</b>
-            {advancedActive && <span className="assistant-advanced__active">已自定义</span>}
-            <ChevDown />
-          </summary>
-          <div className="assistant-advanced__body">
-            <ListRow
-              title="群聊仅在 @机器人时回复"
-              description="避免机器人响应群内的普通消息。"
-              control="switch"
-              checked={value.groupRequireMention}
-              onCheckedChange={(groupRequireMention) => update({ groupRequireMention })}
-              divider={false}
-              className="px-0"
-            />
-            <ListRow
-              title="展示思考过程"
-              description="将模型的推理内容附加在最终回复前。"
-              control="switch"
-              checked={value.showReasoning}
-              onCheckedChange={(showReasoning) => update({ showReasoning })}
-              divider={false}
-              className="px-0"
-            />
-            <ListRow
-              title="展示工具执行进度"
-              description="回复生成过程中展示工具调用及其结果。"
-              control="switch"
-              checked={value.showToolProgress}
-              onCheckedChange={(showToolProgress) => update({ showToolProgress })}
-              divider={false}
-              className="px-0"
-            />
-          </div>
-        </details>
-      </div>
-      <div className="assistant-config-page__actions">
-        <span className={`assistant-config-page__footer-hint${error ? " is-error" : ""}`}>
-          {error ?? (saving ? "正在保存…" : `配置将应用到${copy.name}渠道`)}
-        </span>
-        <Button variant="secondary" onClick={onCancel} disabled={saving}>
-          取消
-        </Button>
-        <Button variant="primary" onClick={onSave} disabled={saveDisabled}>
-          {editing ? "保存" : "创建并启用"}
-        </Button>
-      </div>
-    </div>
-  )
-}