@tencentcloud/chat-uikit-react 2.2.7 → 2.2.9

package/src/context/ConversationListContext.tsx

@@ -0,0 +1,113 @@
+import React, { PropsWithChildren, useContext, useEffect, useState } from 'react';
+import TUIChatEngine, { IConversationModel, StoreName, TUIConversationService, TUIStore } from '@tencentcloud/chat-uikit-engine';
+
+interface ConversationListProviderProps {
+  /** Specifies a function to filter conversations in the conversation list. */
+  filter?: (conversationList: IConversationModel[]) => IConversationModel[];
+  /** Specifies a function to sort conversations in the conversation list. */
+  sort?: (conversationList: IConversationModel[]) => IConversationModel[];
+}
+interface ConversationListContextType {
+  conversationList: IConversationModel[];
+  filteredAndSortedConversationList: IConversationModel[];
+  currentConversation: IConversationModel | undefined;
+  setCurrentConversation: (conversation: IConversationModel) => void;
+  isLoading: boolean;
+  isLoadError: boolean;
+}
+
+const ConversationListContext = React.createContext<ConversationListContextType | null>(null);
+
+function ConversationListProvider(props: PropsWithChildren<Partial<ConversationListProviderProps>>) {
+  const {
+    filter,
+    sort,
+    children,
+  } = props;
+
+  const [conversationList, setConversationList] = useState<IConversationModel[]>([]);
+
+  const [currentConversation, _setCurrentConversation] = useState<IConversationModel | undefined>(undefined);
+
+  const [filteredAndSortedConversationList, setFilteredAndSortedConversationList] = useState<IConversationModel[]>([]);
+
+  const [isLoading, setIsLoading] = useState(true);
+  const [isLoadError, setIsLoadError] = useState(false);
+
+  useEffect(() => {
+    TUIStore.watch(StoreName.CONV, {
+      conversationList: onConversationListUpdated,
+      currentConversation: onCurrentConversationUpdated,
+    });
+    TUIStore.watch(StoreName.USER, {
+      netStateChange: onNetStateChange,
+    });
+
+    return () => {
+      TUIStore.unwatch(StoreName.CONV, {
+        conversationList: onConversationListUpdated,
+        currentConversation: onCurrentConversationUpdated,
+      });
+      TUIStore.unwatch(StoreName.USER, {
+        netStateChange: onNetStateChange,
+      });
+    };
+  }, []);
+
+  useEffect(() => {
+    // filter & sort conversationList
+    let _conversationList = conversationList;
+    filter && (_conversationList = filter(_conversationList));
+    sort && (_conversationList = sort(_conversationList));
+    setFilteredAndSortedConversationList(_conversationList);
+  }, [conversationList, sort, filter]);
+
+  function onConversationListUpdated(list: IConversationModel[]) {
+    // original conversationList
+    setConversationList(list);
+    if (isLoading) {
+      setIsLoading(false);
+    }
+  }
+
+  function onCurrentConversationUpdated(conversation: IConversationModel) {
+    _setCurrentConversation(conversation);
+  }
+
+  function onNetStateChange(netState: string) {
+    if (netState === TUIChatEngine.TYPES.NET_STATE_DISCONNECTED) {
+      setIsLoadError(true);
+    } else {
+      setIsLoadError(false);
+    }
+  }
+
+  function setCurrentConversation(conversation: IConversationModel) {
+    TUIConversationService.switchConversation(conversation?.conversationID);
+  }
+
+  const value = {
+    conversationList,
+    filteredAndSortedConversationList,
+    currentConversation,
+    setCurrentConversation,
+    isLoading,
+    isLoadError,
+  };
+
+  return (
+    <ConversationListContext.Provider value={value}>
+      {children}
+    </ConversationListContext.Provider>
+  );
+}
+
+function useConversationList() {
+  const context = useContext(ConversationListContext);
+  if (!context) {
+    throw new Error('useConversationList must be used within a useConversationList');
+  }
+  return context;
+}
+
+export { useConversationList, ConversationListProvider, ConversationListContextType, ConversationListProviderProps };

package/src/context/LanguageContext.tsx

@@ -6,6 +6,7 @@ import {
   PropsWithChildren,
 } from 'react';
 import { useTranslation } from 'react-i18next';
