@ray-js/t-agent-ui-ray 0.2.6-beta-7 → 0.2.6

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ray-js/t-agent-ui-ray",
-  "version": "0.2.6-beta-7",
+  "version": "0.2.6",
   "author": "Tuya.inc",
   "license": "MIT",
   "private": false,
@@ -40,5 +40,5 @@
     "@types/echarts": "^4.9.22",
     "@types/markdown-it": "^14.1.1"
   },
-  "gitHead": "d76b6bc9d2d7b69b12cc1b741a8638f2dd671db2"
+  "gitHead": "6fc9a8195706d72c2bab10479e8d65a26854bdde"
 }

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

@@ -1,18 +0,0 @@
-import '../index.less';
-import React from 'react';
-interface Props {
-    text: string;
-    setText: (text: string) => void;
-    onBack: () => void;
-    sendDisabled: boolean;
-    responding: boolean;
-    onSend: () => Promise<any>;
-    onError: (error: Error) => void;
-    onMoreClick: () => void;
-    closeMore: () => void;
-    moreOpen: boolean;
-    hasMore: boolean;
-    onAbort: () => void;
-}
-export default function AsrInput(props: Props): React.JSX.Element;
-export {};

package/dist/MessageInput/MessageInputAssistant/AsrInput.js

@@ -1,89 +0,0 @@
-import '../index.less';
-import { Button, Text, View, Textarea } from '@ray-js/components';
-import React from 'react';
-import cx from 'clsx';
-import { useAsrInput } from './useAsrInput';
-export default function AsrInput(props) {
-  const {
-    responding,
-    sendDisabled,
-    onMoreClick,
-    moreOpen,
-    closeMore,
-    hasMore,
-    text,
-    setText,
-    onAbort
-  } = props;
-  const {
-    state,
-    press,
-    release,
-    clear,
-    currentText,
-    incomingText
-  } = useAsrInput(props);
-  return /*#__PURE__*/React.createElement(View, {
-    className: "t-agent-message-input-voice-bar"
-  }, (state === 'recording' || state === 'pending') && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(View, {
-    className: "t-agent-message-input-voice-mask"
-  }), /*#__PURE__*/React.createElement(View, {
-    className: "t-agent-message-input-voice-bubble",
-    "data-testid": "t-agent-message-input-asr-bubble"
-  }, state === 'recording' ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Text, null, currentText.endsWith(' ') ? /*#__PURE__*/React.createElement(React.Fragment, null, currentText, "\xA0") : currentText), /*#__PURE__*/React.createElement(Text, {
-    className: "t-agent-message-input-voice-bubble-predicted"
-  }, incomingText)) : /*#__PURE__*/React.createElement(Textarea, {
-    "data-testid": "t-agent-message-input-asr-bubble-input",
-    autoHeight: true,
-    maxLength: 2048,
-    className: "t-agent-message-input-voice-bubble-input",
-    value: text,
-    onInput: event => setText(event.value)
-  }))), /*#__PURE__*/React.createElement(Button, {
-    "data-testid": "t-agent-message-input-asr-button-left",
-    className: cx('t-agent-message-input-button', {
-      't-agent-message-input-button-text': state === 'init',
-      't-agent-message-input-button-hide': state === 'recording',
-      't-agent-message-input-button-clear': state === 'pending'
-    }),
-    onClick: () => {
-      if (state === 'init') {
-        clear();
-        props.onBack();
-      } else if (state === 'pending') {
-        clear();
-      }
-    }
-  }), /*#__PURE__*/React.createElement(Button, {
-    "data-testid": "t-agent-message-input-asr-button-middle",
-    className: "t-agent-message-input-button t-agent-message-input-button-voice-active",
-    disabled: sendDisabled,
-    onTouchStart: () => {
-      closeMore();
-      press();
-    },
-    onClick: release,
-    onTouchCancel: release,
-    onTouchEnd: release
-  }), /*#__PURE__*/React.createElement(Button, {
-    disabled: sendDisabled,
-    "data-testid": "t-agent-message-input-asr-button-right",
-    className: cx('t-agent-message-input-button', {
-      't-agent-message-input-button-voice-send': state === 'pending',
-      't-agent-message-input-button-hide': (state === 'recording' || !hasMore && state !== 'pending') && !responding,
-      't-agent-message-input-button-more': state === 'init' && hasMore,
-      't-agent-message-input-button-more-open': state === 'init' && moreOpen,
-      't-agent-message-input-button-stop': state === 'init' && responding
-    }),
-    onClick: () => {
-      if (responding) {
-        onAbort();
-      } else if (state === 'init' && hasMore) {
-        onMoreClick();
-      } else {
-        props.onSend();
-        clear();
-      }
-    }
-  }));
-}

