@alifd/chat 0.3.11-beta.6 → 0.3.11-beta.7

package/es/button/main.scss

@@ -13,7 +13,7 @@
       opacity: 0.8;
       border: none !important;
       color: $color-brand1-6 !important;
-      background-color: $color-brand1-1 !important;
+      background-color: $color-fill1-2 !important;
     }
 
     &:focus {

package/es/core/variables.scss

@@ -40,7 +40,6 @@ $font-size-caption: var(--font-size-caption, 12px) !default;
 
 $font-lineheight-2: var(--font-lineheight-2, 1.5) !default;
 
-
 /// 禁用
 $color-text1-1: var(--color-text1-1, #cccccc) !default;
 /// 水印/提示

package/es/index.js

@@ -24,4 +24,4 @@ export { default as Step } from './step';
 export { default as StopGenerate } from './stop-generate';
 export { default as Reference } from './reference';
 export { default as Recommend } from './recommend';
-export const version = '0.3.11-beta.6';
+export const version = '0.3.11-beta.7';

package/es/markdown/index.js

@@ -146,7 +146,7 @@ const Markdown = forwardRef((_a, ref) => {
                         navigator.clipboard.writeText(code).then(() => {
                             copyButton.textContent = '已复制';
                             setTimeout(() => {
-                                copyButton.textContent = '复制';
+                                copyButton.textContent = (others === null || others === void 0 ? void 0 : others.copyLabel) || '复制';
                             }, 1000);
                         }).catch(() => {
                             copyButton.textContent = '复制失败';
@@ -162,7 +162,7 @@ const Markdown = forwardRef((_a, ref) => {
                             document.execCommand('copy');
                             copyButton.textContent = '已复制';
                             setTimeout(() => {
-                                copyButton.textContent = '复制';
+                                copyButton.textContent = (others === null || others === void 0 ? void 0 : others.copyLabel) || '复制';
                             }, 1000);
                         }
                         catch (err) {

package/es/message/style.d.ts

@@ -1,2 +1,3 @@
 import '@alifd/next/lib/message/style2';
+import '@alifd/next/lib/icon/style2';
 import './main.scss';

package/es/message/style.js

@@ -1,2 +1,3 @@
 import '@alifd/next/lib/message/style2';
+import '@alifd/next/lib/icon/style2';
 import './main.scss';

package/es/reference/index.js

@@ -4,7 +4,7 @@
  * @type 通用 - Reference
  * @when Reference
  */
-import React, { forwardRef, useState } from 'react';
+import React, { forwardRef, useState, useEffect } from 'react';
 import { ConfigProvider } from '@alifd/next';
 import Icon from '../icon';
 import cs from 'classnames';
@@ -12,11 +12,29 @@ import { PREFIX_DEFAULT, renderCommonIcon } from '../utils';
 const DEFAULT_REFERENCE_ICON = 'https://img.alicdn.com/imgextra/i3/O1CN01hpxNXz26hRw9Jz4O1_!!6000000007693-55-tps-200-200.svg';
 const DEFAULT_DETAIL_CLOSE_ICON = 'close';
 const DEFAULT_DETAIL_TITLE = '引用信息';
-const Reference = forwardRef(({ className, defaultExpanded = false, header, listItems = [], onToggle, onItemClick, mode = 'simple', onClose, onDetailClick }, ref) => {
-    const [isExpanded, setIsExpanded] = useState(defaultExpanded);
-    const handleToggle = () => {
+const Reference = forwardRef(({ className, defaultExpanded = false, header, listItems = [], onExpandedClick, onItemClick, mode = 'simple', onHeaderClose, onHeaderClick, onContentClick, expanded }, ref) => {
+    const [isExpanded, setIsExpanded] = useState(expanded || defaultExpanded);
+    useEffect(() => {
+        if (expanded !== undefined && (expanded !== isExpanded)) {
+            setIsExpanded(expanded);
+        }
+    }, [expanded]);
+    const handleExpandedClick = () => {
+        if (onExpandedClick) {
+            onExpandedClick(!isExpanded);
+            return;
+        }
         setIsExpanded(!isExpanded);
-        onToggle && onToggle(!isExpanded);
+    };
+    const handleHeaderClick = () => {
+        if (onHeaderClick) {
+            onHeaderClick(!isExpanded);
+            return;
+        }
+        setIsExpanded(!isExpanded);
+    };
+    const handelContentClick = () => {
+        onContentClick === null || onContentClick === void 0 ? void 0 : onContentClick(isExpanded);
     };
     const renderHeader = () => {
         if (header === false) {
@@ -27,11 +45,15 @@ const Reference = forwardRef(({ className, defaultExpanded = false, header, list
         }
         let headerIcon = (header === null || header === void 0 ? void 0 : header.icon) || DEFAULT_REFERENCE_ICON;
         const iconType = isExpanded ? 'arrow-up' : 'arrow-down';
-        return (React.createElement("div", { className: `reference-header ${mode}`, onClick: handleToggle },
+        return (React.createElement("div", { className: `reference-header ${mode}`, onClick: () => {
+                handleHeaderClick();
+            } },
             React.createElement("div", { className: 'reference-name' },
                 renderCommonIcon(headerIcon),
                 React.createElement("div", { className: 'reference-title' }, header === null || header === void 0 ? void 0 : header.title)),
-            React.createElement("div", { className: 'reference-operate' },
+            React.createElement("div", { className: 'reference-operate', onClick: () => {
+                    handleExpandedClick();
+                } },
                 React.createElement(Icon, { type: iconType, size: 'xs' }))));
     };
     const renderDetailHeader = () => {
@@ -43,7 +65,7 @@ const Reference = forwardRef(({ className, defaultExpanded = false, header, list
         return (React.createElement("div", { className: `reference-header ${mode}` },
             React.createElement("div", { className: 'reference-text' }, headerTitle),
             React.createElement("div", { className: 'reference-close', onClick: () => {
-                    onClose === null || onClose === void 0 ? void 0 : onClose();
+                    onHeaderClose === null || onHeaderClose === void 0 ? void 0 : onHeaderClose();
                 } }, renderCommonIcon(headerIcon, 'small'))));
     };
     const handleReferenceClick = (item, index) => {
@@ -66,7 +88,7 @@ const Reference = forwardRef(({ className, defaultExpanded = false, header, list
             return null;
         }
         return (React.createElement("div", { className: `reference-list ${mode}`, onClick: () => {
-                onDetailClick === null || onDetailClick === void 0 ? void 0 : onDetailClick();
+                handelContentClick();
             } },
             isExpanded && mode === 'simple' && listItems.map((item, index) => (React.createElement("div", { key: index, className: 'reference-item' },
                 (item === null || item === void 0 ? void 0 : item.sourceIcon) && renderCommonIcon(item === null || item === void 0 ? void 0 : item.sourceIcon),

package/es/reference/main.scss

@@ -5,7 +5,7 @@ $detail-header-height: 62px;
 .#{$prefix}reference {
   width: fit-content;
   transition: width 0.3s ease-in-out;
-  background-color: $color-brand1-1;
+  background-color: $color-fill1-2;//$color-brand1-1;
   padding: $s-1;
   border-radius: $s-2;
   box-sizing: border-box;

package/es/reference/types.d.ts

@@ -33,10 +33,6 @@ export interface ReferenceProps extends React.HTMLAttributes<HTMLElement>, Commo
      * 是否展开，外层控制面板是否展开
      */
     expanded?: boolean;
-    /**
-     * 点击切换状态
-     */
-    onToggle?: (expanded: boolean) => void;
     /**
      * 点击对应参考来源项
      */
@@ -48,9 +44,17 @@ export interface ReferenceProps extends React.HTMLAttributes<HTMLElement>, Commo
     /**
      * 关闭参考来源点击
      */
-    onClose?: () => void;
+    onHeaderClose?: () => void;
+    /**
+     * 展开按钮点击
+     */
+    onExpandedClick?: (expanded: boolean) => void;
+    /**
+     * 头部区域点击
+     */
+    onHeaderClick?: (expanded: boolean) => void;
     /**
-     * 参考来源面板点击回调（区别于每个参考来源项的点击/头部展开点击）
+     * 内容区域点击
      */
-    onDetailClick?: () => void;
+    onContentClick?: (expanded: boolean) => void;
 }

package/lib/button/main.scss

@@ -13,7 +13,7 @@
       opacity: 0.8;
       border: none !important;
       color: $color-brand1-6 !important;
-      background-color: $color-brand1-1 !important;
+      background-color: $color-fill1-2 !important;
     }
 
     &:focus {

package/lib/core/variables.scss

@@ -40,7 +40,6 @@ $font-size-caption: var(--font-size-caption, 12px) !default;
 
 $font-lineheight-2: var(--font-lineheight-2, 1.5) !default;
 
-
 /// 禁用
 $color-text1-1: var(--color-text1-1, #cccccc) !default;
 /// 水印/提示

package/lib/index.js

@@ -54,4 +54,4 @@ var reference_1 = require("./reference");
 Object.defineProperty(exports, "Reference", { enumerable: true, get: function () { return tslib_1.__importDefault(reference_1).default; } });
 var recommend_1 = require("./recommend");
 Object.defineProperty(exports, "Recommend", { enumerable: true, get: function () { return tslib_1.__importDefault(recommend_1).default; } });
-exports.version = '0.3.11-beta.6';
+exports.version = '0.3.11-beta.7';

package/lib/markdown/index.js

@@ -148,7 +148,7 @@ const Markdown = (0, react_1.forwardRef)((_a, ref) => {
                         navigator.clipboard.writeText(code).then(() => {
                             copyButton.textContent = '已复制';
                             setTimeout(() => {
-                                copyButton.textContent = '复制';
+                                copyButton.textContent = (others === null || others === void 0 ? void 0 : others.copyLabel) || '复制';
                             }, 1000);
                         }).catch(() => {
                             copyButton.textContent = '复制失败';
@@ -164,7 +164,7 @@ const Markdown = (0, react_1.forwardRef)((_a, ref) => {
                             document.execCommand('copy');
                             copyButton.textContent = '已复制';
                             setTimeout(() => {
-                                copyButton.textContent = '复制';
+                                copyButton.textContent = (others === null || others === void 0 ? void 0 : others.copyLabel) || '复制';
                             }, 1000);
                         }
                         catch (err) {

package/lib/message/style.d.ts

@@ -1,2 +1,3 @@
 import '@alifd/next/lib/message/style2';
+import '@alifd/next/lib/icon/style2';
 import './main.scss';

package/lib/message/style.js

@@ -1,4 +1,5 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 require("@alifd/next/lib/message/style2");
+require("@alifd/next/lib/icon/style2");
 require("./main.scss");

package/lib/reference/index.js

@@ -15,11 +15,29 @@ const utils_1 = require("../utils");
 const DEFAULT_REFERENCE_ICON = 'https://img.alicdn.com/imgextra/i3/O1CN01hpxNXz26hRw9Jz4O1_!!6000000007693-55-tps-200-200.svg';
 const DEFAULT_DETAIL_CLOSE_ICON = 'close';
 const DEFAULT_DETAIL_TITLE = '引用信息';
-const Reference = (0, react_1.forwardRef)(({ className, defaultExpanded = false, header, listItems = [], onToggle, onItemClick, mode = 'simple', onClose, onDetailClick }, ref) => {
-    const [isExpanded, setIsExpanded] = (0, react_1.useState)(defaultExpanded);
-    const handleToggle = () => {
+const Reference = (0, react_1.forwardRef)(({ className, defaultExpanded = false, header, listItems = [], onExpandedClick, onItemClick, mode = 'simple', onHeaderClose, onHeaderClick, onContentClick, expanded }, ref) => {
+    const [isExpanded, setIsExpanded] = (0, react_1.useState)(expanded || defaultExpanded);
+    (0, react_1.useEffect)(() => {
+        if (expanded !== undefined && (expanded !== isExpanded)) {
+            setIsExpanded(expanded);
+        }
+    }, [expanded]);
+    const handleExpandedClick = () => {
+        if (onExpandedClick) {
+            onExpandedClick(!isExpanded);
+            return;
+        }
         setIsExpanded(!isExpanded);
-        onToggle && onToggle(!isExpanded);
+    };
+    const handleHeaderClick = () => {
+        if (onHeaderClick) {
+            onHeaderClick(!isExpanded);
+            return;
+        }
+        setIsExpanded(!isExpanded);
+    };
+    const handelContentClick = () => {
+        onContentClick === null || onContentClick === void 0 ? void 0 : onContentClick(isExpanded);
     };
     const renderHeader = () => {
         if (header === false) {
@@ -30,11 +48,15 @@ const Reference = (0, react_1.forwardRef)(({ className, defaultExpanded = false,
         }
         let headerIcon = (header === null || header === void 0 ? void 0 : header.icon) || DEFAULT_REFERENCE_ICON;
         const iconType = isExpanded ? 'arrow-up' : 'arrow-down';
-        return (react_1.default.createElement("div", { className: `reference-header ${mode}`, onClick: handleToggle },
+        return (react_1.default.createElement("div", { className: `reference-header ${mode}`, onClick: () => {
+                handleHeaderClick();
+            } },
             react_1.default.createElement("div", { className: 'reference-name' },
                 (0, utils_1.renderCommonIcon)(headerIcon),
                 react_1.default.createElement("div", { className: 'reference-title' }, header === null || header === void 0 ? void 0 : header.title)),
-            react_1.default.createElement("div", { className: 'reference-operate' },
+            react_1.default.createElement("div", { className: 'reference-operate', onClick: () => {
+                    handleExpandedClick();
+                } },
                 react_1.default.createElement(icon_1.default, { type: iconType, size: 'xs' }))));
     };
     const renderDetailHeader = () => {
@@ -46,7 +68,7 @@ const Reference = (0, react_1.forwardRef)(({ className, defaultExpanded = false,
         return (react_1.default.createElement("div", { className: `reference-header ${mode}` },
             react_1.default.createElement("div", { className: 'reference-text' }, headerTitle),
             react_1.default.createElement("div", { className: 'reference-close', onClick: () => {
-                    onClose === null || onClose === void 0 ? void 0 : onClose();
+                    onHeaderClose === null || onHeaderClose === void 0 ? void 0 : onHeaderClose();
                 } }, (0, utils_1.renderCommonIcon)(headerIcon, 'small'))));
     };
     const handleReferenceClick = (item, index) => {
@@ -69,7 +91,7 @@ const Reference = (0, react_1.forwardRef)(({ className, defaultExpanded = false,
             return null;
         }
         return (react_1.default.createElement("div", { className: `reference-list ${mode}`, onClick: () => {
-                onDetailClick === null || onDetailClick === void 0 ? void 0 : onDetailClick();
+                handelContentClick();
             } },
             isExpanded && mode === 'simple' && listItems.map((item, index) => (react_1.default.createElement("div", { key: index, className: 'reference-item' },
                 (item === null || item === void 0 ? void 0 : item.sourceIcon) && (0, utils_1.renderCommonIcon)(item === null || item === void 0 ? void 0 : item.sourceIcon),

package/lib/reference/main.scss

@@ -5,7 +5,7 @@ $detail-header-height: 62px;
 .#{$prefix}reference {
   width: fit-content;
   transition: width 0.3s ease-in-out;
-  background-color: $color-brand1-1;
+  background-color: $color-fill1-2;//$color-brand1-1;
   padding: $s-1;
   border-radius: $s-2;
   box-sizing: border-box;

package/lib/reference/types.d.ts

@@ -33,10 +33,6 @@ export interface ReferenceProps extends React.HTMLAttributes<HTMLElement>, Commo
      * 是否展开，外层控制面板是否展开
      */
     expanded?: boolean;
-    /**
-     * 点击切换状态
-     */
-    onToggle?: (expanded: boolean) => void;
     /**
      * 点击对应参考来源项
      */
@@ -48,9 +44,17 @@ export interface ReferenceProps extends React.HTMLAttributes<HTMLElement>, Commo
     /**
      * 关闭参考来源点击
      */
-    onClose?: () => void;
+    onHeaderClose?: () => void;
+    /**
+     * 展开按钮点击
+     */
+    onExpandedClick?: (expanded: boolean) => void;
+    /**
+     * 头部区域点击
+     */
+    onHeaderClick?: (expanded: boolean) => void;
     /**
-     * 参考来源面板点击回调（区别于每个参考来源项的点击/头部展开点击）
+     * 内容区域点击
      */
-    onDetailClick?: () => void;
+    onContentClick?: (expanded: boolean) => void;
 }

package/package.json

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