@ray-js/t-agent-ui-ray 0.2.0-beta-2 → 0.2.0-beta-4

package/dist/ChatContainer/index.js

@@ -12,6 +12,13 @@ import { defaultRenderOptions } from '../renderOption';
 import logger from '../logger';
 export default function ChatContainer(props) {
   const [keyboardHeight, setKeyboardHeight] = useState(0);
+  const [windowSize, setWindowSize] = useState(() => {
+    const info = ty.getSystemInfoSync();
+    return {
+      width: info.windowWidth,
+      height: info.windowHeight
+    };
+  });
   const {
     createAgent,
     renderOptions = defaultRenderOptions,
@@ -25,6 +32,13 @@ export default function ChatContainer(props) {
     if (!agent.plugins.ui) {
       throw new Error('UI plugin not found');
     }
+    agent.session.initValue('UIRay.multiSelect.show', false);
+    agent.session.initValue('UIRay.multiSelect.selected', []);
+    agent.session.onChange((key, value) => {
+      if (key === 'UIRay.multiSelect.show' && !value) {
+        agent.session.set('UIRay.multiSelect.selected', []);
+      }
+    });
     return agent;
   });
   if (props.agentRef) {
@@ -135,6 +149,17 @@ export default function ChatContainer(props) {
     const hide = () => {
       setKeyboardHeight(0);
     };
+    const resize = _ref4 => {
+      let {
+        size
+      } = _ref4;
+      setWindowSize({
+        width: size.windowWidth,
+        height: size.windowHeight
+      });
+    };
+    // @ts-ignore
+    ty.onWindowResize(resize);
     ty.onKeyboardWillShow(show);
     ty.onKeyboardWillHide(hide);
     ty.onKeyboardHeightChange(show);
@@ -142,12 +167,16 @@ export default function ChatContainer(props) {
       ty.offKeyboardWillShow(show);
       ty.offKeyboardWillHide(hide);
       ty.offKeyboardHeightChange(show);
+      // @ts-ignore
+      ty.offWindowResize(resize);
     };
   }, []);
   return /*#__PURE__*/React.createElement(View, {
     style: _objectSpread({
       // @ts-ignore
-      '--t-agent-chat-container-keyboard-height': "".concat(keyboardHeight, "px")
+      '--t-agent-chat-container-keyboard-height': "".concat(keyboardHeight, "px"),
+      '--t-agent-chat-container-window-height': "".concat(windowSize.height, "px"),
+      '--t-agent-chat-container-window-width': "".concat(windowSize.width, "px")
     }, style),
     className: cx('t-agent-chat-container', className, {
       't-agent-chat-container-keyboard-show': keyboardHeight > 0

package/dist/MessageInput/MessageInputAIStream/AsrInput.d.ts

@@ -1,15 +1,14 @@
 import React from 'react';
-export declare const WaveformVisualizer: ({ amplitudeCount }: {
-    amplitudeCount: number;
-}) => React.JSX.Element;
-interface IProps {
+interface Props {
     amplitudeCount: number;
+    responding: boolean;
     recording: boolean;
     disabled?: boolean;
     onConfirm: () => void;
     onRecord: () => void;
     onCancel: () => void;
     onBack: () => void;
+    onAbort: () => void;
 }
-declare const AsrInput: (props: IProps) => React.JSX.Element;
+declare const AsrInput: (props: Props) => React.JSX.Element;
 export default AsrInput;

package/dist/MessageInput/MessageInputAIStream/AsrInput.js

@@ -1,112 +1,80 @@
-import "core-js/modules/es.regexp.exec.js";
-import "core-js/modules/esnext.iterator.constructor.js";
-import "core-js/modules/esnext.iterator.map.js";
 import "core-js/modules/web.dom-collections.iterator.js";
-import React, { useState } from 'react';
+import React, { useRef, useState } from 'react';
 import { Button, View } from '@ray-js/ray';
 import cx from 'clsx';
-import { useOnEvent, useTranslate } from '../../hooks';
-export const WaveformVisualizer = _ref => {
-  let {
-    amplitudeCount
-  } = _ref;
-  const [bars, setBars] = useState(() => Array.from({
-    length: amplitudeCount
-  }, (_, index) => /*#__PURE__*/React.createElement(View
-  // eslint-disable-next-line react/no-array-index-key
-  , {
-    key: "asr_wave_".concat(index),
-    className: "t-agent-message-input-waveform-bar",
-    style: {
-      height: 0,
-      // 添加渐变色偏移效果
-      animationDelay: "".concat(index * 10, "ms")
-    }
-  })));
-  useOnEvent('amplitudes', val => {
-    const waveBase = val.body.amplitudes || [];
-    const bars = waveBase.map((item, index) => {
-      const value = item > 1 ? 1 : item * 100;
-      // 将数值映射到高度范围（0-100 → 2px-20px）
-      // const height = 2 + (value / 100) * 18;
-      return /*#__PURE__*/React.createElement(View
-      // eslint-disable-next-line react/no-array-index-key
-      , {
-        key: "asr_wave_".concat(index),
-        className: "t-agent-message-input-waveform-bar t-agent-item",
-        style: {
-          height: "".concat(value, "%"),
-          // 添加渐变色偏移效果
-          animationDelay: "".concat(index * 10, "ms")
-        }
-      });
-    });
-    setBars(bars);
-  });
-  return /*#__PURE__*/React.createElement(View, {
-    className: "t-agent-message-input-waveform-container"
-  }, bars);
-};
+import { useTranslate } from '../../hooks';
+import { WaveformVisualizer } from './WaveformVisualizer';
 const AsrInput = props => {
-  const [asrElementBounds, setAsrElementBounds] = useState(null);
+  const touchRef = useRef({
+    startAt: 0,
+    y: 0
+  });
   const t = useTranslate();
-  const [ptt, setPtt] = useState(false);
-  const onVoiceTouchEnd = e => {
-    const touch = e.origin.changedTouches[0];
-    const touchY = touch.clientY;
-    setPtt(false);
-    // 误触状态
-    if (!asrElementBounds) {
-      setTimeout(() => {
-        props.onCancel();
-      }, 200);
-      setAsrElementBounds(null);
+  const [active, setActive] = useState(false);
+  const [cancel, setCancel] = useState(false);
+  const onVoiceTouchEnd = event => {
+    const touchY = event.changedTouches[0].pageY;
+    setCancel(false);
+    setActive(false);
+    if (touchRef.current.y - touchY > 100) {
+      touchRef.current = {
+        startAt: 0,
+        y: 0
+      };
+      props.onCancel();
       return;
     }
-    // 上滑取消
-    if (touchY < asrElementBounds.top - 100) {
-      setTimeout(() => {
-        props.onCancel();
-      }, 200);
-      setAsrElementBounds(null);
+    if (Date.now() - touchRef.current.startAt < 500) {
+      // 这种情况是误触，直接取消
+      touchRef.current = {
+        startAt: 0,
+        y: 0
+      };
+      props.onCancel();
       return;
     }
-    setTimeout(() => {
-      props.onConfirm();
-    }, 200);
-    setAsrElementBounds(null);
+    props.onConfirm();
   };
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(View, {
+  return /*#__PURE__*/React.createElement(View, {
+    className: "t-agent-message-input-ptt-bar"
+  }, /*#__PURE__*/React.createElement(View, {
     className: cx('t-agent-message-input-ptt', {
-      't-agent-message-input-ptt-handle': ptt
+      't-agent-message-input-ptt-active': active,
+      't-agent-message-input-ptt-cancel': cancel
     }),
-    onTouchStart: () => {
-      const query = ty.createSelectorQuery();
-      query.select('.t-agent-message-input-ptt').boundingClientRect(rect => {
-        if (!rect) return;
-        setAsrElementBounds(rect);
-      }).exec();
-      setPtt(true);
-      setTimeout(() => {
-        props.onRecord();
-      }, 200);
+    onTouchStart: async event => {
+      var _event$touches$;
+      touchRef.current = {
+        startAt: Date.now(),
+        y: (_event$touches$ = event.touches[0]) === null || _event$touches$ === void 0 ? void 0 : _event$touches$.pageY
+      };
+      setActive(true);
+      props.onRecord();
+    },
+    onTouchMove: event => {
+      const touch = event.touches[0];
+      const touchY = touch.pageY;
+      setCancel(touchRef.current.y - touchY > 100);
     },
     onTouchCancel: onVoiceTouchEnd,
     onTouchEnd: onVoiceTouchEnd
-  }, props.recording ? /*#__PURE__*/React.createElement(View, {
-    className: "t-agent-message-input-oninput"
   }, /*#__PURE__*/React.createElement(View, {
-    className: "t-agent-message-input-oninput-text-top"
+    className: "t-agent-message-input-ptt-text"
+  }, " ", t('t-agent.input.asr.ptt')), /*#__PURE__*/React.createElement(View, {
+    className: cx('t-agent-message-input-ptt-overlay', {
+      't-agent-message-input-ptt-overlay-active': active,
+      't-agent-message-input-ptt-overlay-cancel': cancel
+    })
+  }, /*#__PURE__*/React.createElement(View, {
+    className: "t-agent-message-input-ptt-active-text-top"
   }, t('t-agent.input.asr.oninput.text.top')), /*#__PURE__*/React.createElement(View, {
-    className: "t-agent-message-input-oninput-text-center"
+    className: "t-agent-message-input-ptt-active-text-center"
   }, t('t-agent.input.asr.oninput.text.center')), /*#__PURE__*/React.createElement(WaveformVisualizer, {
     amplitudeCount: props.amplitudeCount
-  })) : /*#__PURE__*/React.createElement(View, {
-    className: "t-agent-message-input-ptt-text"
-  }, " ", t('t-agent.input.asr.ptt'))), !props.recording && /*#__PURE__*/React.createElement(Button, {
-    className: "t-agent-message-input-button t-agent-message-input-button-keyboard",
+  }))), !props.recording && /*#__PURE__*/React.createElement(Button, {
+    className: cx('t-agent-message-input-button', 't-agent-message-input-ptt-action-button', props.responding ? 't-agent-message-input-button-stop' : 't-agent-message-input-button-keyboard'),
     "data-testid": "t-agent-message-input-button-asr",
-    onClick: props.onBack
+    onClick: props.responding ? props.onAbort : props.onBack
   }));
 };
 export default AsrInput;

package/dist/MessageInput/MessageInputAIStream/WaveformVisualizer.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+export declare const WaveformVisualizer: ({ amplitudeCount }: {
+    amplitudeCount: number;
+}) => React.JSX.Element;

package/dist/MessageInput/MessageInputAIStream/WaveformVisualizer.js

@@ -0,0 +1,47 @@
+import "core-js/modules/esnext.iterator.constructor.js";
+import "core-js/modules/esnext.iterator.map.js";
+import "core-js/modules/web.dom-collections.iterator.js";
+import React, { useState } from 'react';
+import { View } from '@ray-js/ray';
+import { useOnEvent } from '../../hooks';
+export const WaveformVisualizer = _ref => {
+  let {
+    amplitudeCount
+  } = _ref;
+  const [bars, setBars] = useState(() => Array.from({
+    length: amplitudeCount
+  }, (_, index) => /*#__PURE__*/React.createElement(View
+  // eslint-disable-next-line react/no-array-index-key
+  , {
+    key: "asr_wave_".concat(index),
+    className: "t-agent-message-input-waveform-bar",
+    style: {
+      height: 0,
+      // 添加渐变色偏移效果
+      animationDelay: "".concat(index * 10, "ms")
+    }
+  })));
+  useOnEvent('amplitudes', val => {
+    const waveBase = val.body.amplitudes || [];
+    const bars = waveBase.map((item, index) => {
+      const value = item > 1 ? 1 : item * 100;
+      // 将数值映射到高度范围（0-100 → 2px-20px）
+      // const height = 2 + (value / 100) * 18;
+      return /*#__PURE__*/React.createElement(View
+      // eslint-disable-next-line react/no-array-index-key
+      , {
+        key: "asr_wave_".concat(index),
+        className: "t-agent-message-input-waveform-bar",
+        style: {
+          height: "".concat(value, "%"),
+          // 添加渐变色偏移效果
+          animationDelay: "".concat(index * 10, "ms")
+        }
+      });
+    });
+    setBars(bars);
+  });
+  return /*#__PURE__*/React.createElement(View, {
+    className: "t-agent-message-input-waveform-container"
+  }, bars);
+};

package/dist/MessageInput/MessageInputAIStream/index.js

@@ -14,8 +14,9 @@ import imageSvg from '../icons/image.svg';
 import videoSvg from '../icons/video.svg';
 import loadingSvg from '../icons/loading.svg';
 import closeCircleSvg from '../icons/close-circle.svg';
-import { useAttachmentInput, useChatAgent, useEmitEvent, useIsUnmounted, useOnEvent, useTranslate } from '../../hooks';
+import { useAgentSessionValue, useAttachmentInput, useChatAgent, useEmitEvent, useIsUnmounted, useOnEvent, useTranslate } from '../../hooks';
 import AsrInput from './AsrInput';
+import { useSleep } from '../../hooks/useSleep';
 const AMPLITUDE_COUNT = 60;
 export default function MessageInputAIStream(props) {
   const [moreOpen, setMoreOpen] = useState(false);
@@ -50,9 +51,10 @@ export default function MessageInputAIStream(props) {
       setResponding(false);
     }
   });
-  const isMore = !text.trim().length && true;
+  const [hasMore] = useAgentSessionValue('multiModal');
+  const isMore = !text.trim().length && hasMore;
   const send = async inputBlocks => {
-    if (!(inputBlocks !== null && inputBlocks !== void 0 && inputBlocks.length) || attachmentInput.uploading || responding) {
+    if (!(inputBlocks !== null && inputBlocks !== void 0 && inputBlocks.length)) {
       return;
     }
     setUploaded([]);
@@ -63,8 +65,8 @@ export default function MessageInputAIStream(props) {
     ac.signal.addEventListener('abort', () => {
       if (acRef.current === ac) {
         acRef.current = null;
+        setResponding(false);
       }
-      setResponding(false);
     });
     try {
       await agent.pushInputBlocks(inputBlocks, ac.signal);
@@ -131,7 +133,9 @@ export default function MessageInputAIStream(props) {
       });
     }
   };
+  const sleep = useSleep();
   let container;
+  const canSend = text.trim().length && !responding && !attachmentInput.uploading;
   if (mode === 'text') {
     container = /*#__PURE__*/React.createElement(View, {
       className: "t-agent-message-input-text-bar"
@@ -145,7 +149,7 @@ export default function MessageInputAIStream(props) {
       "data-testid": "t-agent-message-input-text-inner",
       className: "t-agent-message-input-text-inner",
       onConfirm: () => {
-        if (text.trim().length) {
+        if (canSend) {
           send([...attachmentInput.blocks, {
             type: 'text',
             text
@@ -193,7 +197,7 @@ export default function MessageInputAIStream(props) {
           }
         } else if (isMore) {
           openMoreClick();
-        } else if (text.trim().length) {
+        } else if (canSend) {
           await send([...attachmentInput.blocks, {
             type: 'text',
             text
@@ -202,21 +206,25 @@ export default function MessageInputAIStream(props) {
       }
     }));
   } else {
-    container = /*#__PURE__*/React.createElement(View, {
-      className: "t-agent-message-input-text-bar"
-    }, /*#__PURE__*/React.createElement(View, {
-      className: "t-agent-message-input-text-group"
-    }, /*#__PURE__*/React.createElement(AsrInput, {
+    container = /*#__PURE__*/React.createElement(AsrInput, {
+      responding: responding,
       disabled: responding,
       amplitudeCount: AMPLITUDE_COUNT,
       recording: record.recording,
       onRecord: async () => {
+        if (attachmentInput.uploading) {
+          return;
+        }
+        if (responding && acRef.current) {
+          acRef.current.abort('User abort');
+          // 中断后等待一会再开始
+          await sleep(50);
+        }
         const emitter = new Emitter();
         setRecord({
           startAt: Date.now(),
           recording: true,
           confirm: () => {
-            console.log('setRecord confirm');
             emitter.dispatchEvent(new EmitterEvent('confirm'));
             setRecord({
               startAt: 0,
@@ -226,7 +234,6 @@ export default function MessageInputAIStream(props) {
             });
           },
           cancel: () => {
-            console.log('setRecord cancel');
             emitter.dispatchEvent(new EmitterEvent('cancel'));
             setRecord({
               startAt: 0,
@@ -237,7 +244,6 @@ export default function MessageInputAIStream(props) {
           }
         });
         emitter.addEventListener('error', event => {
-          console.log('setRecord error');
           ty.showToast({
             icon: 'error',
             title: t('t-agent.input.voice.recording-failed')
@@ -250,7 +256,6 @@ export default function MessageInputAIStream(props) {
             cancel: null
           });
         });
-        console.log('setRecord send');
         await send([...attachmentInput.blocks, {
           type: 'audio',
           audio_emitter: emitter,
@@ -259,16 +264,19 @@ export default function MessageInputAIStream(props) {
       },
       onConfirm: () => {
         var _record$confirm;
-        console.log('test onConfirm');
         (_record$confirm = record.confirm) === null || _record$confirm === void 0 || _record$confirm.call(record);
       },
       onCancel: () => {
         var _record$cancel;
-        console.log('test onCancel');
         (_record$cancel = record.cancel) === null || _record$cancel === void 0 || _record$cancel.call(record);
       },
-      onBack: () => setMode('text')
-    })));
+      onBack: () => setMode('text'),
+      onAbort: () => {
+        if (responding && acRef.current) {
+          acRef.current.abort('User abort');
+        }
+      }
+    });
   }
   return /*#__PURE__*/React.createElement(View, {
     className: "".concat(props.className || '', " t-agent-message-input"),

package/dist/MessageInput/index.less

@@ -146,12 +146,16 @@
   right: 10rpx;
 }
 
-.t-agent-message-input-button-keyboard {
-  background: transparent url('icons/keyboard.svg') no-repeat center;
+.t-agent-message-input-ptt-action-button {
   position: absolute;
   top: 50%;
   transform: translateY(-50%);
-  right: 10rpx;
+  right: 32rpx;
+}
+
+.t-agent-message-input-button-keyboard {
+  border: 2rpx solid var(--t-agent-input-border-color);
+  background: transparent url('icons/text.svg') no-repeat center;
 }
 
 .t-agent-message-input-button-stop {
@@ -314,37 +318,64 @@
   min-height: 56rpx;
 }
 
-@transition-duration: 0.3s;
+.t-agent-message-input-ptt-bar {
+  padding: 16rpx 32rpx;
+  position: relative;
+}
 
 .t-agent-message-input-ptt {
   background: transparent;
   padding: 0;
   border: none;
-  height: 56rpx;
+  height: 72rpx;
   display: flex;
   justify-content: center;
   align-items: center;
-  transition: height @transition-duration ease-in-out; // 定义高度变化的过渡效果
-}
-
-.t-agent-message-input-ptt-handle {
-  height: 224rpx;
+  transition: height 0.3s ease-in-out; // 定义高度变化的过渡效果
 }
 
 .t-agent-message-input-ptt-text {
   font-size: 32rpx;
   line-height: 56rpx;
-  color: var(--app-M1-B1);
+  color: var(--app-B1-N1);
   text-align: center;
 }
 
-.t-agent-message-input-oninput-text-top {
+.t-agent-message-input-ptt-overlay-cancel {
+
+}
+
+.t-agent-message-input-ptt-overlay {
+  position: absolute;
+  height: 100%;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background-color: var(--app-B1);
+  pointer-events: none;
+  opacity: 0;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  border-top: 2rpx solid var(--t-agent-input-border-color);
+  z-index: 2;
+  transition: opacity 0s ease 0.1s, height 0.3s ease;
+
+  &.t-agent-message-input-ptt-overlay-active {
+    transition: opacity 0s ease 0s, height 0.3s ease;
+    opacity: 1;
+    height: calc(100% + 150rpx);
+  }
+}
+
+.t-agent-message-input-ptt-active-text-top {
   font-size: 32rpx;
   line-height: 56rpx;
   color: var(--app-M1-B1);
   text-align: center;
 }
-.t-agent-message-input-oninput-text-center {
+
+.t-agent-message-input-ptt-active-text-center {
   font-size: 20rpx;
   color: var(--app-M1-B1);
   text-align: center;
@@ -365,7 +396,7 @@
   background-color: var(--app-M4);
   border-radius: 2rpx;
   transition: height 0.3s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.3s ease;
-  animation: colorPulse 2s infinite;
+  animation: t-agent-message-input-waveform-bar-color-pulse 2s infinite;
   margin-right: 4rpx;
   opacity: 1;
 
@@ -374,7 +405,7 @@
   }
 }
 
-@keyframes colorPulse {
+@keyframes t-agent-message-input-waveform-bar-color-pulse {
   0% {
     opacity: 1;
   }

package/dist/MessageList/index.d.ts

@@ -10,11 +10,6 @@ interface Props {
         assistant?: 'start' | 'end' | string;
         [key: string]: 'start' | 'end' | string;
     };
-    multSelect?: {
-        show: boolean;
-        select: string[];
-        onSelect: (msgs: string[]) => void;
-    };
     historyLimit?: {
         /** 历史消息数量限制 */
         count: number;

package/dist/MessageList/index.js

@@ -10,7 +10,7 @@ import { ScrollView } from '@ray-js/ray';
 import { generateId } from '@ray-js/t-agent';
 import { isVersionMatch } from '@ray-js/t-agent-plugin-aistream';
 import MessageRender from '../MessageRender';
-import { useAgentMessage, useOnEvent } from '../hooks';
+import { useAgentMessage, useAgentSessionValue, useOnEvent } from '../hooks';
 import { useDebouncedFn } from '../hooks/useDebouncedFn';
 import { useSleep } from '../hooks/useSleep';
 export default function MessageList(props) {
@@ -20,8 +20,7 @@ export default function MessageList(props) {
     style,
     wrapperClassName,
     wrapperStyle,
-    historyLimit,
-    multSelect
+    historyLimit
   } = props;
   const {
     messages
@@ -32,6 +31,7 @@ export default function MessageList(props) {
   const [scrollTop, setScrollTop] = useState(() => 1000000000000000 + Math.floor(Date.now() / 10));
   const followNewMessageRef = useRef(true);
   const sleep = useSleep();
+  const [showSelect] = useAgentSessionValue('UIRay.multiSelect.show');
   const canIUse = useMemo(() => {
     // @ts-ignore
     const {
@@ -104,7 +104,7 @@ export default function MessageList(props) {
       side = msg.role === 'user' ? 'end' : 'start';
     }
     return /*#__PURE__*/React.createElement(MessageRender, {
-      multSelect: multSelect,
+      showSelect: showSelect,
       key: msg.id,
       message: msg,
       isLatestMessage: index === 0,

package/dist/MessageRender/index.d.ts

@@ -5,11 +5,7 @@ interface Props {
     message: ChatMessageObject;
     isLatestMessage: boolean;
     side: 'start' | 'end' | string;
-    multSelect?: {
-        show: boolean;
-        select: string[];
-        onSelect: (msgs: string[]) => void;
-    };
+    showSelect?: boolean;
 }
-export default function MessageRender({ message, isLatestMessage, side, multSelect }: Props): React.JSX.Element;
+export default function MessageRender({ message, isLatestMessage, side, showSelect }: Props): React.JSX.Element;
 export {};

package/dist/MessageRender/index.js

@@ -4,24 +4,34 @@ import "core-js/modules/esnext.iterator.map.js";
 import "core-js/modules/web.dom-collections.iterator.js";
 import './index.less';
 import { View } from '@ray-js/components';
-import React from 'react';
+import React, { useState } from 'react';
 import TileRender from '../TileRender';
+import { useChatAgent, useOnEvent } from '../hooks';
 export default function MessageRender(_ref) {
   let {
     message,
     isLatestMessage,
     side,
-    multSelect
+    showSelect
   } = _ref;
   const {
     id,
     tiles
   } = message;
-  const {
-    select = [],
-    onSelect = () => {},
-    show: showMultSelect = false
-  } = multSelect || {};
+  const agent = useChatAgent();
+  const [isSelected, setIsSelected] = useState(() => {
+    var _agent$session$get;
+    return !!((_agent$session$get = agent.session.get("UIRay.multiSelect.selected")) !== null && _agent$session$get !== void 0 && _agent$session$get.includes(id));
+  });
+  useOnEvent('sessionChange', _ref2 => {
+    let {
+      key,
+      value
+    } = _ref2;
+    if (key === 'UIRay.multiSelect.selected') {
+      setIsSelected(!!(value !== null && value !== void 0 && value.includes(id)));
+    }
+  });
   if (tiles.length === 0) {
     return /*#__PURE__*/React.createElement(View, {
       key: id,
@@ -30,14 +40,19 @@ export default function MessageRender(_ref) {
   }
   return /*#__PURE__*/React.createElement(View, {
     key: id,
-    className: "t-agent-message-list-row-container "
-  }, showMultSelect && /*#__PURE__*/React.createElement(View, {
+    className: "t-agent-message-list-row-container",
+    onClick: () => {
+      if (showSelect) {
+        const prev = agent.session.get("UIRay.multiSelect.selected") || [];
+        isSelected ? agent.session.set("UIRay.multiSelect.selected", prev.filter(i => i !== id)) : agent.session.set("UIRay.multiSelect.selected", [...prev, id]);
+      }
+    }
+  }, showSelect && /*#__PURE__*/React.createElement(View, {
     className: "t-agent-message-list-row-check"
   }, /*#__PURE__*/React.createElement(View, {
-    className: "checkbox-container ".concat(select.includes(id) ? 'selected' : ''),
-    onClick: () => select.includes(id) ? onSelect([...select.filter(v => v !== id)]) : onSelect([...select, id])
+    className: "t-agent-message-list-checkbox-container ".concat(isSelected ? 't-agent-message-list-checkbox-selected' : '')
   }, /*#__PURE__*/React.createElement(View, {
-    className: "checkbox-check"
+    className: "t-agent-message-list-checkbox-check"
   }))), /*#__PURE__*/React.createElement(View, {
     className: "t-agent-message-list-row t-agent-message-list-row-".concat(side)
   }, tiles.map(tile => {

package/dist/MessageRender/index.less

@@ -28,7 +28,7 @@
 @border-color: rgba(0, 0, 0, 0.3);
 @active-color: #3678E3;
 
-.checkbox-container {
+.t-agent-message-list-checkbox-container {
   position: relative;
   width: @checkbox-size;
   height: @checkbox-size;
@@ -38,17 +38,17 @@
   cursor: pointer;
   transition: all 0.2s ease-in-out;
 
-  &.selected {
+  &.t-agent-message-list-checkbox-selected {
     background: @active-color;
     border-color: transparent;
 
-    .checkbox-check {
+    .t-agent-message-list-checkbox-check {
       opacity: 1;
     }
   }
 }
 
-.checkbox-check {
+.t-agent-message-list-checkbox-check {
   position: absolute;
   top: 50%;
   left: 50%;
@@ -58,4 +58,4 @@
   background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMiIgaGVpZ2h0PSI5IiB2aWV3Qm94PSIwIDAgMTIgOSI+PHBhdGggZmlsbD0ibm9uZSIgc3Ryb2tlPSIjRkZGIiBzdHJva2Utd2lkdGg9IjIiIGQ9Ik0xIDRsMy43NSA0TDEwLjMgMSIvPjwvc3ZnPg==");
   opacity: 0;
   transition: opacity 0.2s ease-in-out;
-}
+}

package/dist/hooks/context.d.ts

@@ -1,3 +1,4 @@
+import { Dispatch, SetStateAction } from 'react';
 import { TTTAction } from '../types';
 export declare const useChatAgent: () => import("../contexts").UIChatAgent;
 export declare const useAgentMessage: () => {
@@ -9,3 +10,4 @@ export declare const useOnEvent: (eventName: string, callback: (details: any) =>
 export declare const useEmitEvent: () => <T extends keyof import("@ray-js/t-agent").UIEventMap>(eventName: T, detail: import("@ray-js/t-agent").UIEventMap[T]) => void;
 export declare const useTileProps: () => import("../types").TileProps<any, any>;
 export declare const useSendAction: () => (action: TTTAction) => void;
+export declare const useAgentSessionValue: <S = any>(key: string) => readonly [S, Dispatch<SetStateAction<S>>];

package/dist/hooks/context.js

@@ -1,4 +1,5 @@
-import { useEffect, useContext, useCallback, useRef } from 'react';
+import "core-js/modules/web.dom-collections.iterator.js";
+import { useEffect, useContext, useCallback, useRef, useState } from 'react';
 import { TilePropsContext, ChatAgentContext, MessageContext, RenderContext } from '../contexts';
 export const useChatAgent = () => {
   return useContext(ChatAgentContext);
@@ -42,4 +43,26 @@ export const useSendAction = () => {
     agent.plugins.ui.emitEvent('runTTTAction', action);
   }, [agent]);
   return emitTileEvent ? tileSendAction : uiSendAction;
+};
+export const useAgentSessionValue = key => {
+  const agent = useChatAgent();
+  const [value, setValue] = useState(() => agent.session.get(key));
+  const set = useCallback(value => {
+    if (typeof value === 'function') {
+      const prev = agent.session.get(key);
+      value = value(prev);
+    }
+    agent.session.set(key, value);
+    setValue(value);
+  }, []);
+  useOnEvent('sessionChange', _ref => {
+    let {
+      key: k,
+      value
+    } = _ref;
+    if (k === key) {
+      setValue(value);
+    }
+  });
+  return [value, set];
 };

package/dist/hooks/index.d.ts

@@ -3,4 +3,4 @@ export * from './useAttachmentInput';
 export * from './useIsUnmounted';
 export * from './useLongPress';
 export * from './useTranslate';
-export * from './useMultSelect';
+export * from './useMultiSelect';

package/dist/hooks/index.js

@@ -3,4 +3,4 @@ export * from './useAttachmentInput';
 export * from './useIsUnmounted';
 export * from './useLongPress';
 export * from './useTranslate';
-export * from './useMultSelect';
+export * from './useMultiSelect';

package/dist/hooks/useLongPress.d.ts

@@ -2,7 +2,7 @@ import { ChatMessageObject } from '@ray-js/t-agent';
 /**
  * 预定义动作类型
  */
-export type ActionType = 'copy' | 'delete' | 'like' | 'unlike' | 'deleteByChannel' | 'multSelect';
+export type ActionType = 'copy' | 'delete' | 'like' | 'unlike' | 'deleteByChannel' | 'multiSelect';
 export interface ActionMenuItem {
     key: string;
     label: string;
@@ -23,7 +23,7 @@ export interface LongPressActionMenuProps {
 }
 export interface UseLongPressOptions {
     message?: ChatMessageObject;
-    actions?: ActionType | ActionType[];
+    actions?: ActionType | ActionType[] | string[];
     getMessageContent?: () => string;
     customActions?: ActionMenuItem[];
     disabled?: boolean;

package/dist/hooks/useLongPress.js

@@ -20,7 +20,7 @@ export function useLongPress() {
   let options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
   const {
     message,
-    actions = ['copy', 'multSelect', 'delete'],
+    actions = ['copy', 'multiSelect', 'delete'],
     getMessageContent = () => '',
     customActions = [],
     disabled = false
@@ -79,12 +79,12 @@ export function useLongPress() {
             });
           }
           break;
-        case 'multSelect':
+        case 'multiSelect':
           menuItems.push({
-            key: 'multSelect',
-            label: t('t-agent.message.action.multSelect'),
+            key: 'multiSelect',
+            label: t('t-agent.message.action.multiSelect'),
             action: () => {
-              emitEvent('multSelect', {});
+              agent.session.set('UIRay.multiSelect.show', !agent.session.get('UIRay.multiSelect.show'));
             }
           });
           break;
@@ -115,32 +115,33 @@ export function useLongPress() {
             });
           }
           break;
-        case 'deleteByChannel':
-          menuItems.push({
-            key: 'deleteByChannel',
-            label: t('t-agent.message.action.deleteByChannel'),
-            action: () => {
-              // const channel = agent.session.get('AIAssistant.channel');
-              // const { removeMessageByChannel } = agent.plugins.assistant;
-              // if (typeof removeMessageByChannel === 'function') {
-              //   removeMessageByChannel(channel);
-              // }
-            }
-          });
-          break;
         case 'like':
           menuItems.push({
             key: 'like',
             label: t('t-agent.message.action.like'),
             action: async () => {
-              // const { feedback } = agent.plugins.assistant;
-              // if (typeof feedback === 'function') {
-              //   await feedback({ requestId: message.id, type: 'like' });
-              //   ty.showToast({
-              //     title: t('t-agent.message.like.success'),
-              //     icon: 'none',
-              //   });
-              // }
+              try {
+                const result = await agent.plugins.ui.callHook('onMessageFeedback', {
+                  messageId: message.id,
+                  rate: 'like'
+                });
+                if (result !== null && result !== void 0 && result.success) {
+                  ty.showToast({
+                    title: t('t-agent.message.like.success'),
+                    icon: 'none'
+                  });
+                } else {
+                  ty.showToast({
+                    title: t('t-agent.unknown-error'),
+                    icon: 'none'
+                  });
+                }
+              } catch (error) {
+                ty.showToast({
+                  title: (error === null || error === void 0 ? void 0 : error.message) || t('t-agent.unknown-error'),
+                  icon: 'none'
+                });
+              }
             }
           });
           break;
@@ -149,14 +150,28 @@ export function useLongPress() {
             key: 'unlike',
             label: t('t-agent.message.action.unlike'),
             action: async () => {
-              // const { feedback } = agent.plugins.assistant;
-              // if (typeof feedback === 'function') {
-              //   await feedback({ requestId: message.id, type: 'unlike' });
-              //   ty.showToast({
-              //     title: t('t-agent.message.unlike.success'),
-              //     icon: 'none',
-              //   });
-              // }
+              try {
+                const result = await agent.plugins.ui.callHook('onMessageFeedback', {
+                  messageId: message.id,
+                  rate: 'unlike'
+                });
+                if (result !== null && result !== void 0 && result.success) {
+                  ty.showToast({
+                    title: t('t-agent.message.unlike.success'),
+                    icon: 'none'
+                  });
+                } else {
+                  ty.showToast({
+                    title: t('t-agent.unknown-error'),
+                    icon: 'none'
+                  });
+                }
+              } catch (error) {
+                ty.showToast({
+                  title: (error === null || error === void 0 ? void 0 : error.message) || t('t-agent.unknown-error'),
+                  icon: 'none'
+                });
+              }
             }
           });
           break;
@@ -217,9 +232,11 @@ export function useLongPress() {
       isClosing: false,
       menuPosition: adjustedPosition
     });
-    ty.vibrateShort({
-      type: 'light'
-    });
+    if (ty.getSystemInfoSync().brand !== 'devtools') {
+      ty.vibrateShort({
+        type: 'light'
+      });
+    }
     if (e.origin && e.origin.stopPropagation) {
       e.origin.stopPropagation();
     }

package/dist/hooks/{useMultSelect.d.ts → useMultiSelect.d.ts}

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-export declare const useMultSelectMessage: () => {
+export declare const useMultiSelectMessage: () => {
     show: boolean;
     select: string[];
     onSelect: import("react").Dispatch<import("react").SetStateAction<string[]>>;

package/dist/hooks/{useMultSelect.js → useMultiSelect.js}

@@ -1,6 +1,6 @@
 import "core-js/modules/web.dom-collections.iterator.js";
 import { useState } from 'react';
-export const useMultSelectMessage = () => {
+export const useMultiSelectMessage = () => {
   const [select, setSelect] = useState([]);
   const [show, setShow] = useState(false);
   return {

package/dist/i18n/strings.d.ts

@@ -25,7 +25,7 @@ declare const _default: {
         't-agent.message.action.copy': string;
         't-agent.message.action.delete': string;
         't-agent.message.action.deleteByChannel': string;
-        't-agent.message.action.multSelect': string;
+        't-agent.message.action.multiSelect': string;
         't-agent.message.like.success': string;
         't-agent.message.unlike.success': string;
         't-agent.message.action.like': string;
@@ -66,6 +66,7 @@ declare const _default: {
         't-agent.expand.scene.one-click': string;
         't-agent.expand.scene.auto': string;
         't-agent.expand.no.details': string;
+        't-agent.unknown-error': string;
     };
     'zh-Hant': {
         't-agent.build-in.button.create_scene_manually': string;
@@ -157,7 +158,7 @@ declare const _default: {
         't-agent.message.action.copy': string;
         't-agent.message.action.delete': string;
         't-agent.message.action.deleteByChannel': string;
-        't-agent.message.action.multSelect': string;
+        't-agent.message.action.multiSelect': string;
         't-agent.message.like.success': string;
         't-agent.message.unlike.success': string;
         't-agent.message.action.like': string;
@@ -198,6 +199,7 @@ declare const _default: {
         't-agent.expand.scene.one-click': string;
         't-agent.expand.scene.auto': string;
         't-agent.expand.no.details': string;
+        't-agent.unknown-error': string;
     };
     ja: {
         't-agent.build-in.button.create_scene_manually': string;

package/dist/i18n/strings.js

@@ -25,7 +25,7 @@ export default {
     't-agent.message.action.copy': '复制消息',
     't-agent.message.action.delete': '删除消息',
     't-agent.message.action.deleteByChannel': '删除所有渠道消息',
-    't-agent.message.action.multSelect': '多选',
+    't-agent.message.action.multiSelect': '多选',
     't-agent.message.like.success': '点赞成功',
     't-agent.message.unlike.success': '取消点赞成功',
     't-agent.message.action.like': '喜欢消息',
@@ -65,7 +65,8 @@ export default {
     't-agent.expand.scene.rename': '{oldName}改名成{newName}',
     't-agent.expand.scene.one-click': '一键执行',
     't-agent.expand.scene.auto': '自动执行',
-    't-agent.expand.no.details': '没有可显示的详情内容'
+    't-agent.expand.no.details': '没有可显示的详情内容',
+    't-agent.unknown-error': '未知错误'
   },
   'zh-Hant': {
     't-agent.build-in.button.create_scene_manually': '手動創建場景',
@@ -160,7 +161,7 @@ export default {
     't-agent.message.action.copy': 'Copy Message',
     't-agent.message.action.delete': 'Delete Message',
     't-agent.message.action.deleteByChannel': 'Delete All Channel Messages',
-    't-agent.message.action.multSelect': 'Multiple Selection',
+    't-agent.message.action.multiSelect': 'Multiple Selection',
     't-agent.message.like.success': 'Like Successful',
     't-agent.message.unlike.success': 'Unlike Successful',
     't-agent.message.action.like': 'Like Message',
@@ -200,7 +201,8 @@ export default {
     't-agent.expand.scene.rename': '{oldName} renamed to {newName}',
     't-agent.expand.scene.one-click': 'One-click Execution',
     't-agent.expand.scene.auto': 'Automatic Execution',
-    't-agent.expand.no.details': 'No details available'
+    't-agent.expand.no.details': 'No details available',
+    't-agent.unknown-error': 'Unknown Error'
   },
   ja: {
     't-agent.build-in.button.create_scene_manually': 'シーンを手動で作成',

package/dist/tiles/BubbleTile/index.js

@@ -1,23 +1,21 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
-import "core-js/modules/es.json.stringify.js";
 import "core-js/modules/esnext.iterator.constructor.js";
 import "core-js/modules/esnext.iterator.find.js";
 import "core-js/modules/esnext.iterator.map.js";
 import "core-js/modules/esnext.iterator.some.js";
-import "core-js/modules/web.dom-collections.iterator.js";
 import './index.less';
 import { View } from '@ray-js/components';
-import React, { useEffect, useState, useCallback, memo } from 'react';
+import React, { useCallback, memo } from 'react';
 import { Image } from '@ray-js/ray';
-import { BubbleTileStatus, ChatMessageStatus, safeParseJSON } from '@ray-js/t-agent';
+import { BubbleTileStatus, ChatMessageStatus } from '@ray-js/t-agent';
 import TileRender from '../../TileRender';
 import noticeSvg from './notice.svg';
 import noticeWarnSvg from './notice-warn.svg';
 import { useChatAgent, useTranslate, useLongPress, useRenderOptions } from '../../hooks';
 import RollBack from '../WorkflowTile/RollBack';
 const BubbleTile = props => {
-  var _message$meta$request, _workflowTile$data;
-  const agent = useChatAgent();
+  var _workflowTile$data;
+  useChatAgent();
   const {
     renderLongPressAs
   } = useRenderOptions();
@@ -38,30 +36,6 @@ const BubbleTile = props => {
   const bubbleStatus = data.status || BubbleTileStatus.NORMAL;
   const t = useTranslate();
   const loading = status === ChatMessageStatus.START || status === ChatMessageStatus.UPDATING;
-  isLatestMessage && status === ChatMessageStatus.FINISH && role === 'assistant' && ((_message$meta$request = message.meta.requestId) === null || _message$meta$request === void 0 ? void 0 : _message$meta$request.startsWith('AIAssistant')) && bubbleStatus === BubbleTileStatus.NORMAL;
-  const [feedbackLoaded, setFeedbackLoaded] = useState(false);
-  const [feedbackValue, setFeedbackValue] = useState(null);
-  useEffect(() => {
-    ty.getStorage({
-      key: 'latestMessageFeedbackValue',
-      success: res => {
-        if (res.data) {
-          try {
-            const {
-              requestId,
-              value
-            } = safeParseJSON(res.data);
-            if (requestId === message.meta.requestId) {
-              setFeedbackValue(value);
-            }
-          } catch (e) {
-            // noop
-          }
-        }
-        setFeedbackLoaded(true);
-      }
-    });
-  }, []);
   const showInfo = () => {
     if (data.info) {
       ty.showToast({
@@ -90,12 +64,7 @@ const BubbleTile = props => {
   }, [tile]);
   const longPressRes = useLongPress({
     message,
-    // actions: [
-    //   'copy',
-    //   'delete',
-    //   ...(isAssistantMessage ? ['like', 'unlike', 'deleteByChannel'] : []),
-    // ] as ActionType[],
-    actions: ['copy', 'multSelect', 'delete'],
+    actions: ['copy', 'multiSelect', 'delete', 'like', 'unlike'],
     getMessageContent,
     disabled: loading
   });

package/dist/tiles/WorkflowTile/RollBack/index.d.ts

@@ -1,5 +1,5 @@
-import React from 'react';
 import './index.less';
+import React from 'react';
 export default function RollBack(props: {
     nodeId: string;
 }): React.JSX.Element;

package/dist/tiles/WorkflowTile/RollBack/index.js

@@ -1,28 +1,22 @@
+import './index.less';
 import { Image, View } from '@ray-js/ray';
 import React from 'react';
 import rollback from './workflow-rollback.png';
-import { useChatAgent } from '../../../hooks';
-import './index.less';
+import { useTileProps } from '../../../hooks';
 export default function RollBack(props) {
   const {
     nodeId
   } = props;
-  const agent = useChatAgent();
+  const {
+    emitTileEvent
+  } = useTileProps();
   return /*#__PURE__*/React.createElement(View, {
     className: "t-agent-workflow-rollback-tile",
     onClick: async () => {
-      agent.session.get('AIAssistant.channel');
-      const systemInfo = ty.getSystemInfoSync();
-      systemInfo.language; // await agent.plugins.assistant.runSkill('hi', 'assistant', {
-      //   channel,
-      //   domain: 'control',
-      //   intent: 'backNode',
-      //   lang,
-      //   'back.node.id': nodeId,
-      //   device_id: undefined,
-      //   'text.stream': 'true',
-      //   'tts.disable': 'true',
-      // });
+      emitTileEvent({
+        type: 'rollback',
+        nodeId
+      });
     }
   }, /*#__PURE__*/React.createElement(Image, {
     src: rollback,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ray-js/t-agent-ui-ray",
-  "version": "0.2.0-beta-2",
+  "version": "0.2.0-beta-4",
   "author": "Tuya.inc",
   "license": "MIT",
   "private": false,
@@ -40,5 +40,5 @@
     "@types/echarts": "^4.9.22",
     "@types/markdown-it": "^14.1.1"
   },
-  "gitHead": "0784a0f440b67cc1f766a440dbad5350f633dfb1"
+  "gitHead": "1728f8a1cac6b2ca53e506e06171808fbf38efdc"
 }