package/dist/MessageInput/MessageInputAssistant/asr.d.ts

@@ -1,30 +0,0 @@
-import { Emitter } from '@ray-js/t-agent';
-import { AsrListenerManager } from '../../utils/ttt';
-export interface DetectResult {
-    /** managerId */
-    managerId: number;
-    /** 拾音状态 0. 未开启 1.进行中 2.结束 3.发送错误 */
-    state: number;
-    /** 语言转换内容 */
-    text: string;
-    /** 错误码 0. 录音时间太短 */
-    errorCode: number;
-}
-export declare enum AsrDetectResultState {
-    WAIT = 0,
-    MID = 1,
-    END = 2,
-    ERROR = 3
-}
-export declare class Asr {
-    static manager: AsrListenerManager | null;
-    static emitter: Emitter;
-    static authorize(): Promise<boolean>;
-    static createManager(): Promise<AsrListenerManager>;
-    static listener: (detail: DetectResult) => void;
-    static dispose: () => void;
-    static detect(callback: (params: DetectResult) => void): {
-        start(): Promise<void>;
-        stop(): Promise<void>;
-    };
-}

package/dist/MessageInput/MessageInputAssistant/asr.js

@@ -1,126 +0,0 @@
-import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-var _Asr;
-import "core-js/modules/es.json.stringify.js";
-import { Emitter, EmitterEvent } from '@ray-js/t-agent';
-import logger from '../../logger';
-import { authorize, getAppInfo, getAsrListenerManager, getCurrentHomeInfo } from '../../utils/ttt';
-export let AsrDetectResultState = /*#__PURE__*/function (AsrDetectResultState) {
-  AsrDetectResultState[AsrDetectResultState["WAIT"] = 0] = "WAIT";
-  AsrDetectResultState[AsrDetectResultState["MID"] = 1] = "MID";
-  AsrDetectResultState[AsrDetectResultState["END"] = 2] = "END";
-  AsrDetectResultState[AsrDetectResultState["ERROR"] = 3] = "ERROR";
-  return AsrDetectResultState;
-}({});
-export class Asr {
-  // 录音权限
-  static authorize() {
-    return authorize({
-      scope: 'scope.record'
-    });
-  }
-  static async createManager() {
-    if (Asr.manager) {
-      return Asr.manager;
-    }
-    const {
-      homeId
-    } = await getCurrentHomeInfo();
-    const systemInfo = ty.getSystemInfoSync();
-    const appInfo = await getAppInfo();
-    const isCnApp = appInfo.regionCode === 'AY';
-    const lang = systemInfo.language;
-    const params = {
-      homeId,
-      sampleRate: isCnApp ? 16000 : 8000,
-      channels: 1,
-      codec: isCnApp ? 0 : 1,
-      options: JSON.stringify({
-        format: isCnApp ? 'wav' : 'mulaw',
-        lang,
-        channel: '1',
-        sampleRate: isCnApp ? '16000' : '8000',
-        realTimeAsr: 'true',
-        'asr.only': 'true'
-      })
-    };
-    logger.debug('Asr createManager', params);
-    Asr.manager = await getAsrListenerManager(params);
-    Asr.manager.onDetect(Asr.listener);
-    return Asr.manager;
-  }
-  static detect(callback) {
-    const listener = event => {
-      var _event$detail;
-      callback(event.detail);
-      if (((_event$detail = event.detail) === null || _event$detail === void 0 ? void 0 : _event$detail.state) === AsrDetectResultState.END) {
-        Asr.emitter.removeEventListener('result', listener);
-      }
-    };
-    const promise = Asr.createManager();
-    Asr.emitter.addEventListener('result', listener);
-    return {
-      start() {
-        logger.debug('Asr detect start');
-        return new Promise((resolve, reject) => {
-          promise.then(manager => {
-            manager.getAsrActive({
-              success: _ref => {
-                let {
-                  isActive
-                } = _ref;
-                logger.debug('Asr manager.getAsrActive', isActive);
-                if (!isActive) {
-                  manager.startDetect({
-                    success: function (res) {
-                      logger.debug('Asr startDetect success', res);
-                      resolve();
-                    },
-                    fail: function (err) {
-                      logger.error('Asr startDetect fail', err);
-                      reject(err);
-                    }
-                  });
-                } else {
-                  resolve();
-                }
-              },
-              failure: params => {
-                logger.error('Asr manager.getAsrActive failure', params);
-                reject(params);
-              }
-            });
-          });
-        });
-      },
-      async stop() {
-        const manager = await promise;
-        logger.debug('Asr detect stop');
-        await new Promise((resolve, reject) => {
-          manager.stopDetect({
-            success: resolve,
-            fail: reject
-          });
-        });
-      }
-    };
-  }
-}
-_Asr = Asr;
-_defineProperty(Asr, "manager", null);
-_defineProperty(Asr, "emitter", new Emitter());
-_defineProperty(Asr, "listener", detail => {
-  const {
-    text,
-    state
-  } = detail;
-  logger.debug('Asr listener', detail);
-  _Asr.emitter.dispatchEvent(new EmitterEvent('result', {
-    detail
-  }));
-});
-_defineProperty(Asr, "dispose", () => {
-  if (_Asr.manager) {
-    _Asr.manager.offDetect(_Asr.listener);
-    _Asr.manager = null;
-  }
-});

