@orbit-work/ui 0.1.1 → 0.1.2

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

@@ -1,490 +0,0 @@
-"use client"
-
-import { type ReactNode, useCallback, useId, useState } from "react"
-import { BeaconSpinner } from "../../../composite/BeaconSpinner"
-import { ChevDown, Copy, Folder, Mail, Server, Skill } from "../../../composite/Icons"
-import { CompressionDivider } from "../../../composite/TranscriptDividers"
-import { Button } from "../../../primitives"
-import { InlineMessage } from "../../../primitives/InlineMessage"
-import { AgentTurn } from "../../chat/AgentTurn"
-import { ChatThinking } from "../../chat/ChatThinking"
-import { MessageActions } from "../../chat/MessageActions"
-import { Transcript } from "../../chat/Transcript"
-import { UserTurn } from "../../chat/UserTurn"
-import { FileIcon } from "../../files/FileIcon"
-import { DesktopChatMessageView, type DesktopChatMessageViewProps } from "../DesktopChatMessageView"
-
-export interface DesktopChatAttachmentView {
-  id?: string
-  name: string
-  meta?: string
-  kind?: "image" | "audio" | "file" | "directory"
-  glyph?: ReactNode
-  previewUrl?: string
-  openable?: boolean
-  draggable?: boolean
-  title?: string
-}
-
-export interface DesktopChatContextView {
-  id: string
-  name: string
-  kind: "skill" | "mcp"
-}
-
-export interface DesktopChatUserTurnViewProps {
-  id: string | number
-  text?: string
-  sourceLabel?: string
-  compressed?: boolean
-  error?: string | null
-  time?: string | null
-  attachments?: DesktopChatAttachmentView[]
-  contexts?: DesktopChatContextView[]
-  onAttachmentClick?: (attachment: DesktopChatAttachmentView, index: number) => void
-  onAttachmentDoubleClick?: (attachment: DesktopChatAttachmentView, index: number) => void
-  onAttachmentDragStart?: (
-    event: React.DragEvent<HTMLButtonElement>,
-    attachment: DesktopChatAttachmentView,
-    index: number,
-  ) => void
-  onAttachmentKeyDown?: (
-    event: React.KeyboardEvent<HTMLButtonElement>,
-    attachment: DesktopChatAttachmentView,
-    index: number,
-  ) => void
-  onCopy?: (text: string) => void | Promise<void>
-  /** 分享挑选模式：行首长出 16px 勾选框（原型 template.dc.html:1142-1149） */
-  selectable?: boolean
-  /** 已选入分享 */
-  checked?: boolean
-  /** 勾选切换；入参是切换后的状态 */
-  onToggle?: (checked: boolean) => void
-  /** 勾选框读屏名，缺省「选入分享」 */
-  selectLabel?: string
-  trailing?: ReactNode
-}
-
-/**
- * Desktop 用户消息的完整纯视图；文件解析和 Electron 操作留在宿主 adapter。
- * DS 2.0 P5：轮次骨架归口 `UserTurn`（domain/chat/UserTurn）——空心环节点＋引用原话
- * 不加气泡底，照锁定件 TranscriptSpine 的语言；来源 chip、附件区、上下文 chip、
- * 操作行分别挂 UserTurn 的 leading / attachments / contexts / actions 槽。
- */
-export function DesktopChatUserTurnView({
-  id,
-  text = "",
-  sourceLabel,
-  compressed,
-  error,
-  time,
-  attachments = [],
-  contexts = [],
-  onAttachmentClick,
-  onAttachmentDoubleClick,
-  onAttachmentDragStart,
-  onAttachmentKeyDown,
-  onCopy,
-  selectable,
-  checked,
-  onToggle,
-  selectLabel,
-  trailing,
-}: DesktopChatUserTurnViewProps) {
-  if (compressed) {
-    return <DesktopChatCompressionDivider id={id} text={text} time={time} onCopy={onCopy} trailing={trailing} />
-  }
-
-  return (
-    <UserTurn
-      className="turn turn--user"
-      anchor={id}
-      /* A7-B2：分享挑选模式的勾选框归口组件库（原来在宿主 ChatCard 的 SharePickRow 里用原生 input） */
-      selectable={selectable}
-      checked={checked}
-      onToggle={onToggle}
-      selectLabel={selectLabel}
-      text={text || undefined}
-      error={error || undefined}
-      trailing={trailing}
-      /* A9-B2：时间读数改挂气泡右侧同一行（原型 template.dc.html:1177），
-         下方操作行只留复制钮。 */
-      time={time || undefined}
-      actions={text ? <DesktopChatUserMeta text={text} onCopy={onCopy} /> : undefined}
-      leading={
-        sourceLabel ? (
-          <div className="turn-source-chip">
-            <Mail /> {sourceLabel}
-          </div>
-        ) : undefined
-      }
-      contexts={
-        contexts.length > 0 ? (
-          <div className="turn-context-chips">
-            {contexts.map((context) => (
-              <span
-                key={`${context.kind}:${context.id}`}
-                className={`turn-context-chip turn-context-chip--${context.kind}`}
-                data-kind={context.kind}
-              >
-                {context.kind === "skill" ? <Skill /> : <Server />}
-                <span>{context.name}</span>
-              </span>
-            ))}
-          </div>
-        ) : undefined
-      }
-      attachments={
-        attachments.length > 0 ? (
-          <div className="atts">
-            {attachments.map((attachment, index) => (
-              <Button
-                variant="unstyled"
-                key={attachment.id ?? `${attachment.name}-${index}`}
-                type="button"
-                className={`att${attachment.openable ? " att--openable" : ""}${attachment.kind === "image" && attachment.previewUrl ? " att--image" : ""}`}
-                title={attachment.title ?? attachment.name}
-                draggable={attachment.draggable}
-                onDragStart={(event) => onAttachmentDragStart?.(event, attachment, index)}
-                onClick={() => onAttachmentClick?.(attachment, index)}
-                onDoubleClick={() => onAttachmentDoubleClick?.(attachment, index)}
-                onKeyDown={(event) => onAttachmentKeyDown?.(event, attachment, index)}
-              >
-                {attachment.kind === "image" && attachment.previewUrl ? (
-                  <img className="att__preview" src={attachment.previewUrl} alt={attachment.name} />
-                ) : (
-                  <>
-                    <span className={`gly ${attachment.kind === "directory" ? "gly--directory" : "gly--file"}`}>
-                      {attachment.kind === "directory" ? (
-                        <Folder aria-hidden="true" />
-                      ) : (
-                        <FileIcon name={attachment.name} kind={attachment.kind} width={16} height={16} />
-                      )}
-                    </span>
-                    <div>
-                      <div>{attachment.name}</div>
-                      {attachment.meta && <div className="m">{attachment.meta}</div>}
-                    </div>
-                  </>
-                )}
-              </Button>
-            ))}
-          </div>
-        ) : undefined
-      }
-    />
-  )
-}
-
-export interface DesktopChatCompressionDividerProps {
-  id: string | number
-  text: string
-  /** Boundary label. Defaults to "上下文已压缩". */
-  label?: ReactNode
-  /** Compressed content stays folded unless explicitly requested otherwise. */
-  defaultExpanded?: boolean
-  time?: string | null
-  onCopy?: (text: string) => void | Promise<void>
-  onExpandedChange?: (expanded: boolean) => void
-  trailing?: ReactNode
-}
-
-/**
- * Desktop 压缩消息分界线；折叠状态和展开交互由 ow-ui 持有。
- * DS 2.0 P5：边界行本体改用 `CompressionDivider`（composite/TranscriptDividers），
- * 本件只保留桌面端外壳（turn 组容器）与详情区卡面（`.compression-divider__details`）。
- */
-export function DesktopChatCompressionDivider({
-  id,
-  text,
-  label = "上下文已压缩",
-  defaultExpanded = false,
-  time,
-  onCopy,
-  onExpandedChange,
-  trailing,
-}: DesktopChatCompressionDividerProps): React.ReactElement {
-  const [expanded, setExpanded] = useState(defaultExpanded)
-  const handleExpandedChange = useCallback(
-    (next: boolean) => {
-      setExpanded(next)
-      onExpandedChange?.(next)
-    },
-    [onExpandedChange],
-  )
-
-  return (
-    <div className={`turn turn--compressed-group${expanded ? " is-expanded" : ""}`} data-chat-anchor={id}>
-      <CompressionDivider
-        className={expanded ? "mt-5 mb-3" : "mt-5 mb-6"}
-        label={label}
-        expanded={expanded}
-        onExpandedChange={handleExpandedChange}
-        detailsLabel="已压缩内容"
-        detailsClassName="compression-divider__details"
-      >
-        <span className="compression-divider__text">{text}</span>
-        {text && <DesktopChatUserMeta text={text} time={time} onCopy={onCopy} visible />}
-      </CompressionDivider>
-      {trailing}
-    </div>
-  )
-}
-
-export interface DesktopChatReconnectDividerProps {
-  id: string | number
-  detail?: string
-  /** Error-card title shown after expanding the reconnect divider. */
-  errorTitle?: string
-  /** Human-readable error-card message shown after expanding the divider. */
-  errorMessage?: string
-  /** Optional host version shown by the expanded error card. */
-  errorVersion?: string
-  /** Calm status copy shown while Desktop is reconnecting. */
-  label?: ReactNode
-  /** Error details stay folded unless explicitly requested otherwise. */
-  defaultExpanded?: boolean
-  onExpandedChange?: (expanded: boolean) => void
-}
-
-/** Desktop transient reconnect boundary; the host removes it after reconnect succeeds. */
-export function DesktopChatReconnectDivider({
-  id,
-  detail = "",
-  errorTitle = "Invalid Request",
-  errorMessage,
-  errorVersion,
-  label = "连接响应异常，正在尝试重新连接",
-  defaultExpanded = false,
-  onExpandedChange,
-}: DesktopChatReconnectDividerProps): React.ReactElement {
-  const detailsId = useId()
-  const [expanded, setExpanded] = useState(defaultExpanded)
-  const toggle = useCallback(() => {
-    setExpanded((value) => {
-      const next = !value
-      onExpandedChange?.(next)
-      return next
-    })
-  }, [onExpandedChange])
-  const actionLabel = expanded ? "收起连接错误详情" : "查看连接错误详情"
-
-  return (
-    <div className={`reconnect-status${expanded ? " is-expanded" : ""}`} data-chat-anchor={id}>
-      <div className="reconnect-divider">
-        <span className="reconnect-divider__line" aria-hidden="true" />
-        <Button
-          variant="unstyled"
-          type="button"
-          className="reconnect-divider__trigger"
-          onClick={toggle}
-          aria-expanded={expanded}
-          aria-controls={detailsId}
-          aria-label={actionLabel}
-          title={actionLabel}
-        >
-          {/* §9 旋转圈退役：自转 Loader 图标 → 锁定件 BeaconSpinner（size 15 → <20px
-              小转子环，描边随 .reconnect-divider__spinner 的 error 色）。 */}
-          <BeaconSpinner size={15} className="reconnect-divider__spinner" aria-label="正在重连" />
-          <span className="reconnect-divider__label" role="status" aria-live="polite">
-            {label}
-          </span>
-          <span className="reconnect-divider__action">{expanded ? "收起" : "查看"}</span>
-          <ChevDown className="reconnect-divider__chevron" aria-hidden="true" />
-        </Button>
-        <span className="reconnect-divider__line" aria-hidden="true" />
-      </div>
-      <div
-        id={detailsId}
-        className="reconnect-divider__details"
-        role="region"
-        aria-label="连接错误详情"
-        hidden={!expanded}
-      >
-        <InlineMessage variant="error" title={errorTitle} meta={errorVersion} detail={detail.trim() || undefined}>
-          {errorMessage?.trim() || detail.trim() || "Backend chat stream returned an invalid response."}
-        </InlineMessage>
-      </div>
-    </div>
-  )
-}
-
-function DesktopChatUserMeta({
-  text,
-  time,
-  onCopy,
-  visible,
-}: {
-  text: string
-  /** 压缩详情里仍走操作行读数；轮次里的时间已挂到气泡右侧（A9-B2） */
-  time?: string | null
-  onCopy?: (text: string) => void | Promise<void>
-  /** 无轮次 hover 语境时（压缩详情里）常显 */
-  visible?: boolean
-}) {
-  const [copied, setCopied] = useState(false)
-  const copy = useCallback(async () => {
-    try {
-      if (onCopy) await onCopy(text)
-      else await navigator.clipboard.writeText(text)
-      setCopied(true)
-      window.setTimeout(() => setCopied(false), 1600)
-    } catch {}
-  }, [onCopy, text])
-  // DS 2.0 P5：用户轮的操作行归口 MessageActions（hover 浮现、ghost 28 图标钮、
-  // 复制完成回执＝勾＋success）。类名 turn-user-meta 只留作宿主定位钩子，
-  // 样式全部由 MessageActions 持有。
-  return (
-    <MessageActions
-      className="turn-user-meta"
-      visible={visible}
-      time={time || undefined}
-      items={[{ key: "copy", label: "复制", icon: <Copy />, done: copied, onSelect: copy }]}
-    />
-  )
-}
-
-export interface DesktopChatAgentMessageView extends Omit<DesktopChatMessageViewProps, "latest" | "disclaimer"> {}
-
-export interface DesktopChatAgentTurnViewProps {
-  children?: ReactNode
-  questions?: ReactNode
-  body?: ReactNode
-  messages?: DesktopChatAgentMessageView[]
-  thinking?: ReactNode
-  thinkingLoading?: boolean
-  /** 思考正文初始展开；缺省折叠（R4） */
-  thinkingDefaultExpanded?: boolean
-  /**
-   * R5 定案：信标合到脊线节点上，**缺省开**。转/停由轮内的 ChatThinking / Thinking 行自动上报
-   * （`thinking` 槽的 loading 也算），对象可强制 spinning / toolRunning；`false` 关掉。
-   */
-  nodeBeacon?: boolean | { spinning?: boolean; toolRunning?: boolean; size?: number }
-  execution?: ReactNode
-  actions?: boolean
-  disclaimer?: ReactNode
-  plain?: boolean
-  /** 署名行的 agent 名；给出即显示脊柱署名行（缺省不显，由宿主标题承担身份） */
-  agentName?: ReactNode
-  /** 署名行右侧读数（步数·耗时·模型），mono＋tabular-nums */
-  agentMeta?: ReactNode
-  /** 分享挑选模式：行首长出 16px 勾选框（原型 template.dc.html:1142-1149） */
-  selectable?: boolean
-  /** 已选入分享 */
-  checked?: boolean
-  /** 勾选切换；入参是切换后的状态 */
-  onToggle?: (checked: boolean) => void
-  /** 勾选框读屏名，缺省「选入分享」 */
-  selectLabel?: string
-}
-
-/**
- * Desktop 助手消息组合视图，覆盖思考、执行摘要、正文、操作区和免责声明。
- * DS 2.0 P5：轮次骨架归口 `AgentTurn`（domain/chat/AgentTurn）——实心点节点＋
- * 可选署名行照锁定件 TranscriptSpine 的语言；桌面端的正文栈（`.body`）与
- * DesktopChatMessageView 仍留在本件。
- */
-export function DesktopChatAgentTurnView({
-  children,
-  questions,
-  body,
-  messages,
-  thinking,
-  thinkingLoading,
-  thinkingDefaultExpanded,
-  nodeBeacon,
-  execution,
-  actions = true,
-  disclaimer,
-  plain,
-  agentName,
-  agentMeta,
-  selectable,
-  checked,
-  onToggle,
-  selectLabel,
-}: DesktopChatAgentTurnViewProps) {
-  const visibleMessages = messages ?? (children !== undefined ? [{ id: "message", content: children }] : [])
-  return (
-    <AgentTurn
-      className={`turn ${plain ? "turn--plain-agent" : "turn--agent"}`}
-      /* A9-B2：原型的每一轮 agent 都挂实心点、内容都缩进 26px（template.dc.html:1150-1170）。
-         纯文本轮原来 node=false，既没点也不缩进，脊线一到它这儿就断——脊柱贯穿的前提是
-         每一轮都占同一条 12px 脊柱列，所以纯文本轮同样挂节点。 */
-      node
-      /* A7-B2：同用户轮，分享挑选模式的勾选框由 AgentTurn 持有 */
-      selectable={selectable}
-      checked={checked}
-      onToggle={onToggle}
-      selectLabel={selectLabel}
-      beacon={nodeBeacon ?? true}
-      byline={agentName != null}
-      name={agentName}
-      meta={agentMeta}
-      execution={execution}
-      thinking={
-        thinking !== undefined ? (
-          /* R4（2026-09-04）：思考正文缺省折叠（思考是过程不是答案），跟 Thinking inline 的缺省走；
-             要常开由宿主传 thinkingDefaultExpanded（ACCEPTANCE-PENDING R4-3）。 */
-          <ChatThinking loading={thinkingLoading} defaultExpanded={thinkingDefaultExpanded}>
-            {thinking}
-          </ChatThinking>
-        ) : undefined
-      }
-    >
-      <div className="body">
-        {questions}
-        {body}
-        {visibleMessages.map((message, index) => {
-          const latest = index === visibleMessages.length - 1
-          return (
-            <DesktopChatMessageView
-              key={message.id}
-              {...message}
-              actions={message.actions ?? actions}
-              latest={latest}
-              disclaimer={latest ? disclaimer : undefined}
-            />
-          )
-        })}
-      </div>
-    </AgentTurn>
-  )
-}
-
-export interface DesktopConversationGroupView {
-  id: string
-  user?: DesktopChatUserTurnViewProps
-  agent?: DesktopChatAgentTurnViewProps
-  divider?: ReactNode
-}
-
-export interface DesktopConversationViewProps {
-  groups: DesktopConversationGroupView[]
-  /** 脊线贯穿；关掉即退化为平铺列表（分享页等无脊柱语境） */
-  spine?: boolean
-  className?: string
-}
-
-/**
- * 一个可同时供 Desktop 和文档示例使用的完整会话列表。
- * DS 2.0 P5：外壳归口 `Transcript`（domain/chat/Transcript）——左侧 1.5px
- * `--ow-timeline` 脊线贯穿，用户轮空心环 / 助手轮实心点各自挂在线上。
- */
-export function DesktopConversationView({
-  groups,
-  spine = true,
-  className,
-}: DesktopConversationViewProps): React.ReactElement {
-  return (
-    <Transcript spine={spine} maxWidth="100%" className={className}>
-      {groups.map((group) => (
-        <div data-ow-part="turn-group" key={group.id}>
-          {group.user && <DesktopChatUserTurnView {...group.user} />}
-          {group.agent && <DesktopChatAgentTurnView {...group.agent} />}
-          {group.divider}
-        </div>
-      ))}
-    </Transcript>
-  )
-}

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

