@ray-js/t-agent-ui-ray 0.2.3-beta-1 → 0.2.3-beta-3

package/dist/LazyScrollView/scroll-view-context.sjs

@@ -0,0 +1,237 @@
+const { OrderedList } = require('./ordered-list.sjs');
+const { getVisibleItems } = require('./get-visible-items.sjs');
+
+// 为了尽可能防止内存泄漏，LazyItemContext 不引用 ownerInstance、instance
+
+export class ScrollViewContext {
+  constructor(prefix, overscanCount) {
+    this.prefix = prefix;
+
+    this.scrollViewId = null;
+    this.height = 0;
+    this.width = 0;
+    this.overscanCount = overscanCount;
+    this.items = new OrderedList(); // ItemContext[]
+    this.initDone = false;
+    this.updateVisibleItemsPending = false;
+    this.offset = 0;
+    this.lastScrollEventDetail = null;
+    this.lastScrollIntoView = null;
+    this.lastChanges = null;
+  }
+
+  refresh(ownerInstance, instance) {
+    const rect = instance.getBoundingClientRect();
+    this.height = rect.height;
+    this.width = rect.width;
+  }
+
+  init(ownerInstance, instance) {
+    const { scrollViewId } = instance.getDataset();
+
+    const rect = instance.getBoundingClientRect();
+
+    this.scrollViewId = scrollViewId;
+    this.height = rect.height;
+    this.width = rect.width
+
+    const onEvent = (event) => {
+      switch (event.type) {
+        case 'itemUpdate': {
+          this.updateVisibleItems(ownerInstance, instance);
+          break;
+        }
+        case 'itemIndexChange':
+        case 'itemAdd': {
+          this.items.upsert(event.itemContext);
+          this.updateVisibleItems(ownerInstance, instance);
+          break;
+        }
+      }
+    }
+
+    ownerInstance.eventChannel.on(`${this.prefix}${this.scrollViewId}`, onEvent);
+    ownerInstance.setTimeout(() => {
+      this.initDone = true;
+      this.updateVisibleItems(ownerInstance, instance);
+    }, 3000);
+  }
+
+  updateVisibleItems(ownerInstance, instance) {
+    if (this.updateVisibleItemsPending || !this.initDone) {
+      return;
+    }
+    this.updateVisibleItemsPending = true;
+    requestAnimationFrame(async () => {
+      const items = this.items.getAll();
+      const map = getVisibleItems({
+        sizes: items,
+        containerSize: this.height,
+        offset: this.offset,
+        overscanCount: this.overscanCount,
+      });
+
+      if (!map) {
+        this.updateVisibleItemsPending = false;
+        return;
+      }
+
+      const changes = {}
+      const toRefresh = [];
+      for (let i = 0; i < items.length; i++) {
+        const itemContext = items[i];
+        const prevShow = itemContext.show;
+        const itemId = itemContext.itemId
+        const show = !!map[itemId];
+        itemContext.show = show;
+
+        if (!itemContext.ready) {
+          // 未准备好，不隐藏
+          changes[itemContext.itemId] = true;
+          continue;
+        }
+
+        // 不展示，则跳过
+        if (!show) {
+          continue
+        }
+
+        changes[itemContext.itemId] = true;
+
+        if (prevShow !== show) {
+          toRefresh.push(itemContext);
+        }
+      }
+
+      if (!this.isChangesDifferent(changes)) {
+        this.updateVisibleItemsPending = false;
+        return;
+      }
+
+      this.lastChanges = changes;
+
+      if (toRefresh.length) {
+        await Promise.all(toRefresh.map((itemContext) => itemContext.refreshSize(ownerInstance)))
+      }
+
+      ownerInstance.triggerEvent('changed', {
+        changes,
+      })
+      this.updateVisibleItemsPending = false;
+    });
+  }
+
+  onScroll(event, ownerInstance, instance) {
+    const last = this.lastScrollEventDetail;
+
+    if (last) {
+      if (
+        last.scrollTop === event.detail.scrollTop &&
+        last.scrollHeight === event.detail.scrollHeight
+      ) {
+        // 如果滚动位置没有变化，则不处理
+        return;
+      }
+    }
+    this.offset = event.detail.scrollTop;
+    // 触发父组件的滚动事件
+    ownerInstance.triggerEvent('scroll', {
+      ...event.detail,
+      clientHeight: this.height,
+      clientWidth: this.width,
+    });
+    this.lastScrollEventDetail = event.detail;
+    this.updateVisibleItems(ownerInstance, instance);
+  }
+
+  onScrollBottom(newValue, oldValue, ownerInstance, instance) {
+    if (newValue === oldValue) {
+      return;
+    }
+
+    requestAnimationFrame(() => {
+      ownerInstance.triggerEvent('done', {
+        scrollIntoView: newValue,
+      })
+    })
+
+    if (!newValue) {
+      return
+    }
+
+    const last = this.lastScrollIntoView;
+
+    if (last && last === newValue) {
+      return;
+    }
+
+    this.lastScrollIntoView = newValue
+
+    const rect = instance.getBoundingClientRect()
+    if (this.lastScrollEventDetail == null) {
+      return
+    }
+
+    // 这个就是用来滚动到底部的，所以直接计算底部 offset 就行
+
+    const lastOffset = this.offset
+    this.offset = this.lastScrollEventDetail.scrollHeight - rect.height;
+    this.refresh(ownerInstance, instance)
+    this.updateVisibleItems(ownerInstance, instance);
+
+    ownerInstance.triggerEvent('scroll', {
+      scrollTop: this.offset,
+      deltaX: 0,
+      deltaY: this.offset - lastOffset,
+      scrollLeft: this.lastScrollEventDetail.scrollLeft,
+      scrollHeight: this.lastScrollEventDetail.scrollHeight,
+      scrollWidth: this.lastScrollEventDetail.scrollWidth,
+      clientHeight: this.height,
+      clientWidth: this.width,
+    });
+  }
+
+  doOp(opJson, old, ownerInstance, instance) {
+    this.refresh(ownerInstance, instance);
+    if (!opJson || opJson === old) {
+      return;
+    }
+
+    let op = null;
+    try {
+      op = JSON.parse(opJson);
+    } catch (error) {
+      // nothing
+    }
+
+    if (!op || !op.type) {
+      return;
+    }
+
+    switch (op.type) {
+      case 'detachItem': {
+        const { itemId } = op;
+        this.items.remove(itemId);
+        this.updateVisibleItems(ownerInstance, instance);
+      }
+    }
+  }
+
+  isChangesDifferent(newMap) {
+    if (!this.lastChanges) {
+      return true
+    }
+
+    let count = 0
+    for (const key in newMap) {
+      if (!(key in this.lastChanges)) return true
+      count++
+    }
+
+    // 再检查 b 有没有多余 key
+    let countB = 0
+    for (const _ in this.lastChanges) countB++
+
+    return count !== countB
+  }
+}

