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

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

@@ -1,127 +0,0 @@
-import type { Meta, StoryObj } from "@storybook/react"
-import { Doc, Folder } from "../../../composite/Icons"
-import { ArtifactCard, ArtifactTrail } from "./index"
-
-const noop = () => undefined
-
-const meta = {
-  title: "Chat/ArtifactCard",
-  component: ArtifactCard,
-  parameters: {
-    layout: "padded",
-  },
-  tags: ["autodocs"],
-  decorators: [
-    (Story) => (
-      <div style={{ maxWidth: 440 }}>
-        <Story />
-      </div>
-    ),
-  ],
-} satisfies Meta<typeof ArtifactCard>
-
-export default meta
-type Story = StoryObj<typeof meta>
-
-/** 完成态：递减短迹（text-3 · 浅暗同形）＋标题＋mono 元信息脚注 */
-export const Default: Story = {
-  args: {
-    title: "Q3 渠道复盘（终稿）",
-    meta: "report_q3_channels.docx · 4,180 字 · 08-28 14:32",
-  },
-}
-
-/** 生成中变体：短迹末颗=var(--ow-beacon)（状态极·限一处，呼吸、reduced-motion 静止），meta 必含「生成中」文字（R1 双编码） */
-export const Generating: Story = {
-  args: {
-    title: "竞品定价对照表",
-    meta: "生成中 · 已完成 3/5 节 · 01:12",
-    generating: true,
-  },
-}
-
-/**
- * 可打开（R3 · Terry 意见 4）：`onOpen` 让卡本体成按钮（宿主接预览栏 / 默认应用），
- * hover 卡边升 `--ow-border-strong`；`onOpenWith` ＋ `openWithApps` 在右侧出一枚 ghost
- * 「打开方式」下拉——候选应用由宿主查系统列出，末行「其他应用…」交系统选择器。
- * 按钮是中性件（ghost 档），不占行动极。
- */
-export const WithOpenWith: Story = {
-  args: {
-    title: "Q3 渠道复盘（终稿）",
-    meta: "report_q3_channels.docx · 4,180 字 · 08-28 14:32",
-    onOpen: noop,
-    onOpenWith: noop,
-    openWithApps: [
-      { id: "word", label: "Microsoft Word", icon: <Doc />, hint: "默认" },
-      { id: "pages", label: "Pages", icon: <Doc /> },
-      { id: "finder", label: "在访达中显示", icon: <Folder /> },
-    ],
-  },
-}
-
-/** 只给 `onOpenWith` 不给候选列表：按钮直接回调 `null`，由宿主拉起系统「打开方式」选择器。 */
-export const OpenWithSystemChooser: Story = {
-  args: {
-    title: "竞品定价对照表",
-    meta: "pricing_matrix.xlsx · 6 表 · 09-04 10:02",
-    onOpen: noop,
-    onOpenWith: noop,
-  },
-}
-
-/** 生成中＋打开口子：卡本体与「打开方式」一起禁用，等生成结束再放开。 */
-export const GeneratingWithOpenWith: Story = {
-  args: {
-    title: "竞品定价对照表",
-    meta: "生成中 · 已完成 3/5 节 · 01:12",
-    generating: true,
-    onOpen: noop,
-    onOpenWith: noop,
-    openWithApps: [{ id: "numbers", label: "Numbers", icon: <Doc /> }],
-  },
-}
-
-/** 无 meta：仅短迹＋标题 */
-export const TitleOnly: Story = {
-  args: {
-    title: "发布说明草稿",
-  },
-}
-
-/** ExecutionSummary 行共用同一记号：短迹＋完成摘要＋右侧 mono 步数·耗时 */
-export const ExecutionSummaryRow: Story = {
-  args: { title: "" },
-  render: () => (
-    <div
-      style={{
-        display: "flex",
-        alignItems: "center",
-        gap: 9,
-        background: "var(--ow-surface)",
-        border: "1px solid var(--ow-border)",
-        borderRadius: "var(--ow-radius-md)",
-        padding: "0 12px",
-        /* W5 终扫修：行高原 34，不在 §7 控件高度档 {28,32,40}——落 32（密行档）。 */
-        height: 32,
-        fontFamily: "var(--ow-font-body)",
-      }}
-    >
-      <ArtifactTrail />
-      {/* R2 复审修：字号原写裸 12.5 / 10.5（半像素，不在 --ow-fs-* 任何一档），归阶到
-          --ow-fs-caption(12) 与 --ow-fs-mark-sm(10)。 */}
-      <span style={{ fontSize: "var(--ow-fs-caption)", color: "var(--ow-text)" }}>核对 14 份来源，更新 9 处引用</span>
-      <span
-        style={{
-          marginLeft: "auto",
-          fontFamily: "var(--ow-font-mono)",
-          fontVariantNumeric: "tabular-nums",
-          fontSize: "var(--ow-fs-mark-sm)",
-          color: "var(--ow-text-2)",
-        }}
-      >
-        6 步 · 2m40s
-      </span>
-    </div>
-  ),
-}

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