package/dist/MessageInput/MessageInputAssistant/index.d.ts

@@ -1,11 +0,0 @@
-import '../index.less';
-import React from 'react';
-interface Props {
-    className?: string;
-    renderTop?: React.ReactNode;
-    placeholder?: string;
-    style?: React.CSSProperties;
-    multiModal?: boolean;
-}
-export default function MessageInputAssistant(props: Props): React.JSX.Element;
-export {};

package/dist/MessageInput/MessageInputAssistant/index.js

@@ -1,325 +0,0 @@
-import "core-js/modules/es.string.trim.js";
-import "core-js/modules/esnext.iterator.constructor.js";
-import "core-js/modules/esnext.iterator.filter.js";
-import "core-js/modules/esnext.iterator.map.js";
-import "core-js/modules/web.dom-collections.iterator.js";
-import '../index.less';
-import { Button, View } from '@ray-js/components';
-import React, { useRef, useState } from 'react';
-import { Image, Input, ScrollView } from '@ray-js/ray';
-import cx from 'clsx';
-import PrivateImage from '../../PrivateImage';
-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 { AbortController } from '../../utils/abort';
-import { useAttachmentInput, useChatAgent, useEmitEvent, useIsUnmounted, useOnEvent, useRenderOptions, useTranslate } from '../../hooks';
-import AsrInput from './AsrInput';
-import { authorize } from '../../utils/ttt';
-export default function MessageInputAssistant(props) {
-  const [moreOpen, setMoreOpen] = useState(false);
-  const t = useTranslate();
-  const [text, setText] = useState('');
-  const [asrText, setAsrText] = useState('');
-  const attachmentInput = useAttachmentInput();
-  const {
-    uploading,
-    uploaded,
-    setUploaded,
-    upload
-  } = attachmentInput;
-  const acRef = useRef(null);
-  const [responding, setResponding] = useState(false);
-  const [mode, setMode] = useState('text');
-  const agent = useChatAgent();
-  const emitEvent = useEmitEvent();
-  const isUnmounted = useIsUnmounted();
-  useOnEvent('networkChange', _ref => {
-    let {
-      online
-    } = _ref;
-    if (!online && responding) {
-      setResponding(false);
-    }
-  });
-  const hasMore = !!props.multiModal;
-  const isMore = !text.trim().length && hasMore;
-  const send = async inputBlocks => {
-    if (!(inputBlocks !== null && inputBlocks !== void 0 && inputBlocks.length) || attachmentInput.uploading || responding) {
-      return;
-    }
-    setUploaded([]);
-    setText('');
-    setResponding(true);
-    const ac = new AbortController();
-    acRef.current = ac;
-    ac.signal.addEventListener('abort', () => {
-      if (acRef.current === ac) {
-        acRef.current = null;
-      }
-      setResponding(false);
-    });
-    try {
-      await agent.pushInputBlocks(inputBlocks, ac.signal);
-    } finally {
-      if (!isUnmounted()) {
-        setResponding(false);
-      }
-    }
-  };
-  useOnEvent('sendMessage', async _ref2 => {
-    let {
-      blocks
-    } = _ref2;
-    if (uploading || responding) {
-      return;
-    }
-    setText('');
-    setMoreOpen(false);
-    setUploaded([]);
-    setResponding(true);
-    const ac = new AbortController();
-    acRef.current = ac;
-    ac.signal.addEventListener('abort', () => {
-      if (acRef.current === ac) {
-        acRef.current = null;
-      }
-      setResponding(false);
-    });
-    try {
-      await agent.pushInputBlocks(blocks, ac.signal);
-    } finally {
-      if (!isUnmounted()) {
-        setResponding(false);
-      }
-    }
-  });
-  useOnEvent('setInputBlocks', async _ref3 => {
-    let {
-      blocks
-    } = _ref3;
-    if (uploading || responding) {
-      return;
-    }
-    if (mode !== 'text') {
-      setMode('text');
-    }
-    attachmentInput.loadBlocks(blocks);
-    let t = '';
-    for (const block of blocks) {
-      if (block.type === 'text') {
-        t = block.text;
-      }
-    }
-    if (t) {
-      setText(t);
-    }
-    setMoreOpen(false);
-  });
-  const openMoreClick = () => {
-    setMoreOpen(!moreOpen);
-    if (!moreOpen) {
-      emitEvent('scrollToBottom', {
-        animation: true
-      });
-    }
-  };
-  const {
-    getStaticResourceBizType
-  } = useRenderOptions();
-  let container;
-  if (mode === 'text') {
-    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(Input, {
-      confirmType: "send",
-      value: text,
-      onInput: event => setText(event.detail.value),
-      placeholder: props.placeholder,
-      "data-testid": "t-agent-message-input-text-inner",
-      className: "t-agent-message-input-text-inner",
-      onConfirm: () => {
-        if (text.trim().length) {
-          send([...attachmentInput.blocks, {
-            type: 'text',
-            text
-          }]);
-        }
-      },
-      maxLength: 200,
-      placeholderStyle: "color: var(--app-B1-N4)",
-      onFocus: () => {
-        setMoreOpen(false);
-        emitEvent('scrollToBottom', {
-          animation: true
-        });
-      }
-    }), /*#__PURE__*/React.createElement(Button, {
-      "data-testid": "t-agent-message-input-button-asr",
-      onClick: async () => {
-        const auth = await authorize({
-          scope: 'scope.record'
-        });
-        if (!auth) {
-          ty.showToast({
-            icon: 'none',
-            title: t('t-agent.input.voice.require-permission')
-          });
-          return;
-        }
-        setText('');
-        setMode('voice');
-      },
-      className: "t-agent-message-input-button t-agent-message-input-button-voice"
-    })), /*#__PURE__*/React.createElement(Button, {
-      disabled: !isMore && uploading,
-      className: cx('t-agent-message-input-button', {
-        't-agent-message-input-button-more': isMore,
-        't-agent-message-input-button-more-open': moreOpen && isMore,
-        't-agent-message-input-button-send': !isMore && !responding,
-        't-agent-message-input-button-stop': responding
-      }),
-      "data-testid": "t-agent-message-input-button-main",
-      onClick: async () => {
-        if (responding) {
-          if (acRef.current) {
-            acRef.current.abort('User abort');
-          }
-        } else if (isMore) {
-          openMoreClick();
-        } else if (text.trim().length) {
-          await send([...attachmentInput.blocks, {
-            type: 'text',
-            text
-          }]);
-        }
-      }
-    }));
-  } else {
-    container = /*#__PURE__*/React.createElement(AsrInput, {
-      text: asrText,
-      setText: setAsrText,
-      onBack: () => {
-        setText('');
-        setMode('text');
-      },
-      onAbort: () => {
-        if (acRef.current) {
-          acRef.current.abort('User abort');
-        }
-      },
-      moreOpen: moreOpen,
-      closeMore: () => setMoreOpen(false),
-      onMoreClick: openMoreClick,
-      responding: responding,
-      sendDisabled: uploading,
-      onSend: async () => {
-        if (asrText) {
-          await send([...attachmentInput.blocks, {
-            type: 'text',
-            text: asrText
-          }]);
-        }
-      },
-      hasMore: hasMore,
-      onError: error => {
-        ty.showToast({
-          icon: 'error',
-          title: error.message
-        });
-      }
-    });
-  }
-  return /*#__PURE__*/React.createElement(View, {
-    className: "".concat(props.className || '', " t-agent-message-input"),
-    style: props.style
-  }, /*#__PURE__*/React.createElement(View, {
-    className: "t-agent-message-input-container"
-  }, props.renderTop, !!uploaded.length && /*#__PURE__*/React.createElement(ScrollView, {
-    scrollX: true,
-    scrollY: false,
-    enableFlex: true,
-    className: "t-agent-message-input-uploaded-files",
-    refresherTriggered: false
-  }, uploaded.map(file => {
-    let content;
-    switch (file.type) {
-      case 'image':
-        content = /*#__PURE__*/React.createElement(PrivateImage, {
-          className: "t-agent-message-input-uploaded-file-image",
-          mode: "aspectFill",
-          bizType: getStaticResourceBizType(file.url, 'image:view'),
-          src: file.url
-        });
-        break;
-      case 'video':
-        content = /*#__PURE__*/React.createElement(PrivateImage, {
-          bizType: getStaticResourceBizType(file.thumbUrl, 'videoThumb:view'),
-          className: "t-agent-message-input-uploaded-file-image",
-          mode: "aspectFill",
-          src: file.thumbUrl
-        });
-        break;
-      case 'loading':
-        content = /*#__PURE__*/React.createElement(View, {
-          className: "t-agent-message-input-uploaded-file-loading",
-          key: file.id
-        }, /*#__PURE__*/React.createElement(Image, {
-          src: loadingSvg,
-          className: "t-agent-message-input-uploaded-file-loading-icon"
-        }));
-        break;
-      default:
-        content = null;
-    }
-    return /*#__PURE__*/React.createElement(View, {
-      key: file.id,
-      className: "t-agent-message-input-uploaded-file"
-    }, /*#__PURE__*/React.createElement(Image, {
-      onClick: () => {
-        setUploaded(prev => prev.filter(f => f.id !== file.id));
-      },
-      className: "t-agent-message-input-uploaded-file-delete",
-      src: closeCircleSvg
-    }), content);
-  })), container), /*#__PURE__*/React.createElement(View, {
-    className: "t-agent-message-input-panel ".concat(moreOpen ? '' : 't-agent-message-input-panel-close')
-  }, /*#__PURE__*/React.createElement(View, {
-    className: "t-agent-message-input-panel-content"
-  }, /*#__PURE__*/React.createElement(Button, {
-    className: "t-agent-message-input-panel-button",
-    onClick: async () => {
-      try {
-        await upload('image', 1);
-      } catch (e) {
-        ty.showToast({
-          icon: 'error',
-          title: t('t-agent.input.upload.failed')
-        });
-      }
-    }
-  }, /*#__PURE__*/React.createElement(View, {
-    className: "t-agent-message-input-panel-button-icon"
-  }, /*#__PURE__*/React.createElement(Image, {
-    src: imageSvg
-  }))), /*#__PURE__*/React.createElement(Button, {
-    className: "t-agent-message-input-panel-button",
-    onClick: async () => {
-      try {
-        await upload('video', 1);
-      } catch (e) {
-        ty.showToast({
-          icon: 'error',
-          title: t('t-agent.input.upload.failed')
-        });
-      }
-    }
-  }, /*#__PURE__*/React.createElement(View, {
-    className: "t-agent-message-input-panel-button-icon"
-  }, /*#__PURE__*/React.createElement(Image, {
-    src: videoSvg
-  }))))));
-}