package/dist/MessageActionBar/back.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1750676277859" class="icon" viewBox="0 0 1052 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="15883" xmlns:xlink="http://www.w3.org/1999/xlink" width="16" height="16"><path d="M142.989806 468.094235L514.938748 59.038122 450.02313 0l-438.619035 482.480939a43.861904 43.861904 0 0 0 0 59.038122l438.619035 482.480939 64.915618-59.038122-371.948942-409.143836H1052.685685v-87.723807H142.989806z" fill="#7b7c7e" p-id="15884"></path></svg>

package/dist/MessageActionBar/delete.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1750676141470" class="icon" viewBox="0 0 1049 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="9977" xmlns:xlink="http://www.w3.org/1999/xlink" width="16" height="16"><path d="M818.93731 882.886003a64.030784 64.030784 0 0 1-63.948694 63.948693H294.295334a64.030784 64.030784 0 0 1-63.948693-63.948693V204.159692h588.590669v678.726311zM358.572391 89.396825a12.888248 12.888248 0 0 1 13.134519-13.134519h307.019401a12.888248 12.888248 0 0 1 13.13452 13.134519v38.500562h-333.28844z m652.539361 38.500562h-242.988616v-38.500562A89.643098 89.643098 0 0 0 678.726311 0H371.378547a89.643098 89.643098 0 0 0-89.396825 89.396825v38.500562H38.41847a38.582652 38.582652 0 1 0 0 77.083213h114.927049v677.987494a141.031906 141.031906 0 0 0 141.031906 141.031906h460.611191a141.031906 141.031906 0 0 0 141.031907-141.031906V204.159692h114.927048a38.500561 38.500561 0 0 0 38.500561-38.582652 37.761744 37.761744 0 0 0-38.500561-37.679653z m-486.469777 703.353535a38.500561 38.500561 0 0 0 38.582652-38.500561V382.871252a38.582652 38.582652 0 1 0-77.083213 0v409.879109a38.41847 38.41847 0 0 0 38.500561 38.500561z m-179.450376 0a38.500561 38.500561 0 0 0 38.500561-38.500561V382.871252a38.582652 38.582652 0 1 0-77.083213 0v409.879109a39.567741 39.567741 0 0 0 38.500561 38.500561z m359.064935 0a38.500561 38.500561 0 0 0 38.500561-38.500561V382.871252a38.582652 38.582652 0 1 0-77.083213 0v409.879109a38.500561 38.500561 0 0 0 38.500561 38.500561z" fill="#748393" p-id="9978"></path></svg>

