@tencentcloud/chat-uikit-react 2.2.5 → 2.2.6

package/dist/esm/index.d.ts

@@ -1,10 +1,8 @@
-export { ChatProps, TUIKit } from './components/TUIKit/TUIKit.js';
-export { UseChatParams, UseContactParams, useTUIKit } from './components/TUIKit/hooks/useTUIKit.js';
-export { useCreateTUIKitContext } from './components/TUIKit/hooks/useCreateTUIKitContext.js';
 export { TUIConversation, UnMemoizedTUIConversation } from './components/TUIConversation/TUIConversation.js';
 export { TUIConversationList, UnMemoTUIConversationList } from './components/TUIConversationList/TUIConversationList.js';
 export { TUIChat } from './components/TUIChat/TUIChat.js';
-export { TUIKitContext, TUIKitContextValue, TUIKitProvider, useTUIKitContext } from './context/TUIKitContext.js';
+export { UIKitProvider, useUIKit } from './context/UIKitContext.js';
+export { UIManagerContextType, UIManagerProvider, useUIManager } from './context/UIManagerContext.js';
 export { TUIChatStateContext, TUIChatStateContextProvider, TUIChatStateContextValue, useTUIChatStateContext } from './context/TUIChatStateContext.js';
 export { TUIChatActionContext, TUIChatActionContextValue, TUIChatActionProvider, useTUIChatActionContext } from './context/TUIChatActionContext.js';
 export { TUIMessageContext, TUIMessageContextProvider, TUIMessageContextValue, messageShowType, useTUIMessageContext } from './context/TUIMessageContext.js';

package/dist/esm/index.js