package/dist/MessageInput/MessageInputAssistant/useAsrInput.d.ts

@@ -1,37 +0,0 @@
-export declare enum AsrErrorCode {
-    SHORT_TIME = 0
-}
-export declare class AsrError extends Error {
-    readonly errorCode: AsrErrorCode;
-    constructor(errorCode: AsrErrorCode, message?: string);
-}
-export interface UseAsrInputOptions {
-    text: string;
-    setText: (text: string) => void;
-    onError: (error: Error) => void;
-}
-/**
-  init 初始状态，有返回按钮
-  recording 按住说话按钮收音，无按钮
-  pending 已有文本，待发送，有清除、发送按钮
-
-      +-------------------------------------------------------+
-      |                      clear/send                       |
-      ↓                                                       |
-  +--------+     press     +------------+     release    +---------+
-  |  init  |  ---------->  | recording  |  ---------->   | pending |
-  +--------+               +------------+                +---------+
-      ^                         |  ^                          |
-      |                         |  |                          |
-      |                         |  |                          |
-      |      empty release      |  |           press          |
-      +-------------------------+  +--------------------------+
- */
-export declare function useAsrInput(options: UseAsrInputOptions): {
-    currentText: string;
-    incomingText: string;
-    state: "pending" | "recording" | "init";
-    clear: () => void;
-    press: () => Promise<void>;
-    release: () => Promise<void>;
-};