package/dist/MessageActionBar/index.d.ts

@@ -0,0 +1,4 @@
+import './index.less';
+import React from 'react';
+declare const MessageActionBar: () => React.JSX.Element | null;
+export default MessageActionBar;

package/dist/MessageActionBar/index.js

@@ -0,0 +1,79 @@
+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 './index.less';
+import { Button, View } from '@ray-js/components';
+import React from 'react';
+import { useAgentSessionValue, useChatAgent, useTranslate } from '../hooks';
+const MessageActionBar = () => {
+  const [showSelect, setShowSelect] = useAgentSessionValue('UIRay.multiSelect.show');
+  const [selected] = useAgentSessionValue('UIRay.multiSelect.selected');
+  const t = useTranslate();
+  const agent = useChatAgent();
+  if (!showSelect) {
+    return null;
+  }
+  return /*#__PURE__*/React.createElement(View, {
+    className: "t-agent-message-action-bar"
+  }, /*#__PURE__*/React.createElement(Button, {
+    className: "t-agent-message-action-bar-button t-agent-message-action-bar-button-back",
+    onClick: () => {
+      setShowSelect(false);
+    }
+  }), /*#__PURE__*/React.createElement(Button, {
+    className: "t-agent-message-action-bar-button t-agent-message-action-bar-button-clean-all",
+    onClick: () => {
+      ty.showModal({
+        title: t('t-agent.message.clear-history.title'),
+        content: t('t-agent.message.clear-history.content'),
+        confirmText: t('t-agent.message.delete.confirm'),
+        cancelText: t('t-agent.message.delete.cancel'),
+        success: async res => {
+          if (res.confirm) {
+            ty.showLoading({
+              title: ''
+            });
+            const {
+              success
+            } = await agent.plugins.ui.callHook('onClearHistory', {});
+            ty.hideLoading();
+            if (success) {
+              setShowSelect(false);
+              ty.showToast({
+                title: t('t-agent.message.delete.success'),
+                icon: 'none'
+              });
+            } else {
+              ty.showToast({
+                title: t('t-agent.error.unknown-error'),
+                icon: 'error'
+              });
+            }
+          }
+        }
+      });
+    }
+  }, t('t-agent.message.clear-history.button')), /*#__PURE__*/React.createElement(Button, {
+    className: "t-agent-message-action-bar-button t-agent-message-action-bar-button-delete",
+    disabled: !selected.length,
+    onClick: () => {
+      ty.showModal({
+        title: t('t-agent.message.multi-select-delete.title'),
+        content: t('t-agent.message.multi-select-delete.content'),
+        confirmText: t('t-agent.message.delete.confirm'),
+        cancelText: t('t-agent.message.delete.cancel'),
+        success: async res => {
+          if (res.confirm) {
+            await Promise.all(selected.map(id => agent.removeMessage(id)));
+            setShowSelect(false);
+            ty.showToast({
+              title: t('t-agent.message.delete.success'),
+              icon: 'none'
+            });
+          }
+        }
+      });
+    }
+  }));
+};
+export default MessageActionBar;

