@agentscope-ai/chat 1.1.45-beta.1766386435551 → 1.1.45-beta.1766389993910

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/components/ChatAnywhere/Input/index.tsx +28 -10
  2. package/components/Sender/style/index.ts +2 -0
  3. package/lib/ChatAnywhere/Input/index.js +38 -9
  4. package/lib/Sender/style/index.js +1 -1
  5. package/package.json +1 -1
package/components/ChatAnywhere/Input/index.tsx CHANGED
@@ -4,10 +4,11 @@ import { useProviderContext, ChatInput, uuid, Sender, Attachments } from '@agent
4
4
  import cls from 'classnames';
5
5
  import { useChatAnywhere } from '../hooks/ChatAnywhereProvider';
6
6
  import { useInput } from '../hooks/useInput';
7
- import { Button, GetProp, Space, Upload } from 'antd';
7
+ import { GetProp, Space, Upload } from 'antd';
8
8
  import Style from './style';
9
- import { IconButton } from '@agentscope-ai/design';
9
+ import { IconButton, Button } from '@agentscope-ai/design';
10
10
  import { AIGC } from '@agentscope-ai/chat';
11
+ import { PlusOutlined } from '@ant-design/icons';
11
12
 
12
13
  type AttachedFiles = GetProp<typeof Attachments, 'items'>;
13
14
 