@@ -1,195 +0,0 @@
-import type { Meta, StoryObj } from "@storybook/react"
-import { Bolt, Settings as User } from "../../../composite/Icons"
-import { Button } from "../../../primitives"
-import { DesktopComposer, DesktopComposerModelButton } from "./index"
-
-const meta = {
-  title: "Desktop/DesktopComposer",
-  component: DesktopComposer,
-  decorators: [
-    (Story) => (
-      <div style={{ padding: 20, background: "var(--bg-primary)" }}>
-        <Story />
-      </div>
-    ),
-  ],
-} satisfies Meta<typeof DesktopComposer>
-
-export default meta
-type Story = StoryObj<typeof meta>
-
-export const Default: Story = {
-  args: {
-    value: "",
-    onChange: (value) => console.log("Value:", value),
-    onSubmit: () => console.log("Submit"),
-    placeholder: "今天帮你做些什么？ / 调用技能与指令 @ 引用专家和连接器",
-  },
-}
-
-export const WithAgent: Story = {
-  args: {
-    value: "",
-    onChange: (value) => console.log("Value:", value),
-    onSubmit: () => console.log("Submit"),
-    placeholder: "向智能体提问",
-    agent: {
-      label: "Code Expert",
-      description: "代码专家",
-      icon: <Bolt />,
-      onRemove: () => console.log("Remove agent"),
-    },
-  },
-}
-
-export const WithPlan: Story = {
-  args: {
-    value: "",
-    onChange: (value) => console.log("Value:", value),
-    onSubmit: () => console.log("Submit"),
-    placeholder: "根据计划提问",
-    plan: {
-      label: "实现登录功能",
-      description: "3 个步骤",
-      onRemove: () => console.log("Remove plan"),
-    },
-  },
-}
-
-export const WithAddAction: Story = {
-  args: {
-    value: "",
-    onChange: (value) => console.log("Value:", value),
-    onSubmit: () => console.log("Submit"),
-    placeholder: "今天帮你做些什么？ / 调用技能与指令 @ 引用专家和连接器",
-    addAction: {
-      onClick: () => console.log("Add"),
-      title: "添加上下文",
-    },
-  },
-}
-
-export const WithModelControl: Story = {
-  args: {
-    value: "",
-    onChange: (value) => console.log("Value:", value),
-    onSubmit: () => console.log("Submit"),
-    placeholder: "今天帮你做些什么？ / 调用技能与指令 @ 引用专家和连接器",
-    modelControl: <DesktopComposerModelButton label="Claude Opus 5" onClick={() => console.log("Select model")} />,
-  },
-}
-
-export const WithProjectControl: Story = {
-  args: {
-    value: "",
-    onChange: (value) => console.log("Value:", value),
-    onSubmit: () => console.log("Submit"),
-    placeholder: "今天帮你做些什么？ / 调用技能与指令 @ 引用专家和连接器",
-    projectControl: (
-      <Button variant="text" size="small">
-        项目: orbit-fe
-      </Button>
-    ),
-  },
-}
-
-export const WithContextUsage: Story = {
-  args: {
-    value: "",
-    onChange: (value) => console.log("Value:", value),
-    onSubmit: () => console.log("Submit"),
-    placeholder: "今天帮你做些什么？ / 调用技能与指令 @ 引用专家和连接器",
-    contextUsage: <div style={{ fontSize: 12, color: "var(--fg-tertiary)" }}>12.5K / 200K tokens</div>,
-  },
-}
-
-export const FullyLoaded: Story = {
-  args: {
-    value: "如何优化这个查询？",
-    onChange: (value) => console.log("Value:", value),
-    onSubmit: () => console.log("Submit"),
-    placeholder: "今天帮你做些什么？ / 调用技能与指令 @ 引用专家和连接器",
-    addAction: {
-      onClick: () => console.log("Add"),
-      title: "添加上下文",
-    },
-    agent: {
-      label: "Database Expert",
-      icon: <Bolt />,
-      onRemove: () => console.log("Remove agent"),
-    },
-    modelControl: <DesktopComposerModelButton label="Claude Opus 5" onClick={() => console.log("Select model")} />,
-    projectControl: (
-      <Button variant="text" size="small">
-        项目: backend
-      </Button>
-    ),
-    contextUsage: <div style={{ fontSize: 12, color: "var(--fg-tertiary)" }}>45K / 200K</div>,
-  },
-}
-
-export const WithPermissionPrompt: Story = {
-  args: {
-    value: "",
-    onChange: () => {},
-    onSubmit: () => {},
-    placeholder: "今天帮你做些什么？ / 调用技能与指令 @ 引用专家和连接器",
-    permissionPrompt: (
-      <div style={{ padding: 40, textAlign: "center", background: "var(--bg-secondary)", borderRadius: 8 }}>
-        <h3>需要权限</h3>
-        <p>此操作需要您的授权</p>
-        <Button variant="primary">授权</Button>
-      </div>
-    ),
-  },
-}
-
-export const CustomNotice: Story = {
-  args: {
-    value: "",
-    onChange: (value) => console.log("Value:", value),
-    onSubmit: () => console.log("Submit"),
-    placeholder: "今天帮你做些什么？ / 调用技能与指令 @ 引用专家和连接器",
-    notice: "⚠️ 当前处于测试模式",
-  },
-}
-
-/** 缺省态：井脚无免责句（R2·L1-2-2 起免责句归 AgentTurn.disclaimer）。 */
-export const NoNotice: Story = {
-  args: {
-    value: "",
-    onChange: (value) => console.log("Value:", value),
-    onSubmit: () => console.log("Submit"),
-    placeholder: "今天帮你做些什么？ / 调用技能与指令 @ 引用专家和连接器",
-  },
-}
-
-/** 显式传 notice 才在井脚补一条（宿主自定义提示用）。 */
-export const WithNotice: Story = {
-  args: {
-    value: "",
-    onChange: (value) => console.log("Value:", value),
-    onSubmit: () => console.log("Submit"),
-    placeholder: "今天帮你做些什么？ / 调用技能与指令 @ 引用专家和连接器",
-    notice: "内容由 AI 生成，请仔细核实回答内容。",
-  },
-}
-
-export const ModelButtonDefault: StoryObj<typeof DesktopComposerModelButton> = {
-  render: () => <DesktopComposerModelButton label="Claude Opus 5" onClick={() => console.log("Click")} />,
-}
-
-export const ModelButtonOpen: StoryObj<typeof DesktopComposerModelButton> = {
-  render: () => <DesktopComposerModelButton label="Claude Sonnet 5" open={true} onClick={() => console.log("Click")} />,
-}
-
-export const ModelButtonWarning: StoryObj<typeof DesktopComposerModelButton> = {
-  render: () => (
-    <DesktopComposerModelButton
-      label="GPT-4"
-      warning={true}
-      title="此模型可能不稳定"
-      onClick={() => console.log("Click")}
-    />
-  ),
-}