package/dist/MessageActionBar/index.less

@@ -0,0 +1,68 @@
+
+.t-agent-message-action-bar {
+  position: absolute;
+  display: flex;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  z-index: 10;
+  height: calc(106rpx + var(--t-agent-safe-bottom));
+
+  --t-agent-action-bar-border-color: var(--app-B1-N7);
+  border-top: 2rpx solid var(--t-agent-action-bar-border-color);
+  background: var(--app-B1);
+
+  padding: 16rpx 32rpx calc(16rpx + var(--t-agent-safe-bottom));
+  align-items: center;
+}
+
+.t-agent-chat-container-keyboard-show .t-agent-message-action-bar {
+  height: 106rpx;
+  padding-bottom: 16rpx;
+}
+
+.t-agent-message-action-bar-button {
+  --button-size: 68rpx;
+  background: transparent;
+
+  border-radius: var(--button-size);
+
+  width: var(--button-size);
+  height: var(--button-size);
+  flex-basis: var(--button-size);
+  line-height: var(--button-size);
+
+  padding: 0;
+  margin: 0;
+  text-align: center;
+  color: transparent;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+
+  background-size: contain;
+  background-origin: content-box;
+
+  &[disabled] {
+    opacity: 0.6;
+  }
+}
+
+.t-agent-message-action-bar-button-back {
+  background: url('./back.svg') no-repeat center;
+}
+
+.t-agent-message-action-bar-button-delete {
+  background: url('./delete.svg') no-repeat center;
+  &[disabled] {
+    background: transparent;
+  }
+}
+
+.t-agent-message-action-bar-button-clean-all {
+  flex: 1;
+  color: var(--app-M2-N1);
+  background: var(--app-M2);
+  margin: 0 32rpx;
+  font-weight: normal;
+}

package/dist/MessageInput/MessageInputAIStream/index.js

@@ -7,7 +7,7 @@ import '../index.less';
 import { Button, View } from '@ray-js/components';
 import React, { useRef, useState, useMemo } from 'react';
 import { Image, Input, ScrollView } from '@ray-js/ray';
-import { AbortController, authorize } from '@ray-js/t-agent-plugin-aistream';
+import { AbortController } from '../../utils/abort';
 import { Emitter, EmitterEvent, isAbortError } from '@ray-js/t-agent';
 import cx from 'clsx';
 import imageSvg from '../icons/image.svg';
@@ -19,6 +19,7 @@ import logger from '../../logger';
 import { systemInfo } from '../../utils';
 import { useSleep } from '../../hooks/useSleep';
 import { useStableCallback } from '../../hooks/useStableCallback';
