@panosen/agent-ui 0.0.1

package/README.md

@@ -0,0 +1,143 @@
+# @panosen/rc-button
+
+一个现代化的 React 按钮组件，支持自定义颜色和渐变效果。
+
+## 特性
+
+- 🎨 **自定义颜色** - 支持通过 `color` 属性自定义按钮颜色
+- ✨ **现代化设计** - 优雅的渐变和悬停效果
+- 🎯 **完整的交互状态** - 支持 hover、active、focus、disabled 状态
+- 📦 **轻量级** - 零依赖（除了 React）
+- 🔧 **TypeScript 支持** - 完整的类型定义
+- 🎭 **灵活配置** - 支持图标、自定义样式等
+
+## 安装
+
+```bash
+npm install @panosen/rc-button
+```
+
+或使用 pnpm：
+
+```bash
+pnpm add @panosen/rc-button
+```
+
+或使用 yarn：
+
+```bash
+yarn add @panosen/rc-button
+```
+
+## 使用
+
+### 基础用法
+
+```tsx
+import { Button } from '@panosen/rc-button';
+import '@panosen/rc-button/style.css';
+
+function App() {
+  return (
+    <Button onClick={() => console.log('clicked')}>
+      Click Me
+    </Button>
+  );
+}
+```
+
+### 自定义颜色
+
+```tsx
+<Button color="#FF5733">Red Orange</Button>
+<Button color="#33FF57">Lime Green</Button>
+<Button color="#3357FF">Royal Blue</Button>
+```
+
+### 带图标
+
+```tsx
+<Button icon={<YourIcon />}>
+  Button with Icon
+</Button>
+```
+
+### 自定义样式
+
+```tsx
+<Button 
+  className="my-custom-class"
+  style={{ fontSize: '1.2rem' }}
+>
+  Custom Style
+</Button>
+```
+
+## API
+
+### Button Props
+
+| 属性 | 类型 | 默认值 | 描述 |
+|------|------|--------|------|
+| `children` | `React.ReactNode` | - | 按钮内容 |
+| `icon` | `React.ReactNode` | - | 按钮图标 |
+| `className` | `string` | - | 自定义类名 |
+| `style` | `React.CSSProperties` | - | 自定义样式 |
+| `color` | `string` | `#667eea` | 按钮主题颜色（支持 hex 格式） |
+| `onClick` | `React.MouseEventHandler` | - | 点击事件处理函数 |
+
+组件使用 `React.forwardRef`，支持传递 ref 到按钮元素。
+
+## 颜色系统
+
+按钮使用 CSS 变量来实现动态颜色系统：
+
+- `--button-color`: 主题色
+- `--button-hover-color`: 悬停颜色（自动计算为较暗的颜色）
+- `--button-active-color`: 激活颜色（自动计算为更暗的颜色）
+
+当你传入 `color` 属性时，组件会自动计算 hover 和 active 状态的颜色。
+
+## 样式特性
+
+- **渐变背景** - 悬停时显示微妙的渐变效果
+- **阴影效果** - 悬停和聚焦时的柔和阴影
+- **平滑过渡** - 所有状态变化都有流畅的过渡动画
+- **无障碍支持** - 完整的键盘导航和焦点管理
+
+## 开发
+
+```bash
+# 安装依赖
+pnpm install
+
+# 开发模式
+pnpm dev
+
+# 构建
+pnpm build
+
+# 代码检查
+pnpm lint
+```
+
+## 技术栈
+
+- React 18/19
+- TypeScript
+- Vite
+- SCSS Modules
+
+## 浏览器支持
+
+支持所有现代浏览器：
+
+- Chrome (最新版本)
+- Firefox (最新版本)
+- Safari (最新版本)
+- Edge (最新版本)
+
+## 相关链接
+
+- [GitHub Repository](https://github.com/panosen-react/panosen-rc-button)
+- [npm Package](https://www.npmjs.com/package/@panosen/rc-button)

package/dist/index.d.ts

@@ -0,0 +1,217 @@
+import { AxiosResponse } from 'axios';
+import { default as default_2 } from 'react';
+import { InternalAxiosRequestConfig } from 'axios';
+
+/**
+ * 对话
+ */
+export declare const API_USE_DEEP_SEEK = "useDeepSeek";
+
+declare interface BaseMessage {
+    id: string;
+    timestamp: number;
+    type: MessageType;
+    role: MessageRole;
+}
+
+/**
+ * 基础请求
+ */
+export declare interface BaseRequest {
+}
+
+/**
+ * 基础返回
+ */
+export declare interface BaseResponse {
+    /**
+     * 状态码
+     */
+    code?: number | null;
+    /**
+     * 消息
+     */
+    message?: string | null;
+}
+
+export declare const ChatApp: default_2.FC<ChatAppProps>;
+
+export declare interface ChatAppProps {
+    theme?: Theme;
+}
+
+export declare interface ChatHistory {
+    messages: Message[];
+    currentSessionId: string;
+}
+
+/**
+ * 解析主题配置并返回完整的主题 tokens
+ * @param theme 主题配置 ('light' | 'dark' | CustomTheme)
+ * @returns 完整的主题 tokens
+ */
+export declare const computeThemeTokens: (theme: Theme) => ThemeTokens;
+
+/**
+ * 自定义主题
+ */
+export declare interface CustomTheme {
+    /**
+     * 主题名称
+     */
+    name: string;
+    /**
+     * 基础主题
+     */
+    base: Theme;
+    /**
+     * 覆盖的 token
+     */
+    tokens: Partial<ThemeTokens>;
+}
+
+export declare interface LoadingMessage extends BaseMessage {
+    type: typeof MESSAGE_TYPE_LOADING;
+    content: string;
+}
+
+export declare type Message = LoadingMessage | TextMessage | ToolMessage;
+
+export declare const MESSAGE_ROLE_ASSISTANT = "assistant";
+
+export declare const MESSAGE_ROLE_TOOL = "tool";
+
+export declare const MESSAGE_ROLE_USER = "user";
+
+export declare const MESSAGE_TYPE_LOADING = "loading";
+
+export declare const MESSAGE_TYPE_TEXT = "text";
+
+export declare const MESSAGE_TYPE_TOOL = "tool";
+
+export declare type MessageRole = typeof MESSAGE_ROLE_USER | typeof MESSAGE_ROLE_ASSISTANT | typeof MESSAGE_ROLE_TOOL;
+
+export declare type MessageType = typeof MESSAGE_TYPE_LOADING | typeof MESSAGE_TYPE_TEXT | typeof MESSAGE_TYPE_TOOL;
+
+export declare const simpleSampleService: SimpleSampleServiceClient;
+
+/**
+ * 简单示例服务
+ */
+declare class SimpleSampleServiceClient {
+    private axios;
+    constructor(baseURL: string, options?: SimpleSampleServiceClientOptions);
+    httpPost<T = any>(api: string, request: any): Promise<T>;
+    httpPostSse<T = any>(api: string, request: any, handleResponse: (response: any) => void): Promise<AxiosResponse<T>>;
+    parseAndEmit(chunk: string, handleResponse: (chunk: string) => void): void;
+    processStreamResponse(response: AxiosResponse<ReadableStream>, handleResponse: (chunk: string) => void): Promise<void>;
+}
+
+declare interface SimpleSampleServiceClientOptions {
+    interceptorsRequest?: (config: InternalAxiosRequestConfig) => InternalAxiosRequestConfig;
+    interceptorsResponse?: (response: AxiosResponse) => AxiosResponse;
+    interceptorsRequestException?: (error: any) => any;
+    interceptorsResponseException?: (error: any) => any;
+}
+
+export declare interface TextMessage extends BaseMessage {
+    type: typeof MESSAGE_TYPE_TEXT;
+    content: string;
+}
+
+export declare type Theme = 'light' | 'dark' | CustomTheme;
+
+export declare interface ThemeTokens {
+    backgroundColor?: string;
+    textColor?: string;
+    errorBackground?: string;
+    errorColor?: string;
+    errorBorder?: string;
+    errorBorderLeft?: string;
+    animationGradientStart?: string;
+    animationGradientMid?: string;
+    animationGradientEnd?: string;
+    messageLoading?: string;
+    messageUser?: string;
+    messageAssistant?: string;
+    messageTool?: string;
+    inputBorder?: string;
+    inputColor?: string;
+    inputPlaceholderColor?: string;
+    inputShadow?: string;
+    inputDisabledBackground?: string;
+    inputDisabledColor?: string;
+    inputDisabledBorder?: string;
+    submitBackground?: string;
+    submitBorder?: string;
+    submitColor?: string;
+    submitHoverBackground?: string;
+    listScrollbarTrack?: string;
+    listScrollbarThumb?: string;
+    listScrollbarThumbHover?: string;
+    listScrollbarGlow?: string;
+    listWelcomeColor?: string;
+    listWelcomeTitleGradientStart?: string;
+    listWelcomeTitleGradientMid?: string;
+    listWelcomeTitleGradientEnd?: string;
+    listWelcomeTitleTextShadow?: string;
+    listWelcomeContentColor?: string;
+}
+
+export declare const TOOL_STATUS_COMPLETED = "completed";
+
+export declare const TOOL_STATUS_PREPARING = "preparing";
+
+export declare const TOOL_STATUS_PROCESSING = "processing";
+
+export declare interface ToolMessage extends BaseMessage {
+    type: typeof MESSAGE_TYPE_TOOL;
+    toolStatus: ToolStatus;
+    name: string;
+}
+
+export declare type ToolStatus = typeof TOOL_STATUS_PREPARING | typeof TOOL_STATUS_PROCESSING | typeof TOOL_STATUS_COMPLETED;
+
+/**
+ * 工具调用
+ */
+export declare interface ToolUsage {
+    /**
+     * 编号
+     */
+    id?: string | null;
+    /**
+     * 名称
+     */
+    name?: string | null;
+    /**
+     * 状态 preparing(创建) processing(调用) completed(完成)
+     */
+    status?: string | null;
+}
+
+/**
+ * 对话请求体
+ */
+export declare interface UseDeepSeekRequest extends BaseRequest {
+    /**
+     * 内容
+     */
+    content?: string | null;
+}
+
+/**
+ * 对话返回体
+ */
+export declare interface UseDeepSeekResponse extends BaseResponse {
+    /**
+     * 内容
+     */
+    content?: string | null;
+    /**
+     * 工具调用
+     */
+    toolUsage?: ToolUsage | null;
+}
+
+export { }