@alifd/chat 0.3.33-beta.1 → 0.3.33-beta.3

package/es/drawer/index.js

@@ -11,12 +11,12 @@ import { Drawer as NextDrawer, ConfigProvider } from '@alifd/next';
 import cs from 'classnames';
 import { PREFIX_DEFAULT, assignSubComponent } from '../utils';
 const Drawer = forwardRef((_a, ref) => {
-    var { className, headerStyle, children, footer, footerClassName } = _a, props = __rest(_a, ["className", "headerStyle", "children", "footer", "footerClassName"]);
+    var { className, headerStyle, children, footer, footerClassName, placement } = _a, props = __rest(_a, ["className", "headerStyle", "children", "footer", "footerClassName", "placement"]);
     // 对齐小蜜现有的底部
     const defaultHeaderStyle = {
         "border-bottom:": "1px solid var(--40gmM)"
     };
-    return (React.createElement(NextDrawer, Object.assign({}, props, { v2: true, ref: ref, headerStyle: Object.assign(Object.assign({}, defaultHeaderStyle), headerStyle), className: cs(`${PREFIX_DEFAULT}drawer`, className) }),
+    return (React.createElement(NextDrawer, Object.assign({}, props, { v2: true, ref: ref, placement: placement, headerStyle: Object.assign(Object.assign({}, defaultHeaderStyle), headerStyle), className: cs(`${PREFIX_DEFAULT}drawer ${placement}`, className) }),
         React.createElement("div", { className: 'draw-content' }, children),
         footer && footer.length && React.createElement("div", { className: cs('draw-footer', footerClassName) }, footer)));
 });

package/es/drawer/main.scss

@@ -2,8 +2,14 @@
 
 .#{$prefix}drawer {
 
-  border-top-left-radius: 16px;
-  border-top-right-radius: 16px;
+  &.bottom {
+    border-top-left-radius: 16px;
+    border-top-right-radius: 16px;
+  }
+
+  &.right {
+    border-top-right-radius: 8px;
+  }
 
   .draw-footer {
     width: calc(100% - 40px);

package/es/html-render/index.js

@@ -103,7 +103,7 @@ const HTMLRenderer = memo(function HTMLRenderer({ className, children, imagePrev
     const parserOptions = {
         // @ts-ignore
         replace: domNode => {
-            var _a, _b, _c, _d, _e, _f;
+            var _a, _b, _c, _d, _e, _f, _g;
             // 处理文本节点
             if ((domNode.type === 'text' || domNode.nodeType === 3) && typewriterEffect) {
                 return processTextNode(domNode);
@@ -131,7 +131,7 @@ const HTMLRenderer = memo(function HTMLRenderer({ className, children, imagePrev
                     return (React.createElement(Balloon, { v2: true, align: "b", className: "link-reference-balloon", closable: false, offset: [0, -8], triggerType: ['hover'], trigger: React.createElement("span", { className: "link-reference-index", onClick: handleUrlClick }, (_c = spanElement === null || spanElement === void 0 ? void 0 : spanElement.props) === null || _c === void 0 ? void 0 : _c.children) },
                         React.createElement("div", { className: "link-reference-content" },
                             React.createElement("img", { className: "link-reference-source-icon", src: ((_d = element.props) === null || _d === void 0 ? void 0 : _d['data-source-icon']) || '' }),
-                            React.createElement("a", { className: "link-reference-title", onClick: handleUrlClick }, ((_e = element.props) === null || _e === void 0 ? void 0 : _e['data-title']) || ''))));
+                            React.createElement("a", { className: "link-reference-title", onClick: handleUrlClick, title: ((_e = element.props) === null || _e === void 0 ? void 0 : _e['data-title']) || '' }, ((_f = element.props) === null || _f === void 0 ? void 0 : _f['data-title']) || ''))));
                 }
                 if (name === 'a') {
                     const element = (domToReact([domNode]));
@@ -185,7 +185,7 @@ const HTMLRenderer = memo(function HTMLRenderer({ className, children, imagePrev
                         return renderImage(element.props);
                     }
                     // 换成统一的图片渲染
-                    return React.createElement(Img, Object.assign({}, element.props, { imageClassName: (_f = element.props) === null || _f === void 0 ? void 0 : _f.className, enablePreview: imagePreview, onImageClick: () => {
+                    return React.createElement(Img, Object.assign({}, element.props, { imageClassName: (_g = element.props) === null || _g === void 0 ? void 0 : _g.className, enablePreview: imagePreview, onImageClick: () => {
                             handleImageClick === null || handleImageClick === void 0 ? void 0 : handleImageClick(element.props.src);
                         } }));
                 }

package/es/index.js

@@ -32,4 +32,4 @@ export { default as CheckboxGroup } from './checkbox-group';
 export { default as Select } from './select';
 export { default as Flip } from './flip';
 export { default as ToolStatus } from './tool-status';
-export const version = '0.3.33-beta.1';
+export const version = '0.3.33-beta.3';

package/es/tool-status/index.js

@@ -7,13 +7,14 @@
 import React, { forwardRef } from 'react';
 import { ConfigProvider } from '@alifd/next';
 import Icon from '../icon';
+import Button from '../button';
 import cs from 'classnames';
 import { PREFIX_DEFAULT } from '../utils';
 const SUCCESS_ICON = 'success';
 const ERROR_ICON = 'error';
 const LOADING_ICON = 'loading';
 const ToolStatus = forwardRef((props, ref) => {
-    const { className, selected = false, status, result = '', onToolClick, auth } = props;
+    const { useText = '使用', name, className, selected = false, status, onToolClick, authInfo } = props;
     const handleClick = (event) => {
         event.stopPropagation();
         onToolClick === null || onToolClick === void 0 ? void 0 : onToolClick(props);
@@ -22,15 +23,15 @@ const ToolStatus = forwardRef((props, ref) => {
     return (React.createElement("div", { className: cs(`${PREFIX_DEFAULT}tool-status ${statusClassName} ${status}`, className), ref: ref, onClick: (e) => {
             handleClick(e);
         } },
-        React.createElement("div", { className: 'main-content' },
-            React.createElement(Icon, { size: 'small', type: status === 'error' ? ERROR_ICON : status === 'success' ? SUCCESS_ICON : LOADING_ICON }),
-            React.createElement("div", { className: 'content-result' }, result)),
-        auth && React.createElement("div", { className: 'auth-content' },
-            React.createElement("div", { onClick: (event) => {
+        React.createElement(Icon, { size: 'small', type: status === 'failed' ? ERROR_ICON : status === 'completed' ? SUCCESS_ICON : LOADING_ICON }),
+        authInfo && status === 'auth' && React.createElement("div", { className: 'auth-content' },
+            React.createElement(Button, { type: 'primary', text: true, size: 'medium', onClick: (event) => {
                     var _a;
                     event.stopPropagation();
-                    (_a = auth === null || auth === void 0 ? void 0 : auth.onAuthClick) === null || _a === void 0 ? void 0 : _a.call(auth, props);
-                } }, auth === null || auth === void 0 ? void 0 : auth.content))));
+                    (_a = authInfo === null || authInfo === void 0 ? void 0 : authInfo.onAuthClick) === null || _a === void 0 ? void 0 : _a.call(authInfo, props);
+                } }, authInfo === null || authInfo === void 0 ? void 0 : authInfo.content)),
+        React.createElement("div", { className: 'content-use-tips' }, useText),
+        React.createElement("div", { className: 'content-name' }, name)));
 });
 export * from './types';
 export default ConfigProvider.config(ToolStatus);

package/es/tool-status/main.scss

@@ -4,39 +4,52 @@
   width: fit-content;
   transition: width 0.3s ease-in-out;
   background-color: $color-fill1-1;//$color-brand1-1;
-  padding: $s-1;
-  border-radius: $s-2;
+  padding: $s-1 $s-3;
+  border-radius: $s-4;
   box-sizing: border-box;
   border: solid 1px $color-fill1-1;
   align-items: center;
+  display: flex;
+  i {
+    margin-right: $s-2;
+  }
 
   &.selected {
     background-color: $color-fill1-2;
   }
 
-  &.success {
+  &.completed {
     i {
       color: $color-success-3;
     }
   }
 
-  &.error {
+  &.failed {
     i {
       color: $color-error-3;
     }
   }
 
-  &.loading {
+  &.running, &.auth, &.started {
     i {
       color: $color-brand1-6;
     }
   }
-
-  .main-content {
-    display: flex;
-    .content-result {
-      margin-left: 4px;
+  
+  .auth-content {
+    margin-right: $s-1;
+    button {
+      font-size: $font-size-body-2 !important;
     }
   }
 
+  .content-use-tips {
+    color: $color-text1-2;
+    margin-right: $s-1;
+  }
+
+  .content-name {
+    color: $color-text1-4;
+  }
+
 }

package/es/tool-status/types.d.ts

@@ -16,7 +16,7 @@ export interface ToolStatusProps extends React.HTMLAttributes<HTMLElement>, Comm
     /**
      * 工具调用状态
      */
-    status?: 'loading' | 'success' | 'error';
+    status?: 'started' | 'running' | 'completed' | 'failed' | 'auth';
     /**
      * 工具调用结果
      */
@@ -28,5 +28,13 @@ export interface ToolStatusProps extends React.HTMLAttributes<HTMLElement>, Comm
     /**
      * 额外的授权信息
      */
-    auth?: ToolStatusAuthProps;
+    authInfo?: ToolStatusAuthProps;
+    /**
+     * 工具名称
+     */
+    name?: string;
+    /**
+     * 工具详情链接
+     */
+    useText?: string;
 }

package/lib/drawer/index.js

@@ -13,12 +13,12 @@ const next_1 = require("@alifd/next");
 const classnames_1 = tslib_1.__importDefault(require("classnames"));
 const utils_1 = require("../utils");
 const Drawer = (0, react_1.forwardRef)((_a, ref) => {
-    var { className, headerStyle, children, footer, footerClassName } = _a, props = tslib_1.__rest(_a, ["className", "headerStyle", "children", "footer", "footerClassName"]);
+    var { className, headerStyle, children, footer, footerClassName, placement } = _a, props = tslib_1.__rest(_a, ["className", "headerStyle", "children", "footer", "footerClassName", "placement"]);
     // 对齐小蜜现有的底部
     const defaultHeaderStyle = {
         "border-bottom:": "1px solid var(--40gmM)"
     };
-    return (react_1.default.createElement(next_1.Drawer, Object.assign({}, props, { v2: true, ref: ref, headerStyle: Object.assign(Object.assign({}, defaultHeaderStyle), headerStyle), className: (0, classnames_1.default)(`${utils_1.PREFIX_DEFAULT}drawer`, className) }),
+    return (react_1.default.createElement(next_1.Drawer, Object.assign({}, props, { v2: true, ref: ref, placement: placement, headerStyle: Object.assign(Object.assign({}, defaultHeaderStyle), headerStyle), className: (0, classnames_1.default)(`${utils_1.PREFIX_DEFAULT}drawer ${placement}`, className) }),
         react_1.default.createElement("div", { className: 'draw-content' }, children),
         footer && footer.length && react_1.default.createElement("div", { className: (0, classnames_1.default)('draw-footer', footerClassName) }, footer)));
 });

package/lib/drawer/main.scss

@@ -2,8 +2,14 @@
 
 .#{$prefix}drawer {
 
-  border-top-left-radius: 16px;
-  border-top-right-radius: 16px;
+  &.bottom {
+    border-top-left-radius: 16px;
+    border-top-right-radius: 16px;
+  }
+
+  &.right {
+    border-top-right-radius: 8px;
+  }
 
   .draw-footer {
     width: calc(100% - 40px);

package/lib/html-render/index.js

@@ -106,7 +106,7 @@ const HTMLRenderer = (0, react_1.memo)(function HTMLRenderer({ className, childr
     const parserOptions = {
         // @ts-ignore
         replace: domNode => {
-            var _a, _b, _c, _d, _e, _f;
+            var _a, _b, _c, _d, _e, _f, _g;
             // 处理文本节点
             if ((domNode.type === 'text' || domNode.nodeType === 3) && typewriterEffect) {
                 return processTextNode(domNode);
@@ -134,7 +134,7 @@ const HTMLRenderer = (0, react_1.memo)(function HTMLRenderer({ className, childr
                     return (react_1.default.createElement(balloon_1.default, { v2: true, align: "b", className: "link-reference-balloon", closable: false, offset: [0, -8], triggerType: ['hover'], trigger: react_1.default.createElement("span", { className: "link-reference-index", onClick: handleUrlClick }, (_c = spanElement === null || spanElement === void 0 ? void 0 : spanElement.props) === null || _c === void 0 ? void 0 : _c.children) },
                         react_1.default.createElement("div", { className: "link-reference-content" },
                             react_1.default.createElement("img", { className: "link-reference-source-icon", src: ((_d = element.props) === null || _d === void 0 ? void 0 : _d['data-source-icon']) || '' }),
-                            react_1.default.createElement("a", { className: "link-reference-title", onClick: handleUrlClick }, ((_e = element.props) === null || _e === void 0 ? void 0 : _e['data-title']) || ''))));
+                            react_1.default.createElement("a", { className: "link-reference-title", onClick: handleUrlClick, title: ((_e = element.props) === null || _e === void 0 ? void 0 : _e['data-title']) || '' }, ((_f = element.props) === null || _f === void 0 ? void 0 : _f['data-title']) || ''))));
                 }
                 if (name === 'a') {
                     const element = ((0, html_react_parser_1.domToReact)([domNode]));
@@ -188,7 +188,7 @@ const HTMLRenderer = (0, react_1.memo)(function HTMLRenderer({ className, childr
                         return renderImage(element.props);
                     }
                     // 换成统一的图片渲染
-                    return react_1.default.createElement(img_1.default, Object.assign({}, element.props, { imageClassName: (_f = element.props) === null || _f === void 0 ? void 0 : _f.className, enablePreview: imagePreview, onImageClick: () => {
+                    return react_1.default.createElement(img_1.default, Object.assign({}, element.props, { imageClassName: (_g = element.props) === null || _g === void 0 ? void 0 : _g.className, enablePreview: imagePreview, onImageClick: () => {
                             handleImageClick === null || handleImageClick === void 0 ? void 0 : handleImageClick(element.props.src);
                         } }));
                 }

package/lib/index.js

@@ -70,4 +70,4 @@ var flip_1 = require("./flip");
 Object.defineProperty(exports, "Flip", { enumerable: true, get: function () { return tslib_1.__importDefault(flip_1).default; } });
 var tool_status_1 = require("./tool-status");
 Object.defineProperty(exports, "ToolStatus", { enumerable: true, get: function () { return tslib_1.__importDefault(tool_status_1).default; } });
-exports.version = '0.3.33-beta.1';
+exports.version = '0.3.33-beta.3';

package/lib/tool-status/index.js

@@ -10,13 +10,14 @@ const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importStar(require("react"));
 const next_1 = require("@alifd/next");
 const icon_1 = tslib_1.__importDefault(require("../icon"));
+const button_1 = tslib_1.__importDefault(require("../button"));
 const classnames_1 = tslib_1.__importDefault(require("classnames"));
 const utils_1 = require("../utils");
 const SUCCESS_ICON = 'success';
 const ERROR_ICON = 'error';
 const LOADING_ICON = 'loading';
 const ToolStatus = (0, react_1.forwardRef)((props, ref) => {
-    const { className, selected = false, status, result = '', onToolClick, auth } = props;
+    const { useText = '使用', name, className, selected = false, status, onToolClick, authInfo } = props;
     const handleClick = (event) => {
         event.stopPropagation();
         onToolClick === null || onToolClick === void 0 ? void 0 : onToolClick(props);
@@ -25,15 +26,15 @@ const ToolStatus = (0, react_1.forwardRef)((props, ref) => {
     return (react_1.default.createElement("div", { className: (0, classnames_1.default)(`${utils_1.PREFIX_DEFAULT}tool-status ${statusClassName} ${status}`, className), ref: ref, onClick: (e) => {
             handleClick(e);
         } },
-        react_1.default.createElement("div", { className: 'main-content' },
-            react_1.default.createElement(icon_1.default, { size: 'small', type: status === 'error' ? ERROR_ICON : status === 'success' ? SUCCESS_ICON : LOADING_ICON }),
-            react_1.default.createElement("div", { className: 'content-result' }, result)),
-        auth && react_1.default.createElement("div", { className: 'auth-content' },
-            react_1.default.createElement("div", { onClick: (event) => {
+        react_1.default.createElement(icon_1.default, { size: 'small', type: status === 'failed' ? ERROR_ICON : status === 'completed' ? SUCCESS_ICON : LOADING_ICON }),
+        authInfo && status === 'auth' && react_1.default.createElement("div", { className: 'auth-content' },
+            react_1.default.createElement(button_1.default, { type: 'primary', text: true, size: 'medium', onClick: (event) => {
                     var _a;
                     event.stopPropagation();
-                    (_a = auth === null || auth === void 0 ? void 0 : auth.onAuthClick) === null || _a === void 0 ? void 0 : _a.call(auth, props);
-                } }, auth === null || auth === void 0 ? void 0 : auth.content))));
+                    (_a = authInfo === null || authInfo === void 0 ? void 0 : authInfo.onAuthClick) === null || _a === void 0 ? void 0 : _a.call(authInfo, props);
+                } }, authInfo === null || authInfo === void 0 ? void 0 : authInfo.content)),
+        react_1.default.createElement("div", { className: 'content-use-tips' }, useText),
+        react_1.default.createElement("div", { className: 'content-name' }, name)));
 });
 tslib_1.__exportStar(require("./types"), exports);
 exports.default = next_1.ConfigProvider.config(ToolStatus);

package/lib/tool-status/main.scss

@@ -4,39 +4,52 @@
   width: fit-content;
   transition: width 0.3s ease-in-out;
   background-color: $color-fill1-1;//$color-brand1-1;
-  padding: $s-1;
-  border-radius: $s-2;
+  padding: $s-1 $s-3;
+  border-radius: $s-4;
   box-sizing: border-box;
   border: solid 1px $color-fill1-1;
   align-items: center;
+  display: flex;
+  i {
+    margin-right: $s-2;
+  }
 
   &.selected {
     background-color: $color-fill1-2;
   }
 
-  &.success {
+  &.completed {
     i {
       color: $color-success-3;
     }
   }
 
-  &.error {
+  &.failed {
     i {
       color: $color-error-3;
     }
   }
 
-  &.loading {
+  &.running, &.auth, &.started {
     i {
       color: $color-brand1-6;
     }
   }
-
-  .main-content {
-    display: flex;
-    .content-result {
-      margin-left: 4px;
+  
+  .auth-content {
+    margin-right: $s-1;
+    button {
+      font-size: $font-size-body-2 !important;
     }
   }
 
+  .content-use-tips {
+    color: $color-text1-2;
+    margin-right: $s-1;
+  }
+
+  .content-name {
+    color: $color-text1-4;
+  }
+
 }

package/lib/tool-status/types.d.ts

@@ -16,7 +16,7 @@ export interface ToolStatusProps extends React.HTMLAttributes<HTMLElement>, Comm
     /**
      * 工具调用状态
      */
-    status?: 'loading' | 'success' | 'error';
+    status?: 'started' | 'running' | 'completed' | 'failed' | 'auth';
     /**
      * 工具调用结果
      */
@@ -28,5 +28,13 @@ export interface ToolStatusProps extends React.HTMLAttributes<HTMLElement>, Comm
     /**
      * 额外的授权信息
      */
-    auth?: ToolStatusAuthProps;
+    authInfo?: ToolStatusAuthProps;
+    /**
+     * 工具名称
+     */
+    name?: string;
+    /**
+     * 工具详情链接
+     */
+    useText?: string;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alifd/chat",
-  "version": "0.3.33-beta.1",
+  "version": "0.3.33-beta.3",
   "description": "A configurable component library for chat built on React.",
   "main": "lib/index.js",
   "module": "es/index.js",