+import { authorize } from '../../utils/ttt';
 export let MessageInputState = /*#__PURE__*/function (MessageInputState) {
   MessageInputState["PENDING"] = "pending";
   MessageInputState["RECORDING"] = "recording";
@@ -239,7 +240,7 @@ export default function MessageInputAIStream(props) {
       onClick: async () => {
         const auth = await authorize({
           scope: 'scope.record'
-        }).then(() => true, () => false);
+        });
         if (!auth) {
           ty.showToast({
             icon: 'none',
@@ -350,7 +351,7 @@ export default function MessageInputAIStream(props) {
           }
           if (dispatch(InputAction.ASR_ERROR, {})) {
             var _error$detail;
-            if (((_error$detail = error.detail) === null || _error$detail === void 0 ? void 0 : _error$detail.code) === 'asr_empty') {
+            if (((_error$detail = error.detail) === null || _error$detail === void 0 ? void 0 : _error$detail.code) === 'asr-empty') {
               ty.showToast({
                 icon: 'error',
                 title: t('t-agent.input.asr.error.empty')

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

@@ -0,0 +1,30 @@
+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

@@ -0,0 +1,126 @@
+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.js

@@ -7,15 +7,16 @@ 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 { Asr, AbortController } from '@ray-js/t-agent-plugin-assistant';
 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();
@@ -159,7 +160,9 @@ export default function MessageInputAssistant(props) {
     }), /*#__PURE__*/React.createElement(Button, {
       "data-testid": "t-agent-message-input-button-asr",
       onClick: async () => {
-        const auth = await Asr.authorize();
+        const auth = await authorize({
+          scope: 'scope.record'
+        });
         if (!auth) {
           ty.showToast({
             icon: 'none',

package/dist/MessageInput/MessageInputAssistant/useAsrInput.js

@@ -1,6 +1,6 @@
 import "core-js/modules/web.dom-collections.iterator.js";
 import { useEffect, useRef, useState } from 'react';
-import { Asr, AsrDetectResultState } from '@ray-js/t-agent-plugin-assistant';
+import { Asr, AsrDetectResultState } from './asr';
 import { useIsUnmounted } from '../../hooks';
 export let AsrErrorCode = /*#__PURE__*/function (AsrErrorCode) {
   AsrErrorCode[AsrErrorCode["SHORT_TIME"] = 0] = "SHORT_TIME";

package/dist/MessageList/PartRender.d.ts

@@ -0,0 +1,15 @@
+import React, { ReactNode } from 'react';
+interface PartOptions {
+    notifyHeightChanged: () => void;
+}
+export type RenderPart = ReactNode | ((options: PartOptions) => React.ReactNode);
+interface Props {
+    scrollViewId: string;
+    notifyHeightChanged: () => void;
+    itemId: string;
+    children: RenderPart;
+    index: number;
+    show: boolean;
+}
+export declare function PartRender(props: Props): React.JSX.Element;
+export {};

package/dist/MessageList/PartRender.js

@@ -0,0 +1,25 @@
+import "core-js/modules/web.dom-collections.iterator.js";
+import LazyItem from '../LazyScrollView/LazyItem';
+import React, { useState } from 'react';
+export function PartRender(props) {
+  const {
+    scrollViewId,
+    children,
+    itemId,
+    index
+  } = props;
+  const [tick, setTick] = useState(() => "".concat(Math.random()));
+  const content = typeof children === 'function' ? children({
+    notifyHeightChanged: () => {
+      props.notifyHeightChanged();
+      setTick("".concat(Math.random()));
+    }
+  }) : children;
+  return /*#__PURE__*/React.createElement(LazyItem, {
+    scrollViewId: scrollViewId,
+    itemId: itemId,
+    update: tick,
+    ready: true,
+    index: index
+  }, content);
+}

package/dist/MessageList/ScrollBottomView.d.ts

@@ -36,6 +36,7 @@ interface Props extends ScrollBottomViewOptions {
     children: React.ReactNode;
     style?: React.CSSProperties;
     hideScrollbar?: boolean;
+    onChanged?: (changes: Record<string, boolean>) => void;
 }
 export interface ScrollBottomViewRef {
     scrollToBottom: (options?: {