one-design-next 0.0.4-alpha.99 → 0.0.5

package/README.md

@@ -1,134 +1,204 @@
-# one-design-next
+<div align="center">
 
-One Design Next from TAD
+# One Design Next
 
-目标：
+基于 **TAD One Design & WXAD AD UI** 设计语言的 React 组件库
 
-1. 对 One Design 设计语言来说，提供高质量高保真的再实现；
-2. 对其他 AMS 业务来说，提供高质量高自由度的基础库。
+通用业务控件 / 平台布局 / GenUI 对话组件 / AI Skill 工程化流水线
 
-## 组件选型
+[![npm](https://img.shields.io/badge/npm-one--design--next-blue)](http://mirrors.tencent.com/npm/package/one-design-next)
+[![React](https://img.shields.io/badge/React-16.14%20%7C%2017%20%7C%2018%20%7C%2019-61dafb)](https://react.dev)
+[![License](https://img.shields.io/badge/License-MIT-green.svg)](./LICENSE)
 
-## 自定义组件：ConfigProvider 及 CSS Variables
+</div>
 
-自定义组件的能力通过 ConfigProvider 及 CSS Variables 实现。
+---
 
-CSS Variables 当然也可以由 ConfigProvider 替代，但 CSS Variables 更方便，而且可以绕过 Message 组件不在 context 的问题，同时也方便未来的 Figma 资产生成。
+## 概览
 
-CSS Variables 分为 base.css 中的基础变量，及组件级别的组件变量。后者引用前者。如需大范围的样式用前者，更细粒度的样式用后者。
+One Design Next 是腾讯 TAD / WXAD 团队维护的 React 组件库，提供 **60+** 组件，涵盖：
 
-ConfigProvider 则负责更复杂的自定义，如 Icon 的自定义添加，以及增加组件行为，比如 Button 的点击行为定义。
+- **基础 UI** — 按钮、表单、表格、对话框、导航等通用控件
+- **平台布局** — 如翼（RuyiLayout）、MP（MpLayout）等业务平台专用布局
+- **GenUI** — AI 对话场景组件（Composer、StreamText、ChatItem、AgentStep 等）
+- **AI Skill 系统** — 配套 Cursor Skill 流水线，支撑需求分析到页面落地的全流程
 
-## react-day-picker-for-od
+配有 **Dumi 文档站**，支持组件预览、区块示例与设计 Token 文档。
 
-**20260106 由于 dmp 已升级 node，因此废除，直接使用 react-day-picker@9 即可。**
+## 快速开始
 
----
+### 安装
 
-https://github.com/aragakey/react-day-picker
+```bash
+# 腾讯内部 npm 源
+npm install one-design-next --registry http://mirrors.tencent.com/npm/
 
-fork 自 react-day-picker@9，保持 @9 的版本更新。
+# 或使用 pnpm
+pnpm add one-design-next --registry http://mirrors.tencent.com/npm/
+```
 
-fork 只修改了对 node>18 的依赖，以兼容有一些业务必须使用 16 或更低的 node 版本。
+### 使用
 
-## 2025-05-20 TODO
+```tsx
+// 1. 引入全局基础样式（入口文件中引入一次即可）
+import 'one-design-next/dist/styles/base.css';
 
-- [] https://ant.design/components/config-provider-cn#config-provider-demo-wave
+// 2. 按需导入组件
+import { Button, Table, Dialog, Composer } from 'one-design-next';
+```
 
----
+> 构建产物位于 `dist/` 目录（由 [father](https://github.com/umijs/father) 生成）。除 `base.css` 外，可按需引入更细粒度样式，详见文档站说明。
 
-## 发布流程 SOP（给 AI 助手读取用）
+## 组件一览
 
-> 每次发布 alpha 版本，直接按以下步骤执行，无需人工确认每一步。
+完整导出清单以 [`components/index.ts`](components/index.ts) 为准，分类说明与 Props 索引见 [component-list.md](.cursor/skills/p2-one-design/references/component-list.md)。
 
-### 环境准备（首次或环境重置后）
+| 分类 | 组件 |
+|:-----|:-----|
+| **通用** | `Button` `Icon` `Link` `Avatar` `HoverFill` `ConfigProvider` |
+| **布局** | `Card` `Collapse` `ScrollArea` `RuyiLayout` `MpLayout` |
+| **导航** | `Tabs` `Dropdown` `Pagination` `Cascader` `TreeSelect` |
+| **数据录入** | `Form` `Input` `InputNumber` `InputOtp` `Select` `AutoComplete` `Checkbox` `Radio` `Switch` `Slider` `ColorPicker` `DatePicker` `DateRangePicker` `TimePicker` `Calendar` |
+| **数据展示** | `Table` `Chart` `VirtualList` `NumberFlow` `EllipsisText` `TextSwap` `Empty` |
+| **反馈** | `Dialog` `Drawer` `Message` `Alert` `Tooltip` `Popover` `Loading` |
+| **GenUI** | `Composer` `StreamText` `ChatItem` `AgentStep` `AgentThink` `CodeBlock` `PreviewPanel` `ActionBar` `Attachments` `Sources` `Suggestions` `SkillSlot` `UserBubble` `Welcome` `ErrorBlock` `Fab` |
+| **底层** | `ModalBase` 系列 `PopBase` 系列 `Collapsible` 日期 / 时间工具函数 |
 
-```bash
-# 设置 npm registry
-npm config set registry http://mirrors.tencent.com/npm/
-pnpm config set registry http://mirrors.tencent.com/npm/
+> GenUI 共享类型（`ToolCall`、`ChatMessage`、`Conversation` 等）通过 `_genui-types` 统一导出。
 
-# 配置 npm auth token（每次 token 失效时更新）
-# 格式写入 ~/.npmrc：
-# //mirrors.tencent.com/npm/:_authToken="<base64-token>"
-```
+## 主题定制
 
-### Step 1：更新 one-design-next 版本号并发布
+One Design Next 提供两种主题定制方式：
 
-```bash
-# 1. 进入仓库，切到 master，拉最新
-cd /root/.openclaw/workspace/one-design-next
-git checkout master && git pull origin master
+| 方式 | 适用场景 | 说明 |
+|:-----|:---------|:-----|
+| **CSS Variables** | 全局主题、脱离 React 树的场景（如 `Message`） | `base.css` 提供基础 token，组件级变量可覆盖 |
+| **ConfigProvider** | 需要 React 上下文的定制（图标解析、按钮行为等） | 通过 Provider 注入配置 |
 
-# 2. 读取当前版本，计算下一个 alpha 版本
-# 当前版本格式：0.0.4-alpha.N → 下一个：0.0.4-alpha.(N+1)
-# 用工蜂 MCP 直接修改 package.json 并 commit 到 master（见下方 AI 操作说明）
+## 本地开发
 
-# 3. 拉取最新（含刚提交的版本号变更）
-git pull origin master
+> 推荐使用 **pnpm**，与仓库脚本一致。
 
-# 4. 安装依赖（注意：npm install 在 node v22 有 bug，必须用 pnpm）
+```bash
+# 安装依赖
 pnpm install
 
-# 5. 构建（prepublishOnly 会自动 build，但提前 build 可提前发现错误）
+# 启动开发（构建 variables / benchmark / feedback 数据后启动 Dumi 文档站）
+pnpm run dev
+
+# 组件库构建（father 构建 + 样式管线）
 pnpm run build
 
-# 6. 发布
-npm publish --registry http://mirrors.tencent.com/npm/
+# 文档站静态构建
+pnpm run docs:build
 ```
 
-> ⚠️ **已知问题：npm install 在 node v22 报错**
-> 错误：`Cannot read properties of null (reading 'matches')`
-> 原因：npm v10 arborist 的 bug
-> **解决：始终用 `pnpm install`，不要用 `npm install`**
+### 常用脚本
 
-### Step 2：更新 tad-universal-components
+| 命令 | 说明 |
+|:-----|:-----|
+| `pnpm run dev` | 启动本地开发文档站 |
+| `pnpm run build` | 构建组件库（father + 样式） |
+| `pnpm run docs:build` | 静态构建文档站（含 LLM 知识生成） |
+| `pnpm run create-component` | 创建新组件脚手架 |
+| `pnpm run create-skill` | 创建新 AI Skill |
+| `pnpm run benchmark` | 运行性能基准测试 |
+| `pnpm run benchmark:compare` | 对比性能基准 |
+| `pnpm run lint` | ESLint + Stylelint 代码检查 |
+| `pnpm run release` | 版本发布 |
 
-```bash
-# 1. 进入仓库（如不存在则 clone）
-cd /root/.openclaw/workspace/tad-universal-components
-# 或：git clone https://git.woa.com/tad-ag/tad-universal-components.git
+## 仓库结构
 
-# 2. 切到 odn-update 分支，合入最新 main
-git checkout odn-update
-git fetch origin
-git merge origin/main --no-edit
+```
+one-design-next/
+├── components/            # 组件源码与样式（60+ 组件）
+│   ├── button/
+│   ├── composer/
+│   ├── stream-text/
+│   ├── _genui-types.ts    # GenUI 共享类型
+│   ├── _util/             # 内部工具函数（日期、时间等）
+│   └── index.ts           # 统一导出入口
+├── docs-pages/            # 文档与示例
+│   ├── doc/               # 设计 Token 等文档页
+│   ├── block/             # 区块级 demo（与 block-catalog 知识对应）
+│   ├── workshop/          # 页面级 / 评测向用例
+│   ├── draft/             # 草稿区（对话场景 demo / 团队内部 vibe coding）
+│   ├── dev-diary/         # 设计系统演进笔记
+│   └── feedback/          # 反馈文档入口
+├── .cursor/skills/        # AI Skill 知识包与流程（SKILL.md 为总入口）
+├── .dumi/                 # Dumi 配置与构建数据
+├── scripts/               # 构建、benchmark、反馈等工具脚本
+├── skills/                # 对外摘要型 Skill 文档
+├── dist/                  # 构建产物
+└── public/                # 静态资源
+```
 
-# 3. 更新 packages/lib-od/package.json 中的版本号
-# 将 "one-design-next": "^0.0.4-alpha.N" 改为新版本
+## AI Skill 系统
 
-# 4. pnpm install 更新 lock 文件
-pnpm install
+项目配套完整的 AI Skill 流水线，总入口为 [`.cursor/skills/SKILL.md`](.cursor/skills/SKILL.md)。
 
-# 5. 提交（注意 commitlint scope 规则）
-git add packages/lib-od/package.json pnpm-lock.yaml
-git commit -m "chore(od): update one-design-next to <新版本号>"
-git push origin odn-update
+### 工作流
+
+```
+需求分析 → 设计规格 → 区块 / 页面实现 → 质量审查 → 精修发布 → 反馈采集
 ```
 
-> ⚠️ **已知问题：commitlint scope 校验**
-> 错误：`scope may not be empty` 或 `无效 scope`
-> **允许的 scope 值**：`common`, `od`, `adui`, `antdm`, `td-vue`, `ots`, `base`, `biz-mx`, `biz-mb`, `biz-ms`, `biz-mw`, `*`, `release`
-> **正确写法**：`chore(od): update one-design-next to 0.0.4-alpha.83`
+### 阶段说明
 
-### Step 3：创建 MR
+| 阶段 | Skill | 职责 |
+|:-----|:------|:-----|
+| **P1** 需求 | `p1-design-analyst` · `p1-design-spec` | 需求结构化分析、组件级设计说明 |
+| **P2** 知识 | `p2-one-design` · `p2-block-catalog` · `p2-business-knowledge` | 组件库知识、区块目录、业务页面知识 |
+| **P3** 质量 | `p3-audit` · `p3-polish` | 代码质量审查、发布前精修 |
+| **P4** 转化 | `p4-figma-to-block` · `p4-component-update-process` | 设计稿转区块、组件更新流程 |
+| **P5** 落地 | `p5-figma-to-page` · `p5-feedback` | 整页拼装、上下文与反馈采集 |
+| **辅助** | `ten-questions` · `philosophy-talks` | 方法论讨论与设计哲学 |
 
-通过工蜂 MCP 创建：
+> **外部只读模式**：外部平台（如 Workbuddy）仅消费知识生成代码与建议，不修改本仓库的组件、区块与知识文件。
 
+## 发布
+
+### 环境准备
+
+```bash
+npm config set registry http://mirrors.tencent.com/npm/
+pnpm config set registry http://mirrors.tencent.com/npm/
+# 在 ~/.npmrc 配置 mirrors 的 _authToken（发布权限）
 ```
-project_id: tad-ag/tad-universal-components
-source_branch: odn-update
-target_branch: main
-title: chore(od): update one-design-next to <新版本号>
+
+### 发布流程
+
+```bash
+git checkout master && git pull origin master
+
+# 更新 package.json 版本号后：
+pnpm install
+pnpm run build
+npm publish --registry http://mirrors.tencent.com/npm/
 ```
 
-MR 链接格式：`https://git.woa.com/tad-ag/tad-universal-components/-/merge_requests/<iid>`
+提交信息遵循 [Conventional Commits](https://www.conventionalcommits.org/) 规范（通过 `commitlint` + `husky` 钩子校验）。
+
+### 同步到 tad-universal-components
+
+```bash
+cd tad-universal-components
+git checkout odn-update && git merge origin/main --no-edit
+
+# 更新 packages/lib-od/package.json 中的 one-design-next 版本
+pnpm install
+git add packages/lib-od/package.json pnpm-lock.yaml
+git commit -m "chore(od): update one-design-next to <版本号>"
+git push origin odn-update
+# 在工蜂创建 MR：odn-update → main
+```
+
+## 相关链接
+
+- **源码仓库** — https://git.woa.com/wxad-design/one-design-next
+- **tad-universal-components** — https://git.woa.com/tad-ag/tad-universal-components
+- **npm 包** — `one-design-next` @ [mirrors.tencent.com/npm](http://mirrors.tencent.com/npm/)
 
-### 完整版本信息
+## 协议
 
-| 仓库                     | 地址                                                |
-| ------------------------ | --------------------------------------------------- |
-| one-design-next          | https://git.woa.com/wxad-design/one-design-next     |
-| tad-universal-components | https://git.woa.com/tad-ag/tad-universal-components |
-| npm registry             | http://mirrors.tencent.com/npm/                     |
-| npm 包名                 | one-design-next                                     |
+[MIT License](./LICENSE) &copy; TAD / WXAD Design

package/dist/_genui-types.d.ts

@@ -0,0 +1,106 @@
+export interface PropDef {
+    name: string;
+    type: string;
+    default?: string;
+    description: string;
+}
+export type ToolStatus = 'pending' | 'running' | 'success' | 'error' | 'cancelled';
+export interface ToolCall {
+    id: string;
+    name: string;
+    description?: string;
+    params?: Record<string, unknown>;
+    result?: string;
+    error?: string;
+    status: ToolStatus;
+}
+export interface Source {
+    title: string;
+    url: string;
+    description?: string;
+    favicon?: string;
+}
+export interface Attachment {
+    name: string;
+    type: string;
+    url?: string;
+    size?: number;
+    /** 特殊变体：'report' 渲染为 AI 生成报告的大卡片（含创建时间 + 右侧预览缩略图）；未传走普通文件卡片/chip。 */
+    variant?: 'report';
+    /** variant='report' 时展示在标题下的创建时间，例如 "03-09 15:46"。 */
+    createdAt?: string;
+    /** variant='report' 时右侧预览缩略图地址。未传时渲染为浅色占位层。 */
+    thumbnailUrl?: string;
+}
+export type PreviewTarget = {
+    kind: 'file';
+    attachment: Attachment;
+} | {
+    kind: 'url';
+    url: string;
+    title?: string;
+};
+export interface PreviewTab {
+    id: string;
+    name: string;
+    content: string;
+    type: string;
+}
+export interface SkillItem {
+    id: string;
+    label: string;
+    icon: string;
+    description?: string;
+}
+export interface SendMeta {
+    attachments?: Attachment[];
+    webSearch?: boolean;
+    skill?: string;
+}
+export type AgentEvent = {
+    kind: 'thinking';
+    content: string;
+    duration?: number;
+} | {
+    kind: 'tool';
+    tool: ToolCall;
+};
+export interface Conversation {
+    id: string;
+    title: string;
+    preview?: string;
+    timestamp?: number;
+    status?: 'generating' | 'unread';
+}
+export interface MessageSnapshot {
+    content: string;
+    thinking?: string;
+    toolCalls?: ToolCall[];
+    steps?: AgentEvent[];
+    sources?: Source[];
+    error?: {
+        message: string;
+        retryable?: boolean;
+    };
+}
+export interface ChatMessage {
+    id: string;
+    role: 'user' | 'assistant' | 'system';
+    content: string;
+    timestamp: number;
+    isStreaming?: boolean;
+    toolCalls?: ToolCall[];
+    steps?: AgentEvent[];
+    attachments?: Attachment[];
+    thinking?: string;
+    sources?: Source[];
+    error?: {
+        message: string;
+        retryable?: boolean;
+    };
+    regenerations?: MessageSnapshot[];
+    /**
+     * 助手消息可选的快捷回复（如意图澄清）。由上层在正文下渲染为可点选项，点击语义等同用户发送该句。
+     */
+    suggestionChips?: string[];
+}

package/dist/_genui-types.js

@@ -0,0 +1 @@
+export {};

package/dist/action-bar/index.d.ts

@@ -0,0 +1,17 @@
+/// <reference types="react" />
+import './style';
+export interface ActionBarProps {
+    content: string;
+    onRegenerate?: () => void;
+    /** 当前反馈状态（受控），传入后按钮回显为已点赞/已点踩 */
+    feedback?: 'positive' | 'negative' | null;
+    onFeedback?: (type: 'positive' | 'negative' | null) => void;
+    versionCount?: number;
+    currentVersion?: number;
+    onVersionChange?: (index: number) => void;
+}
+export declare function ActionBar({ content, onRegenerate, feedback: feedbackProp, onFeedback, versionCount, currentVersion, onVersionChange, }: ActionBarProps): import("react").JSX.Element;
+export declare namespace ActionBar {
+    var displayName: string;
+}
+export default ActionBar;

package/dist/action-bar/index.js

@@ -0,0 +1,164 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function _regeneratorRuntime() { "use strict"; /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */ _regeneratorRuntime = function _regeneratorRuntime() { return e; }; var t, e = {}, r = Object.prototype, n = r.hasOwnProperty, o = Object.defineProperty || function (t, e, r) { t[e] = r.value; }, i = "function" == typeof Symbol ? Symbol : {}, a = i.iterator || "@@iterator", c = i.asyncIterator || "@@asyncIterator", u = i.toStringTag || "@@toStringTag"; function define(t, e, r) { return Object.defineProperty(t, e, { value: r, enumerable: !0, configurable: !0, writable: !0 }), t[e]; } try { define({}, ""); } catch (t) { define = function define(t, e, r) { return t[e] = r; }; } function wrap(t, e, r, n) { var i = e && e.prototype instanceof Generator ? e : Generator, a = Object.create(i.prototype), c = new Context(n || []); return o(a, "_invoke", { value: makeInvokeMethod(t, r, c) }), a; } function tryCatch(t, e, r) { try { return { type: "normal", arg: t.call(e, r) }; } catch (t) { return { type: "throw", arg: t }; } } e.wrap = wrap; var h = "suspendedStart", l = "suspendedYield", f = "executing", s = "completed", y = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} var p = {}; define(p, a, function () { return this; }); var d = Object.getPrototypeOf, v = d && d(d(values([]))); v && v !== r && n.call(v, a) && (p = v); var g = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(p); function defineIteratorMethods(t) { ["next", "throw", "return"].forEach(function (e) { define(t, e, function (t) { return this._invoke(e, t); }); }); } function AsyncIterator(t, e) { function invoke(r, o, i, a) { var c = tryCatch(t[r], t, o); if ("throw" !== c.type) { var u = c.arg, h = u.value; return h && "object" == _typeof(h) && n.call(h, "__await") ? e.resolve(h.__await).then(function (t) { invoke("next", t, i, a); }, function (t) { invoke("throw", t, i, a); }) : e.resolve(h).then(function (t) { u.value = t, i(u); }, function (t) { return invoke("throw", t, i, a); }); } a(c.arg); } var r; o(this, "_invoke", { value: function value(t, n) { function callInvokeWithMethodAndArg() { return new e(function (e, r) { invoke(t, n, e, r); }); } return r = r ? r.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg(); } }); } function makeInvokeMethod(e, r, n) { var o = h; return function (i, a) { if (o === f) throw new Error("Generator is already running"); if (o === s) { if ("throw" === i) throw a; return { value: t, done: !0 }; } for (n.method = i, n.arg = a;;) { var c = n.delegate; if (c) { var u = maybeInvokeDelegate(c, n); if (u) { if (u === y) continue; return u; } } if ("next" === n.method) n.sent = n._sent = n.arg;else if ("throw" === n.method) { if (o === h) throw o = s, n.arg; n.dispatchException(n.arg); } else "return" === n.method && n.abrupt("return", n.arg); o = f; var p = tryCatch(e, r, n); if ("normal" === p.type) { if (o = n.done ? s : l, p.arg === y) continue; return { value: p.arg, done: n.done }; } "throw" === p.type && (o = s, n.method = "throw", n.arg = p.arg); } }; } function maybeInvokeDelegate(e, r) { var n = r.method, o = e.iterator[n]; if (o === t) return r.delegate = null, "throw" === n && e.iterator.return && (r.method = "return", r.arg = t, maybeInvokeDelegate(e, r), "throw" === r.method) || "return" !== n && (r.method = "throw", r.arg = new TypeError("The iterator does not provide a '" + n + "' method")), y; var i = tryCatch(o, e.iterator, r.arg); if ("throw" === i.type) return r.method = "throw", r.arg = i.arg, r.delegate = null, y; var a = i.arg; return a ? a.done ? (r[e.resultName] = a.value, r.next = e.nextLoc, "return" !== r.method && (r.method = "next", r.arg = t), r.delegate = null, y) : a : (r.method = "throw", r.arg = new TypeError("iterator result is not an object"), r.delegate = null, y); } function pushTryEntry(t) { var e = { tryLoc: t[0] }; 1 in t && (e.catchLoc = t[1]), 2 in t && (e.finallyLoc = t[2], e.afterLoc = t[3]), this.tryEntries.push(e); } function resetTryEntry(t) { var e = t.completion || {}; e.type = "normal", delete e.arg, t.completion = e; } function Context(t) { this.tryEntries = [{ tryLoc: "root" }], t.forEach(pushTryEntry, this), this.reset(!0); } function values(e) { if (e || "" === e) { var r = e[a]; if (r) return r.call(e); if ("function" == typeof e.next) return e; if (!isNaN(e.length)) { var o = -1, i = function next() { for (; ++o < e.length;) if (n.call(e, o)) return next.value = e[o], next.done = !1, next; return next.value = t, next.done = !0, next; }; return i.next = i; } } throw new TypeError(_typeof(e) + " is not iterable"); } return GeneratorFunction.prototype = GeneratorFunctionPrototype, o(g, "constructor", { value: GeneratorFunctionPrototype, configurable: !0 }), o(GeneratorFunctionPrototype, "constructor", { value: GeneratorFunction, configurable: !0 }), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, u, "GeneratorFunction"), e.isGeneratorFunction = function (t) { var e = "function" == typeof t && t.constructor; return !!e && (e === GeneratorFunction || "GeneratorFunction" === (e.displayName || e.name)); }, e.mark = function (t) { return Object.setPrototypeOf ? Object.setPrototypeOf(t, GeneratorFunctionPrototype) : (t.__proto__ = GeneratorFunctionPrototype, define(t, u, "GeneratorFunction")), t.prototype = Object.create(g), t; }, e.awrap = function (t) { return { __await: t }; }, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, c, function () { return this; }), e.AsyncIterator = AsyncIterator, e.async = function (t, r, n, o, i) { void 0 === i && (i = Promise); var a = new AsyncIterator(wrap(t, r, n, o), i); return e.isGeneratorFunction(r) ? a : a.next().then(function (t) { return t.done ? t.value : a.next(); }); }, defineIteratorMethods(g), define(g, u, "Generator"), define(g, a, function () { return this; }), define(g, "toString", function () { return "[object Generator]"; }), e.keys = function (t) { var e = Object(t), r = []; for (var n in e) r.push(n); return r.reverse(), function next() { for (; r.length;) { var t = r.pop(); if (t in e) return next.value = t, next.done = !1, next; } return next.done = !0, next; }; }, e.values = values, Context.prototype = { constructor: Context, reset: function reset(e) { if (this.prev = 0, this.next = 0, this.sent = this._sent = t, this.done = !1, this.delegate = null, this.method = "next", this.arg = t, this.tryEntries.forEach(resetTryEntry), !e) for (var r in this) "t" === r.charAt(0) && n.call(this, r) && !isNaN(+r.slice(1)) && (this[r] = t); }, stop: function stop() { this.done = !0; var t = this.tryEntries[0].completion; if ("throw" === t.type) throw t.arg; return this.rval; }, dispatchException: function dispatchException(e) { if (this.done) throw e; var r = this; function handle(n, o) { return a.type = "throw", a.arg = e, r.next = n, o && (r.method = "next", r.arg = t), !!o; } for (var o = this.tryEntries.length - 1; o >= 0; --o) { var i = this.tryEntries[o], a = i.completion; if ("root" === i.tryLoc) return handle("end"); if (i.tryLoc <= this.prev) { var c = n.call(i, "catchLoc"), u = n.call(i, "finallyLoc"); if (c && u) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } else if (c) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); } else { if (!u) throw new Error("try statement without catch or finally"); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } } } }, abrupt: function abrupt(t, e) { for (var r = this.tryEntries.length - 1; r >= 0; --r) { var o = this.tryEntries[r]; if (o.tryLoc <= this.prev && n.call(o, "finallyLoc") && this.prev < o.finallyLoc) { var i = o; break; } } i && ("break" === t || "continue" === t) && i.tryLoc <= e && e <= i.finallyLoc && (i = null); var a = i ? i.completion : {}; return a.type = t, a.arg = e, i ? (this.method = "next", this.next = i.finallyLoc, y) : this.complete(a); }, complete: function complete(t, e) { if ("throw" === t.type) throw t.arg; return "break" === t.type || "continue" === t.type ? this.next = t.arg : "return" === t.type ? (this.rval = this.arg = t.arg, this.method = "return", this.next = "end") : "normal" === t.type && e && (this.next = e), y; }, finish: function finish(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.finallyLoc === t) return this.complete(r.completion, r.afterLoc), resetTryEntry(r), y; } }, catch: function _catch(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.tryLoc === t) { var n = r.completion; if ("throw" === n.type) { var o = n.arg; resetTryEntry(r); } return o; } } throw new Error("illegal catch attempt"); }, delegateYield: function delegateYield(e, r, n) { return this.delegate = { iterator: values(e), resultName: r, nextLoc: n }, "next" === this.method && (this.arg = t), y; } }, e; }
+function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
+function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+import { useCallback, useRef, useState } from 'react';
+import Button from "../button";
+import Icon from "../icon";
+import Tooltip from "../tooltip";
+import "./style";
+export function ActionBar(_ref) {
+  var content = _ref.content,
+    onRegenerate = _ref.onRegenerate,
+    feedbackProp = _ref.feedback,
+    onFeedback = _ref.onFeedback,
+    _ref$versionCount = _ref.versionCount,
+    versionCount = _ref$versionCount === void 0 ? 1 : _ref$versionCount,
+    _ref$currentVersion = _ref.currentVersion,
+    currentVersion = _ref$currentVersion === void 0 ? 0 : _ref$currentVersion,
+    onVersionChange = _ref.onVersionChange;
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    copied = _useState2[0],
+    setCopied = _useState2[1];
+  var copyTimer = useRef(undefined);
+  var copy = useCallback( /*#__PURE__*/function () {
+    var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(text) {
+      return _regeneratorRuntime().wrap(function _callee$(_context) {
+        while (1) switch (_context.prev = _context.next) {
+          case 0:
+            _context.next = 2;
+            return navigator.clipboard.writeText(text);
+          case 2:
+            setCopied(true);
+            clearTimeout(copyTimer.current);
+            copyTimer.current = setTimeout(function () {
+              return setCopied(false);
+            }, 2000);
+          case 5:
+          case "end":
+            return _context.stop();
+        }
+      }, _callee);
+    }));
+    return function (_x) {
+      return _ref2.apply(this, arguments);
+    };
+  }(), []);
+
+  // 受控/非受控：外部传了 feedback 就用外部的，否则用内部 state
+  var isControlled = feedbackProp !== undefined;
+  var _useState3 = useState(null),
+    _useState4 = _slicedToArray(_useState3, 2),
+    internalFeedback = _useState4[0],
+    setInternalFeedback = _useState4[1];
+  var feedback = isControlled ? feedbackProp : internalFeedback;
+  var handleToggle = function handleToggle(type) {
+    var next = feedback === type ? null : type;
+    if (!isControlled) setInternalFeedback(next);
+    onFeedback === null || onFeedback === void 0 || onFeedback(next);
+  };
+  var showPager = versionCount > 1;
+  return /*#__PURE__*/React.createElement("div", {
+    "data-odn-action-bar": true
+  }, /*#__PURE__*/React.createElement("span", {
+    "data-odn-action-bar-toolbar-btn": true,
+    "data-odn-action-bar-copy-wrap": true,
+    "data-copied": copied ? 'true' : undefined
+  }, /*#__PURE__*/React.createElement(Tooltip, {
+    popup: "\u590D\u5236",
+    placement: "top",
+    offset: 6
+  }, /*#__PURE__*/React.createElement(Button, {
+    light: true,
+    type: "button",
+    size: "medium",
+    intent: "normal",
+    icon: copied ? 'check' : 'copy',
+    "aria-label": "\u590D\u5236",
+    onClick: function onClick() {
+      return copy(content);
+    },
+    style: {
+      // ""
+    }
+  }))), onRegenerate && /*#__PURE__*/React.createElement("span", {
+    "data-odn-action-bar-toolbar-btn": true
+  }, /*#__PURE__*/React.createElement(Tooltip, {
+    popup: "\u91CD\u65B0\u751F\u6210",
+    placement: "top",
+    offset: 6
+  }, /*#__PURE__*/React.createElement(Button, {
+    light: true,
+    type: "button",
+    size: "medium",
+    intent: "normal",
+    icon: "refresh",
+    "aria-label": "\u91CD\u65B0\u751F\u6210",
+    onClick: onRegenerate
+  }))), /*#__PURE__*/React.createElement("span", {
+    "data-odn-action-bar-separator": true
+  }), /*#__PURE__*/React.createElement("span", {
+    "data-odn-action-bar-toolbar-btn": true
+  }, /*#__PURE__*/React.createElement(Button, {
+    light: true,
+    type: "button",
+    size: "medium",
+    intent: "normal",
+    icon: "thumbs-up",
+    "data-odn-action-bar-feedback": "positive",
+    "aria-pressed": feedback === 'positive',
+    "aria-label": "\u6709\u5E2E\u52A9",
+    onClick: function onClick() {
+      return handleToggle('positive');
+    }
+  })), /*#__PURE__*/React.createElement("span", {
+    "data-odn-action-bar-toolbar-btn": true
+  }, /*#__PURE__*/React.createElement(Button, {
+    light: true,
+    type: "button",
+    size: "medium",
+    intent: "normal",
+    icon: "thumbs-down",
+    "data-odn-action-bar-feedback": "negative",
+    "aria-pressed": feedback === 'negative',
+    "aria-label": "\u6CA1\u5E2E\u52A9",
+    onClick: function onClick() {
+      return handleToggle('negative');
+    }
+  })), showPager && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("span", {
+    "data-odn-action-bar-separator": true
+  }), /*#__PURE__*/React.createElement("div", {
+    "data-odn-action-bar-pager": true
+  }, /*#__PURE__*/React.createElement("button", {
+    onClick: function onClick() {
+      return onVersionChange === null || onVersionChange === void 0 ? void 0 : onVersionChange(currentVersion - 1);
+    },
+    disabled: currentVersion <= 0,
+    "data-odn-action-bar-pager-btn": true,
+    "aria-label": "\u4E0A\u4E00\u4E2A\u7248\u672C"
+  }, /*#__PURE__*/React.createElement(Icon, {
+    name: "chevron-left",
+    size: 14
+  })), /*#__PURE__*/React.createElement("span", {
+    "data-odn-action-bar-pager-text": true
+  }, currentVersion + 1, "/", versionCount), /*#__PURE__*/React.createElement("button", {
+    onClick: function onClick() {
+      return onVersionChange === null || onVersionChange === void 0 ? void 0 : onVersionChange(currentVersion + 1);
+    },
+    disabled: currentVersion >= versionCount - 1,
+    "data-odn-action-bar-pager-btn": true,
+    "aria-label": "\u4E0B\u4E00\u4E2A\u7248\u672C"
+  }, /*#__PURE__*/React.createElement(Icon, {
+    name: "chevron-right",
+    size: 14
+  })))));
+}
+ActionBar.displayName = 'ActionBar';
+export default ActionBar;