@@ -1 +1 @@
-import o from"./server.js";export{TUIKit}from"./components/TUIKit/TUIKit.js";export{useTUIKit}from"./components/TUIKit/hooks/useTUIKit.js";export{useCreateTUIKitContext}from"./components/TUIKit/hooks/useCreateTUIKitContext.js";export{TUIConversation,UnMemoizedTUIConversation}from"./components/TUIConversation/TUIConversation.js";export{TUIConversationList,UnMemoTUIConversationList}from"./components/TUIConversationList/TUIConversationList.js";import"react";import"@tencentcloud/chat";import"@tencentcloud/chat-uikit-engine";export{TUIChat}from"./components/TUIChat/TUIChat.js";import"tslib";export{ConversationPreview}from"./components/ConversationPreview/ConversationPreview.js";export{ConversationPreviewContent,unMemoConversationPreviewContent}from"./components/ConversationPreview/ConversationPreviewContent.js";export{TUIChatHeader}from"./components/TUIChatHeader/TUIChatHeader.js";export{TUIChatHeaderDefault}from"./components/TUIChatHeader/TUIChatHeaderDefault.js";export{TUIMessageList}from"./components/TUIMessageList/TUIMessageList.js";export{TUIMessage}from"./components/TUIMessage/TUIMessage.js";export{MessagePlugins}from"./components/TUIMessage/MessagePlugins.js";export{MessageContext}from"./components/TUIMessage/MessageContext.js";export{TUIMessageInput}from"./components/TUIMessageInput/TUIMessageInput.js";export{TUIMessageInputDefault}from"./components/TUIMessageInput/TUIMessageInputDefault.js";export{InputPluginsDefalut}from"./components/TUIMessageInput/InputPluginsDefalut.js";export{TUIProfile}from"./components/TUIProfile/TUIProfile.js";export{TUIProfileDefault}from"./components/TUIProfile/TUIProfileDefault.js";export{Avatar}from"./components/Avatar/Avatar.js";export{defaultGroupAvatarAVChatRoom,defaultGroupAvatarMeeting,defaultGroupAvatarPublic,defaultGroupAvatarWork,defaultUserAvatar}from"./components/Avatar/default.js";export{ConversationSearchInput}from"./components/ConversationSearch/ConversationSearchInput.js";export{ConversationSearchResult}from"./components/ConversationSearch/ConversationSearchResult.js";export{TUIManage}from"./components/TUIManage/TUIManage.js";export{Popup}from"./components/Popup/index.js";export{Checkbox}from"./components/Checkbox/index.js";export{DivWithEdit}from"./components/DivWithEdit/DivWithEdit.js";export{Icon,changeTypeToIconClassName}from"./components/Icon/Icon.js";export{IconTypes}from"./components/Icon/type.js";export{EmptyStateIndicator}from"./components/EmptyStateIndicator/EmptyStateIndicator.js";export{Input}from"./components/Input/Input.js";export{Model}from"./components/Model/index.js";export{Plugins}from"./components/Plugins/index.js";export{Switch}from"./components/Switch/Switch.js";export{Toast}from"./components/Toast/index.js";export{TUIContactList}from"./components/TUIContact/TUIContactList/TUIContactList.js";export{TUIContactInfo,UnMemoizedTUIContactInfo}from"./components/TUIContact/TUIContactInfo/TUIContactInfo.js";export{TUIContact,UnMemoizedTUIContact}from"./components/TUIContact/TUIContact.js";export{TUIKitContext,TUIKitProvider,useTUIKitContext}from"./context/TUIKitContext.js";export{TUIChatStateContext,TUIChatStateContextProvider,useTUIChatStateContext}from"./context/TUIChatStateContext.js";export{TUIChatActionContext,TUIChatActionProvider,useTUIChatActionContext}from"./context/TUIChatActionContext.js";export{TUIMessageContext,TUIMessageContextProvider,messageShowType,useTUIMessageContext}from"./context/TUIMessageContext.js";export{ComponentContext,ComponentProvider,useComponentContext}from"./context/ComponentContext.js";export{TUIMessageInputContext,TUIMessageInputContextProvider,useTUIMessageInputContext}from"./context/TUIMessageInputContext.js";export{TUIContactContext,TUIContactContextProvider,useTUIContactContext}from"./context/TUIContactContext.js";export{useConversation}from"./hooks/useConversation.js";export{useProfile}from"./hooks/useProfile.js";export{t}from"./locales/index.js";export{isH5,isPC,setPlatform}from"./utils/env.js";export{default as i18next}from"i18next";new o;
+import o from"./server.js";export{TUIConversation,UnMemoizedTUIConversation}from"./components/TUIConversation/TUIConversation.js";export{TUIConversationList,UnMemoTUIConversationList}from"./components/TUIConversationList/TUIConversationList.js";import"react";import"@tencentcloud/chat";import"@tencentcloud/chat-uikit-engine";export{TUIChat}from"./components/TUIChat/TUIChat.js";import"tslib";export{ConversationPreview}from"./components/ConversationPreview/ConversationPreview.js";export{ConversationPreviewContent,unMemoConversationPreviewContent}from"./components/ConversationPreview/ConversationPreviewContent.js";export{TUIChatHeader}from"./components/TUIChatHeader/TUIChatHeader.js";export{TUIChatHeaderDefault}from"./components/TUIChatHeader/TUIChatHeaderDefault.js";export{TUIMessageList}from"./components/TUIMessageList/TUIMessageList.js";export{TUIMessage}from"./components/TUIMessage/TUIMessage.js";export{MessagePlugins}from"./components/TUIMessage/MessagePlugins.js";export{MessageContext}from"./components/TUIMessage/MessageContext.js";export{TUIMessageInput}from"./components/TUIMessageInput/TUIMessageInput.js";export{TUIMessageInputDefault}from"./components/TUIMessageInput/TUIMessageInputDefault.js";export{InputPluginsDefalut}from"./components/TUIMessageInput/InputPluginsDefalut.js";export{TUIProfile}from"./components/TUIProfile/TUIProfile.js";export{TUIProfileDefault}from"./components/TUIProfile/TUIProfileDefault.js";export{Avatar}from"./components/Avatar/Avatar.js";export{defaultGroupAvatarAVChatRoom,defaultGroupAvatarMeeting,defaultGroupAvatarPublic,defaultGroupAvatarWork,defaultUserAvatar}from"./components/Avatar/default.js";export{ConversationSearchInput}from"./components/ConversationSearch/ConversationSearchInput.js";export{ConversationSearchResult}from"./components/ConversationSearch/ConversationSearchResult.js";export{TUIManage}from"./components/TUIManage/TUIManage.js";export{Popup}from"./components/Popup/index.js";export{Checkbox}from"./components/Checkbox/index.js";export{DivWithEdit}from"./components/DivWithEdit/DivWithEdit.js";export{Icon,changeTypeToIconClassName}from"./components/Icon/Icon.js";export{IconTypes}from"./components/Icon/type.js";export{EmptyStateIndicator}from"./components/EmptyStateIndicator/EmptyStateIndicator.js";export{Input}from"./components/Input/Input.js";export{Model}from"./components/Model/index.js";export{Plugins}from"./components/Plugins/index.js";export{Switch}from"./components/Switch/Switch.js";export{Toast}from"./components/Toast/index.js";export{TUIContactList}from"./components/TUIContact/TUIContactList/TUIContactList.js";export{TUIContactInfo,UnMemoizedTUIContactInfo}from"./components/TUIContact/TUIContactInfo/TUIContactInfo.js";export{TUIContact,UnMemoizedTUIContact}from"./components/TUIContact/TUIContact.js";export{UIKitProvider,useUIKit}from"./context/UIKitContext.js";export{UIManagerProvider,useUIManager}from"./context/UIManagerContext.js";export{TUIChatStateContext,TUIChatStateContextProvider,useTUIChatStateContext}from"./context/TUIChatStateContext.js";export{TUIChatActionContext,TUIChatActionProvider,useTUIChatActionContext}from"./context/TUIChatActionContext.js";export{TUIMessageContext,TUIMessageContextProvider,messageShowType,useTUIMessageContext}from"./context/TUIMessageContext.js";export{ComponentContext,ComponentProvider,useComponentContext}from"./context/ComponentContext.js";export{TUIMessageInputContext,TUIMessageInputContextProvider,useTUIMessageInputContext}from"./context/TUIMessageInputContext.js";export{TUIContactContext,TUIContactContextProvider,useTUIContactContext}from"./context/TUIContactContext.js";export{useConversation}from"./hooks/useConversation.js";export{useProfile}from"./hooks/useProfile.js";export{t}from"./locales/index.js";export{isH5,isPC,setPlatform}from"./utils/env.js";export{default as i18next}from"i18next";new o;