@@ -1,249 +0,0 @@
-import type { CSSProperties, ReactNode } from "react"
-import { cn } from "../../../../lib/utils"
-import { ChevDown } from "../../../composite/Icons"
-import { Button } from "../../../primitives/Button"
-import { MENU_SEPARATOR, Menu } from "../../../primitives/Menu"
-import type { MenuEntry } from "../../../primitives/Menu"
-
-/** 「打开方式」的一枚候选应用（宿主查系统可用程序后列出；icon 走 §7 图标色域，禁彩色）。 */
-export type ArtifactOpenWithApp = {
-  id: string
-  label: string
-  icon?: ReactNode
-  /** 行尾次要文字（如「默认」） */
-  hint?: string
-}
-
-export type ArtifactCardProps = {
-  /** 产物标题，如「Q3 渠道复盘（终稿）」 */
-  title: string
-  /** mono 元信息脚注（tabular-nums），如 "report_q3_channels.docx · 4,180 字 · 08-28 14:32"；generating 时必须含「生成中」文字（R1 双编码） */
-  meta?: string
-  /** 生成中：短迹末颗换 var(--ow-beacon)（状态极·限一处），末颗呼吸、reduced-motion 静止 */
-  generating?: boolean
-  /**
-   * 打开产物（点卡本体）：宿主接预览栏 / 系统默认应用。不给＝卡不可点（纯记号）。
-   * R3（2026-09-04，Terry 意见 4）。生成中禁点。
-   */
-  onOpen?: () => void
-  /**
-   * 「打开方式」候选应用。给了就出下拉（末行恒为「其他应用…」，回调 `null`，由宿主拉
-   * 系统选择器）；不给而只给 `onOpenWith` ＝ 按钮直接回调 `null`。
-   */
-  openWithApps?: ArtifactOpenWithApp[]
-  /** 「打开方式」回调：用本地其他软件打开文件。`app === null` ＝ 交给系统选择器。不给＝不出按钮。 */
-  onOpenWith?: (app: ArtifactOpenWithApp | null) => void
-  /** 按钮文案，缺省「打开方式」 */
-  openWithLabel?: string
-  className?: string
-}
-
-/** 递减短迹 4 颗：尺寸 6/5/4/3px · 透明度 1/.68/.45/.25 */
-const TRAIL_DOTS: Array<{ size: number; opacity: number }> = [
-  { size: 6, opacity: 1 },
-  { size: 5, opacity: 0.68 },
-  { size: 4, opacity: 0.45 },
-  { size: 3, opacity: 0.25 },
-]
-
-/**
- * ArtifactTrail 递减短迹——「Orbitwork 交付物」统一签名（照 ow/components/chat/ArtifactCard 规格卡）。
- * 4 颗由大到小（6/5/4/3px）、透明度递减（1/.68/.45/.25）的圆点，色=var(--ow-text-3)，
- * 浅暗同形，不占荧黄配额，不做常驻动画。
- * generating 时末颗换 var(--ow-beacon)（状态极·限一处，允许呼吸、reduced-motion 静止），
- * 且宿主元信息必须同时含「生成中」文字（R1 双编码）。
- */
-export function ArtifactTrail({
-  generating = false,
-  className = "",
-  style,
-}: {
-  generating?: boolean
-  className?: string
-  style?: CSSProperties
-}) {
-  return (
-    <span className={`ow-artifact-trail ${className}`} style={{ ...trailStyle, ...style }} aria-hidden="true">
-      {TRAIL_DOTS.map((dot, i) => {
-        const gen = generating && i === TRAIL_DOTS.length - 1
-        return (
-          <i
-            key={i}
-            className={gen ? "ow-artifact-trail__dot--gen" : undefined}
-            style={{
-              ...trailDotStyle,
-              width: dot.size,
-              height: dot.size,
-              ...(gen ? { background: "var(--ow-beacon)", opacity: 1 } : { opacity: dot.opacity }),
-            }}
-          />
-        )
-      })}
-    </span>
-  )
-}
-
-const OTHER_APP_KEY = "__ow_open_with_other__"
-
-/**
- * ArtifactCard 交付记号（品牌锁定件，照 ow/components/chat/ArtifactCard 规格卡逐像素）。
- * 产物卡=var(--ow-surface)＋1px var(--ow-border)＋radius 12；顶部递减短迹＋
- * 标题（13.5px/600 text）＋mono 元信息脚注（10px text-2 · tabular-nums）。
- * generating 变体：短迹末颗=var(--ow-beacon)（状态极·限一处，同屏至多一张），
- * meta 必须同时含「生成中」文字（R1 双编码）；生成结束回落为 text-3 短迹。
- * 禁：图标彩色、品牌黄装饰、短迹常驻动画。
- *
- * R3（2026-09-04，Terry 意见 4）加两个口子，记号本体（短迹/标题/脚注的几何与配色）不动：
- * - `onOpen`：卡本体成按钮（预览栏 / 默认应用由宿主接），hover 边转 `--ow-border-strong`；
- * - `onOpenWith`（＋可选 `openWithApps`）：卡右侧一枚 ghost「打开方式」——有候选列表就出
- *   `primitives/Menu` 下拉（末行「其他应用…」交系统选择器），没有就直接回调。
- *   按钮是 §4 R3 中性件（ghost 档，不占行动极）；生成中两处一起禁用。
- */
-export function ArtifactCard({
-  title,
-  meta,
-  generating = false,
-  onOpen,
-  openWithApps,
-  onOpenWith,
-  openWithLabel = "打开方式",
-  className = "",
-}: ArtifactCardProps) {
-  const body = (
-    <>
-      <div style={trailRowStyle}>
-        <ArtifactTrail generating={generating} />
-      </div>
-      <div data-ow-part="title" style={titleStyle}>
-        {title}
-      </div>
-      {meta && (
-        <div data-ow-part="meta" style={metaStyle}>
-          {meta}
-        </div>
-      )}
-    </>
-  )
-
-  const openWithButton = (
-    <Button
-      variant="ghost"
-      size="sm"
-      type="button"
-      data-ow-part="open-with"
-      className={cn("shrink-0 whitespace-nowrap", openWithApps?.length && "flex-row-reverse")}
-      disabled={generating}
-      icon={openWithApps?.length ? <ChevDown /> : undefined}
-      onClick={openWithApps?.length ? undefined : () => onOpenWith?.(null)}
-    >
-      {openWithLabel}
-    </Button>
-  )
-
-  const openWithItems: MenuEntry[] | null = openWithApps?.length
-    ? [
-        ...openWithApps.map((app) => ({ key: app.id, label: app.label, icon: app.icon, hint: app.hint })),
-        MENU_SEPARATOR,
-        { key: OTHER_APP_KEY, label: "其他应用…" },
-      ]
-    : null
-
-  return (
-    <div
-      data-slot="artifact-card"
-      data-ow-state={cn(generating && "generating", onOpen && "interactive") || undefined}
-      className={`ow-artifact-card ${className}`}
-      style={cardStyle}
-    >
-      {onOpen ? (
-        <button
-          type="button"
-          data-ow-part="open"
-          className="ow-focus-ring"
-          style={openButtonStyle}
-          disabled={generating}
-          aria-label={`打开 ${title}`}
-          onClick={onOpen}
-        >
-          {body}
-        </button>
-      ) : (
-        <div data-ow-part="body" style={bodyStyle}>
-          {body}
-        </div>
-      )}
-      {onOpenWith &&
-        (openWithItems ? (
-          <Menu
-            trigger={openWithButton}
-            items={openWithItems}
-            ariaLabel="打开方式"
-            onSelect={(key) => {
-              if (key === OTHER_APP_KEY) return onOpenWith(null)
-              const app = openWithApps?.find((item) => item.id === key)
-              if (app) onOpenWith(app)
-            }}
-          />
-        ) : (
-          openWithButton
-        ))}
-    </div>
-  )
-}
-
-const cardStyle: CSSProperties = {
-  display: "flex",
-  alignItems: "center",
-  gap: 12,
-  background: "var(--ow-surface)",
-  border: "1px solid var(--ow-border)",
-  borderRadius: "var(--ow-radius-lg)",
-  padding: "12px 14px 11px",
-  fontFamily: "var(--ow-font-body)",
-  transition: "border-color var(--ow-dur-1) var(--ow-ease-beacon)",
-}
-
-const bodyStyle: CSSProperties = { flex: "1 1 auto", minWidth: 0 }
-
-/* 卡本体成按钮：清掉 UA 的边/底/内距，字与色继承卡；hover 反馈由卡边（CSS :has）出，不另涂底。 */
-const openButtonStyle: CSSProperties = {
-  ...bodyStyle,
-  display: "block",
-  textAlign: "left",
-  appearance: "none",
-  border: 0,
-  padding: 0,
-  margin: 0,
-  background: "transparent",
-  color: "inherit",
-  font: "inherit",
-  cursor: "pointer",
-  borderRadius: "var(--ow-radius-xs)",
-}
-
-const trailRowStyle: CSSProperties = {
-  display: "flex",
-  alignItems: "center",
-  justifyContent: "space-between",
-  marginBottom: 8,
-}
-
-/* 短迹点间距 3px（原型模板 template.dc.html:1222-1227 的执行摘要头行与 1354-1359 的产物卡
-   逐值同源；A9 对齐前这里是 5px，两处宿主一并收到 3）。 */
-const trailStyle: CSSProperties = { display: "flex", alignItems: "center", gap: 3, height: 8, flex: "none" }
-const trailDotStyle: CSSProperties = { display: "block", borderRadius: "50%", background: "var(--ow-text-3)" }
-
-const titleStyle: CSSProperties = {
-  fontSize: 13.5,
-  fontWeight: 600,
-  color: "var(--ow-text)",
-  lineHeight: 1.4,
-}
-
-const metaStyle: CSSProperties = {
-  fontFamily: "var(--ow-font-mono)",
-  fontVariantNumeric: "tabular-nums",
-  fontSize: 10,
-  color: "var(--ow-text-2)",
-  marginTop: 5,
-}

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