package/dist/MessageInput/MessageInputAssistant/useAsrInput.js

@@ -1,131 +0,0 @@
-import "core-js/modules/web.dom-collections.iterator.js";
-import { useEffect, useRef, useState } from 'react';
-import { Asr, AsrDetectResultState } from './asr';
-import { useIsUnmounted } from '../../hooks';
-export let AsrErrorCode = /*#__PURE__*/function (AsrErrorCode) {
-  AsrErrorCode[AsrErrorCode["SHORT_TIME"] = 0] = "SHORT_TIME";
-  return AsrErrorCode;
-}({});
-export class AsrError extends Error {
-  constructor(errorCode, message) {
-    if (!message) {
-      switch (errorCode) {
-        case AsrErrorCode.SHORT_TIME:
-          message = 'Recording time is too short';
-          break;
-        default:
-          message = 'Unknown error';
-          break;
-      }
-    }
-    super(message);
-    this.errorCode = errorCode;
-  }
-}
-/**
-  init 初始状态，有返回按钮
-  recording 按住说话按钮收音，无按钮
-  pending 已有文本，待发送，有清除、发送按钮
-
-      +-------------------------------------------------------+
-      |                      clear/send                       |
-      ↓                                                       |
-  +--------+     press     +------------+     release    +---------+
-  |  init  |  ---------->  | recording  |  ---------->   | pending |
-  +--------+               +------------+                +---------+
-      ^                         |  ^                          |
-      |                         |  |                          |
-      |                         |  |                          |
-      |      empty release      |  |           press          |
-      +-------------------------+  +--------------------------+
- */
-export function useAsrInput(options) {
-  const {
-    text,
-    setText,
-    onError
-  } = options;
-  const asrRef = useRef(null);
-  const [currentText, setCurrentText] = useState('');
-  const [incomingText, setIncomingText] = useState('');
-  const isUnmounted = useIsUnmounted();
-  const [state, setState] = useState('init');
-  const startAt = useRef(0);
-  useEffect(() => {
-    return () => {
-      if (asrRef.current) {
-        asrRef.current.stop();
-        asrRef.current = null;
-        Asr.dispose();
-      }
-    };
-  }, []);
-  return {
-    currentText,
-    incomingText,
-    state,
-    clear: () => {
-      setState('init');
-      setText('');
-      setCurrentText('');
-      setIncomingText('');
-    },
-    press: async () => {
-      setState('recording');
-
-      // 保存当前文本，用于恢复
-      const initial = text;
-
-      // 上次识别的结果
-      let last = '';
-      setCurrentText(initial);
-      setIncomingText('');
-
-      // 开始录音时
-      const asr = Asr.detect(res => {
-        if (isUnmounted()) {
-          return;
-        }
-        if (res.state === AsrDetectResultState.MID || res.state === AsrDetectResultState.END) {
-          if (res.text.startsWith(last)) {
-            const incoming = res.text.slice(last.length);
-            setIncomingText(incoming);
-            setCurrentText(initial + last);
-            last = res.text;
-          } else {
-            setIncomingText(res.text);
-            setCurrentText(initial);
-          }
-          setText(initial + res.text);
-        }
-        if (res.state === AsrDetectResultState.ERROR) {
-          onError(new AsrError(res.errorCode));
-        }
-      });
-      try {
-        await asr.start();
-        startAt.current = Date.now();
-        asrRef.current = asr;
-      } catch (error) {
-        onError(error);
-      }
-    },
-    release: async () => {
-      if (state !== 'recording') {
-        return;
-      }
-      if (!text && startAt.current - Date.now() < 400) {
-        onError(new AsrError(AsrErrorCode.SHORT_TIME));
-      }
-      if (text) {
-        setState('pending');
-      } else {
-        setState('init');
-      }
-      if (asrRef.current) {
-        await asrRef.current.stop();
-        asrRef.current = null;
-      }
-    }
-  };
-}