package/dist/esm/locales/en-US/TUIGlobal.js

@@ -0,0 +1 @@
+var a={chats:"Messages",contacts:"Contacts"};export{a as default};

package/dist/esm/locales/en-US/index.js

@@ -1 +1 @@
-import o from"./TUIChat.js";import r from"./TUIConversation.js";import t from"./TUIContact.js";import I from"./TUIProfile.js";var T={TUIGlobal:I,TUIChat:o,TUIConversation:r,TUIContact:t,TUIProfile:I};export{T as message};
+import o from"./TUIGlobal.js";import r from"./TUIChat.js";import t from"./TUIConversation.js";import m from"./TUIContact.js";import I from"./TUIProfile.js";var T={TUIGlobal:o,TUIChat:r,TUIConversation:t,TUIContact:m,TUIProfile:I};export{T as message};

package/dist/esm/locales/ja-JP/TUIGlobal.js

@@ -0,0 +1 @@
+var a={chats:"メッセージ",contacts:"連絡先"};export{a as TUIGlobal,a as default};

package/dist/esm/locales/ja-JP/index.js

@@ -1 +1 @@
-import o from"./TUIChat.js";import r from"./TUIConversation.js";import t from"./TUIContact.js";import i from"./TUIProfile.js";var m={TUIChat:o,TUIConversation:r,TUIContact:t,TUIProfile:i};export{m as message};
+import{TUIGlobal as o}from"./TUIGlobal.js";import r from"./TUIChat.js";import t from"./TUIConversation.js";import m from"./TUIContact.js";import I from"./TUIProfile.js";var T={TUIGlobal:o,TUIChat:r,TUIConversation:t,TUIContact:m,TUIProfile:I};export{T as message};

package/dist/esm/locales/ko-KR/TUIGlobal.js

@@ -0,0 +1 @@
+var a={chats:"채팅",contacts:"연락처"};export{a as TUIGlobal,a as default};

package/dist/esm/locales/ko-KR/index.js

@@ -1 +1 @@
-import o from"./TUIChat.js";import r from"./TUIConversation.js";import t from"./TUIContact.js";import i from"./TUIProfile.js";var m={TUIChat:o,TUIConversation:r,TUIContact:t,TUIProfile:i};export{m as message};
+import{TUIGlobal as o}from"./TUIGlobal.js";import r from"./TUIChat.js";import t from"./TUIConversation.js";import m from"./TUIContact.js";import I from"./TUIProfile.js";var T={TUIGlobal:o,TUIChat:r,TUIConversation:t,TUIContact:m,TUIProfile:I};export{T as message};

package/dist/esm/locales/zh-CN/TUIGlobal.js

@@ -0,0 +1 @@
+var a={chats:"消息",contacts:"通讯录"};export{a as TUIGlobal,a as default};

package/dist/esm/locales/zh-CN/index.js

@@ -1 +1 @@
-import o from"./TUIChat.js";import t from"./TUIConversation.js";import r from"./TUIContact.js";import a from"./TUIProfile.js";var i={chats:"消息",contacts:"通讯录",TUIChat:o,TUIConversation:t,TUIContact:r,TUIProfile:a};export{i as message};
+import{TUIGlobal as o}from"./TUIGlobal.js";import r from"./TUIChat.js";import t from"./TUIConversation.js";import m from"./TUIContact.js";import I from"./TUIProfile.js";var T={TUIGlobal:o,TUIChat:r,TUIConversation:t,TUIContact:m,TUIProfile:I};export{T as message};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tencentcloud/chat-uikit-react",
-  "version": "2.2.5",
+  "version": "2.2.6",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",
   "license": "MIT",
@@ -15,8 +15,8 @@
     "uikit"
   ],
   "scripts": {
-    "build": "rimraf ./dist && yarn run rollup -c",
-    "start": "yarn run rollup -c -w",
+    "build": "rimraf dist && rollup -c",
+    "start": "rimraf dist && rollup -c -w",
     "clean": "rimraf -g ./dist node_modules examples/*/node_modules",
     "prepare": "husky install"
   },
@@ -42,6 +42,7 @@
     "@typescript-eslint/eslint-plugin": "^5.36.2",
     "@typescript-eslint/parser": "^5.36.2",
     "autoprefixer": "^10.4.11",
+    "cross-env": "^7.0.3",
     "eslint": "^8.57.0",
     "eslint-config-react-app": "^7.0.1",
     "eslint-import-resolver-typescript": "^3.5.1",