@@ -1,235 +0,0 @@
-import type { Meta, StoryObj } from "@storybook/react"
-import { Attachment, AttachmentList, type AttachmentMenuOption } from "./index"
-
-const meta = {
-  title: "Domain/Chat/Attachment",
-  component: Attachment,
-  parameters: { layout: "padded" },
-  tags: ["autodocs"],
-} satisfies Meta<typeof Attachment>
-
-export default meta
-type Story = StoryObj<typeof meta>
-
-const Frame = ({ children, width = 520 }: { children: React.ReactNode; width?: number }) => (
-  <div style={{ width, maxWidth: "100%", display: "flex", flexDirection: "column", gap: 12 }}>{children}</div>
-)
-
-const Row = ({ label, children }: { label: string; children: React.ReactNode }) => (
-  <div style={{ display: "flex", flexDirection: "column", gap: 6 }}>
-    <span
-      style={{
-        font: "500 var(--ow-fs-eyebrow, 11px)/1 var(--ow-font-sans)",
-        letterSpacing: "var(--ow-ls-eyebrow, 0.08em)",
-        color: "var(--ow-eyebrow, var(--ow-text-3))",
-      }}
-    >
-      {label}
-    </span>
-    {children}
-  </div>
-)
-
-const OPEN_WITH: AttachmentMenuOption[] = [
-  { id: "header", kind: "header", name: "推荐应用" },
-  { id: "preview", kind: "app", name: "预览", iconName: "Doc" },
-  { id: "vscode", kind: "app", name: "Visual Studio Code", iconName: "Terminal" },
-  { id: "div", kind: "divider" },
-  { id: "reveal", kind: "action", name: "在访达中显示", iconName: "Folder" },
-]
-
-/* ── 形态矩阵 ── */
-
-export const Card: Story = {
-  name: "卡形态",
-  render: () => (
-    <Frame>
-      <Row label="只读">
-        <Attachment variant="card" name="季度复盘.md" path="/Users/orbit/docs/季度复盘.md" />
-      </Row>
-      <Row label="可点开 ＋ 打开方式菜单">
-        <Attachment
-          variant="card"
-          name="2026-Q3-预算.xlsx"
-          path="/Users/orbit/docs/2026-Q3-预算.xlsx"
-          meta="XLSX · 754 KB"
-          onOpen={() => {}}
-          actions={OPEN_WITH}
-          onAction={() => {}}
-        />
-      </Row>
-      <Row label="带移除">
-        <Attachment
-          variant="card"
-          name="接口契约.json"
-          path="/Users/orbit/api/接口契约.json"
-          meta="JSON · 18 KB"
-          onOpen={() => {}}
-          onRemove={() => {}}
-        />
-      </Row>
-    </Frame>
-  ),
-}
-
-export const Tile: Story = {
-  name: "方片形态（Composer 附件条）",
-  render: () => (
-    <Frame>
-      <AttachmentList layout="strip" aria-label="待发送附件">
-        <Attachment variant="tile" name="需求说明.docx" meta="DOCX · 231 KB" onRemove={() => {}} />
-        <Attachment variant="tile" name="日志片段-2026-08-31.txt" meta="TXT · 12 KB" onRemove={() => {}} />
-        <Attachment variant="tile" name="架构图.pdf" meta="PDF · 2.4 MB" onRemove={() => {}} />
-      </AttachmentList>
-    </Frame>
-  ),
-}
-
-export const Image: Story = {
-  name: "图片形态（缩略 ＋ 遮罩操作）",
-  render: () => (
-    <Frame>
-      <AttachmentList layout="strip" aria-label="待发送图片">
-        <Attachment
-          variant="image"
-          name="首页改版.png"
-          thumbnail="data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='112' height='112'%3E%3Crect width='112' height='112' fill='%23C9C6BC'/%3E%3C/svg%3E"
-          onOpen={() => {}}
-          onRemove={() => {}}
-        />
-        <Attachment variant="image" name="没取到缩略图.png" placeholder="cover.png · 1600×900" onRemove={() => {}} />
-      </AttachmentList>
-    </Frame>
-  ),
-}
-
-export const Media: Story = {
-  name: "富媒体图卡",
-  render: () => (
-    <Frame width={420}>
-      <Attachment
-        variant="media"
-        name="现场照片.jpg"
-        placeholder="现场照片.jpg · 1600×900"
-        caption="发布会现场，第二排右起第三位是我们的工程师。"
-      />
-    </Frame>
-  ),
-}
-
-/* ── 状态矩阵（§6） ── */
-
-export const Uploading: Story = {
-  name: "上传中",
-  render: () => (
-    <Frame>
-      <Row label="卡形态">
-        <Attachment variant="card" name="录屏-完整版.mp4" meta="MP4 · 184 MB" status="uploading" progress={42} />
-      </Row>
-      <Row label="方片 ＋ 图片">
-        <AttachmentList layout="strip">
-          <Attachment variant="tile" name="录屏-完整版.mp4" status="uploading" progress={42} onRemove={() => {}} />
-          <Attachment
-            variant="image"
-            name="首页改版.png"
-            thumbnail="data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='112' height='112'%3E%3Crect width='112' height='112' fill='%23C9C6BC'/%3E%3C/svg%3E"
-            status="uploading"
-            progress={68}
-            onRemove={() => {}}
-          />
-        </AttachmentList>
-      </Row>
-    </Frame>
-  ),
-}
-
-export const Failed: Story = {
-  name: "失败（error tint ＋ 重试）",
-  render: () => (
-    <Frame>
-      <Row label="卡形态">
-        <Attachment
-          variant="card"
-          name="录屏-完整版.mp4"
-          meta="MP4 · 184 MB"
-          status="error"
-          errorText="网络断了，没传上去"
-          onRetry={() => {}}
-          onRemove={() => {}}
-        />
-      </Row>
-      <Row label="方片 ＋ 图片">
-        <AttachmentList layout="strip">
-          <Attachment variant="tile" name="录屏-完整版.mp4" status="error" onRetry={() => {}} onRemove={() => {}} />
-          <Attachment
-            variant="image"
-            name="首页改版.png"
-            thumbnail="data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='112' height='112'%3E%3Crect width='112' height='112' fill='%23C9C6BC'/%3E%3C/svg%3E"
-            status="error"
-            onRetry={() => {}}
-            onRemove={() => {}}
-          />
-        </AttachmentList>
-      </Row>
-    </Frame>
-  ),
-}
-
-export const Disabled: Story = {
-  name: "禁用（逐 token）",
-  render: () => (
-    <Frame>
-      <Attachment variant="card" name="只读附件.pdf" meta="PDF · 1.2 MB" disabled onOpen={() => {}} />
-      <AttachmentList layout="strip">
-        <Attachment variant="tile" name="只读附件.pdf" meta="PDF · 1.2 MB" disabled onRemove={() => {}} />
-      </AttachmentList>
-    </Frame>
-  ),
-}
-
-/* ── 容器 ── */
-
-export const ListStack: Story = {
-  name: "行集 · 竖列",
-  render: () => (
-    <Frame>
-      <AttachmentList layout="stack" aria-label="本地文件引用">
-        <Attachment variant="card" name="季度复盘.md" path="/docs/季度复盘.md" onOpen={() => {}} />
-        <Attachment variant="card" name="接口契约.json" path="/api/接口契约.json" onOpen={() => {}} />
-        <Attachment variant="card" name="架构图.pdf" path="/docs/架构图.pdf" onOpen={() => {}} />
-      </AttachmentList>
-    </Frame>
-  ),
-}
-
-export const ListEmpty: Story = {
-  name: "行集 · 空态",
-  render: () => (
-    <Frame>
-      <AttachmentList layout="stack" empty="这轮对话还没有附件" />
-    </Frame>
-  ),
-}
-
-/* ── 打开方式菜单（Menu 配方） ── */
-
-export const AsyncOpenWith: Story = {
-  name: "打开方式 · 异步加载",
-  render: () => (
-    <Frame>
-      <p style={{ margin: 0, font: "400 var(--ow-fs-ui, 13px)/1.5 var(--ow-font-sans)", color: "var(--ow-text-2)" }}>
-        点开菜单会去拉可用应用；闲时已经预取过一次，所以通常一点就有。弹层的立面、翻转、外点关闭、键盘导航都由 Menu
-        原语承担。
-      </p>
-      <Attachment
-        variant="card"
-        name="设计稿.sketch"
-        path="/Users/orbit/design/设计稿.sketch"
-        meta="SKETCH · 12 MB"
-        onOpen={() => {}}
-        onRequestActions={() => new Promise((resolve) => setTimeout(() => resolve(OPEN_WITH), 600))}
-        onAction={() => {}}
-      />
-    </Frame>
-  ),
-}