+import { TUITranslateService } from '@tencentcloud/chat-uikit-engine';
 
 interface LanguageContextType {
   language: string;

package/src/context/MessageContext.tsx

@@ -0,0 +1,55 @@
+import React, { PropsWithChildren, ReactEventHandler, useContext } from 'react';
+import { Message } from '@tencentcloud/chat';
+import { MessagePluginsProps } from '../components';
+
+export enum messageShowType {
+  IN = 'in',
+  OUT = 'out',
+  ALL = 'all',
+  NONE = 'none',
+}
+
+export interface TUIMessageContextValue {
+  message?: Message;
+  handleDelete?: ReactEventHandler;
+  CustemElement?: React.ComponentType<{ message: Message }>;
+  TextElement?: React.ComponentType<{ message: Message }>;
+  ImageElement?: React.ComponentType<{ message: Message }>;
+  VideoElement?: React.ComponentType<{ message: Message }>;
+  AudioElement?: React.ComponentType<{ message: Message }>;
+  FileElement?: React.ComponentType<{ message: Message }>;
+  MergerElement?: React.ComponentType<{ message: Message }>;
+  LocationElement?: React.ComponentType<{ message: Message }>;
+  FaceElement?: React.ComponentType<{ message: Message }>;
+  filter?: (data: Message) => void;
+  isShowTime?: boolean;
+  isShowRead?: boolean;
+  plugin?: MessagePluginsProps;
+  prefix?: React.ReactElement | string;
+  suffix?: React.ReactElement | string;
+  customName?: React.ReactElement;
+  showAvatar?: messageShowType;
+  showName?: messageShowType;
+  customAvatar?: React.ReactElement;
+  isShowProgress?: boolean;
+  Progress?: React.ComponentType<{ message: Message }>;
+}
+
+export const TUIMessageContext = React.createContext<TUIMessageContextValue>({});
+export function TUIMessageContextProvider({ children, value }: PropsWithChildren<{
+  value: TUIMessageContextValue;
+}>): React.ReactElement {
+  return (
+    <TUIMessageContext.Provider value={value}>
+      {children}
+    </TUIMessageContext.Provider>
+  );
+}
+
+export function useTUIMessageContext(componentName?: string): TUIMessageContextValue {
+  const contextValue = useContext(TUIMessageContext);
+  if (!contextValue && componentName) {
+    return {} as TUIMessageContextValue;
+  }
+  return (contextValue as unknown) as TUIMessageContextValue;
+}

package/src/context/MessageInputContext.tsx

@@ -0,0 +1,54 @@
+import React, {
+  PropsWithChildren,
+  ChangeEventHandler,
+  useContext,
+  KeyboardEventHandler,
+  MutableRefObject,
+} from 'react';
+import { PluginConfigProps } from '../components';
+import type { ICursorPos } from '../components/MessageInput/hooks';
+import type { EmojiData } from '../components/MessageInput/hooks/useEmojiPicker';
+import type { filesData } from '../components/MessageInput/hooks/useUploadPicker';
+import type { MESSAGE_TYPE_NAME } from '../constants';
+
+interface dispatchParams {
+  type: string;
+  value?: string;
+}
+export interface TUIMessageInputContextValue {
+  text?: string;
+  disabled?: boolean;
+  dispatch?: (params: dispatchParams) => void;
+  handleChange?: ChangeEventHandler<HTMLTextAreaElement>;
+  handleSubmit?: (event: React.BaseSyntheticEvent) => void;
+  handleKeyDown?: KeyboardEventHandler<HTMLTextAreaElement>;
+  textareaRef?: MutableRefObject<HTMLTextAreaElement | undefined>;
+  onSelectEmoji?: (emoji: EmojiData) => void;
+  sendFaceMessage?: (emoji: EmojiData) => void;
+  sendUploadMessage?: (file: filesData, type: MESSAGE_TYPE_NAME) => void;
+  insertText?: (textToInsert: string) => void;
+  setText?: (textToInsert: string) => void;
+  focus?: boolean;
+  handlePasete?: (e: ClipboardEvent) => void;
+  setCursorPos?: (e: ICursorPos) => void;
+  pluginConfig?: PluginConfigProps;
+}
+
+export const TUIMessageInputContext = React.createContext<TUIMessageInputContextValue>({});
+export function TUIMessageInputContextProvider({ children, value }: PropsWithChildren<{
+  value: TUIMessageInputContextValue;
+}>): React.ReactElement {
+  return (
+    <TUIMessageInputContext.Provider value={value}>
+      {children}
+    </TUIMessageInputContext.Provider>
+  );
+}
+
+export function useTUIMessageInputContext(componentName?: string): TUIMessageInputContextValue {
+  const contextValue = useContext(TUIMessageInputContext);
+  if (!contextValue && componentName) {
+    return {} as TUIMessageInputContextValue;
+  }
+  return (contextValue as unknown) as TUIMessageInputContextValue;
+}

package/src/context/index.ts

@@ -1,8 +1,9 @@
 export * from './UIKitContext';
 export * from './UIManagerContext';
-export * from './TUIChatStateContext';
-export * from './TUIChatActionContext';
-export * from './TUIMessageContext';
+export * from './ChatStateContext';
+export * from './ChatActionContext';
+export * from './MessageContext';
 export * from './ComponentContext';
-export * from './TUIMessageInputContext';
-export * from './TUIContactContext';
+export * from './MessageInputContext';
+export * from './ContactContext';
+export * from './ConversationListContext';

package/src/hooks/index.ts

@@ -1,2 +1,4 @@
 export * from './useConversation';
 export * from './useProfile';
+export * from './useMouseHover';
+export * from './useLongPress';

package/src/hooks/useConversation.tsx

@@ -1,78 +1,30 @@
-import React from 'react';
-import TencentCloudChat from '@tencentcloud/chat';
-import { useTUIConversationContext } from '../context/TUIConversationContext';
+import TUIChatEngine, { TUIGroupService, TUIConversationService, IConversationModel, CreateGroupParams } from '@tencentcloud/chat-uikit-engine';
 
-export interface CreateGroupConversationParams {
-  name: string;
-  type?: TencentCloudChat.TYPES;
-  groupID?: string;
-  introduction?: string;
-  notification?: string;
-  avatar?: string;
-  maxMemberNum?: number;
-  joinOption?: string;
-  memberList?: Array<object>;
-  groupCustomField?: Array<object>;
-  isSupportTopic?: boolean;
+async function createC2CConversation(userID: string): Promise<IConversationModel> {
+  const response = await TUIConversationService.getConversationProfile(`C2C${userID}`);
+  return response.data.conversation;
 }
-export const useConversation = (chat: any) => {
-  const {
-    createConversation: contextCreateConversation,
-    deleteConversation: contextDeleteConversation,
-  } = useTUIConversationContext('useConversation');
-  const createConversation = async (
-    params: string | CreateGroupConversationParams,
-  ) => {
-    // create c2c conversation
-    if (typeof params === 'string') {
-      const { data } = await chat.getConversationProfile(params);
-      return data.conversation;
-    }
-    // create group conversation
-    const {
-      name,
-      type,
-      groupID,
-      introduction,
-      notification,
-      avatar,
-      maxMemberNum,
-      joinOption,
-      memberList = [],
-      groupCustomField = [],
-      isSupportTopic,
-    } = params;
-    const res = await chat.createGroup({
-      name,
-      type,
-      groupID,
-      introduction,
-      notification,
-      avatar,
-      maxMemberNum,
-      joinOption,
-      memberList,
-      groupCustomField,
-      isSupportTopic,
+
+async function createGroupConversation(groupParams: CreateGroupParams): Promise<IConversationModel> {
+  if (groupParams.type === TUIChatEngine.TYPES.GRP_COMMUNITY) {
+    delete groupParams.groupID;
+  }
+
+  const res = await TUIGroupService.createGroup(groupParams);
+  const { type } = res.data.group;
+
+  if (type === TUIChatEngine.TYPES.GRP_AVCHATROOM) {
+    await TUIGroupService.joinGroup({
+      groupID: res.data.group.groupID,
+      applyMessage: '',
     });
-    const { groupID: createdGroupID } = res.data.group;
-    if (type === TencentCloudChat.TYPES.GRP_AVCHATROOM) {
-      await chat.joinGroup({
-        groupID: createdGroupID,
-        type: TencentCloudChat.TYPES.GRP_AVCHATROOM,
-      });
-    }
-    const { data } = await chat.getConversationProfile(`GROUP${createdGroupID}`);
-    return data.conversation;
-  };
-  const pinConversation = (options: {
-    conversationID: string;
-    isPinned: boolean;
-  }) => chat.pinConversation(options);
-  const deleteConversation = (conversationID: string) => chat.deleteConversation(conversationID);
-  return {
-    createConversation: contextCreateConversation || createConversation,
-    pinConversation,
-    deleteConversation: contextDeleteConversation || deleteConversation,
-  };
+  }
+
+  const response = await TUIConversationService.getConversationProfile(`GROUP${res.data.group.groupID}`);
+  return response.data.conversation;
+}
+
+export {
+  createC2CConversation,
+  createGroupConversation,
 };

package/src/hooks/useLongPress.tsx

@@ -0,0 +1,117 @@
+import React, {
+  useState,
+  useRef,
+  useCallback,
+} from 'react';
+import { isH5 } from '../utils/env';
+
+const DEFAULT_DURATION = 300;
+
+function preventDefault(e: Event) {
+  if (!isTouchEvent(e)) {
+    return;
+  }
+
+  if (e.touches.length < 2 && e.preventDefault) {
+    e.preventDefault();
+  }
+}
+
+export function isTouchEvent(e: Event): e is TouchEvent {
+  return e && 'touches' in e;
+}
+
+interface PressHandlers<T> {
+  onLongPress?: (e: React.MouseEvent<T> | React.TouchEvent<T>) => void;
+  onClick?: (e: React.MouseEvent<T> | React.TouchEvent<T>) => void;
+}
+
+interface Options {
+  delay?: number;
+  shouldPreventDefault?: boolean;
+  shouldStopPropagation?: boolean;
+}
+
+interface UseLongPressType<T> {
+  isLongPressing: boolean;
+  onTouchMove: (e: React.TouchEvent<T>) => void;
+  onMouseDown: (e: React.MouseEvent<T>) => void;
+  onTouchStart: (e: React.TouchEvent<T>) => void;
+  onMouseUp: (e: React.MouseEvent<T>) => void;
+  onMouseLeave: (e: React.MouseEvent<T>) => void;
+  onTouchEnd: (e: React.TouchEvent<T>) => void;
+}
+
+export default function useLongPress<T>({
+  onLongPress,
+  onClick,
+}: PressHandlers<T>, {
+  delay = DEFAULT_DURATION,
+  shouldPreventDefault = true,
+  shouldStopPropagation = false,
+}: Options = {}): UseLongPressType<T> {
+  const [longPressTriggered, setLongPressTriggered] = useState(false);
+  const [dragTriggered, setDragTriggered] = useState(false);
+  const timeout = useRef<ReturnType<typeof setTimeout>>();
+  const target = useRef<EventTarget>();
+
+  const start = useCallback((e: React.MouseEvent<T> | React.TouchEvent<T>) => {
+    e.persist();
+    const clonedEvent = {
+      ...e,
+    };
+    setDragTriggered(false);
+    if (shouldStopPropagation) {
+      e.stopPropagation();
+    }
+    if (shouldPreventDefault && e.target) {
+      e.target.addEventListener(
+        'touchend',
+        preventDefault,
+        {
+          passive: false,
+        },
+      );
+      target.current = e.target;
+    }
+
+    timeout.current = setTimeout(() => {
+      onLongPress?.(clonedEvent);
+      setLongPressTriggered(true);
+    }, delay);
+  }, [onLongPress, delay, shouldPreventDefault, shouldStopPropagation, isH5]);
+
+  const clear = useCallback((
+    e: React.MouseEvent<T> | React.TouchEvent<T>,
+    shouldTriggerClick = true,
+    onDrag = false,
+  ) => {
+    if (onDrag) {
+      setDragTriggered(true);
+    } else {
+      setDragTriggered(false);
+    }
+    if (timeout?.current) {
+      clearTimeout(timeout.current);
+    }
+    if (shouldTriggerClick && !longPressTriggered && !dragTriggered) {
+      onClick?.(e);
+    }
+    setLongPressTriggered(false);
+    if (shouldPreventDefault && target.current) {
+      target.current.removeEventListener('touchend', preventDefault);
+    }
+  }, [shouldPreventDefault, onClick, longPressTriggered, dragTriggered]);
+
+  return {
+    isLongPressing: longPressTriggered,
+    onMouseDown: (e: React.MouseEvent<T>) => start(e),
+    onMouseUp: (e: React.MouseEvent<T>) => clear(e),
+    onMouseLeave: (e: React.MouseEvent<T>) => clear(e, false),
+    onTouchStart: (e: React.TouchEvent<T>) => start(e),
+    // setDragTriggered as true on touchmove, so that next onTouchEnd is ignored
+    // if we dont do it, onClick?.(e) will be triggred, see inside clear()
+    onTouchMove: (e: React.TouchEvent<T>) => clear(e, false, true),
+    onTouchEnd: (e: React.TouchEvent<T>) => clear(e),
+  };
+}

package/src/hooks/useMouseHover.tsx

@@ -0,0 +1,21 @@
+import { useState } from 'react';
+
+import type { RefObject } from 'react';
+
+export default function useHover<T extends HTMLElement = HTMLElement>(
+  elementRef: RefObject<T>,
+): boolean {
+  const [value, setValue] = useState<boolean>(false);
+
+  const handleMouseEnter = () => {
+    setValue(true);
+  };
+  const handleMouseLeave = () => {
+    setValue(false);
+  };
+
+  elementRef.current?.addEventListener('mouseenter', handleMouseEnter);
+  elementRef.current?.addEventListener('mouseleave', handleMouseLeave);
+
+  return value;
+}

package/src/locales/en-US/TUIConversation.ts

@@ -8,6 +8,8 @@ const TUIConversation = {
   'Conversation Information': 'Conversation Information',
   'Pin': 'Pin',
   'Unpin': 'Unpin',
+  'Mute': 'Mute',
+  'Unmute': 'Unmute',
   'Search': 'Search',
   'Add Participants': 'Add Participants',
   'No conversation': 'No conversation',
@@ -19,6 +21,8 @@ const TUIConversation = {
   'Create': 'Create',
   'Details': 'Details',
   'Work': 'Work',
+  'Private': 'Work',
+  'ChatRoom': 'Meeting',
   'Public': 'Public',
   'Meeting': 'Meeting',
   'AVChatRoom': 'AVChatRoom',

package/src/locales/index.ts

@@ -1,5 +1,6 @@
 import i18next from 'i18next';
 import { initReactI18next } from 'react-i18next';
+import { TUITranslateService } from '@tencentcloud/chat-uikit-engine';
 import { message as enMessage } from './en-US/index';
 import { message as zhMessage } from './zh-CN/index';
 import { message as jaMessage } from './ja-JP/index';
@@ -32,5 +33,14 @@ i18next.use(initReactI18next).init({
   },
 });
 
+const engineLocaleResources = {
+  'en-US': enMessage,
+  'zh-CN': zhMessage,
+  'ja-JP': jaMessage,
+  'ko-KR': koMessage,
+};
+TUITranslateService.provideLanguages(engineLocaleResources);
+TUITranslateService.useI18n('en-US');
+
 const { t } = i18next;
 export { i18next, t };

package/src/locales/ja-JP/TUIConversation.ts

@@ -6,6 +6,8 @@ const TUIConversation = {
   'Delete': 'チャットを削除',
   'Pin': 'チャットをトップに固定',
   'Unpin': 'トップ固定を解除',
+  'Mute': 'ミュート',
+  'Unmute': 'ミュート解除',
   'Conversation Information': 'チャット情報',
   'Search': '検索',
   'Add Participants': 'グループチャットを作成',
@@ -18,6 +20,8 @@ const TUIConversation = {
   'Create': '作成',
   'Details': '詳細',
   'Work': '友達の仕事グループ(Work)',
+  'Private': '友達の仕事グループ(Work)',
+  'ChatRoom': '一時的な会議グループ(Meeting)',
   'Public': '見知らぬ人の社交グループ(Public)',
   'Meeting': '一時的な会議グループ(Meeting)',
   'AVChatRoom': 'ライブチャットルーム(AVChatroom)',

package/src/locales/ko-KR/TUIConversation.ts

@@ -6,6 +6,8 @@ const TUIConversation = {
   'Delete': '채팅 삭제',
   'Pin': '채팅 고정',
   'Unpin': '채팅 고정 해제',
+  'Mute': '음소거',
+  'Unmute': '음소거 해제',
   'Conversation Information': '채팅 정보',
   'Search': '검색',
   'Add Participants': '그룹 채팅 생성',
@@ -18,6 +20,8 @@ const TUIConversation = {
   'Create': '생성',
   'Details': '상세',
   'Work': '친구 작업 그룹(Work)',
+  'Private': '친구 작업 그룹(Work)',
+  'ChatRoom': '임시 회의 그룹(Meeting)',
   'Public': '낯선 사람 소셜 그룹(Public)',
   'Meeting': '임시 회의 그룹(Meeting)',
   'AVChatRoom': '라이브 방송 그룹(AVChatroom)',

package/src/locales/zh-CN/TUIConversation.ts

@@ -6,6 +6,8 @@ const TUIConversation = {
   'Delete': '删除会话',
   'Pin': '置顶会话',
   'Unpin': '取消置顶',
+  'Mute': '消息免打扰',
+  'Unmute': '取消免打扰',
   'Conversation Information': '会话信息',
   'Search': '搜索',
   'Add Participants': '创建群聊',
@@ -18,6 +20,8 @@ const TUIConversation = {
   'Create': '创建',
   'Details': '详情',
   'Work': '好友工作群（Work）',
+  'Private': '好友工作群（Work）',
+  'ChatRoom': '临时会议群（Meeting）',
   'Public': '陌生人社交群（Public）',
   'Meeting': '临时会议群（Meeting）',
   'AVChatRoom': '直播群（AVChatroom）',

package/src/locales/zh-TW/TUIConversation.ts

@@ -6,6 +6,8 @@ const TUIConversation = {
   'Delete': '刪除會話',
   'Pin': '置頂會話',
   'Unpin': '取消置頂',
+  'Mute': '訊息免幹擾',
+  'Unmute': '取消免幹擾',
   'Conversation Information': '會話資訊',
   'Search': '搜尋',
   'Add Participants': '創建群聊',
@@ -18,6 +20,8 @@ const TUIConversation = {
   'Create': '創建',
   'Details': '詳情',
   'Work': '好友工作群（Work）',
+  'Private': '好友工作群（Work）',
+  'ChatRoom': '臨時會議群（Meeting）',
   'Public': '陌生人社交群（Public）',
   'Meeting': '臨時會議群（Meeting）',
   'AVChatRoom': '直播群（AVChatroom）',

package/dist/cjs/components/ConversationCreate/ConversationCreatGroupDetail.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("tslib"),t=require("react/jsx-runtime"),r=require("react"),a=require("react-i18next"),n=require("@tencentcloud/chat-uikit-engine"),s=require("../Input/Input.js"),i=require("../Icon/Icon.js"),o=require("../Icon/type.js"),u=require("../Avatar/Avatar.js"),c=require("../Avatar/default.js"),p=require("./ConversationCreate.js"),l=require("./ConversationGroupTypeInfo.js");require("@tencentcloud/tui-core");var v=require("../../context/UIManagerContext.js");require("../../context/TUIMessageContext.js"),exports.ConversationCreatGroupDetail=function(d){var g=this,m=d.profileList,x=d.pageState,_=d.setPageState,f=d.createConversation,h=d.setConversationCreated,I=a.useTranslation().t,j=v.useUIManager(),C=j.setActiveConversation,y=j.myProfile,T=e.__spreadArray([],m,!0);y&&T.unshift(y);var b=T.map((function(e){return e.nick||e.userID})).toString(),N=r.useState(b.length>=15?"".concat(b.slice(0,12),"..."):b),q=N[0],G=N[1],A=r.useState(""),U=A[0],P=A[1],k=r.useState("Work"),S=k[0],D=k[1],R=function(e,t){var r=e.target.value;switch(t){case"name":G(r);break;case"id":P(r);break;case"type":D(r)}},w=function(){_(p.PageStateTypes.GROUP_TYPE)};return x!==p.PageStateTypes.GROUP_TYPE?t.jsxs(t.Fragment,{children:[t.jsxs("div",e.__assign({className:"tui-conversation-create-group-detail"},{children:[t.jsx("div",e.__assign({className:"create-group-box create-group-name"},{children:t.jsx(s.Input,{maxLength:15,value:q,onChange:function(e){R(e,"name")},border:"bottom",customClassName:"input-group-name",clearable:!0,prefix:t.jsx("div",e.__assign({className:"input-group-title"},{children:I("TUIConversation.Group Name")}))})})),t.jsx("div",e.__assign({className:"create-group-box create-group-id"},{children:t.jsx(s.Input,{border:"bottom",customClassName:"input-group-text",clearable:!0,value:U,onChange:function(e){R(e,"id")},prefix:t.jsx("div",e.__assign({className:"input-group-title"},{children:I("TUIConversation.Group ID")}))})})),t.jsx("div",e.__assign({className:"create-group-box create-group-type",onClick:w},{children:t.jsx(s.Input,{readOnly:!0,border:"bottom",customClassName:"input-group-text",prefix:t.jsx("div",e.__assign({className:"input-group-title"},{children:I("TUIConversation.Group Type")})),suffix:t.jsx(i.Icon,{onClick:w,type:o.IconTypes.ARROW_RIGHT,width:7,height:12}),value:I("TUIConversation.".concat(S)),onChange:function(e){R(e,"type")}})})),t.jsx("div",e.__assign({className:"create-group-illustrate"},{children:I("TUIConversation.".concat(null===l.typeInfoList||void 0===l.typeInfoList?void 0:l.typeInfoList.find((function(e){return e.type===S})).des))})),t.jsxs("div",e.__assign({className:"create-group-portrait"},{children:[t.jsx("div",e.__assign({className:"create-group-portrait-title"},{children:I("TUIConversation.Participants")})),t.jsx("div",e.__assign({className:"create-group-portrait-info-container"},{children:m.map((function(r){var a=r.avatar,n=r.userID,s=r.nick;return t.jsxs("div",e.__assign({className:"create-group-portrait-info"},{children:[t.jsx(u.Avatar,{shape:"square",size:50,image:a||c.defaultUserAvatar}),t.jsx("div",e.__assign({className:"create-group-portrait-info-nick"},{children:s}))]}),n)}))}))]}))]})),t.jsx("div",e.__assign({className:"tui-conversation-create-next-container"},{children:t.jsx("div",e.__assign({role:"presentation",className:"tui-conversation-create-next",onClick:function(){return e.__awaiter(g,void 0,void 0,(function(){var t,r,a;return e.__generator(this,(function(e){switch(e.label){case 0:return t=m.map((function(e){return{userID:e.userID}})),r=function(e){switch(e){case"Work":return c.defaultGroupAvatarWork;case"Public":return c.defaultGroupAvatarPublic;case"Meeting":return c.defaultGroupAvatarMeeting;case"AVChatRoom":return c.defaultGroupAvatarAVChatRoom;default:return""}}(S),[4,f({name:q,type:l.GroupType[S],groupID:U,avatar:r,memberList:t})];case 1:return a=e.sent(),C(a),n.TUIConversationService.switchConversation(null==a?void 0:a.conversationID),h(!1),[2]}}))}))}},{children:I("TUIConversation.Create")}))}))]}):t.jsx(l.ConversationGroupTypeInfo,{groupType:S,setGroupType:D,setPageState:_})};

package/dist/cjs/components/ConversationPreview/ConversationListContainer.d.ts

@@ -1,10 +0,0 @@
-import React__default from 'react';
-import { Conversation } from '@tencentcloud/chat';
-
-interface ConversationListContainerProps {
-    error?: Error | null;
-    loading?: boolean;
-    setConversationList?: React__default.Dispatch<React__default.SetStateAction<Array<Conversation>>>;
-}
-
-export { ConversationListContainerProps };

package/dist/cjs/components/ConversationPreview/ConversationListContainer.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("tslib"),r=require("react/jsx-runtime");exports.ConversationListContainer=function(i){var t=i.children;return r.jsx("div",e.__assign({className:"conversation-list-container"},{children:t}))};

package/dist/cjs/components/ConversationPreview/ConversationPreviewContent.d.ts

@@ -1,10 +0,0 @@
-import React__default from 'react';
-import { ConversationPreviewUIComponentProps } from './ConversationPreview.js';
-
-interface IPluginsRef {
-    closeMore?: () => void;
-}
-declare function unMemoConversationPreviewContent<T extends ConversationPreviewUIComponentProps>(props: T): React__default.ReactElement;
-declare const ConversationPreviewContent: typeof unMemoConversationPreviewContent;
-
-export { ConversationPreviewContent, IPluginsRef, unMemoConversationPreviewContent };

package/dist/cjs/components/ConversationPreview/ConversationPreviewContent.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("tslib"),n=require("react/jsx-runtime"),i=require("react"),t=require("react-i18next"),s=require("@tencentcloud/chat-uikit-engine"),o=require("../../utils/env.js"),r=require("../Avatar/Avatar.js"),a=require("../Icon/Icon.js"),c=require("../Icon/type.js"),u=require("../Plugins/index.js"),l=require("../../hooks/useConversation.js"),v=require("../../context/UIKitContext.js"),d=require("../../context/UIManagerContext.js");function m(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function h(m){var h,x=m.conversation,p=m.Avatar,j=void 0===p?r.Avatar:p,f=m.displayImage,I=m.displayTitle,g=m.displayMessage,C=m.displayTime,_=m.unread,T=m.active,q=m.activeConversationID,N=m.setActiveConversationID,M=m.setActiveConversation,P=t.useTranslation().t,w=i.useRef(null),b=v.useUIKit().chat,y=d.useUIManager().conversation,D=l.useConversation(b),U=D.pinConversation,k=D.deleteConversation,A=T?"conversation-preview-content--active":"",E=_&&_>=1?"conversation-preview-content--unread":"",R=x.isPinned?"conversation-preview-content--pin":"",S=i.useState(!1),K=S[0],O=S[1],z=i.useRef(null);i.useEffect((function(){q!==x.conversationID&&O(!1)}),[q]);var L=function(e){if(!o.isPC){var n=x.conversationID;switch(N&&N(n),e){case"touchstart":h=setTimeout(i,500);break;case"touchend":clearTimeout(h),setTimeout((function(){}),200)}}function i(){clearTimeout(h),O(!0)}},B=function(e,n){var i,t=x.conversationID,s=x.isPinned;switch(e.stopPropagation(),O(!1),(null===(i=null==z?void 0:z.current)||void 0===i?void 0:i.closeMore)&&z.current.closeMore(),n){case"pin":U({conversationID:t,isPinned:!s});break;case"delete":k(t),M&&t===(null==y?void 0:y.conversationID)&&M(void 0)}};return n.jsxs("button",e.__assign({type:"button","aria-selected":T,role:"option",className:"conversation-preview-container ".concat(A," ").concat(E," ").concat(R),onClick:function(){s.TUIConversationService.switchConversation(null==x?void 0:x.conversationID),M&&M(x),(null==w?void 0:w.current)&&w.current.blur()},onMouseEnter:function(){O(!0)},onMouseLeave:function(){O(!1)},onTouchStart:function(){return L("touchstart")},onTouchEnd:function(){return L("touchend")},ref:w,id:x.conversationID},{children:[n.jsx("div",e.__assign({className:"avatar"},{children:n.jsx(j,{image:f,name:I,size:40})})),n.jsxs("div",e.__assign({className:"content"},{children:[n.jsx("div",e.__assign({className:"title text-ellipsis"},{children:I})),n.jsx("div",e.__assign({className:"message"},{children:g}))]})),n.jsxs("div",e.__assign({className:"external"},{children:[_?n.jsx("div",e.__assign({className:"unread"},{children:_<=99?_:"99+"})):n.jsx("div",{className:"unread"}),K?n.jsx("div",e.__assign({className:"".concat(K?"more--hover":"more")},{children:n.jsx(u.Plugins,{customClass:"more-handle-box",ref:z,plugins:[n.jsx("div",e.__assign({role:"presentation",className:"more-handle-item",onClick:function(e){B(e,"pin")}},{children:P(x.isPinned?"TUIConversation.Unpin":"TUIConversation.Pin")})),n.jsx("div",e.__assign({className:"more-handle-item delete",onClick:function(e){B(e,"delete")},role:"presentation"},{children:P("TUIConversation.Delete")}))],showNumber:0,MoreIcon:n.jsx(a.Icon,{className:"icon-more",width:16,height:16,type:c.IconTypes.MORE})})})):n.jsx("div",e.__assign({className:"time"},{children:C}))]}))]}))}require("../../context/TUIMessageContext.js");var x=m(i).default.memo(h);exports.ConversationPreviewContent=x,exports.unMemoConversationPreviewContent=h;