@@ -90,6 +91,23 @@ export default forwardRef(function (_, ref) {
90
91
  return [];
91
92
  }
92
93
  const nodes = onUpload.map((item, index) => {
94
+
95
+ let trigger;
96
+
97
+ if (item.trigger) {
98
+ trigger = item.trigger;
99
+ } else if (item.title || item.description) {
100
+ trigger = <Button type='text' icon={item.icon} >
101
+ {item.title && <span>{item.title}</span>}
102
+ {item.description && <span style={{ fontSize: '0.8em', opacity: 0.8 }}>{item.description}</span>}
103
+ </Button>
104
+ } else {
105
+ trigger = <IconButton
106
+ icon={item.icon}
107
+ bordered={false}
108
+ />
109
+ }
110
+
93
111
  return <Upload
94
112
  {...item}
95
113
  fileList={attachedFiles[index]}
@@ -106,19 +124,19 @@ export default forwardRef(function (_, ref) {
106
124
  showUploadList={false}
107
125
  >
108
126
  {
109
- item.trigger || <IconButton
110
- icon={item.icon}
111
- bordered={false}
112
- />
127
+ trigger
113
128
  }
114
129
  </Upload>
115
130
  });
116
131
 
117
132
  if (nodes.length === 1) return nodes;
118
- return <Popover content={nodes} trigger="click">
119
- <Flex vertical>
120
- {nodes}
121
- </Flex>
133
+ return <Popover content={<Flex vertical>
134
+ {nodes}
135
+ </Flex>} trigger="click" styles={{ body: { padding: 4 } }}>
136
+ <IconButton
137
+ icon={<PlusOutlined />}
138
+ bordered={false}
139
+ />
122
140
  </Popover>
123
141
 
124
142
 
package/components/Sender/style/index.ts CHANGED
@@ -69,7 +69,9 @@ const IndexStyle = createGlobalStyle`
69
69
  }
70
70
 
71
71
  &-prefix {
72
+ width: 0;
72
73
  flex: 1;
74
+ overflow: auto;
73
75
  }
74
76
 
75
77
  &-input {
package/lib/ChatAnywhere/Input/index.js CHANGED
@@ -25,12 +25,13 @@ import { useChatAnywhere } from "../hooks/ChatAnywhereProvider";
25
25
  import { useInput } from "../hooks/useInput";
26
26
  import { Upload } from 'antd';
27
27
  import Style from "./style";
28
- import { IconButton } from '@agentscope-ai/design';
28
+ import { IconButton, Button } from '@agentscope-ai/design';
29
29
  import { AIGC } from "../..";
30
+ import { PlusOutlined } from "@agentscope-ai/icons-override-antd";
30
31
  import { jsx as _jsx } from "react/jsx-runtime";
32
+ import { jsxs as _jsxs } from "react/jsx-runtime";
31
33
  import { createElement as _createElement } from "react";
32
34
  import { Fragment as _Fragment } from "react/jsx-runtime";
33
- import { jsxs as _jsxs } from "react/jsx-runtime";
34
35
  export default /*#__PURE__*/forwardRef(function (_, ref) {
35
36
  var _React$useState = React.useState(''),
36
37
  _React$useState2 = _slicedToArray(_React$useState, 2),
@@ -129,6 +130,29 @@ export default /*#__PURE__*/forwardRef(function (_, ref) {
129
130
  return [];
130
131
  }
131
132
  var nodes = onUpload.map(function (item, index) {
133
+ var trigger;
134
+ if (item.trigger) {
135
+ trigger = item.trigger;
136
+ } else if (item.title || item.description) {
137
+ trigger = /*#__PURE__*/_jsxs(Button, {
138
+ type: "text",
139
+ icon: item.icon,
140
+ children: [item.title && /*#__PURE__*/_jsx("span", {
141
+ children: item.title
142
+ }), item.description && /*#__PURE__*/_jsx("span", {
143
+ style: {
144
+ fontSize: '0.8em',
145
+ opacity: 0.8
146
+ },
147
+ children: item.description
148
+ })]
149
+ });
150
+ } else {
151
+ trigger = /*#__PURE__*/_jsx(IconButton, {
152
+ icon: item.icon,
153
+ bordered: false
154
+ });
155
+ }
132
156
  return /*#__PURE__*/_createElement(Upload, _objectSpread(_objectSpread({}, item), {}, {
133
157
  fileList: attachedFiles[index],
134
158
  key: index,
@@ -141,18 +165,23 @@ export default /*#__PURE__*/forwardRef(function (_, ref) {
141
165
  }
142
166
  },
143
167
  showUploadList: false
144
- }), item.trigger || /*#__PURE__*/_jsx(IconButton, {
145
- icon: item.icon,
146
- bordered: false
147
- }));
168
+ }), trigger);
148
169
  });
149
170
  if (nodes.length === 1) return nodes;
150
171
  return /*#__PURE__*/_jsx(Popover, {
151
- content: nodes,
152
- trigger: "click",
153
- children: /*#__PURE__*/_jsx(Flex, {
172
+ content: /*#__PURE__*/_jsx(Flex, {
154
173
  vertical: true,
155
174
  children: nodes
175
+ }),
176
+ trigger: "click",
177
+ styles: {
178
+ body: {
179
+ padding: 4
180
+ }
181
+ },
182
+ children: /*#__PURE__*/_jsx(IconButton, {
183
+ icon: /*#__PURE__*/_jsx(PlusOutlined, {}),
184
+ bordered: false
156
185
  })
157
186
  });
158
187
  }, [onInput.variant, onUpload, attachedFiles]);
package/lib/Sender/style/index.js CHANGED
@@ -1,7 +1,7 @@
1
1
  var _templateObject;
2
2
  function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
3
3
  import { createGlobalStyle } from 'antd-style';
4
- var IndexStyle = createGlobalStyle(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n.", "-sender {\n position: relative;\n width: 100%;\n box-sizing: border-box;\n box-shadow: 0px 12px 24px -16px rgba(54, 54, 73, 0.04),\n 0px 12px 40px 0px rgba(51, 51, 71, 0.08),\n 0px 0px 1px 0px rgba(44, 44, 54, 0.02);\n background-color: ", ";\n border-radius: ", "px;\n border-color: ", ";\n border-width: 0;\n border-style: solid;\n overflow: hidden;\n\n &:after {\n content: '';\n position: absolute;\n inset: 0;\n pointer-events: none;\n transition: border-color ", ";\n border-radius: inherit;\n border-style: inherit;\n border-color: inherit;\n border-width: ", "px;\n }\n\n &:focus-within {\n box-shadow: 0px 12px 24px -16px rgba(54, 54, 73, 0.04),\n 0px 12px 40px 0px rgba(51, 51, 71, 0.08),\n 0px 0px 1px 0px rgba(44, 44, 54, 0.02);\n border-color: ", ";\n\n &:after {\n border-width: ", "px;\n }\n }\n\n &-disabled {\n .", "-sender-content,\n .", "-sender-header {\n background-color: ", ";\n }\n }\n\n &-blur {\n .", "-sender-input {\n height: 22px !important;\n min-height: 22px !important;\n }\n }\n\n &.", "-sender-rtl {\n direction: rtl;\n }\n\n &-content {\n width: 100%;\n padding: 8px;\n box-sizing: border-box;\n overflow: hidden;\n }\n\n &-content-bottom {\n margin-top: 4px;\n display: flex;\n }\n\n &-prefix {\n flex: 1;\n }\n\n &-input {\n margin: 4px 0;\n padding: 0 8px;\n border-radius: 0;\n align-self: center;\n font-size: 14px;\n line-height: 22px;\n }\n\n &-actions-list {\n flex: none;\n display: flex;\n margin: 0 0 0 auto;\n\n &-presets {\n gap: ", "px;\n }\n\n &-length {\n font-size: 12px;\n line-height: 1;\n display: flex;\n align-items: center;\n padding: 0 12px;\n color: ", ";\n }\n }\n\n &-recording {\n height: 30px;\n padding: 0 8px;\n &-icon {\n display: block;\n width: 100%;\n height: 30px;\n }\n }\n\n &-actions-btn {\n &-disabled {\n background: ", ";\n }\n\n &-loading-button {\n padding: 0;\n border: 0;\n }\n\n &-loading-icon {\n height: ", "px;\n width: ", "px;\n vertical-align: top;\n }\n\n &-recording-icon {\n height: 1.2em;\n width: 1.2em;\n vertical-align: top;\n }\n\n \n }\n}\n\n.", "-sender {\n &-header {\n &-motion {\n transition: height .3s, border .3s;\n overflow: hidden;\n &-enter-start,\n &-leave-active {\n border-bottom-color: transparent;\n }\n\n &-hidden {\n display: none;\n }\n }\n }\n}\n"])), function (p) {
4
+ var IndexStyle = createGlobalStyle(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n.", "-sender {\n position: relative;\n width: 100%;\n box-sizing: border-box;\n box-shadow: 0px 12px 24px -16px rgba(54, 54, 73, 0.04),\n 0px 12px 40px 0px rgba(51, 51, 71, 0.08),\n 0px 0px 1px 0px rgba(44, 44, 54, 0.02);\n background-color: ", ";\n border-radius: ", "px;\n border-color: ", ";\n border-width: 0;\n border-style: solid;\n overflow: hidden;\n\n &:after {\n content: '';\n position: absolute;\n inset: 0;\n pointer-events: none;\n transition: border-color ", ";\n border-radius: inherit;\n border-style: inherit;\n border-color: inherit;\n border-width: ", "px;\n }\n\n &:focus-within {\n box-shadow: 0px 12px 24px -16px rgba(54, 54, 73, 0.04),\n 0px 12px 40px 0px rgba(51, 51, 71, 0.08),\n 0px 0px 1px 0px rgba(44, 44, 54, 0.02);\n border-color: ", ";\n\n &:after {\n border-width: ", "px;\n }\n }\n\n &-disabled {\n .", "-sender-content,\n .", "-sender-header {\n background-color: ", ";\n }\n }\n\n &-blur {\n .", "-sender-input {\n height: 22px !important;\n min-height: 22px !important;\n }\n }\n\n &.", "-sender-rtl {\n direction: rtl;\n }\n\n &-content {\n width: 100%;\n padding: 8px;\n box-sizing: border-box;\n overflow: hidden;\n }\n\n &-content-bottom {\n margin-top: 4px;\n display: flex;\n }\n\n &-prefix {\n width: 0;\n flex: 1;\n overflow: auto;\n }\n\n &-input {\n margin: 4px 0;\n padding: 0 8px;\n border-radius: 0;\n align-self: center;\n font-size: 14px;\n line-height: 22px;\n }\n\n &-actions-list {\n flex: none;\n display: flex;\n margin: 0 0 0 auto;\n\n &-presets {\n gap: ", "px;\n }\n\n &-length {\n font-size: 12px;\n line-height: 1;\n display: flex;\n align-items: center;\n padding: 0 12px;\n color: ", ";\n }\n }\n\n &-recording {\n height: 30px;\n padding: 0 8px;\n &-icon {\n display: block;\n width: 100%;\n height: 30px;\n }\n }\n\n &-actions-btn {\n &-disabled {\n background: ", ";\n }\n\n &-loading-button {\n padding: 0;\n border: 0;\n }\n\n &-loading-icon {\n height: ", "px;\n width: ", "px;\n vertical-align: top;\n }\n\n &-recording-icon {\n height: 1.2em;\n width: 1.2em;\n vertical-align: top;\n }\n\n \n }\n}\n\n.", "-sender {\n &-header {\n &-motion {\n transition: height .3s, border .3s;\n overflow: hidden;\n &-enter-start,\n &-leave-active {\n border-bottom-color: transparent;\n }\n\n &-hidden {\n display: none;\n }\n }\n }\n}\n"])), function (p) {
5
5
  return p.theme.prefixCls;
6
6
  }, function (p) {
7
7
  return p.theme.colorBgBase;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@agentscope-ai/chat",
3
- "version": "1.1.45-beta.1766386435551",
3
+ "version": "1.1.45-beta.1766389993910",
4
4
  "description": "a free and open-source chat framework for building excellent LLM-powered chat experiences",
5
5
  "license": "Apache-2.0",
6
6
  "sideEffects": [