listpage-next 0.0.271 → 0.0.273

package/dist/features/ChatClient/ui/Bubble/Bubble.js

@@ -2,8 +2,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { useRef } from "react";
 import { useHover } from "ahooks";
 import styled_components from "styled-components";
-import { Markdown } from "./Markdown.js";
-import { Reasoning } from "./Reasoning.js";
+import { Markdown, Reasoning } from "../Markdown/index.js";
 import { ReferenceList } from "./ReferenceList.js";
 const Bubble = (props)=>{
     const { className, content, reasoning_content, extra, feedback, markdownRender, reasoningMarkdownRender = markdownRender, references, suggests, role = 'user', status, placement = 'user' === role ? 'end' : 'start', showFeedback = (hovered)=>hovered } = props;

package/dist/features/ChatClient/ui/Bubble/index.d.ts

@@ -1,7 +1,5 @@
 export * from './Bubble';
-export * from './Reasoning';
 export * from './ReferenceList';
 export * from './SuggestMessageList';
 export * from './LinkCard';
 export * from './BubbleList';
-export * from './Markdown';

package/dist/features/ChatClient/ui/Bubble/index.js

@@ -1,7 +1,5 @@
 export * from "./Bubble.js";
-export * from "./Reasoning.js";
 export * from "./ReferenceList.js";
 export * from "./SuggestMessageList.js";
 export * from "./LinkCard.js";
 export * from "./BubbleList.js";
-export * from "./Markdown.js";

package/dist/features/ChatClient/ui/Markdown/base/Reasoning.d.ts

@@ -0,0 +1,5 @@
+import { ReactNode } from 'react';
+export declare const Reasoning: import("react").MemoExoticComponent<({ thinking, children }: {
+    thinking?: boolean;
+    children?: ReactNode;
+}) => import("react/jsx-runtime").JSX.Element>;

package/dist/features/ChatClient/ui/Markdown/base/Reasoning.js

@@ -0,0 +1,110 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { ArrowsAltOutlined, ShrinkOutlined } from "@ant-design/icons";
+import { memo, useEffect, useState } from "react";
+import { styled } from "styled-components";
+const Reasoning = /*#__PURE__*/ memo(({ thinking, children })=>{
+    const [collapsed, setCollapsed] = useState(false);
+    useEffect(()=>{
+        if (!thinking) setCollapsed(true);
+    }, [
+        thinking
+    ]);
+    return /*#__PURE__*/ jsxs(ReasoningContainer, {
+        style: {
+            padding: collapsed ? '6px 12px' : '0px 12px 13px 12px',
+            backgroundColor: collapsed ? void 0 : '#fff',
+            ...collapsed && {
+                maxWidth: 240
+            }
+        },
+        children: [
+            /*#__PURE__*/ jsxs(ReasoningHeader, {
+                onClick: ()=>setCollapsed(!collapsed),
+                style: {
+                    padding: collapsed ? '0' : '7px 0px',
+                    height: collapsed ? 42 : 56
+                },
+                children: [
+                    /*#__PURE__*/ jsx(ReasoningTitle, {
+                        children: thinking ? /*#__PURE__*/ jsx(ReasoningTitleAnimation, {
+                            children: "深度思考中"
+                        }) : '已完成思考'
+                    }),
+                    /*#__PURE__*/ jsx(ReasoningIcon, {
+                        children: collapsed ? /*#__PURE__*/ jsx(ArrowsAltOutlined, {}) : /*#__PURE__*/ jsx(ShrinkOutlined, {})
+                    })
+                ]
+            }),
+            !collapsed && /*#__PURE__*/ jsx(ReasoningContent, {
+                children: children
+            })
+        ]
+    });
+});
+const ReasoningContainer = styled.div`
+  background-color: #fff;
+  cursor: pointer;
+  border: 1px solid #ebebeb;
+  border-radius: 12px;
+  transition: height 0.3s ease-in-out;
+  &:hover {
+    background-color: #0000000a;
+  }
+  width: 100%;
+
+  & > * {
+    box-sizing: border-box;
+  }
+`;
+const ReasoningHeader = styled.div`
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+`;
+const ReasoningContent = styled.div`
+  color: #00000080 !important;
+  overflow: hidden;
+`;
+const ReasoningTitle = styled.div`
+  color: #000c;
+  font-size: 14px;
+  font-weight: 500;
+`;
+const ReasoningIcon = styled.div`
+  align-items: center;
+  border: 1px solid #00000014;
+  border-radius: 8px;
+  display: flex;
+  height: 28px;
+  justify-content: center;
+  padding: 5px 8px;
+  width: 28px;
+  box-sizing: border-box;
+  &:hover {
+    background-color: #0000000a;
+  }
+`;
+const ReasoningTitleAnimation = styled.span`
+  /* 文字流光动画 */
+  @keyframes textShine {
+    to {
+      background-position: 200% center;
+    }
+  }
+
+  background: linear-gradient(
+    90deg,
+    #3b82f6,
+    #93c5fd,
+    #3b82f6,
+    #93c5fd,
+    #3b82f6
+  );
+  background-size: 200% auto;
+  color: #000;
+  background-clip: text;
+  -webkit-background-clip: text;
+  -webkit-text-fill-color: transparent;
+  animation: textShine 3s linear infinite;
+`;
+export { Reasoning };

package/dist/features/ChatClient/ui/Markdown/components/CodeComponent.d.ts

@@ -0,0 +1 @@
+export declare const Code: (props: any) => import("react/jsx-runtime").JSX.Element;

package/dist/features/ChatClient/ui/Markdown/components/CodeComponent.js

@@ -0,0 +1,38 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Container, ContentArea, Dot, DotsContainer, Header, Pre, SnippetLabel, SnippetLabelContainer } from "../styles/CodeComponent.styles.js";
+const Code = (props)=>/*#__PURE__*/ jsxs(Container, {
+        children: [
+            /*#__PURE__*/ jsxs(Header, {
+                children: [
+                    /*#__PURE__*/ jsxs(DotsContainer, {
+                        children: [
+                            /*#__PURE__*/ jsx(Dot, {
+                                $bgColor: "#ff5f56",
+                                $borderColor: "rgba(224, 68, 62, 0.5)"
+                            }),
+                            /*#__PURE__*/ jsx(Dot, {
+                                $bgColor: "#ffbd2e",
+                                $borderColor: "rgba(222, 161, 35, 0.5)"
+                            }),
+                            /*#__PURE__*/ jsx(Dot, {
+                                $bgColor: "#27c93f",
+                                $borderColor: "rgba(26, 171, 41, 0.5)"
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ jsx(SnippetLabelContainer, {
+                        className: "snippet-label",
+                        children: /*#__PURE__*/ jsx(SnippetLabel, {
+                            children: "Snippet"
+                        })
+                    })
+                ]
+            }),
+            /*#__PURE__*/ jsx(ContentArea, {
+                children: /*#__PURE__*/ jsx(Pre, {
+                    children: props.children
+                })
+            })
+        ]
+    });
+export { Code };

package/dist/features/ChatClient/ui/Markdown/components/PlaceholderComponent.d.ts

@@ -0,0 +1 @@
+export declare const Placeholder: () => import("react/jsx-runtime").JSX.Element;

package/dist/features/ChatClient/ui/Markdown/components/PlaceholderComponent.js

@@ -0,0 +1,62 @@
+import { jsx } from "react/jsx-runtime";
+import { styled } from "styled-components";
+const Placeholder = ()=>/*#__PURE__*/ jsx(StyledPlaceholder, {
+        "data-type": "pending"
+    });
+const StyledPlaceholder = styled.span`
+  placeholder[type='pending'] {
+    display: inline-block;
+    vertical-align: text-bottom;
+    width: 28px;
+    height: 100%;
+    position: relative;
+  }
+
+  placeholder[type='pending']::after {
+    content: '';
+    display: inline-block;
+    width: 8px;
+    height: 8px;
+    border-radius: 50%;
+    background: rgba(0, 0, 0, 0.6);
+    box-shadow:
+      0 0 0 0 rgba(0, 0, 0, 0.6),
+      10px 0 0 0 rgba(0, 0, 0, 0.6),
+      20px 0 0 0 rgba(0, 0, 0, 0.6);
+    transform-origin: center;
+    will-change: transform, box-shadow, background;
+    animation: dotRolling 0.8s cubic-bezier(0.4, 0, 0.2, 1) infinite;
+  }
+
+  @keyframes dotRolling {
+    0% {
+      background: rgba(0, 0, 0, 0.85);
+      box-shadow:
+        0 0 0 0 rgba(0, 0, 0, 0.85),
+        10px 0 0 0 rgba(0, 0, 0, 0.55),
+        20px 0 0 -2px rgba(0, 0, 0, 0.45);
+    }
+    33% {
+      background: rgba(0, 0, 0, 0.55);
+      box-shadow:
+        0 0 0 -2px rgba(0, 0, 0, 0.45),
+        10px 0 0 2px rgba(0, 0, 0, 0.85),
+        20px 0 0 -2px rgba(0, 0, 0, 0.45);
+    }
+    66% {
+      background: rgba(0, 0, 0, 0.55);
+      box-shadow:
+        0 0 0 -2px rgba(0, 0, 0, 0.45),
+        10px 0 0 -2px rgba(0, 0, 0, 0.45),
+        20px 0 0 2px rgba(0, 0, 0, 0.85);
+    }
+    100% {
+      background: rgba(0, 0, 0, 0.85);
+      box-shadow:
+        0 0 0 0 rgba(0, 0, 0, 0.85),
+        10px 0 0 0 rgba(0, 0, 0, 0.55),
+        20px 0 0 -2px rgba(0, 0, 0, 0.45);
+    }
+  }
+`;
+export { Placeholder };

package/dist/features/ChatClient/ui/Markdown/components/ThinkConponent.d.ts

@@ -0,0 +1,2 @@
+import type { ComponentProps } from '@ant-design/x-markdown';
+export declare const Think: import("react").MemoExoticComponent<({ streamStatus, children }: ComponentProps) => import("react/jsx-runtime").JSX.Element>;

package/dist/features/ChatClient/ui/Markdown/components/ThinkConponent.js

@@ -0,0 +1,22 @@
+import { jsx } from "react/jsx-runtime";
+import { memo, useEffect, useState } from "react";
+import { Reasoning } from "../base/Reasoning.js";
+import { styled } from "styled-components";
+const Think = /*#__PURE__*/ memo(({ streamStatus, children })=>{
+    const [loading, setLoading] = useState(true);
+    useEffect(()=>{
+        if ('done' === streamStatus) setLoading(false);
+    }, [
+        streamStatus
+    ]);
+    return /*#__PURE__*/ jsx(ReasoningContainer, {
+        children: /*#__PURE__*/ jsx(Reasoning, {
+            thinking: loading,
+            children: children
+        })
+    });
+});
+const ReasoningContainer = styled.div`
+  margin-bottom: 8px;
+`;
+export { Think };

package/dist/features/ChatClient/ui/{Bubble/Markdown.d.ts → Markdown/index.d.ts}

@@ -4,3 +4,4 @@ export interface MarkdownProps extends XMarkdownProps {
     hasNextChunk?: boolean;
 }
 export declare const Markdown: ({ hasNextChunk, ...props }: MarkdownProps) => import("react/jsx-runtime").JSX.Element;
+export { Reasoning } from './base/Reasoning';

package/dist/features/ChatClient/ui/{Bubble/Markdown.js → Markdown/index.js}

@@ -2,8 +2,18 @@ import { jsx } from "react/jsx-runtime";
 import styled_components from "styled-components";
 import x_markdown from "@ant-design/x-markdown";
 import "@ant-design/x-markdown/themes/light.css";
+import { Placeholder } from "./components/PlaceholderComponent.js";
+import { Think } from "./components/ThinkConponent.js";
+import { Code } from "./components/CodeComponent.js";
+import { Reasoning } from "./base/Reasoning.js";
 const Markdown = ({ hasNextChunk, ...props })=>/*#__PURE__*/ jsx(MarkdownBody, {
         ...props,
+        components: {
+            placeholder: Placeholder,
+            think: Think,
+            code: Code,
+            ...props.components
+        },
         streaming: {
             enableAnimation: true,
             hasNextChunk,
@@ -193,60 +203,5 @@ const MarkdownBody = styled_components(x_markdown)`
     margin: 16px 0;
     background: linear-gradient(to right, #e5e7eb, #cbd5e1, #e5e7eb);
   }
-
-  placeholder[type='pending'] {
-    display: inline-block;
-    vertical-align: text-bottom;
-    width: 28px;
-    height: 100%;
-    position: relative;
-  }
-
-  placeholder[type='pending']::after {
-    content: '';
-    display: inline-block;
-    width: 8px;
-    height: 8px;
-    border-radius: 50%;
-    background: rgba(0, 0, 0, 0.6);
-    box-shadow:
-      0 0 0 0 rgba(0, 0, 0, 0.6),
-      10px 0 0 0 rgba(0, 0, 0, 0.6),
-      20px 0 0 0 rgba(0, 0, 0, 0.6);
-    transform-origin: center;
-    will-change: transform, box-shadow, background;
-    animation: dotRolling 0.8s cubic-bezier(0.4, 0, 0.2, 1) infinite;
-  }
-
-  @keyframes dotRolling {
-    0% {
-      background: rgba(0, 0, 0, 0.85);
-      box-shadow:
-        0 0 0 0 rgba(0, 0, 0, 0.85),
-        10px 0 0 0 rgba(0, 0, 0, 0.55),
-        20px 0 0 -2px rgba(0, 0, 0, 0.45);
-    }
-    33% {
-      background: rgba(0, 0, 0, 0.55);
-      box-shadow:
-        0 0 0 -2px rgba(0, 0, 0, 0.45),
-        10px 0 0 2px rgba(0, 0, 0, 0.85),
-        20px 0 0 -2px rgba(0, 0, 0, 0.45);
-    }
-    66% {
-      background: rgba(0, 0, 0, 0.55);
-      box-shadow:
-        0 0 0 -2px rgba(0, 0, 0, 0.45),
-        10px 0 0 -2px rgba(0, 0, 0, 0.45),
-        20px 0 0 2px rgba(0, 0, 0, 0.85);
-    }
-    100% {
-      background: rgba(0, 0, 0, 0.85);
-      box-shadow:
-        0 0 0 0 rgba(0, 0, 0, 0.85),
-        10px 0 0 0 rgba(0, 0, 0, 0.55),
-        20px 0 0 -2px rgba(0, 0, 0, 0.45);
-    }
-  }
 `;
-export { Markdown };
+export { Markdown, Reasoning };

package/dist/features/ChatClient/ui/Markdown/styles/CodeComponent.styles.d.ts

@@ -0,0 +1,11 @@
+export declare const Container: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const Header: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const DotsContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const Dot: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    $bgColor: string;
+    $borderColor: string;
+}>> & string;
+export declare const SnippetLabelContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const SnippetLabel: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>> & string;
+export declare const ContentArea: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const Pre: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLPreElement>, HTMLPreElement>, never>> & string;

package/dist/features/ChatClient/ui/Markdown/styles/CodeComponent.styles.js

@@ -0,0 +1,77 @@
+import styled_components from "styled-components";
+const Container = styled_components.div`
+  margin: 16px 0;
+  border-radius: 0.75rem;
+  overflow: hidden;
+  background-color: #1e1e1e;
+  box-shadow:
+    0 20px 25px -5px rgb(0 0 0 / 0.1),
+    0 8px 10px -6px rgb(0 0 0 / 0.1);
+  border: 1px solid rgba(41, 37, 36, 0.5);
+
+  &:hover .snippet-label {
+    opacity: 1;
+  }
+`;
+const Header = styled_components.div`
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 8px 12px;
+  background-color: #252526;
+  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
+`;
+const DotsContainer = styled_components.div`
+  display: flex;
+  gap: 6px;
+`;
+const Dot = styled_components.div`
+  width: 10px;
+  height: 10px;
+  border-radius: 50%;
+  background-color: ${(props)=>props.$bgColor};
+  border: 1px solid ${(props)=>props.$borderColor};
+  box-shadow: inset 0 2px 4px 0 rgb(0 0 0 / 0.05);
+`;
+const SnippetLabelContainer = styled_components.div`
+  opacity: 0;
+  transition: opacity 300ms;
+`;
+const SnippetLabel = styled_components.span`
+  font-size: 10px;
+  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
+    'Liberation Mono', 'Courier New', monospace;
+  color: #78716c;
+  font-weight: 700;
+  text-transform: uppercase;
+  letter-spacing: 0.1em;
+`;
+const ContentArea = styled_components.div`
+  padding: 16px;
+  overflow-x: auto;
+
+  &::-webkit-scrollbar {
+    height: 8px;
+    width: 8px;
+  }
+  &::-webkit-scrollbar-track {
+    background: transparent;
+  }
+  &::-webkit-scrollbar-thumb {
+    background-color: #444;
+    border-radius: 4px;
+  }
+  &::-webkit-scrollbar-thumb:hover {
+    background-color: #555;
+  }
+`;
+const Pre = styled_components.pre`
+  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
+    'Liberation Mono', 'Courier New', monospace;
+  font-size: 0.75rem;
+  line-height: 1.625;
+  color: #d6d3d1;
+  font-weight: 500;
+  margin: 0;
+`;
+export { Container, ContentArea, Dot, DotsContainer, Header, Pre, SnippetLabel, SnippetLabelContainer };

package/dist/features/ChatClient/ui/TracePanel/DataTable.d.ts

@@ -0,0 +1,7 @@
+interface DataTableProps {
+    data: string;
+    columns?: any[];
+    className?: string;
+}
+export declare const DataTable: ({ data, columns: controlledColumns, className, }: DataTableProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/features/ChatClient/ui/TracePanel/DataTable.js

@@ -0,0 +1,71 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useMemo } from "react";
+import { Container, ErrorContainer, Footer, NullSpan, ScrollContainer, Table, Td, Th, Thead, Tr } from "./styles/DataTable.styles.js";
+const DataTable = ({ data, columns: controlledColumns, className = '' })=>{
+    const { list, error } = useMemo(()=>{
+        try {
+            return {
+                list: JSON.parse(data) || [],
+                error: ''
+            };
+        } catch  {
+            return {
+                error: data,
+                list: []
+            };
+        }
+    }, [
+        data
+    ]);
+    const columns = useMemo(()=>{
+        if (!list || 0 === list.length) return [];
+        const keys = Object.keys(list[0]);
+        if (keys.includes('__index')) return [
+            '__index',
+            ...keys.filter((k)=>'__index' !== k)
+        ];
+        return keys;
+    }, [
+        list
+    ]);
+    if (error || !data || 0 === data.length) return /*#__PURE__*/ jsx(ErrorContainer, {
+        className: className,
+        children: error || '无数据'
+    });
+    return /*#__PURE__*/ jsxs(Container, {
+        className: className,
+        children: [
+            /*#__PURE__*/ jsx(ScrollContainer, {
+                children: /*#__PURE__*/ jsxs(Table, {
+                    children: [
+                        /*#__PURE__*/ jsx(Thead, {
+                            children: /*#__PURE__*/ jsx("tr", {
+                                children: (controlledColumns || columns).map((col)=>/*#__PURE__*/ jsx(Th, {
+                                        children: col
+                                    }, col))
+                            })
+                        }),
+                        /*#__PURE__*/ jsx("tbody", {
+                            children: list.map((row, rowIndex)=>/*#__PURE__*/ jsx(Tr, {
+                                    children: columns.map((col)=>/*#__PURE__*/ jsx(Td, {
+                                            title: String(row[col]),
+                                            children: null === row[col] ? /*#__PURE__*/ jsx(NullSpan, {
+                                                children: "null"
+                                            }) : String(row[col])
+                                        }, `${rowIndex}-${col}`))
+                                }, rowIndex))
+                        })
+                    ]
+                })
+            }),
+            /*#__PURE__*/ jsxs(Footer, {
+                children: [
+                    "共 ",
+                    list.length,
+                    " 条记录"
+                ]
+            })
+        ]
+    });
+};
+export { DataTable };

package/dist/features/ChatClient/ui/TracePanel/Popover.d.ts

@@ -0,0 +1,6 @@
+import { TodoItem } from './TodoList';
+import { MessageCache } from './transform';
+export declare const TraceTrigger: ({ tool_calls, todos, }: {
+    tool_calls?: MessageCache["tool_calls"];
+    todos?: TodoItem[];
+}) => import("react/jsx-runtime").JSX.Element;

package/dist/features/ChatClient/ui/TracePanel/Popover.js

@@ -0,0 +1,32 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Popover } from "antd";
+import { TracePanel } from "./TracePanel.js";
+import { Activity } from "lucide-react";
+const TraceTrigger = ({ tool_calls, todos })=>/*#__PURE__*/ jsx(Popover, {
+        trigger: "click",
+        color: "transparent",
+        styles: {
+            body: {
+                width: 500,
+                background: 'transparent',
+                padding: 0
+            }
+        },
+        placement: "rightTop",
+        title: /*#__PURE__*/ jsx(TracePanel, {
+            data: {
+                tool_calls,
+                todos
+            }
+        }),
+        children: /*#__PURE__*/ jsxs("span", {
+            className: "cursor-pointer flex items-center gap-1 p-1.5 text-slate-400 hover:text-emerald-600 hover:bg-emerald-50 rounded transition-colors",
+            children: [
+                /*#__PURE__*/ jsx(Activity, {
+                    size: 12
+                }),
+                "运行过程"
+            ]
+        })
+    });
+export { TraceTrigger };

package/dist/features/ChatClient/ui/TracePanel/TodoList.d.ts

@@ -0,0 +1,13 @@
+export interface TodoItem {
+    content: string;
+    status: 'pending' | 'in_progress' | 'completed';
+}
+interface TodoListProps {
+    items: TodoItem[];
+    title?: string;
+    defaultCollapsed?: boolean;
+    className?: string;
+    simple?: boolean;
+}
+export declare const TodoList: ({ items, title, defaultCollapsed, className, simple, }: TodoListProps) => import("react/jsx-runtime").JSX.Element;
+export {};