package/src/components/ConversationCreate/ConversationCreatGroupDetail.tsx

@@ -14,7 +14,7 @@ import {
 } from '../Avatar';
 import { PageStateTypes } from './ConversationCreate';
 import { ConversationGroupTypeInfo, GroupType, typeInfoList } from './ConversationGroupTypeInfo';
-import { useTUIKitContext } from '../../context';
+import { useUIManager } from '../../context';
 import { CreateGroupConversationParams } from '../../hooks';
 
 export interface ConversationCreatGroupDetailProps {
@@ -30,7 +30,7 @@ export function ConversationCreatGroupDetail(props: ConversationCreatGroupDetail
     profileList, pageState, setPageState, createConversation, setConversationCreated,
   } = props;
   const { t } = useTranslation();
-  const { setActiveConversation, myProfile } = useTUIKitContext();
+  const { setActiveConversation, myProfile } = useUIManager();
   const temp = [...profileList];
   myProfile && temp.unshift(myProfile);
   const name = temp.map((item) => item.nick || item.userID).toString();
@@ -84,9 +84,9 @@ export function ConversationCreatGroupDetail(props: ConversationCreatGroupDetail
       name: groupName,
       // eslint-disable-next-line
       // @ts-ignore
-      type: GroupType[groupType], 
+      type: GroupType[groupType],
       groupID,
-      avatar, 
+      avatar,
       memberList,
     });
     setActiveConversation(conversation);

package/src/components/ConversationCreate/ConversationCreate.tsx

@@ -5,7 +5,7 @@ import { Conversation } from '@tencentcloud/chat';
 import { Icon, IconTypes } from '../Icon';
 import { ConversationCreateUserSelectList } from './ConversationCreateUserSelectList';
 import { ConversationCreatGroupDetail } from './ConversationCreatGroupDetail';
-import { useTUIKitContext } from '../../context';
+import { useUIKit } from '../../context';
 import { useConversation } from '../../hooks';
 
 export interface ConversationCreateProps {
@@ -24,7 +24,7 @@ export function ConversationCreate<T extends ConversationCreateProps>(props:T) {
   const [isCreateGroup, setIsCreateGroup] = useState(false);
   const [pageState, setPageState] = useState<PageStateTypes>(PageStateTypes.USER_SELECT);
   const [selectList, setSelectList] = useState([]);
-  const { chat } = useTUIKitContext();
+  const { chat } = useUIKit();
   const { createConversation } = useConversation(chat);
 
   const back = () => {

package/src/components/ConversationCreate/ConversationCreateUserSelectList.tsx

@@ -9,7 +9,7 @@ import { Icon, IconTypes } from '../Icon';
 import { ConversationCreateSelectView, ConversationCreateSelectViewProps } from './ConversationCreateSelectView';
 import { Avatar, defaultUserAvatar } from '../Avatar';
 import { useConversationCreate } from './hooks/useConversationCreate';
-import { useTUIKitContext } from '../../context';
+import { useUIKit, useUIManager } from '../../context';
 import { PageStateTypes } from './ConversationCreate';
 import { useConversation } from '../../hooks';
 import { Toast } from '../Toast';
@@ -35,7 +35,8 @@ export function ConversationCreateUserSelectList(props: ConversationCreateUserSe
   } = props;
   const { t } = useTranslation();
   const [searchValue, setSearchValue] = useState('');
-  const { chat, setActiveConversation } = useTUIKitContext();
+  const { chat } = useUIKit();
+  const { setActiveConversation } = useUIManager();
   const [friendList, setFriendList] = useState<any>({});
   const {
     getFriendListSortSearchResult,

package/src/components/ConversationPreview/ConversationPreview.tsx

@@ -1,6 +1,6 @@
 import React, { useState, useEffect } from 'react';
-import { Conversation } from '@tencentcloud/chat';
-import { TUIKitContextValue, useTUIKitContext } from '../../context';
+import type { Conversation } from '@tencentcloud/chat';
+import { useUIKit, useUIManager } from '../../context';
 import { ConversationPreviewContent } from './ConversationPreviewContent';
 import { AvatarProps } from '../Avatar';
 
@@ -8,34 +8,34 @@ import {
   getDisplayImage, getDisplayMessage, getDisplayTitle, getDisplayTime,
 } from './utils';
 
-export interface ConversationPreviewUIComponentProps extends ConversationPreviewProps{
+export interface ConversationPreviewUIComponentProps extends ConversationPreviewProps {
   /** If the component's Conversation is the active (selected) Conversation */
-  active?: boolean,
+  active?: boolean;
   /** Image of Conversation to display */
-  displayImage?: string,
+  displayImage?: string;
   /** Title of Conversation to display */
-  displayTitle?: string | React.ReactElement,
+  displayTitle?: string | React.ReactElement;
   /** Message of Conversation to display */
-  displayMessage?: string | React.ReactElement,
+  displayMessage?: string | React.ReactElement;
   /** Time of Conversation to display */
-  displayTime?: string,
+  displayTime?: string;
   /** Number of unread Messages */
-  unread?: number,
+  unread?: number;
 }
 export interface ConversationPreviewProps {
-  conversation: Conversation,
-  activeConversation?: Conversation,
-  Preview?: React.ComponentType<ConversationPreviewUIComponentProps>,
-  Avatar?: React.ComponentType<AvatarProps>
-  setActiveConversation?: TUIKitContextValue['setActiveConversation'],
-  searchValue?: string,
-  conversationUpdateCount?: number
-  activeConversationID?: string,
-  setActiveConversationID?: (conversationID: string) => void,
+  conversation: Conversation;
+  activeConversation?: Conversation;
+  Preview?: React.ComponentType<ConversationPreviewUIComponentProps>;
+  Avatar?: React.ComponentType<AvatarProps>;
+  setActiveConversation?: (conversation: Conversation | undefined) => void;
+  searchValue?: string;
+  conversationUpdateCount?: number;
+  activeConversationID?: string;
+  setActiveConversationID?: (conversationID: string) => void;
 }
 export function ConversationPreview<T extends ConversationPreviewProps>(
   props: T,
-):React.ReactElement {
+) {
   const {
     activeConversation,
     conversation,
@@ -43,11 +43,11 @@ export function ConversationPreview<T extends ConversationPreviewProps>(
     searchValue,
     conversationUpdateCount,
   } = props;
-  const { language } = useTUIKitContext('TUIConversation');
+  const { language } = useUIKit();
   const {
     setActiveConversation,
     myProfile,
-  } = useTUIKitContext('ConversationPreview');
+  } = useUIManager('ConversationPreview');
   const [displayImage, setDisplayImage] = useState(getDisplayImage(conversation));
   const [displayTitle, setDisplayTitle] = useState(getDisplayTitle(conversation, searchValue));
   const [displayMessage, setDisplayMessage] = useState(myProfile && getDisplayMessage(conversation, myProfile, language));

package/src/components/ConversationPreview/ConversationPreviewContent.tsx

@@ -10,7 +10,7 @@ import './styles/index.scss';
 import { Icon, IconTypes } from '../Icon';
 import { Plugins } from '../Plugins';
 import { useConversation } from '../../hooks';
-import { useTUIKitContext } from '../../context';
+import { useUIKit, useUIManager } from '../../context';
 
 export interface IPluginsRef {
   closeMore?: () => void,
@@ -34,7 +34,8 @@ export function unMemoConversationPreviewContent<T extends ConversationPreviewUI
 
   const { t } = useTranslation();
   const conversationPreviewButton = useRef<HTMLButtonElement | null>(null);
-  const { chat, conversation: activeConversation } = useTUIKitContext('ConversationPreviewContent');
+  const { chat } = useUIKit();
+  const { conversation: activeConversation } = useUIManager('ConversationPreviewContent');
   const { pinConversation, deleteConversation } = useConversation(chat);
   const activeClass = active ? 'conversation-preview-content--active' : '';
   const unreadClass = unread && unread >= 1 ? 'conversation-preview-content--unread' : '';

package/src/components/Plugins/styles/color.scss

@@ -8,12 +8,12 @@
       color: get(text-primary);
     }
 
-    [data-chat-theme="light"] & {
+    [data-uikit-theme="light"] & {
       background-color: var(--chat-theme-light-bg-primary);
       box-shadow: var(--chat-theme-light-box-shadow-1);
     }
 
-    [data-chat-theme="dark"] & {
+    [data-uikit-theme="dark"] & {
       background-color: var(--chat-theme-dark-bg-3);
       box-shadow: var(--chat-theme-dark-box-shadow-1);
     }

package/src/components/TUIChat/TUIChat.tsx

@@ -10,7 +10,7 @@ import TUIChatEngine, {
   StoreName,
 } from '@tencentcloud/chat-uikit-engine';
 import { JSONStringToParse } from '../untils';
-import { useTUIKitContext } from '../../context/TUIKitContext';
+import { useUIKit, useUIManager } from '../../context';
 import { TUIChatStateContextProvider } from '../../context/TUIChatStateContext';
 import { TUIChatActionProvider } from '../../context/TUIChatActionContext';
 import { ComponentProvider, UnknowPorps } from '../../context/ComponentContext';
@@ -79,7 +79,8 @@ function UnMemoizedTUIChat <T extends TUIChatProps>(
     EmptyPlaceholder = <EmptyStateIndicator listType="chat" />,
   } = props;
 
-  const { conversation: contextConversation, chat } = useTUIKitContext('TUIChat');
+  const { chat } = useUIKit();
+  const { conversation: contextConversation } = useUIManager('TUIChat');
 
   const conversation = propsConversation || contextConversation;
 
@@ -162,7 +163,7 @@ function TUIChatInner <T extends TUIChatInnerProps>(
     setHighlightedMessageId,
     setActiveMessageID,
   } = useHandleMessage({
-    // eslint-disable-next-line 
+    // eslint-disable-next-line
     // @ts-ignore
     state,
     dispatch,

package/src/components/TUIChatHeader/TUIChatHeaderDefault.tsx

@@ -6,7 +6,7 @@ import { handleDisplayAvatar } from '../untils';
 import { isH5 } from '../../utils/env';
 import './styles/index.scss';
 import { Icon, IconTypes } from '../Icon';
-import { useTUIKitContext } from '../../context';
+import { useUIManager } from '../../context';
 
 export interface TUIChatHeaderDefaultProps {
   title?: string,
@@ -32,7 +32,7 @@ function TUIChatHeaderDefaultWithContext <T extends TUIChatHeaderBasicProps>(
     isLive,
     opateIcon,
   } = props;
-  const { setActiveContact } = useTUIKitContext('TUIContact');
+  const { setActiveContact } = useUIManager('TUIContact');
   const [title, setTitle] = useState(propTitle);
   const [avatar, setAvatar] = useState<React.ReactElement | string>('');
 
@@ -82,7 +82,7 @@ function TUIChatHeaderDefaultWithContext <T extends TUIChatHeaderBasicProps>(
     TUIConversationService.switchConversation('');
     setActiveContact();
   };
-  const { setTUIManageShow } = useTUIKitContext();
+  const { setTUIManageShow } = useUIManager();
   const openTUIManage = () => {
     setTUIManageShow && setTUIManageShow(true);
   };

package/src/components/TUIContact/TUIContact.tsx

@@ -5,7 +5,7 @@ import {
   TUIContactContextValue,
 } from '../../context/TUIContactContext';
 import { isH5 } from '../../utils/env';
-import { useTUIKitContext } from '../../context';
+import { useUIManager } from '../../context';
 import useTUIContact from './hooks/useTUIContact';
 import { TUIContactList } from './TUIContactList/TUIContactList';
 import { TUIContactSearch } from '../TUIContactSearch/TUIContactSearch';
@@ -17,7 +17,7 @@ export function UnMemoizedTUIContact<T>(
 ): React.ReactElement {
   const { children } = props;
   const { t } = useTranslation();
-  const { setActiveContact } = useTUIKitContext('TUIContact');
+  const { setActiveContact } = useUIManager('TUIContact');
   const [isShowAddFriend, setShowAddFriend] = useState(false);
   const addFriend = () => {
     setActiveContact();

package/src/components/TUIContact/TUIContactInfo/TUIContactInfo.tsx

@@ -1,7 +1,7 @@
 import React, {
   PropsWithChildren,
 } from 'react';
-import { useTUIKitContext } from '../../../context';
+import { useUIManager } from '../../../context';
 import { isH5 } from '../../../utils/env';
 import { FriendInfo } from './friendInfo';
 import { BlockInfo } from './blockInfo';
@@ -18,7 +18,7 @@ export function UnMemoizedTUIContactInfo<T extends TUIContactInfoProps>(
   props: PropsWithChildren<T>,
 ): React.ReactElement {
   const { showChats } = props;
-  const { contactData } = useTUIKitContext('TUIContact');
+  const { contactData } = useUIManager('TUIContact');
   if (!contactData?.type) {
     return (<> </>);
   }

package/src/components/TUIContact/TUIContactInfo/basicInfo.tsx

@@ -2,7 +2,7 @@ import React from 'react';
 import { useTranslation } from 'react-i18next';
 import { Profile } from '@tencentcloud/chat';
 import { TUIConversationService } from '@tencentcloud/chat-uikit-engine';
-import { useTUIKitContext } from '../../../context';
+import { useUIManager } from '../../../context';
 import { Icon, IconTypes } from '../../Icon';
 import { isH5 } from '../../../utils/env';
 
@@ -19,7 +19,7 @@ export function UnMemoizedBasicInfo<T extends Props>(
   const {
     userID, nick, selfSignature, avatar,
   } = profile;
-  const { setActiveContact } = useTUIKitContext('TUIContact');
+  const { setActiveContact } = useUIManager('TUIContact');
   const back = () => {
     TUIConversationService.switchConversation('');
     setActiveContact();

package/src/components/TUIContact/TUIContactInfo/blockInfo.tsx

@@ -1,7 +1,7 @@
 import React, { useState, useEffect } from 'react';
 import { useTranslation } from 'react-i18next';
 import { Profile } from '@tencentcloud/chat';
-import { useTUIKitContext } from '../../../context';
+import { useUIManager } from '../../../context';
 import { BasicInfo } from './basicInfo';
 import { Switch } from '../../Switch';
 import useContactInfo from './hooks/useContactInfo';
@@ -13,7 +13,7 @@ export function UnMemoizedBlockInfo<T extends Props>(
   props: T,
 ): React.ReactElement {
   const { profile } = props;
-  const { contactData, setActiveContact } = useTUIKitContext('TUIContact');
+  const { contactData, setActiveContact } = useUIManager('TUIContact');
   const { t } = useTranslation();
   const [isAddToBlocklist, setIsAddToBlocklist] = useState(false);
 

package/src/components/TUIContact/TUIContactInfo/friendApplication.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import { useTranslation } from 'react-i18next';
 import TencentCloudChat, { FriendApplication } from '@tencentcloud/chat';
-import { useTUIKitContext } from '../../../context';
+import { useUIManager } from '../../../context';
 import { Avatar, defaultUserAvatar } from '../../Avatar';
 import useContactInfo from './hooks/useContactInfo';
 
@@ -11,7 +11,7 @@ interface Props {
 export function UnMemoizedFriendApplication<T extends Props>(
   props: T,
 ): React.ReactElement {
-  const { setActiveContact } = useTUIKitContext('TUIContact');
+  const { setActiveContact } = useUIManager('TUIContact');
   const { t } = useTranslation();
   const { application } = props;
   const {

package/src/components/TUIContact/TUIContactInfo/friendInfo.tsx

@@ -2,7 +2,7 @@ import React, { useState, useEffect } from 'react';
 import { useTranslation } from 'react-i18next';
 import { Friend } from '@tencentcloud/chat';
 import { TUIConversationService, IConversationModel } from '@tencentcloud/chat-uikit-engine';
-import { useTUIKitContext } from '../../../context';
+import { useUIKit, useUIManager } from '../../../context';
 import { BasicInfo } from './basicInfo';
 import { Switch } from '../../Switch';
 import useContactInfo from './hooks/useContactInfo';
@@ -16,9 +16,10 @@ interface Props {
 export function UnMemoizedFriendInfo<T extends Props>(
   props: T,
 ): React.ReactElement {
+  const { chat } = useUIKit();
   const {
-    chat, contactData, setActiveContact, setActiveConversation,
-  } = useTUIKitContext('TUIContact');
+    contactData, setActiveContact, setActiveConversation,
+  } = useUIManager('TUIContact');
   const { t } = useTranslation();
   const { friend, showChats } = props;
   const { userID, profile, remark } = friend;

package/src/components/TUIContact/TUIContactInfo/groupInfo.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import { useTranslation } from 'react-i18next';
 import { TUIConversationService, IGroupModel, IConversationModel } from '@tencentcloud/chat-uikit-engine';
-import { useTUIKitContext } from '../../../context';
+import { useUIManager } from '../../../context';
 import { Icon, IconTypes } from '../../Icon';
 import { isH5 } from '../../../utils/env';
 import '../index.scss';
@@ -16,8 +16,8 @@ export function UnMemoizedGroupInfo<T extends Props>(
   props: T,
 ): React.ReactElement {
   const { group, showChats } = props;
-  
-  const { setActiveContact, setActiveConversation } = useTUIKitContext('TUIContact');
+
+  const { setActiveContact, setActiveConversation } = useUIManager('TUIContact');
   const { t } = useTranslation();
   const { groupID, name, avatar } = group;
 

package/src/components/TUIContact/TUIContactInfo/hooks/useContactInfo.tsx

@@ -1,10 +1,10 @@
 import React, { useCallback } from 'react';
 import TencentCloudChat from '@tencentcloud/chat';
 import { Toast } from '../../../Toast';
-import { useTUIKitContext } from '../../../../context';
+import { useUIKit } from '../../../../context';
 
 function useContactInfo() {
-  const { chat } = useTUIKitContext('useContactInfo');
+  const { chat } = useUIKit('useContactInfo');
 
   const removeFromBlocklist = useCallback((userID: string) => {
     chat.removeFromBlacklist({

package/src/components/TUIContact/TUIContactList/TUIContactList.tsx

@@ -2,7 +2,7 @@ import React, { useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import TencentCloudChat from '@tencentcloud/chat';
 import { isH5 } from '../../../utils/env';
-import { useTUIKitContext, useTUIContactContext } from '../../../context';
+import { useUIManager, useTUIContactContext } from '../../../context';
 import useContactInfo from '../TUIContactInfo/hooks/useContactInfo';
 import useTUIContact from '../hooks/useTUIContact';
 import { Avatar, defaultUserAvatar } from '../../Avatar';
@@ -19,7 +19,7 @@ interface RenderContactListProps {
 }
 
 function UnMemoizedTUIContactList<T>(): React.ReactElement {
-  const { setActiveContact } = useTUIKitContext();
+  const { setActiveContact } = useUIManager();
   const { t } = useTranslation();
   const {
     isShowContactList, friendList, blocklistProfile, friendApplicationList,
@@ -143,21 +143,21 @@ const RenderContactList = ({ type, isShow, setShow, list, title } : RenderContac
               </div>
             );
           })}
-        <RenderContactList 
+        <RenderContactList
           type={'block'}
           title={t('TUIContact.Blocked List')}
           isShow={isShowBlocklist}
           setShow={setShowBlocklist}
           list={blocklistProfile}
         />
-        <RenderContactList 
+        <RenderContactList
           type={'group'}
           title={t('TUIContact.Group List')}
           setShow={setShowGrouplist}
           isShow={isShowGrouplist}
           list={groupList}
         />
-        <RenderContactList 
+        <RenderContactList
           type={'friend'}
           title={t('TUIContact.Friends')}
           setShow={setShowFriends}

package/src/components/TUIContact/hooks/useTUIContact.tsx

@@ -5,10 +5,10 @@ import {
   StoreName,
   IGroupModel,
 } from '@tencentcloud/chat-uikit-engine';
-import { useTUIKitContext } from '../../../context';
+import { useUIKit } from '../../../context';
 
 function useTUIContact() {
-  const { chat } = useTUIKitContext();
+  const { chat } = useUIKit();
   const [friendList, setFriendList] = useState([]);
   const [blockList, setBlockList] = useState([]);
   const [friendApplicationList, setFriendApplicationList] = useState([]);

package/src/components/TUIContactSearch/TUIContactSearch.tsx

@@ -1,6 +1,6 @@
 import React, { useState } from 'react';
 import { useTranslation } from 'react-i18next';
-import { useTUIKitContext, useTUIContactContext } from '../../context';
+import { useUIManager, useTUIContactContext } from '../../context';
 import useContactSearch from './hooks/useContactSearch';
 import { Icon, IconTypes } from '../Icon';
 import { Avatar, defaultUserAvatar } from '../Avatar';
@@ -8,7 +8,7 @@ import { Input } from '../Input';
 import './index.scss';
 
 export function UnMemoizedTUIContactSearch<T>(): React.ReactElement {
-  const { chat, setActiveContact } = useTUIKitContext('TUIContactSearch');
+  const { setActiveContact } = useUIManager('TUIContactSearch');
   const { t } = useTranslation();
   const { friendList, setShowContactList } = useTUIContactContext('TUIContactList');
   const [isShowSearchResult, setShowSearchResult] = useState(false);

package/src/components/TUIContactSearch/hooks/useContactSearch.tsx

@@ -1,9 +1,9 @@
 import TencentCloudChat from '@tencentcloud/chat';
-import { useTUIKitContext, useTUIContactContext } from '../../../context';
+import { useUIKit, useTUIContactContext } from '../../../context';
 
 function useContactSearch() {
   const { blockList } = useTUIContactContext('TUIContactList');
-  const { chat } = useTUIKitContext('TUIContactSearch');
+  const { chat } = useUIKit('TUIContactSearch');
 
   const checkFriend = (info: any): Promise<any> => chat.checkFriend({
     userIDList: [info?.userID],

package/src/components/TUIConversationList/TUIConversationList.tsx

@@ -1,7 +1,7 @@
 import React, { useRef, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { Conversation } from '@tencentcloud/chat';
-import { useTUIKitContext } from '../../context';
+import { useUIKit, useUIManager } from '../../context';
 import { isH5 } from '../../utils/env';
 import useConversationList from './hooks/useConversationList';
 import './index.scss';
@@ -43,13 +43,13 @@ export function UnMemoTUIConversationList<T extends Props>(props: T):React.React
     },
   } = props;
   const { t } = useTranslation();
+  const { chat } = useUIKit('TUIConversationList');
   const {
-    chat,
     customClasses,
     conversation,
     setActiveConversation,
     setTUIProfileShow,
-  } = useTUIKitContext('TUIConversationList');
+  } = useUIManager('TUIConversationList');
   const { filterConversation: contextFilterConversation } = useTUIConversationContext('TUIConversationList');
   const filterConversation = propsFilterConversation || contextFilterConversation;
   const [conversationUpdateCount, setConversationUpdateCount] = useState(0);
@@ -64,7 +64,6 @@ export function UnMemoTUIConversationList<T extends Props>(props: T):React.React
     if (!conversationList.length) {
       return;
     }
-    setActiveConversation(conversation);
   };
   const { conversationList, setConversationList } = useConversationList(
     chat,

package/src/components/TUIConversationList/hooks/useConversationUpdate.tsx

@@ -1,6 +1,6 @@
 import React, { useEffect } from 'react';
 import TencentCloudChat, { Conversation } from '@tencentcloud/chat';
-import { useTUIKitContext } from '../../../context';
+import { useUIKit } from '../../../context';
 
 export const useConversationUpdate = (
   setConversationList?: React.Dispatch<React.SetStateAction<Array<Conversation>>>,
@@ -11,7 +11,7 @@ export const useConversationUpdate = (
   forceUpdate?: () => void,
   filterConversation?:(conversationList: Array<Conversation>) => Array<Conversation>,
 ) => {
-  const { chat } = useTUIKitContext('useConversationUpdate');
+  const { chat } = useUIKit('useConversationUpdate');
   useEffect(() => {
     const onConversationListUpdated = (event:any) => {
       if (setConversationList) {