@sendbird/uikit-react 3.0.0-beta.5 → 3.0.0-rc.1

package/index.d.ts

@@ -3,1105 +3,1179 @@
  * homepage: https://sendbird.com/
  * git: https://github.com/sendbird/sendbird-uikit-react
  */
-type ReplyType = "NONE" | "QUOTE_REPLY" | "THREAD";
+ declare module "SendbirdUIKitGlobal" {
+  import type React from 'react';
+  import type Locale from 'date-fns';
+  import type SendbirdChat from '@sendbird/chat';
+  import type { SendbirdError, SessionHandler, User } from '@sendbird/chat';
+  import type { GroupChannel, GroupChannelCreateParams, GroupChannelUpdateParams, Member, SendbirdGroupChat } from '@sendbird/chat/groupChannel';
+  import type { AdminMessage, FileMessage, FileMessageCreateParams, MessageListParams, MessageSearchQuery, UserMessage, UserMessageCreateParams, UserMessageUpdateParams } from '@sendbird/chat/message';
+  import type { OpenChannel, OpenChannelCreateParams, OpenChannelUpdateParams, SendbirdOpenChat } from '@sendbird/chat/openChannel';
+
+  export type ReplyType = "NONE" | "QUOTE_REPLY" | "THREAD";
+  export interface AppProps {
+    appId: string;
+    userId: string;
+    accessToken?: string;
+    theme?: 'light' | 'dark';
+    userListQuery?(): UserListQuery;
+    nickname?: string;
+    profileUrl?: string;
+    dateLocale?: Locale;
+    allowProfileEdit?: boolean;
+    disableUserProfile?: boolean;
+    showSearchIcon?: boolean;
+    renderUserProfile?: (props: RenderUserProfileProps) => React.ReactNode;
+    onProfileEditSuccess?(user: User): void;
+    config?: SendbirdProviderConfig;
+    useReaction?: boolean;
+    useMessageGrouping?: boolean;
+    stringSet?: Record<string, string>;
+    colorSet?: Record<string, string>;
+    imageCompression?: {
+      compressionRate?: number,
+      resizingWidth?: number | string,
+      resizingHeight?: number | string,
+    };
+    replyType?: ReplyType;
+    disableAutoSelect?: boolean;
+  }
 
-type Logger = {
-  info?(title?: unknown, description?: unknown): void;
-  error?(title?: unknown, description?: unknown): void;
-  warning?(title?: unknown, description?: unknown): void;
-};
+  export type Logger = {
+    info?(title?: unknown, description?: unknown): void;
+    error?(title?: unknown, description?: unknown): void;
+    warning?(title?: unknown, description?: unknown): void;
+  }
 
-interface UserListQuery {
-  hasNext?: boolean;
-  next(callback: unknown): void;
-}
+  export type MessageHandler = (message: UserMessage | FileMessage) => void;
 
-interface RenderUserProfileProps {
-  user: SendBird.User | SendBird.Member;
-  currentUserId: string;
-  close(): void;
-}
+  export interface UikitMessageHandler {
+    onPending: (handler: MessageHandler) => UikitMessageHandler;
+    onFailed: (handler: MessageHandler) => UikitMessageHandler;
+    onSucceeded: (handler: MessageHandler) => UikitMessageHandler;
+  }
+
+  export interface UserListQuery {
+    hasNext?: boolean;
+    next(callback: unknown): void;
+  }
+
+  export interface RenderUserProfileProps {
+    user: User | Member;
+    currentUserId: string;
+    close(): void;
+  }
+
+  export interface SendbirdProviderConfig {
+    logLevel?: 'debug' | 'warning' | 'error' | 'info' | 'all' | Array<string>;
+    userMention?: {
+      maxMentionCount?: number,
+      maxSuggestionCount?: number,
+    };
+  }
+
+  export interface ClientMessage {
+    reqId: string;
+    file?: File;
+    localUrl?: string;
+    _sender: User;
+  }
+
+  export interface RenderMessageProps {
+    message: EveryMessage;
+    chainTop: boolean;
+    chainBottom: boolean;
+  }
+
+  export interface ClientUserMessage extends UserMessage, ClientMessage { }
+  export interface ClientFileMessage extends FileMessage, ClientMessage { }
+  export interface ClientAdminMessage extends AdminMessage, ClientMessage { }
+  export type EveryMessage = ClientUserMessage | ClientFileMessage | ClientAdminMessage;
+  export type ClientSentMessages = ClientUserMessage | ClientFileMessage;
+
+  export type GetSdk = SendbirdChat | undefined;
+  export type GetConnect = (
+    userId: string,
+    accessToken?: string
+  ) => Promise<User>;
+  export type GetDisconnect = () => Promise<void>;
+  export type GetUpdateUserInfo = (
+    nickName: string,
+    profileUrl?: string
+  ) => Promise<User>;
+  export type GetCreateGroupChannel = (channelParams: GroupChannelCreateParams) => Promise<GroupChannel>;
+  export type GetCreateOpenChannel = (channelParams: OpenChannelCreateParams) => Promise<OpenChannel>;
+  export type GetGetGroupChannel = (
+    channelUrl: string,
+    isSelected?: boolean,
+  ) => Promise<GroupChannel>;
+  export type GetGetOpenChannel = (
+    channelUrl: string,
+  ) => Promise<OpenChannel>;
+  export type GetLeaveGroupChannel = (channel: GroupChannel) => Promise<void>;
+  export type GetEnterOpenChannel = (channel: OpenChannel) => Promise<OpenChannel>;
+  export type GetExitOpenChannel = (channel: OpenChannel) => Promise<void>;
+  export type GetFreezeChannel = (channel: GroupChannel | OpenChannel) => Promise<void>;
+  export type GetUnFreezeChannel = (channel: GroupChannel | OpenChannel) => Promise<void>;
+  export type GetSendUserMessage = (
+    channel: GroupChannel | OpenChannel,
+    UserMessageCreateParams: UserMessageCreateParams,
+  ) => UikitMessageHandler;
+  export type GetSendFileMessage = (
+    channel: GroupChannel | OpenChannel,
+    FileMessageCreateParams: FileMessageCreateParams
+  ) => UikitMessageHandler;
+  export type GetUpdateUserMessage = (
+    channel: GroupChannel | OpenChannel,
+    messageId: string | number,
+    params: UserMessageUpdateParams
+  ) => Promise<UserMessage>;
+  // type getUpdateFileMessage = (
+  //   channel: GroupChannel | OpenChannel,
+  //   messageId: string | number,
+  //   params: FileMessageUpdateParams,
+  // ) => Promise<FileMessage>;
+  export type GetDeleteMessage = (
+    channel: GroupChannel | OpenChannel,
+    message: UserMessage | FileMessage
+  ) => Promise<void>;
+  export type GetResendUserMessage = (
+    channel: GroupChannel | OpenChannel,
+    failedMessage: UserMessage
+  ) => Promise<UserMessage>;
+  export type GetResendFileMessage = (
+    channel: GroupChannel | OpenChannel,
+    failedMessage: FileMessage
+  ) => Promise<FileMessage>;
+
+  export interface sendbirdSelectorsInterface {
+    getSdk: (store: SendBirdState) => GetSdk;
+    getConnect: (store: SendBirdState) => GetConnect
+    getDisconnect: (store: SendBirdState) => GetDisconnect;
+    getUpdateUserInfo: (store: SendBirdState) => GetUpdateUserInfo;
+    getCreateGroupChannel: (store: SendBirdState) => GetCreateGroupChannel;
+    getCreateOpenChannel: (store: SendBirdState) => GetCreateOpenChannel;
+    getGetGroupChannel: (store: SendBirdState) => GetGetGroupChannel;
+    getGetOpenChannel: (store: SendBirdState) => GetGetOpenChannel;
+    getLeaveChannel: (store: SendBirdState) => GetLeaveGroupChannel;
+    getEnterOpenChannel: (store: SendBirdState) => GetEnterOpenChannel;
+    getExitOpenChannel: (store: SendBirdState) => GetExitOpenChannel;
+    getFreezeChannel: (store: SendBirdState) => GetFreezeChannel;
+    getUnFreezeChannel: (store: SendBirdState) => GetUnFreezeChannel;
+    getSendUserMessage: (store: SendBirdState) => GetSendUserMessage;
+    getSendFileMessage: (store: SendBirdState) => GetSendFileMessage;
+    getUpdateUserMessage: (store: SendBirdState) => GetUpdateUserMessage;
+    // getUpdateFileMessage: (store: SendBirdState) => GetUpdateFileMessage;
+    getDeleteMessage: (store: SendBirdState) => GetDeleteMessage;
+    getResendUserMessage: (store: SendBirdState) => GetResendUserMessage;
+    getResendFileMessage: (store: SendBirdState) => GetResendFileMessage;
+  }
+  export interface SendbirdProviderProps {
+    userId: string;
+    appId: string;
+    accessToken?: string;
+    configureSession?: (sdk: SendbirdGroupChat | SendbirdOpenChat) => SessionHandler;
+    children?: React.ReactNode;
+    theme?: 'light' | 'dark';
+    nickname?: string;
+    profileUrl?: string;
+    dateLocale?: Locale;
+    disableUserProfile?: boolean;
+    renderUserProfile?: (props: RenderUserProfileProps) => React.ReactNode;
+    allowProfileEdit?: boolean;
+    userListQuery?(): UserListQuery;
+    config?: SendbirdProviderConfig;
+    stringSet?: Record<string, string>;
+    colorSet?: Record<string, string>;
+    isMentionEnabled?: boolean;
+    imageCompression?: {
+      compressionRate?: number,
+      resizingWidth?: number | string,
+      resizingHeight?: number | string,
+    };
+  }
+
+  export interface SendBirdStateConfig {
+    disableUserProfile: boolean;
+    renderUserProfile?: (props: RenderUserProfileProps) => React.ReactNode;
+    allowProfileEdit: boolean;
+    isOnline: boolean;
+    isMentionEnabled: boolean;
+    userMention: {
+      maxMentionCount: number;
+      maxSuggestionCount: number;
+    };
+    userId: string;
+    appId: string;
+    accessToken: string;
+    theme: string;
+    pubSub: any;
+    logger: Logger;
+    setCurrenttheme: (theme: string) => void;
+    userListQuery?(): UserListQuery;
+    imageCompression?: {
+      compressionRate?: number,
+      resizingWidth?: number | string,
+      resizingHeight?: number | string,
+    };
+  }
+  export interface SdkStore {
+    error: boolean;
+    initialized: boolean;
+    loading: boolean;
+    sdk: SendbirdGroupChat | SendbirdOpenChat;
+  }
+  export interface UserStore {
+    initialized: boolean;
+    loading: boolean;
+    user: User;
+  }
+  export interface SendBirdStateStore {
+    sdkStore: SdkStore;
+    userStore: UserStore;
+  }
+
+  export type SendBirdState = {
+    config: SendBirdStateConfig;
+    stores: SendBirdStateStore;
+    dispatchers: {
+      userDispatcher: UserDispatcher,
+    },
+  }
 
-interface SendBirdProviderConfig {
-  logLevel?: 'debug' | 'warning' | 'error' | 'info' | 'all' | Array<string>;
-  userMention?: {
-    maxMentionCount?: number,
-    maxSuggestionCount?: number,
+  export type UserDispatcherParams = {
+    type: string,
+    payload: User;
   };
-}
 
-interface ClientMessage {
-  reqId: string;
-  file?: File;
-  localUrl?: string;
-  _sender: SendBird.User;
-}
-
-interface RenderMessageProps {
-  message: EveryMessage;
-  chainTop: boolean;
-  chainBottom: boolean;
-}
-
-interface ClientUserMessage extends SendBird.UserMessage, ClientMessage { }
-interface ClientFileMessage extends SendBird.FileMessage, ClientMessage { }
-interface ClientAdminMessage extends SendBird.AdminMessage, ClientMessage { }
-type EveryMessage = ClientUserMessage | ClientFileMessage | ClientAdminMessage;
-type ClientSentMessages = ClientUserMessage | ClientFileMessage;
-
-interface SendBirdProviderProps {
-  userId: string;
-  appId: string;
-  accessToken?: string;
-  children?: React.ReactNode;
-  theme?: 'light' | 'dark';
-  nickname?: string;
-  profileUrl?: string;
-  dateLocale?: Locale;
-  disableUserProfile?: boolean;
-  renderUserProfile?: (props: RenderUserProfileProps) => React.ReactNode;
-  allowProfileEdit?: boolean;
-  userListQuery?(): UserListQuery;
-  config?: SendBirdProviderConfig;
-  stringSet?: Record<string, string>;
-  colorSet?: Record<string, string>;
-  isMentionEnabled?: boolean;
-  imageCompression?: {
-    compressionRate?: number,
-    resizingWidth?: number | string,
-    resizingHeight?: number | string,
+  export type UserDispatcher = (params: UserDispatcherParams) => void;
+
+
+  export interface ApplicationUserListQuery {
+    limit?: number;
+    userIdsFilter?: Array<string>;
+    metaDataKeyFilter?: string;
+    metaDataValuesFilter?: Array<string>;
+  }
+
+  export interface GroupChannelListQuery {
+    limit?: number;
+    includeEmpty?: boolean;
+    order?: 'latest_last_message' | 'chronological' | 'channel_name_alphabetical' | 'metadata_value_alphabetical';
+    userIdsExactFilter?: Array<string>;
+    userIdsIncludeFilter?: Array<string>;
+    userIdsIncludeFilterQueryType?: 'AND' | 'OR';
+    nicknameContainsFilter?: string;
+    channelNameContainsFilter?: string;
+    customTypesFilter?: Array<string>;
+    customTypeStartsWithFilter?: string;
+    channelUrlsFilter?: Array<string>;
+    superChannelFilter?: 'all' | 'super' | 'nonsuper';
+    publicChannelFilter?: 'all' | 'public' | 'private';
+    metadataOrderKeyFilter?: string;
+    memberStateFilter?: 'all' | 'joined_only' | 'invited_only' | 'invited_by_friend' | 'invited_by_non_friend';
+    hiddenChannelFilter?: 'unhidden_only' | 'hidden_only' | 'hidden_allow_auto_unhide' | 'hidden_prevent_auto_unhide';
+    unreadChannelFilter?: 'all' | 'unread_message';
+    includeFrozen?: boolean;
+  }
+  export interface ChannelListQueries {
+    applicationUserListQuery?: ApplicationUserListQuery;
+    channelListQuery?: GroupChannelListQuery;
+  }
+
+  export interface ChannelListProviderProps {
+    allowProfileEdit?: boolean;
+    onBeforeCreateChannel?(users: Array<string>): GroupChannelCreateParams;
+    onThemeChange?(theme: string): void;
+    onProfileEditSuccess?(user: User): void;
+    onChannelSelect?(channel: GroupChannel): void;
+    sortChannelList?: (channels: GroupChannel[]) => GroupChannel[];
+    queries?: ChannelListQueries;
+    children?: React.ReactNode;
+    className?: string | string[];
+    renderUserProfile?: (props: RenderUserProfileProps) => React.ReactNode;
+    disableUserProfile?: boolean;
+    disableAutoSelect?: boolean;
+  }
+
+  export interface ChannelListProviderInterface extends ChannelListProviderProps {
+    initialized: boolean;
+    loading: boolean;
+    allChannels: GroupChannel[];
+    currentChannel: GroupChannel;
+    showSettings: boolean;
+    channelListQuery: GroupChannelListQuery;
+    currentUserId: string;
+    // channelListDispatcher: CustomUseReducerDispatcher;
+    channelSource: GroupChannelListQuery;
+  }
+
+  export interface RenderChannelPreviewProps {
+    channel: GroupChannel;
+    onLeaveChannel(
+      channel: GroupChannel,
+      onLeaveChannelCb?: (c: GroupChannel) => void,
+    );
+  }
+
+  export interface ChannelListUIProps {
+    renderChannelPreview?: (props: RenderChannelPreviewProps) => React.ReactNode;
+    renderUserProfile?: (props: RenderUserProfileProps) => React.ReactNode;
+    renderHeader?: (props: void) => React.ReactNode;
+    renderPlaceHolderError?: (props: void) => React.ReactNode;
+    renderPlaceHolderLoading?: (props: void) => React.ReactNode;
+    renderPlaceHolderEmptyList?: (props: void) => React.ReactNode;
+  }
+
+  export interface ChannelListProps extends ChannelListProviderInterface, ChannelListUIProps {}
+
+  export interface ChannelListHeaderInterface {
+    renderHeader?: (props: void) => React.ReactNode;
+    renderIconButton?: (props: void) => React.ReactNode;
+    onEdit?: (props: void) => void;
+    allowProfileEdit?: boolean;
+  }
+
+  export interface ChannelPreviewInterface {
+    channel: GroupChannel;
+    isActive?: boolean;
+    onClick: () => void;
+    renderChannelAction: (props: { channel: GroupChannel }) => React.ReactNode;
+    tabIndex: number;
+  }
+
+  export interface ChannelPreviewActionInterface {
+    disabled?: boolean;
+    onLeaveChannel?: () => void;
+  }
+
+  export interface ChannelSettingsProviderInterface {
+    channelUrl: string;
+    onCloseClick?(): void;
+    onChannelModified?(channel: GroupChannel): void;
+    onBeforeUpdateChannel?(currentTitle: string, currentImg: File, data: string): GroupChannelUpdateParams;
+    queries?: ChannelSettingsQueries;
+    forceUpdateUI(): void;
+    channel: GroupChannel;
+    invalidChannel: boolean;
+  }
+
+  export interface ChannelSettingsUIProps {
+    renderPlaceholderError?: () => React.ReactNode;
+    renderChannelProfile?: () => React.ReactNode;
+    renderModerationPanel?: () => React.ReactNode;
+    renderLeaveChannel?: () => React.ReactNode;
+  }
+
+  export interface ApplicationUserListQuery {
+    limit?: number;
+    userIdsFilter?: Array<string>;
+    metaDataKeyFilter?: string;
+    metaDataValuesFilter?: Array<string>;
+  }
+
+  export interface ChannelSettingsQueries {
+    applicationUserListQuery?: ApplicationUserListQuery;
+  }
+
+  export type ChannelSettingsContextProps = {
+    children: React.ReactNode;
+    channelUrl: string;
+    className?: string;
+    onCloseClick?(): void;
+    onChannelModified?(channel: GroupChannel): void;
+    onBeforeUpdateChannel?(currentTitle: string, currentImg: File, data: string): GroupChannelUpdateParams;
+    queries?: ChannelSettingsQueries;
+    renderUserProfile?: (props: RenderUserProfileProps) => React.ReactNode;
+    disableUserProfile?: boolean;
+  }
+
+  export interface ChannelSettingsProps extends ChannelSettingsUIProps, ChannelSettingsContextProps {
+  }
+
+  export type ChannelSettingsEditDetailsProps = {
+    onSubmit: () => void;
+    onCancel: () => void;
+  }
+
+  export type CustomUser = User & {
+    isMuted: boolean;
+    role: string;
+  }
+
+  export interface UserListItemActionProps {
+    actionRef: React.RefObject<HTMLInputElement>;
+    parentRef: React.RefObject<HTMLInputElement>;
+  }
+
+  export interface UserListItemProps {
+    user: CustomUser;
+    currentUser?: string;
+    className?: string;
+    action?(props: UserListItemActionProps): React.ReactElement;
+  }
+
+  export type LeaveChannelProps = {
+    onSubmit: () => void;
+    onCancel: () => void;
   };
-}
 
-interface SendBirdStateConfig {
-  disableUserProfile: boolean;
-  renderUserProfile?: (props: RenderUserProfileProps) => React.ReactNode;
-  allowProfileEdit: boolean;
-  isOnline: boolean;
-  isMentionEnabled: boolean;
-  userMention: {
-    maxMentionCount: number;
-    maxSuggestionCount: number;
+  /**
+   * Channel
+   */
+  export interface RenderMessageProps {
+    message: EveryMessage;
+    chainTop: boolean;
+    chainBottom: boolean;
+  }
+
+  export type ChannelQueries = {
+    messageListParams?: MessageListParams;
   };
-  userId: string;
-  appId: string;
-  accessToken: string;
-  theme: string;
-  pubSub: any;
-  logger: Logger;
-  setCurrenttheme: (theme: string) => void;
-  userListQuery?(): UserListQuery;
-  imageCompression?: {
-    compressionRate?: number,
-    resizingWidth?: number | string,
-    resizingHeight?: number | string,
+
+  export type ChannelContextProps = {
+    channelUrl: string;
+    children?: React.ReactNode;
+    useMessageGrouping?: boolean;
+    useReaction?: boolean;
+    showSearchIcon?: boolean;
+    highlightedMessage?: number;
+    startingPoint?: number;
+    onBeforeSendUserMessage?(text: string, quotedMessage?: UserMessage | FileMessage): UserMessageCreateParams;
+    onBeforeSendFileMessage?(file: File, quotedMessage?: UserMessage | FileMessage): FileMessageCreateParams;
+    onBeforeUpdateUserMessage?(text: string): UserMessageUpdateParams;
+    onChatHeaderActionClick?(event: React.MouseEvent<HTMLElement>): void;
+    onSearchClick?(): void;
+    replyType?: ReplyType;
+    queries?: ChannelQueries;
+    renderUserProfile?: (props: RenderUserProfileProps) => React.ReactNode;
+    disableUserProfile?: boolean;
   };
-}
-interface SdkStore {
-  error: boolean;
-  initialized: boolean;
-  loading: boolean;
-  sdk: SendBird.SendBirdInstance;
-}
-interface UserStore {
-  initialized: boolean;
-  loading: boolean;
-  user: SendBird.User;
-}
-interface SendBirdStateStore {
-  sdkStore: SdkStore;
-  userStore: UserStore;
-}
-
-interface MessageSearchQueryType extends SendBird.MessageSearchQueryOptions {
-  key: string;
-  hasNext?: boolean;
-}
-
-type SendBirdState = {
-  config: SendBirdStateConfig;
-  stores: SendBirdStateStore;
-  dispatchers: {
-    userDispatcher: UserDispatcher,
-  },
-}
-
-type UserDispatcherParams = {
-  type: string,
-  payload: SendBird.User
-};
-
-type UserDispatcher = (params: UserDispatcherParams) => void;
-
-type GetSdk = SendBird.SendBirdInstance | undefined;
-type GetConnect = (
-  userId: string,
-  accessToken?: string
-) => Promise<SendBird.User>;
-type GetDisconnect = () => Promise<void>;
-type GetUpdateUserInfo = (
-  nickName: string,
-  profileUrl?: string
-) => Promise<SendBird.User>;
-type GetSendUserMessage = (
-  channelUrl: string,
-  userMessageParams: SendBird.UserMessageParams
-) => Promise<SendBird.UserMessage>;
-type GetSendFileMessage = (
-  channelUrl: string,
-  fileMessageParams: SendBird.FileMessageParams
-) => Promise<SendBird.FileMessage>;
-type GetUpdateUserMessage = (
-  channelUrl: string,
-  messageId: string | number,
-  params: SendBird.UserMessageParams
-) => Promise<SendBird.UserMessage>;
-type GetDeleteMessage = (
-  channelUrl: string,
-  message: SendBird.AdminMessage | SendBird.UserMessage | SendBird.FileMessage
-) => Promise<void>;
-type GetResendUserMessage = (
-  channelUrl: string,
-  failedMessage: SendBird.UserMessage
-) => Promise<SendBird.UserMessage>;
-type GetResendFileMessage = (
-  channelUrl: string,
-  failedMessage: SendBird.FileMessage
-) => Promise<SendBird.FileMessage>;
-type GetFreezeChannel = (channelUrl: string) => Promise<SendBird.GroupChannel>;
-type GetUnFreezeChannel = (channelUrl: string) => Promise<SendBird.GroupChannel>;
-type GetCreateChannel = (channelParams: SendBird.GroupChannelParams) => Promise<SendBird.GroupChannel>;
-type GetLeaveChannel = (channelUrl: string) => Promise<SendBird.GroupChannel>;
-type GetCreateOpenChannel = (channelParams: SendBird.OpenChannelParams) => Promise<SendBird.OpenChannel>;
-type GetEnterOpenChannel = (channelUrl: string) => Promise<null>;
-type GetExitOpenChannel = (channelUrl: string) => Promise<null>;
-type GetOpenChannelSendUserMessage = (
-  channelUrl: string,
-  params: SendBird.UserMessageParams,
-) => Promise<SendBird.UserMessage>;
-type GetOpenChannelSendFileMessage = (
-  channelUrl: string,
-  params: SendBird.FileMessageParams,
-) => Promise<SendBird.FileMessage>;
-type GetOpenChannelUpdateUserMessage = (
-  channelUrl: string,
-  messageId: string,
-  params: SendBird.UserMessageParams,
-) => Promise<SendBird.UserMessage>;
-type GetOpenChannelDeleteMessage = (
-  channelUrl: string,
-  message: SendBird.UserMessage | SendBird.FileMessage,
-) => Promise<SendBird.UserMessage | SendBird.FileMessage>;
-type GetOpenChannelResendUserMessage = (
-  channelUrl: string,
-  failedMessage: SendBird.UserMessage,
-) => Promise<SendBird.UserMessage>;
-type GetOpenChannelResendFileMessage = (
-  channelUrl: string,
-  failedMessage: SendBird.FileMessage,
-) => Promise<SendBird.FileMessage>;
-
-
-interface sendBirdSelectorsInterface {
-  getSdk: (store: SendBirdState) => GetSdk;
-  getConnect: (store: SendBirdState) => GetConnect
-  getDisconnect: (store: SendBirdState) => GetDisconnect;
-  getUpdateUserInfo: (store: SendBirdState) => GetUpdateUserInfo;
-  getSendUserMessage: (store: SendBirdState) => GetSendUserMessage;
-  getSendFileMessage: (store: SendBirdState) => GetSendFileMessage;
-  getUpdateUserMessage: (store: SendBirdState) => GetUpdateUserMessage;
-  getDeleteMessage: (store: SendBirdState) => GetDeleteMessage;
-  getResendUserMessage: (store: SendBirdState) => GetResendUserMessage;
-  getResendFileMessage: (store: SendBirdState) => GetResendFileMessage;
-  getFreezeChannel: (store: SendBirdState) => GetFreezeChannel;
-  getUnFreezeChannel: (store: SendBirdState) => GetUnFreezeChannel;
-  getCreateChannel: (store: SendBirdState) => GetCreateChannel;
-  getLeaveChannel: (store: SendBirdState) => GetLeaveChannel;
-  getCreateOpenChannel: (store: SendBirdState) => GetCreateOpenChannel;
-  getEnterOpenChannel: (store: SendBirdState) => GetEnterOpenChannel;
-  getExitOpenChannel: (store: SendBirdState) => GetExitOpenChannel;
-  enterOpenChannel: (store: SendBirdState) => GetEnterOpenChannel;
-  exitOpenChannel: (store: SendBirdState) => GetExitOpenChannel;
-  getOpenChannelSendUserMessage: (store: SendBirdState) => GetOpenChannelSendUserMessage;
-  getOpenChannelSendFileMessage: (store: SendBirdState) => GetOpenChannelSendFileMessage;
-  getOpenChannelUpdateUserMessage: (store: SendBirdState) => GetOpenChannelUpdateUserMessage;
-  getOpenChannelDeleteMessage: (store: SendBirdState) => GetOpenChannelDeleteMessage;
-  getOpenChannelResendUserMessage: (store: SendBirdState) => GetOpenChannelResendUserMessage;
-  getOpenChannelResendFileMessage: (store: SendBirdState) => GetOpenChannelResendFileMessage;
-}
-
-interface AppProps {
-  appId: string;
-  userId: string;
-  accessToken?: string;
-  theme?: 'light' | 'dark';
-  userListQuery?(): UserListQuery;
-  nickname?: string;
-  profileUrl?: string;
-  dateLocale?: Locale;
-  allowProfileEdit?: boolean;
-  disableUserProfile?: boolean;
-  showSearchIcon?: boolean;
-  renderUserProfile?: (props: RenderUserProfileProps) => React.ReactNode;
-  onProfileEditSuccess?(user: SendBird.User): void;
-  config?: SendBirdProviderConfig;
-  useReaction?: boolean;
-  useMessageGrouping?: boolean;
-  stringSet?: Record<string, string>;
-  colorSet?: Record<string, string>;
-  imageCompression?: {
-    compressionRate?: number,
-    resizingWidth?: number | string,
-    resizingHeight?: number | string,
+
+  export interface ChannelUIProps {
+    renderPlaceholderLoader?: () => React.ReactNode;
+    renderPlaceholderInvalid?: () => React.ReactNode;
+    renderPlaceholderEmpty?: () => React.ReactNode;
+    renderChannelHeader?: () => React.ReactNode;
+    renderMessage?: (props: RenderMessageProps) => React.ComponentType;
+    renderMessageInput?: () => React.ReactNode;
+    renderTypingIndicator?: () => React.ReactNode;
+    renderCustomSeperator?: () => React.ReactNode;
+  }
+
+  export type CoreMessageType = AdminMessage | UserMessage | FileMessage;
+
+  export interface MessageStoreInterface {
+    allMessages: CoreMessageType[];
+    loading: boolean;
+    initialized: boolean;
+    unreadSince: string;
+    isInvalid: boolean;
+    currentGroupChannel: GroupChannel;
+    hasMorePrev: boolean;
+    oldestMessageTimeStamp: number;
+    hasMoreNext: boolean;
+    latestMessageTimeStamp: number;
+    emojiContainer: any;
+    readStatus: any;
+  }
+
+  export interface ChannelProviderInterface extends ChannelContextProps, ChannelContextProps {
+    scrollToMessage?(createdAt: number, messageId: number): void;
+    messageActionTypes: Record<string ,string>;
+    quoteMessage: CoreMessageType;
+    setQuoteMessage: React.Dispatch<React.SetStateAction<CoreMessageType>>;
+    initialTimeStamp: number;
+    setInitialTimeStamp: React.Dispatch<React.SetStateAction<number>>;
+    animatedMessageId: number;
+    highLightedMessageId: number;
+    nicknamesMap: Map<string, string>;
+    scrollRef: React.MutableRefObject<HTMLDivElement>;
+    setAnimatedMessageId: React.Dispatch<React.SetStateAction<number>>;
+    setHighLightedMessageId: React.Dispatch<React.SetStateAction<number>>;
+    messageInputRef: React.MutableRefObject<HTMLInputElement>,
+    toggleReaction(message: UserMessage | FileMessage, emojiKey: string, isReacted: boolean): void,
+  }
+
+  export type FileViewerProps = {
+    onCancel:() => void;
+    message: ClientFileMessage;
+  }
+
+  export type MessageUIProps = {
+    message: EveryMessage;
+    hasSeparator?: boolean;
+    chainTop?: boolean;
+    chainBottom?: boolean;
+    handleScroll: () => void;
+    // for extending
+    renderMessage?: (props: RenderMessageProps) => React.ReactNode;
+    renderCustomSeperator?: () => React.ReactNode;
+    renderEditInput?: () => React.ReactNode;
+    renderMessageContent?: () => React.ReactNode;
   };
-  replyType?: ReplyType;
-  disableAutoSelect?: boolean;
-}
-
-interface ApplicationUserListQuery {
-  limit?: number;
-  userIdsFilter?: Array<string>;
-  metaDataKeyFilter?: string;
-  metaDataValuesFilter?: Array<string>;
-}
-
-interface GroupChannelListQuery {
-  limit?: number;
-  includeEmpty?: boolean;
-  order?: 'latest_last_message' | 'chronological' | 'channel_name_alphabetical' | 'metadata_value_alphabetical';
-  userIdsExactFilter?: Array<string>;
-  userIdsIncludeFilter?: Array<string>;
-  userIdsIncludeFilterQueryType?: 'AND' | 'OR';
-  nicknameContainsFilter?: string;
-  channelNameContainsFilter?: string;
-  customTypesFilter?: Array<string>;
-  customTypeStartsWithFilter?: string;
-  channelUrlsFilter?: Array<string>;
-  superChannelFilter?: 'all' | 'super' | 'nonsuper';
-  publicChannelFilter?: 'all' | 'public' | 'private';
-  metadataOrderKeyFilter?: string;
-  memberStateFilter?: 'all' | 'joined_only' | 'invited_only' | 'invited_by_friend' | 'invited_by_non_friend';
-  hiddenChannelFilter?: 'unhidden_only' | 'hidden_only' | 'hidden_allow_auto_unhide' | 'hidden_prevent_auto_unhide';
-  unreadChannelFilter?: 'all' | 'unread_message';
-  includeFrozen?: boolean;
-}
-interface ChannelListQueries {
-  applicationUserListQuery?: ApplicationUserListQuery;
-  channelListQuery?: GroupChannelListQuery;
-}
-
-interface ChannelListProviderProps {
-  allowProfileEdit?: boolean;
-  onBeforeCreateChannel?(users: Array<string>): SendBird.GroupChannelParams;
-  onThemeChange?(theme: string): void;
-  onProfileEditSuccess?(user: SendBird.User): void;
-  onChannelSelect?(channel: SendBird.GroupChannel): void;
-  sortChannelList?: (channels: SendBird.GroupChannel[]) => SendBird.GroupChannel[];
-  queries?: ChannelListQueries;
-  children?: React.ReactNode;
-  className?: string | string[];
-  renderUserProfile?: (props: RenderUserProfileProps) => React.ReactNode;
-  disableUserProfile?: boolean;
-  disableAutoSelect?: boolean;
-}
-
-interface ChannelListProviderInterface extends ChannelListProviderProps {
-  initialized: boolean;
-  loading: boolean;
-  allChannels: SendBird.GroupChannel[];
-  currentChannel: SendBird.GroupChannel;
-  showSettings: boolean;
-  channelListQuery: GroupChannelListQuery;
-  currentUserId: string;
-  // channelListDispatcher: CustomUseReducerDispatcher;
-  channelSource: SendBird.GroupChannelListQuery;
-}
 
-interface RenderChannelPreviewProps {
-  channel: SendBird.GroupChannel;
-  onLeaveChannel(
-    channel: SendBird.GroupChannel,
-    onLeaveChannelCb?: (c: SendBird.GroupChannel) => void,
-  );
-}
+  export type MessageListProps = {
+    renderMessage?: (props: RenderMessageProps) => React.ReactNode;
+    renderPlaceholderEmpty?: () => React.ReactNode;
+    renderCustomSeperator?: () => React.ReactNode;
+  };
 
-interface ChannelListUIProps {
-  renderChannelPreview?: (props: RenderChannelPreviewProps) => React.ReactNode;
-  renderUserProfile?: (props: RenderUserProfileProps) => React.ReactNode;
-  renderHeader?: (props: void) => React.ReactNode;
-  renderPlaceHolderError?: (props: void) => React.ReactNode;
-  renderPlaceHolderLoading?: (props: void) => React.ReactNode;
-  renderPlaceHolderEmptyList?: (props: void) => React.ReactNode;
-}
+  export type SuggestedMentionListProps = {
+    targetNickname: string;
+    memberListQuery?: Record<string, string>;
+    onUserItemClick?: (member: User) => void;
+    onFocusItemChange?: (member: User) => void;
+    onFetchUsers?: (users: Array<User>) => void;
+    renderUserMentionItem?: (props: { user: User }) => JSX.Element;
+    ableAddMention: boolean;
+    maxMentionCount?: number;
+    maxSuggestionCount?: number;
+    inputEvent?: React.KeyboardEvent<HTMLDivElement>;
+  };
 
-interface ChannelListProps extends ChannelListProviderInterface, ChannelListUIProps {}
+  export type SuggestedUserMentionItemProps = {
+    member: User | Member;
+    isFocused?: boolean;
+    onClick?: (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
+    onMouseOver?: (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
+    renderUserMentionItem?: (props: { user: User | Member }) => JSX.Element;
+  };
 
-interface ChannelListHeaderInterface {
-  renderHeader?: (props: void) => React.ReactNode;
-  renderIconButton?: (props: void) => React.ReactNode;
-  onEdit?: (props: void) => void;
-  allowProfileEdit?: boolean;
-}
+  export interface UnreadCountProps {
+    count: number;
+    time: string;
+    onClick(): void;
+  }
 
-interface ChannelPreviewInterface {
-  channel: SendBird.GroupChannel;
-  isActive?: boolean;
-  onClick: () => void;
-  renderChannelAction: (props: { channel: SendBird.GroupChannel }) => React.ReactNode;
-  tabIndex: number;
-}
+  export interface ChannelProps extends ChannelContextProps, ChannelUIProps {
+  }
 
-interface ChannelPreviewActionInterface {
-  disabled?: boolean;
-  onLeaveChannel?: () => void;
-}
+  export interface RemoveMessageProps {
+    onCancel: () => void;
+    message: EveryMessage;
+  }
 
-interface ChannelSettingsProviderInterface {
-  channelUrl: string;
-  onCloseClick?(): void;
-  onChannelModified?(channel: SendBird.GroupChannel): void;
-  onBeforeUpdateChannel?(currentTitle: string, currentImg: File, data: string): SendBird.GroupChannelParams;
-  queries?: ChannelSettingsQueries;
-  forceUpdateUI(): void;
-  channel: SendBird.GroupChannel;
-  invalidChannel: boolean;
-}
-
-interface ChannelSettingsUIProps {
-  renderPlaceholderError?: () => React.ReactNode;
-  renderChannelProfile?: () => React.ReactNode;
-  renderModerationPanel?: () => React.ReactNode;
-  renderLeaveChannel?: () => React.ReactNode;
-}
+  /**
+   * OpenChannel
+   */
+  export type OpenChannelQueries = {
+    // https://sendbird.github.io/core-sdk-javascript/module-model_params_messageListParams-MessageListParams.html
+    messageListParams?: {
+      replyType?: string,
+      messageType?: string,
+      prevResultSize?: number,
+      nextResultSize?: number,
+      reverse?: boolean,
+      isInclusive?: boolean,
+      includeMetaArray?: boolean,
+      // UIKit doesn't support emoji reaction in OpenChannel
+      // includeReactions?: boolean,
+      // UIKit doesn't support message threading in OpenChannel
+      // includeThreadInfo?: boolean,
+      includePollDetails?: boolean,
+      includeParentMessageInfo?: boolean,
+      showSubchannelMessagesOnly?: boolean,
+      customTypes?: Array<string>,
+      senderUserIds?: Array<string>,
+    },
+  };
 
-interface ApplicationUserListQuery {
-  limit?: number;
-  userIdsFilter?: Array<string>;
-  metaDataKeyFilter?: string;
-  metaDataValuesFilter?: Array<string>;
-}
+  export interface OpenChannelProviderProps {
+    channelUrl: string;
+    children?: React.ReactNode;
+    useMessageGrouping?: boolean;
+    queries?: OpenChannelQueries;
+    messageLimit?: number;
+    onBeforeSendUserMessage?(text: string): UserMessageCreateParams;
+    onBeforeSendFileMessage?(file_: File): FileMessageCreateParams;
+    onChatHeaderActionClick?(): void;
+    disableUserProfile?: boolean;
+    renderUserProfile?: (props: RenderUserProfileProps) => React.ReactNode;
+  }
 
-interface ChannelSettingsQueries {
-  applicationUserListQuery?: ApplicationUserListQuery;
-}
+  export interface OpenChannelMessagesState {
+    allMessages: Array<EveryMessage>;
+    loading: boolean;
+    initialized: boolean;
+    currentOpenChannel: OpenChannel;
+    isInvalid: boolean;
+    hasMore: boolean;
+    lastMessageTimestamp: number;
+    frozen: boolean;
+    operators: Array<User>;
+    participants: Array<User>;
+    bannedParticipantIds: Array<string>;
+    mutedParticipantIds: Array<string>;
+  }
 
-type ChannelSettingsContextProps = {
-  children: React.ReactNode;
-  channelUrl: string;
-  className?: string;
-  onCloseClick?(): void;
-  onChannelModified?(channel: SendBird.GroupChannel): void;
-  onBeforeUpdateChannel?(currentTitle: string, currentImg: File, data: string): SendBird.GroupChannelParams;
-  queries?: ChannelSettingsQueries;
-  renderUserProfile?: (props: RenderUserProfileProps) => React.ReactNode;
-  disableUserProfile?: boolean;
-}
+  export interface OpenChannelInterface extends OpenChannelProviderProps, OpenChannelMessagesState {
+    // derived/utils
+    messageInputRef: React.RefObject<HTMLInputElement>;
+    conversationScrollRef: React.RefObject<HTMLDivElement>;
+    disabled: boolean;
+    amIBanned: boolean;
+    amIMuted: boolean;
+    amIOperator: boolean;
+    fetchMore: boolean;
+    checkScrollBottom: () => boolean;
+    onScroll: (callback: () => void) => void;
+  }
 
-interface ChannelSettingsProps extends ChannelSettingsUIProps, ChannelSettingsContextProps {
-}
+  export interface OpenChannelUIProps {
+    renderMessage?: (props: RenderMessageProps) => React.ReactNode;
+    renderHeader?: () => React.ReactNode;
+    renderInput?: () => React.ReactNode;
+    renderPlaceHolderEmptyList?: () => React.ReactNode;
+    renderPlaceHolderError?: () => React.ReactNode;
+    renderPlaceHolderLoading?: () => React.ReactNode;
+  }
 
-type ChannelSettingsEditDetailsProps = {
-  onSubmit: () => void;
-  onCancel: () => void;
-}
+  export interface OpenChannelProps extends OpenChannelProviderProps, OpenChannelUIProps {
+  }
 
-type CustomUser = SendBird.User & {
-  isMuted: boolean;
-  role: string;
-}
+  export type OpenchannelMessageListProps = {
+    renderMessage?: (props: RenderMessageProps) => React.ReactNode;
+    renderPlaceHolderEmptyList?: () => React.ReactNode;
+  }
 
-interface UserListItemActionProps {
-  actionRef: React.RefObject<HTMLInputElement>;
-  parentRef: React.RefObject<HTMLInputElement>;
-}
+  export type OpenChannelMessageProps = {
+    renderMessage?: (props: RenderMessageProps) => React.ReactNode;
+    message: EveryMessage;
+    chainTop?: boolean;
+    chainBottom?: boolean;
+    hasSeparator?: boolean;
+    editDisabled?: boolean;
+  };
 
-interface UserListItemProps {
-  user: CustomUser;
-  currentUser?: string;
-  className?: string;
-  action?(props: UserListItemActionProps): React.ReactElement;
-}
+  /**
+   * OpenChannelSettings
+   */
+  export interface OpenChannelSettingsContextProps {
+    channelUrl: string;
+    children?: React.ReactNode;
+    onCloseClick?(): void;
+    onBeforeUpdateChannel?(currentTitle: string, currentImg: File, data: string): OpenChannelUpdateParams;
+    onChannelModified?(channel: OpenChannel): void;
+    onDeleteChannel?(channel: OpenChannel): void;
+    disableUserProfile?: boolean;
+    renderUserProfile?: (props: RenderUserProfileProps) => React.ReactNode;
+  }
+
+  export interface OpenChannelSettingsUIProps {
+    renderOperatorUI?: () => React.ReactNode;
+    renderParticipantList?: () => React.ReactNode;
+  }
 
-type LeaveChannelProps = {
-  onSubmit: () => void;
-  onCancel: () => void;
-};
+  export interface OpenChannelSettingsProps extends OpenChannelSettingsContextProps, OpenChannelSettingsUIProps {
+  }
+
+  export interface OpenChannelSettingsContextType extends OpenChannelSettingsContextProps {
+    channelUrl: string;
+    channel?: OpenChannel;
+    setChannel?: React.Dispatch<React.SetStateAction<OpenChannel>>;
+  }
+
+  export interface OperatorUIProps {
+    renderChannelProfile?: () => React.ReactNode;
+  }
+
+  export interface OpenChannelEditDetailsProps {
+    onCancel(): void;
+  }
+
+  /**
+   * MessageSearch
+   */
+  export interface MessageSearchProviderProps {
+    channelUrl: string;
+    children?: React.ReactNode;
+    searchString?: string;
+    requestString?: string;
+    messageSearchQuery?: MessageSearchQuery;
+    onResultLoaded?(messages?: Array<ClientSentMessages>, error?: SendbirdError): void;
+    onResultClick?(message: ClientSentMessages): void;
+  }
+
+  export type MessageSearchScrollCallbackReturn = (
+    callback: (
+      messages: Array<UserMessage | FileMessage | AdminMessage>,
+      /* eslint-disable @typescript-eslint/no-explicit-any*/
+      error: any,
+    ) => void
+  ) => void;
+
+  export type MessageSearchDispatcherType = { type: string, payload: any };
+  export interface MessageSearchProviderInterface extends MessageSearchProviderProps {
+    retryCount: number;
+    setRetryCount: React.Dispatch<React.SetStateAction<number>>;
+    selectedMessageId: number;
+    setSelectedMessageId: React.Dispatch<React.SetStateAction<number>>;
+    messageSearchDispatcher: (diapatcher: MessageSearchDispatcherType) => void;
+    scrollRef: React.MutableRefObject<HTMLDivElement>;
+    allMessages: Array<ClientFileMessage | ClientUserMessage>;
+    loading: boolean;
+    isInvalid: boolean;
+    currentChannel: GroupChannel;
+    currentMessageSearchQuery: MessageSearchQuery;
+    hasMoreResult: boolean;
+    onScroll: MessageSearchScrollCallbackReturn;
+    handleRetryToConnect: () => void;
+    handleOnScroll: (e: React.BaseSyntheticEvent) => void;
+  }
+
+  export interface MessageSearchUIProps {
+    renderPlaceHolderError?: (props: void) => React.ReactNode;
+    renderPlaceHolderLoading?: (props: void) => React.ReactNode;
+    renderPlaceHolderNoString?: (props: void) => React.ReactNode;
+    renderPlaceHolderEmptyList?: (props: void) => React.ReactNode;
+    renderSearchItem?(
+      {
+        message,
+        onResultClick,
+      }: {
+        message: ClientSentMessages,
+        onResultClick?: (message: ClientSentMessages) => void,
+      }
+    ): JSX.Element;
+  }
+
+  export interface MessageSearchProps extends MessageSearchUIProps, MessageSearchProviderProps {}
+
+  /**
+   * CreateChannel
+   */
+  export interface CreateChannelProviderProps {
+    children?: React.ReactNode;
+    onCreateChannel(channel: GroupChannel): void;
+    onBeforeCreateChannel?(users: Array<string>): GroupChannelCreateParams;
+    userListQuery?(): UserListQuery;
+  }
+
+  export interface CreateChannelContextInterface {
+    onBeforeCreateChannel?(users: Array<string>): GroupChannelCreateParams;
+    createChannel: (channelParams: GroupChannelCreateParams) => Promise<GroupChannel>;
+    sdk: SendbirdGroupChat | SendbirdOpenChat;
+    userListQuery?(): UserListQuery;
+    onCreateChannel?(channel: GroupChannel): void;
+    step: number,
+    setStep: React.Dispatch<React.SetStateAction<number>>,
+    type: 'group' | 'supergroup' | 'broadcast',
+    setType: React.Dispatch<React.SetStateAction<'group' | 'supergroup' | 'broadcast'>>,
+  }
+
+  export interface CreateChannelUIProps {
+    onCancel?(): void;
+    renderStepOne?:(props: void) => React.ReactNode;
+  }
+
+  export interface CreateChannelProps extends CreateChannelProviderProps, CreateChannelUIProps {}
+
+  export interface InviteUsersProps {
+    onCancel?: () => void;
+  }
+
+  export interface SelectChannelTypeProps {
+    onCancel?(): void;
+  }
+
+  /**
+   * EditUserProfile
+   */
+  export interface EditUserProfileProps {
+    children?: React.ReactNode;
+    onCancel?(): void;
+    onThemeChange?(theme: string): void;
+    onEditProfile?(updatedUser: User): void;
+  }
+
+  export interface EditUserProfileProviderInterface {
+    onCancel?(): void;
+    onThemeChange?(theme: string): void;
+    onEditProfile?(updatedUser: User): void;
+  }
+}
 
 declare module '@sendbird/uikit-react'  {
-  export const App: React.FunctionComponent<AppProps>;
-  export const SendBirdProvider: React.FunctionComponent<SendBirdProviderProps>;
-  export const sendBirdSelectors: sendBirdSelectorsInterface;
-  export const ChannelList: React.FunctionComponent<ChannelListProps>;
-  export const ChannelSettings: React.FunctionComponent<ChannelSettingsProps>;
-  export const Channel: React.FunctionComponent<ChannelProps>
-  export const OpenChannel: React.FunctionComponent<OpenChannelProps>
-  export const OpenChannelSettings: React.FunctionComponent<OpenChannelSettingsProps>
-  export const MessageSearch: React.FunctionComponent<MessageSearchProps>
+  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+  export const App: React.FunctionComponent<SendbirdUIKitGlobal.AppProps>;
+  export const SendBirdProvider: React.FunctionComponent<SendbirdUIKitGlobal.SendbirdProviderProps>;
+  export const sendBirdSelectors: SendbirdUIKitGlobal.sendbirdSelectorsInterface;
+  export const ChannelList: React.FunctionComponent<SendbirdUIKitGlobal.ChannelListProps>;
+  export const ChannelSettings: React.FunctionComponent<SendbirdUIKitGlobal.ChannelSettingsProps>;
+  export const Channel: React.FunctionComponent<SendbirdUIKitGlobal.ChannelProps>
+  export const OpenChannel: React.FunctionComponent<SendbirdUIKitGlobal.OpenChannelProps>
+  export const OpenChannelSettings: React.FunctionComponent<SendbirdUIKitGlobal.OpenChannelSettingsProps>
+  export const MessageSearch: React.FunctionComponent<SendbirdUIKitGlobal.MessageSearchProps>
   export function withSendBird(
     ChildComp: React.Component | React.ElementType,
-    mapStoreToProps?: (store: SendBirdState) => unknown
+    mapStoreToProps?: (store: SendbirdUIKitGlobal.SendBirdState) => unknown
   ): (props: unknown) => React.ReactNode;
-  export function useSendbirdStateContext(): SendBirdState;
+  export function useSendbirdStateContext(): SendbirdUIKitGlobal.SendBirdState;
 }
 
 declare module '@sendbird/uikit-react/App' {
-  const App: React.FunctionComponent<AppProps>
+  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+  const App: React.FunctionComponent<SendbirdUIKitGlobal.AppProps>
   export default App;
 }
 
 declare module '@sendbird/uikit-react/SendbirdProvider' {
-  const SendbirdProvider: React.FunctionComponent<SendBirdProviderProps>;
+  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+  const SendbirdProvider: React.FunctionComponent<SendbirdUIKitGlobal.SendbirdProviderProps>;
   export default SendbirdProvider;
 }
 
-declare module '@sendbird/uikit-react/sendBirdSelectors' {
-  const sendBirdSelectors: sendBirdSelectorsInterface;
+declare module '@sendbird/uikit-react/sendbirdSelectors' {
+  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+  const sendBirdSelectors: SendbirdUIKitGlobal.sendbirdSelectorsInterface;
   export default sendBirdSelectors;
 }
 
 declare module '@sendbird/uikit-react/useSendbirdStateContext' {
-  function useSendbirdStateContext(): SendBirdState;
+  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+  function useSendbirdStateContext(): SendbirdUIKitGlobal.SendBirdState;
   export default useSendbirdStateContext;
 }
 
-declare module '@sendbird/uikit-react/withSendBird' {
-  function withSendBird(
+declare module '@sendbird/uikit-react/withSendbird' {
+  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+  function withSendbird(
     ChildComp: React.Component | React.ElementType,
-    mapStoreToProps?: (store: SendBirdState) => unknown
+    mapStoreToProps?: (store: SendbirdUIKitGlobal.SendBirdState) => unknown
   ): (props: unknown) => React.ReactNode;
-  export default withSendBird;
+  export default withSendbird;
 }
 
+/** ChannelList */
 declare module '@sendbird/uikit-react/ChannelList' {
-  const ChannelList: React.FunctionComponent<ChannelListProps>;
+  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+  const ChannelList: React.FunctionComponent<SendbirdUIKitGlobal.ChannelListProps>;
   export default ChannelList;
 }
 
 declare module '@sendbird/uikit-react/ChannelList/context' {
-  export const ChannelListProvider: React.FunctionComponent<ChannelListProviderProps>;
-  export function useChannelListContext (): ChannelListProviderInterface;
-  export function useChannelList (): ChannelListProviderInterface;
+  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+  export const ChannelListProvider: React.FunctionComponent<SendbirdUIKitGlobal.ChannelListProviderProps>;
+  export function useChannelListContext (): SendbirdUIKitGlobal.ChannelListProviderInterface;
+  export function useChannelList (): SendbirdUIKitGlobal.ChannelListProviderInterface;
 }
 
 declare module '@sendbird/uikit-react/ChannelList/components/AddChannel' {
-  const AddChannel: React.VoidFunctionComponent;
+  const AddChannel: React.FunctionComponent;
   export default AddChannel;
 }
 
 declare module '@sendbird/uikit-react/ChannelList/components/ChannelListUI' {
-  const ChannelListUI: React.FunctionComponent<ChannelListUIProps>;
+  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+  const ChannelListUI: React.FunctionComponent<SendbirdUIKitGlobal.ChannelListUIProps>;
   export default ChannelListUI;
 }
 
 declare module '@sendbird/uikit-react/ChannelList/components/ChannelListHeader' {
-  const ChannelListHeader: React.FunctionComponent<ChannelListUIProps>;
+  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+  const ChannelListHeader: React.FunctionComponent<SendbirdUIKitGlobal.ChannelListHeaderInterface>;
   export default ChannelListHeader;
 }
 
 declare module '@sendbird/uikit-react/ChannelList/components/ChannelPreview' {
-  const ChannelPreview: React.FunctionComponent<ChannelPreviewInterface>;
+  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+  const ChannelPreview: React.FunctionComponent<SendbirdUIKitGlobal.ChannelPreviewInterface>;
   export default ChannelPreview;
 }
 
 declare module '@sendbird/uikit-react/ChannelList/components/ChannelPreviewAction' {
-  const ChannelPreviewAction: React.FunctionComponent<ChannelPreviewActionInterface>;
+  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+  const ChannelPreviewAction: React.FunctionComponent<SendbirdUIKitGlobal.ChannelPreviewActionInterface>;
   export default ChannelPreviewAction;
 }
 
 declare module '@sendbird/uikit-react/ChannelSettings' {
-  const ChannelSettings: React.FunctionComponent<ChannelSettingsProps>;
+  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+  const ChannelSettings: React.FunctionComponent<SendbirdUIKitGlobal.ChannelSettingsProps>;
   export default ChannelSettings;
 }
 
 declare module '@sendbird/uikit-react/ChannelSettings/context' {
-  export const ChannelSettingsProvider: React.FC<ChannelSettingsContextProps>;
-  export const UseChannelSettingsType: () => ChannelSettingsProviderInterface;
+  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+  export const ChannelSettingsProvider: React.FC<SendbirdUIKitGlobal.ChannelSettingsContextProps>;
+  export const useChannelSettingsContext: () => SendbirdUIKitGlobal.ChannelSettingsProviderInterface;
 }
 
-declare module '@sendbird/uikit-react/ChannelSettings/components/AdminPanel' {
-  const AdminPanel: React.VoidFunctionComponent;
-  export default AdminPanel;
+declare module '@sendbird/uikit-react/ChannelSettings/components/ModerationPanel' {
+  const ModerationPanel: React.FunctionComponent;
+  export default ModerationPanel;
 }
 
 declare module '@sendbird/uikit-react/ChannelSettings/components/ChannelProfile' {
-  const ChannelProfile: React.VoidFunctionComponent;
+  const ChannelProfile: React.FunctionComponent;
   export default ChannelProfile;
 }
 
 declare module '@sendbird/uikit-react/ChannelSettings/components/ChannelSettingsUI' {
-  const ChannelSettingsUI: React.FC<ChannelSettingsUIProps>;
+  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+  const ChannelSettingsUI: React.FC<SendbirdUIKitGlobal.ChannelSettingsUIProps>;
   export default ChannelSettingsUI;
 }
 
 declare module '@sendbird/uikit-react/ChannelSettings/components/EditDetailsModal' {
-  const EditDetailsModal: React.FC<ChannelSettingsEditDetailsProps>;
+  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+  const EditDetailsModal: React.FC<SendbirdUIKitGlobal.ChannelSettingsEditDetailsProps>;
   export default EditDetailsModal;
 }
 
 declare module '@sendbird/uikit-react/ChannelSettings/components/LeaveChannel' {
-  const LeaveChannel: React.FC<LeaveChannelProps>;
+  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+  const LeaveChannel: React.FC<SendbirdUIKitGlobal.LeaveChannelProps>;
   export default LeaveChannel;
 }
 
 declare module '@sendbird/uikit-react/ChannelSettings/components/UserListItem' {
-  const UserListItem: React.FC<UserListItemProps>;
+  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+  const UserListItem: React.FC<SendbirdUIKitGlobal.UserListItemProps>;
   export default UserListItem;
 }
 
 declare module '@sendbird/uikit-react/ChannelSettings/components/UserPanel' {
-  const UserPanel: React.VoidFunctionComponent;
+  const UserPanel: React.FunctionComponent;
   export default UserPanel;
 }
 
 /**
  * Channel
  */
-interface RenderMessageProps {
-  message: EveryMessage;
-  chainTop: boolean;
-  chainBottom: boolean;
-}
-
-type ChannelQueries = {
-  messageListParams?: SendBird.MessageListParams;
-};
-
-type ChannelContextProps = {
-  channelUrl: string;
-  children?: React.ReactNode;
-  useMessageGrouping?: boolean;
-  useReaction?: boolean;
-  showSearchIcon?: boolean;
-  highlightedMessage?: number;
-  startingPoint?: number;
-  onBeforeSendUserMessage?(text: string, quotedMessage?: SendBird.UserMessage | SendBird.FileMessage): SendBird.UserMessageParams;
-  onBeforeSendFileMessage?(file: File, quotedMessage?: SendBird.UserMessage | SendBird.FileMessage): SendBird.FileMessageParams;
-  onBeforeUpdateUserMessage?(text: string): SendBird.UserMessageParams;
-  onChatHeaderActionClick?(event: React.MouseEvent<HTMLElement>): void;
-  onSearchClick?(): void;
-  replyType?: ReplyType;
-  queries?: ChannelQueries;
-  renderUserProfile?: (props: RenderUserProfileProps) => React.ReactNode;
-  disableUserProfile?: boolean;
-};
-
-interface ChannelUIProps {
-  renderPlaceholderLoader?: () => React.ReactNode;
-  renderPlaceholderInvalid?: () => React.ReactNode;
-  renderPlaceholderEmpty?: () => React.ReactNode;
-  renderChannelHeader?: () => React.ReactNode;
-  renderMessage?: (props: RenderMessageProps) => React.ComponentType;
-  renderMessageInput?: () => React.ReactNode;
-  renderTypingIndicator?: () => React.ReactNode;
-  renderCustomSeperator?: () => React.ReactNode;
-}
-
-type CoreMessageType = SendBird.AdminMessage | SendBird.UserMessage | SendBird.FileMessage;
-
-interface MessageStoreInterface {
-  allMessages: CoreMessageType[];
-  loading: boolean;
-  initialized: boolean;
-  unreadSince: string;
-  isInvalid: boolean;
-  currentGroupChannel: SendBird.GroupChannel;
-  hasMorePrev: boolean;
-  oldestMessageTimeStamp: number;
-  hasMoreNext: boolean;
-  latestMessageTimeStamp: number;
-  emojiContainer: any;
-  readStatus: any;
-}
-
-interface ChannelProviderInterface extends ChannelContextProps, ChannelContextProps {
-  scrollToMessage?(createdAt: number, messageId: number): void;
-  messageActionTypes: Record<string ,string>;
-  quoteMessage: CoreMessageType;
-  setQuoteMessage: React.Dispatch<React.SetStateAction<CoreMessageType>>;
-  initialTimeStamp: number;
-  setInitialTimeStamp: React.Dispatch<React.SetStateAction<number>>;
-  animatedMessageId: number;
-  highLightedMessageId: number;
-  nicknamesMap: Map<string, string>;
-  scrollRef: React.MutableRefObject<HTMLDivElement>;
-  setAnimatedMessageId: React.Dispatch<React.SetStateAction<number>>;
-  setHighLightedMessageId: React.Dispatch<React.SetStateAction<number>>;
-  messageInputRef: React.MutableRefObject<HTMLInputElement>,
-  toggleReaction(message: SendBird.UserMessage | SendBird.FileMessage, emojiKey: string, isReacted: boolean): void,
-}
-
-type FileViewerProps = {
-  onCancel:() => void;
-  message: ClientFileMessage;
-}
-
-type MessageUIProps = {
-  message: EveryMessage;
-  hasSeparator?: boolean;
-  chainTop?: boolean;
-  chainBottom?: boolean;
-  handleScroll: () => void;
-  // for extending
-  renderMessage?: (props: RenderMessageProps) => React.ReactNode;
-  renderCustomSeperator?: () => React.ReactNode;
-  renderEditInput?: () => React.ReactNode;
-  renderMessageContent?: () => React.ReactNode;
-};
-
-type MessageListProps = {
-  renderMessage?: (props: RenderMessageProps) => React.ReactNode;
-  renderPlaceholderEmpty?: () => React.ReactNode;
-  renderCustomSeperator?: () => React.ReactNode;
-};
-
-type SuggestedMentionListProps = {
-  targetNickname: string;
-  memberListQuery?: Record<string, string>;
-  onUserItemClick?: (member: SendBird.User) => void;
-  onFocusItemChange?: (member: SendBird.User) => void;
-  onFetchUsers?: (users: Array<SendBird.User>) => void;
-  renderUserMentionItem?: (props: { user: SendBird.User }) => JSX.Element;
-  ableAddMention: boolean;
-  maxMentionCount?: number;
-  maxSuggestionCount?: number;
-  inputEvent?: React.KeyboardEvent<HTMLDivElement>;
-};
-
-type SuggestedUserMentionItemProps = {
-  member: SendBird.User;
-  isFocused?: boolean;
-  onClick?: (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
-  onMouseOver?: (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
-  renderUserMentionItem?: (props: { user: SendBird.User }) => JSX.Element;
-};
-
-interface UnreadCountProps {
-  count: number;
-  time: string;
-  onClick(): void;
-}
-
-interface ChannelProps extends ChannelContextProps, ChannelUIProps {
-}
-
-interface RemoveMessageProps {
-  onCancel: () => void;
-  message: EveryMessage;
-}
-
 declare module '@sendbird/uikit-react/Channel' {
-  const Channel: React.FC<ChannelProps>;
+  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+  const Channel: React.FC<SendbirdUIKitGlobal.ChannelProps>;
   export default Channel;
 }
 
 declare module '@sendbird/uikit-react/Channel/context' {
-  export const ChannelProvider: React.FunctionComponent<ChannelContextProps>;
-  export function useChannel(): ChannelProviderInterface;
+  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+  export const ChannelProvider: React.FunctionComponent<SendbirdUIKitGlobal.ChannelContextProps>;
+  export function useChannelContext(): SendbirdUIKitGlobal.ChannelProviderInterface;
 }
 
 declare module '@sendbird/uikit-react/Channel/components/ChannelHeader' {
-  const ChannelHeader: React.VoidFunctionComponent;
+  const ChannelHeader: React.FunctionComponent;
   export default ChannelHeader;
 }
 
 declare module '@sendbird/uikit-react/Channel/components/ChannelUI' {
-  const ChannelUI: React.FunctionComponent<ChannelUIProps>;
+  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+  const ChannelUI: React.FunctionComponent<SendbirdUIKitGlobal.ChannelUIProps>;
   export default ChannelUI;
 }
 
 declare module '@sendbird/uikit-react/Channel/components/FileViewer' {
-  const FileViewer: React.FunctionComponent<FileViewerProps>;
+  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+  const FileViewer: React.FunctionComponent<SendbirdUIKitGlobal.FileViewerProps>;
   export default FileViewer;
 }
 
 declare module '@sendbird/uikit-react/Channel/components/FrozenNotification' {
-  const FrozenNotification: React.VoidFunctionComponent;
+  const FrozenNotification: React.FunctionComponent;
   export default FrozenNotification;
 }
 
 declare module '@sendbird/uikit-react/Channel/components/Message' {
-  const Message: React.FunctionComponent<MessageUIProps>;
+  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+  const Message: React.FunctionComponent<SendbirdUIKitGlobal.MessageUIProps>;
   export default Message;
 }
 
 declare module '@sendbird/uikit-react/Channel/components/MessageInput' {
-  const MessageInput: React.VoidFunctionComponent;
+  const MessageInput: React.FunctionComponent;
   export default MessageInput;
 }
 
 declare module '@sendbird/uikit-react/Channel/components/MessageList' {
-  const MessageList: React.FunctionComponent<MessageListProps>;
+  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+  const MessageList: React.FunctionComponent<SendbirdUIKitGlobal.MessageListProps>;
   export default MessageList;
 }
 
 declare module '@sendbird/uikit-react/Channel/components/SuggestedMentionList' {
-  const SuggestedMentionList: React.FunctionComponent<SuggestedMentionListProps>;
+  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+  const SuggestedMentionList: React.FunctionComponent<SendbirdUIKitGlobal.SuggestedMentionListProps>;
   export default SuggestedMentionList;
 }
 
 declare module '@sendbird/uikit-react/Channel/components/RemoveMessageModal' {
-  const RemoveMessageModal: React.FunctionComponent<RemoveMessageProps>;
+  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+  const RemoveMessageModal: React.FunctionComponent<SendbirdUIKitGlobal.RemoveMessageProps>;
   export default RemoveMessageModal;
 }
 
 declare module '@sendbird/uikit-react/Channel/components/TypingIndicator' {
-  const TypingIndicator: React.VoidFunctionComponent;
+  const TypingIndicator: React.FunctionComponent;
   export default TypingIndicator;
 }
 
 declare module '@sendbird/uikit-react/Channel/components/UnreadCount' {
-  const UnreadCount: React.FunctionComponent<UnreadCountProps>;
+  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+  const UnreadCount: React.FunctionComponent<SendbirdUIKitGlobal.UnreadCountProps>;
   export default UnreadCount;
 }
 
-type OpenChannelQueries = {
-  // https://sendbird.github.io/core-sdk-javascript/module-model_params_messageListParams-MessageListParams.html
-  messageListParams?: {
-    replyType?: string,
-    messageType?: string,
-    prevResultSize?: number,
-    nextResultSize?: number,
-    reverse?: boolean,
-    isInclusive?: boolean,
-    includeMetaArray?: boolean,
-    // UIKit doesn't support emoji reaction in OpenChannel
-    // includeReactions?: boolean,
-    // UIKit doesn't support message threading in OpenChannel
-    // includeThreadInfo?: boolean,
-    includePollDetails?: boolean,
-    includeParentMessageInfo?: boolean,
-    showSubchannelMessagesOnly?: boolean,
-    customTypes?: Array<string>,
-    senderUserIds?: Array<string>,
-  },
-};
-
-interface OpenChannelProviderProps {
-  channelUrl: string;
-  children?: React.ReactNode;
-  useMessageGrouping?: boolean;
-  queries?: OpenChannelQueries;
-  messageLimit?: number;
-  onBeforeSendUserMessage?(text: string): SendBird.UserMessageParams;
-  onBeforeSendFileMessage?(file_: File): SendBird.FileMessageParams;
-  onChatHeaderActionClick?(): void;
-  disableUserProfile?: boolean;
-  renderUserProfile?: (props: RenderUserProfileProps) => React.ReactNode;
-}
-
-interface OpenChannelMessagesState {
-  allMessages: Array<EveryMessage>;
-  loading: boolean;
-  initialized: boolean;
-  currentOpenChannel: SendBird.OpenChannel;
-  isInvalid: boolean;
-  hasMore: boolean;
-  lastMessageTimestamp: number;
-  frozen: boolean;
-  operators: Array<SendBird.User>;
-  participants: Array<SendBird.User>;
-  bannedParticipantIds: Array<string>;
-  mutedParticipantIds: Array<string>;
-}
-
-interface OpenChannelInterface extends OpenChannelProviderProps, OpenChannelMessagesState {
-  // derived/utils
-  messageInputRef: React.RefObject<HTMLInputElement>;
-  conversationScrollRef: React.RefObject<HTMLDivElement>;
-  disabled: boolean;
-  amIBanned: boolean;
-  amIMuted: boolean;
-  amIOperator: boolean;
-  fetchMore: boolean;
-  checkScrollBottom: () => boolean;
-  onScroll: (callback: () => void) => void;
-}
-
-interface OpenChannelUIProps {
-  renderMessage?: (props: RenderMessageProps) => React.ReactNode;
-  renderHeader?: () => React.ReactNode;
-  renderInput?: () => React.ReactNode;
-  renderPlaceHolderEmptyList?: () => React.ReactNode;
-  renderPlaceHolderError?: () => React.ReactNode;
-  renderPlaceHolderLoading?: () => React.ReactNode;
-}
-
-interface OpenChannelProps extends OpenChannelProviderProps, OpenChannelUIProps {
-}
-
-type OpenchannelMessageListProps = {
-  renderMessage?: (props: RenderMessageProps) => React.ReactNode;
-  renderPlaceHolderEmptyList?: () => React.ReactNode;
-}
-
-type OpenChannelMessageProps = {
-  renderMessage?: (props: RenderMessageProps) => React.ReactNode;
-  message: EveryMessage;
-  chainTop?: boolean;
-  chainBottom?: boolean;
-  hasSeparator?: boolean;
-  editDisabled?: boolean;
-};
-
+/**
+ * OpenChannel
+ */
 declare module '@sendbird/uikit-react/OpenChannel' {
-  const OpenChannel: React.FC<OpenChannelProps>;
+  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+  const OpenChannel: React.FC<SendbirdUIKitGlobal.OpenChannelProps>;
   export default OpenChannel;
 }
 
 declare module '@sendbird/uikit-react/OpenChannel/context' {
-  export const OpenChannelProvider: React.FunctionComponent<OpenChannelProviderProps>;
-  export function useOpenChannel(): OpenChannelInterface;
+  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+  export const OpenChannelProvider: React.FunctionComponent<SendbirdUIKitGlobal.OpenChannelProviderProps>;
+  export function useOpenChannelContext(): SendbirdUIKitGlobal.OpenChannelInterface;
 }
 
 declare module '@sendbird/uikit-react/OpenChannel/components/FrozenChannelNotification' {
-  const FrozenChannelNotification: React.VoidFunctionComponent;
+  const FrozenChannelNotification: React.FunctionComponent;
   export default FrozenChannelNotification;
 }
 
 declare module '@sendbird/uikit-react/OpenChannel/components/OpenChannelHeader' {
-  const OpenChannelHeader: React.VoidFunctionComponent;
+  const OpenChannelHeader: React.FunctionComponent;
   export default OpenChannelHeader;
 }
 
 declare module '@sendbird/uikit-react/OpenChannel/components/OpenChannelInput' {
-  const OpenChannelInput: React.VoidFunctionComponent;
+  const OpenChannelInput: React.FunctionComponent;
   export default OpenChannelInput;
 
 }
 
 declare module '@sendbird/uikit-react/OpenChannel/components/OpenChannelMessage' {
-  const OpenChannelMessage: React.FC<OpenChannelMessageProps>;
+  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+  const OpenChannelMessage: React.FC<SendbirdUIKitGlobal.OpenChannelMessageProps>;
   export default OpenChannelMessage;
-
 }
 
 declare module '@sendbird/uikit-react/OpenChannel/components/OpenChannelMessageList' {
-  const OpenChannelMessageList: React.FC<OpenchannelMessageListProps>;
+  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+  const OpenChannelMessageList: React.FC<SendbirdUIKitGlobal.OpenchannelMessageListProps>;
   export default OpenChannelMessageList;
 }
 
 declare module '@sendbird/uikit-react/OpenChannel/components/OpenChannelUI' {
-  const OpenChannelUI: React.FC<OpenChannelUIProps>;
+  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+  const OpenChannelUI: React.FC<SendbirdUIKitGlobal.OpenChannelUIProps>;
   export default OpenChannelUI;
 }
 
-interface OpenChannelSettingsContextProps {
-  channelUrl: string;
-  children?: React.ReactNode;
-  onCloseClick?(): void;
-  onBeforeUpdateChannel?(currentTitle: string, currentImg: File, data: string): SendBird.OpenChannelParams;
-  onChannelModified?(channel: SendBird.OpenChannel): void;
-  onDeleteChannel?(channel: SendBird.OpenChannel): void;
-  disableUserProfile?: boolean;
-  renderUserProfile?: (props: RenderUserProfileProps) => React.ReactNode;
-}
-
-interface OpenChannelSettingsUIProps {
-  renderOperatorUI?: () => React.ReactNode;
-  renderParticipantList?: () => React.ReactNode;
-}
-
-interface OpenChannelSettingsProps extends OpenChannelSettingsContextProps, OpenChannelSettingsUIProps {
-}
-
-interface OpenChannelSettingsContextType extends OpenChannelSettingsContextProps {
-  channelUrl: string;
-  channel?: SendBird.OpenChannel;
-  setChannel?: React.Dispatch<React.SetStateAction<SendBird.OpenChannel>>;
-}
-
-interface OperatorUIProps {
-  renderChannelProfile?: () => React.ReactNode;
-}
-
-interface OpenChannelEditDetailsProps {
-  onCancel(): void;
-}
-
+/**
+ * OpenChannelSettings
+ */
 declare module '@sendbird/uikit-react/OpenChannelSettings' {
-  const OpenChannelSettings: React.FC<OpenChannelSettingsProps>;
+  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+  const OpenChannelSettings: React.FC<SendbirdUIKitGlobal.OpenChannelSettingsProps>;
   export default OpenChannelSettings;
 }
 
 declare module '@sendbird/uikit-react/OpenChannelSettings/context' {
-  export const useOpenChannelSettings: () => OpenChannelSettingsContextType;
-  export const OpenChannelSettingsProvider: React.FC<OpenChannelSettingsContextProps>;
+  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+  export const useOpenChannelSettingsContext: () => SendbirdUIKitGlobal.OpenChannelSettingsContextType;
+  export const OpenChannelSettingsProvider: React.FC<SendbirdUIKitGlobal.OpenChannelSettingsContextProps>;
 }
 
 declare module '@sendbird/uikit-react/OpenChannelSettings/components/EditDetailsModal' {
-  const EditDetailsModal: React.FC<OpenChannelEditDetailsProps>;
+  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+  const EditDetailsModal: React.FC<SendbirdUIKitGlobal.OpenChannelEditDetailsProps>;
   export default EditDetailsModal;
 }
 
 declare module '@sendbird/uikit-react/OpenChannelSettings/components/OpenChannelSettingsUI' {
-  const OpenChannelSettingsUI: React.FC<OpenChannelSettingsUIProps>;
+  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+  const OpenChannelSettingsUI: React.FC<SendbirdUIKitGlobal.OpenChannelSettingsUIProps>;
   export default OpenChannelSettingsUI;
 }
 
 declare module '@sendbird/uikit-react/OpenChannelSettings/components/OperatorUI' {
-  const OperatorUI: React.FC<OperatorUIProps>;
+  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+  const OperatorUI: React.FC<SendbirdUIKitGlobal.OperatorUIProps>;
   export default OperatorUI;
 }
 
 declare module '@sendbird/uikit-react/OpenChannelSettings/components/ParticipantUI' {
-  const ParticipantUI: React.VoidFunctionComponent;
+  const ParticipantUI: React.FunctionComponent;
   export default ParticipantUI;
 }
 
-interface MessageSearchProviderProps {
-  channelUrl: string;
-  children?: React.ReactNode;
-  searchString?: string;
-  requestString?: string;
-  messageSearchQuery?: SendBird.MessageSearchQueryOptions;
-  onResultLoaded?(messages?: Array<ClientSentMessages>, error?: SendBird.SendBirdError): void;
-  onResultClick?(message: ClientSentMessages): void;
-}
-
-type MessageSearchScrollCallbackReturn = (
-  callback: (
-    messages: Array<SendBird.UserMessage | SendBird.FileMessage | SendBird.AdminMessage>,
-    /* eslint-disable @typescript-eslint/no-explicit-any*/
-    error: any,
-  ) => void
-) => void;
-
-interface MessageSearchProviderInterface extends MessageSearchProviderProps {
-  retryCount: number;
-  setRetryCount: React.Dispatch<React.SetStateAction<number>>;
-  selectedMessageId: number;
-  setSelectedMessageId: React.Dispatch<React.SetStateAction<number>>;
-  messageSearchDispatcher: ({ type: string, payload: any }) => void;
-  scrollRef: React.MutableRefObject<HTMLDivElement>;
-  allMessages: Array<ClientFileMessage | ClientUserMessage>;
-  loading: boolean;
-  isInvalid: boolean;
-  currentChannel: SendBird.GroupChannel;
-  currentMessageSearchQuery: SendBird.MessageSearchQuery;
-  hasMoreResult: boolean;
-  onScroll: MessageSearchScrollCallbackReturn;
-  handleRetryToConnect: () => void;
-  handleOnScroll: (e: React.BaseSyntheticEvent) => void;
-}
-
-interface MessageSearchUIProps {
-  renderPlaceHolderError?: (props: void) => React.ReactNode;
-  renderPlaceHolderLoading?: (props: void) => React.ReactNode;
-  renderPlaceHolderNoString?: (props: void) => React.ReactNode;
-  renderPlaceHolderEmptyList?: (props: void) => React.ReactNode;
-  renderSearchItem?(
-    {
-      message,
-      onResultClick,
-    }: {
-      message: ClientSentMessages,
-      onResultClick?: (message: ClientSentMessages) => void,
-    }
-  ): JSX.Element;
-}
-
-interface MessageSearchProps extends MessageSearchUIProps, MessageSearchProviderProps {}
-
+/**
+ * MessageSearch
+ */
 declare module '@sendbird/uikit-react/MessageSearch' {
-  const MessageSearch: React.FC<MessageSearchProps>;
+  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+  const MessageSearch: React.FC<SendbirdUIKitGlobal.MessageSearchProps>;
   export default MessageSearch;
 }
 
 declare module '@sendbird/uikit-react/MessageSearch/context' {
-  export const useMessageSearch: () => MessageSearchProviderInterface;
-  export const MessageSearchProvider: React.FC<MessageSearchProviderProps>;
+  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+  export const useMessageSearchContext: () => SendbirdUIKitGlobal.MessageSearchProviderInterface;
+  export const MessageSearchProvider: React.FC<SendbirdUIKitGlobal.MessageSearchProviderProps>;
 }
 
 declare module '@sendbird/uikit-react/MessageSearch/components/MessageSearchUI' {
-  const MessageSearchUI: React.FC<MessageSearchUIProps>;
+  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+  const MessageSearchUI: React.FC<SendbirdUIKitGlobal.MessageSearchUIProps>;
   export default MessageSearchUI;
 }
 
-interface CreateChannelProviderProps {
-  children?: React.ReactNode;
-  onCreateChannel(channel: SendBird.GroupChannel): void;
-  onBeforeCreateChannel?(users: Array<string>): SendBird.GroupChannelParams;
-  userListQuery?(): UserListQuery;
-}
-
-
-interface CreateChannelContextInterface {
-  onBeforeCreateChannel?(users: Array<string>): SendBird.GroupChannelParams;
-  createChannel: (channelParams: SendBird.GroupChannelParams) => Promise<SendBird.GroupChannel>;
-  sdk: SendBird.SendBirdInstance;
-  userListQuery?(): UserListQuery;
-  onCreateChannel?(channel: SendBird.GroupChannel): void;
-  step: number,
-  setStep: React.Dispatch<React.SetStateAction<number>>,
-  type: 'group' | 'supergroup' | 'broadcast',
-  setType: React.Dispatch<React.SetStateAction<'group' | 'supergroup' | 'broadcast'>>,
-}
-
-interface CreateChannelUIProps {
-  onCancel?(): void;
-  renderStepOne?:(props: void) => React.ReactNode;
-}
-
-interface CreateChannelProps extends CreateChannelProviderProps, CreateChannelUIProps {}
-
-interface InviteMembersProps {
-  onCancel?: () => void;
-}
-
-interface SelectChannelTypeProps {
-  onCancel?(): void;
-}
-
+/**
+ * CreateChannel
+ */
 declare module '@sendbird/uikit-react/CreateChannel' {
-  const CreateChannel: React.FC<CreateChannelProps>;
+  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+  const CreateChannel: React.FC<SendbirdUIKitGlobal.CreateChannelProps>;
   export default CreateChannel;
 }
 
 declare module '@sendbird/uikit-react/CreateChannel/context' {
-  export const CreateChannelProvider: React.FC<CreateChannelProviderProps>;
-  export function useCreateChannelContext (): CreateChannelContextInterface;
+  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+  export const CreateChannelProvider: React.FC<SendbirdUIKitGlobal.CreateChannelProviderProps>;
+  export function useCreateChannelContext (): SendbirdUIKitGlobal.CreateChannelContextInterface;
 }
 
 declare module '@sendbird/uikit-react/CreateChannel/components/CreateChannelUI' {
-  const CreateChannelUI: React.FC<CreateChannelUIProps>;
+  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+  const CreateChannelUI: React.FC<SendbirdUIKitGlobal.CreateChannelUIProps>;
   export default CreateChannelUI;
 }
 
-declare module '@sendbird/uikit-react/CreateChannel/components/InviteMembers' {
-  const InviteMembers: React.FC<InviteMembersProps>;
-  export default InviteMembers;
+declare module '@sendbird/uikit-react/CreateChannel/components/InviteUsers' {
+  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+  const InviteUsers: React.FC<SendbirdUIKitGlobal.InviteUsersProps>;
+  export default InviteUsers;
 }
 
 declare module '@sendbird/uikit-react/CreateChannel/components/SelectChannelType' {
-  const SelectChannelType: React.FC<SelectChannelTypeProps>;
+  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+  const SelectChannelType: React.FC<SendbirdUIKitGlobal.SelectChannelTypeProps>;
   export default SelectChannelType;
 }
 
-interface EditUserProfileProps {
-  children?: React.ReactNode;
-  onCancel?(): void;
-  onThemeChange?(theme: string): void;
-  onEditProfile?(updatedUser: SendBird.User): void;
-}
-
-interface EditUserProfileProviderInterface {
-  onCancel?(): void;
-  onThemeChange?(theme: string): void;
-  onEditProfile?(updatedUser: SendBird.User): void;
-}
-
+/**
+ * EditUserProfile
+ */
 declare module '@sendbird/uikit-react/EditUserProfile' {
-  const EditProfile: React.FC<EditUserProfileProps>;
+  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+  const EditProfile: React.FC<SendbirdUIKitGlobal.EditUserProfileProps>;
   export default EditProfile;
 }
 
 declare module '@sendbird/uikit-react/EditUserProfile/context' {
-  export const EditUserProfileProvider: React.FC<EditUserProfileProps>;
-  export function useEditUserProfileProvider (): EditUserProfileProviderInterface;
+  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+  export const EditUserProfileProvider: React.FC<SendbirdUIKitGlobal.EditUserProfileProps>;
+  export function useEditUserProfileProviderContext (): SendbirdUIKitGlobal.EditUserProfileProviderInterface;
 }
 
 declare module '@sendbird/uikit-react/EditUserProfile/components/EditUserProfileUI' {
-  const EditUserProfileUI: React.VoidFunctionComponent;
+  const EditUserProfileUI: React.FunctionComponent;
   export default EditUserProfileUI;
 }
 
@@ -1128,12 +1202,13 @@ declare module '@sendbird/uikit-react/ui/AccordionGroup' {
 }
 
 declare module '@sendbird/uikit-react/ui/AdminMessage' {
+  import type { AdminMessage } from '@sendbird/chat/message';
   interface AdminMessageProps {
     className?: string,
-    message: SendBird.AdminMessage,
+    message: AdminMessage,
   }
-  const AdminMessage: React.FC<AdminMessageProps>;
-  export default AdminMessage;
+  const AdminMessageComponent: React.FC<AdminMessageProps>;
+  export default AdminMessageComponent;
 }
 
 declare module '@sendbird/uikit-react/ui/Avatar' {
@@ -1183,8 +1258,9 @@ declare module '@sendbird/uikit-react/ui/Button' {
 }
 
 declare module '@sendbird/uikit-react/ui/ChannelAvatar' {
+  import type { GroupChannel } from '@sendbird/chat/groupChannel'
   interface ChannelAvatarProps {
-    channel: SendBird.GroupChannel;
+    channel: GroupChannel;
     userId: string;
     theme: string;
     width?: number,
@@ -1195,8 +1271,9 @@ declare module '@sendbird/uikit-react/ui/ChannelAvatar' {
 }
 
 declare module '@sendbird/uikit-react/ui/OpenChannelAvatar' {
+  import type { OpenChannel } from '@sendbird/chat/OpenChannel'
   interface OpenChannelAvatarProps {
-    channel: SendBird.OpenChannel;
+    channel: OpenChannel;
     theme: string;
     height?: number;
     width?: number;
@@ -1206,9 +1283,11 @@ declare module '@sendbird/uikit-react/ui/OpenChannelAvatar' {
 }
 
 declare module '@sendbird/uikit-react/ui/ChannelPreview' {
+  import type { User } from '@sendbird/chat';
+  import type { GroupChannel } from '@sendbird/chat/groupChannel';
   interface ChannelPreviewProps {
-    channel?: SendBird.GroupChannel,
-    currentUser?: SendBird.User,
+    channel?: GroupChannel,
+    currentUser?: User,
     isActive?: boolean,
     ChannelAction: React.ReactElement,
     theme?: 'light' | 'dark',
@@ -1220,9 +1299,11 @@ declare module '@sendbird/uikit-react/ui/ChannelPreview' {
 }
 
 declare module '@sendbird/uikit-react/ui/ChatHeader' {
+  import type { User } from '@sendbird/chat';
+  import type { GroupChannel } from '@sendbird/chat/groupChannel';
   interface ChatHeaderProps {
-    currentGroupChannel?: SendBird.GroupChannel;
-    currentUser?: SendBird.User;
+    currentGroupChannel?: GroupChannel;
+    currentUser?: User;
     title?: string;
     subTitle?: string;
     isMuted?: boolean;
@@ -1246,7 +1327,7 @@ declare module '@sendbird/uikit-react/ui/Checkbox' {
 }
 
 declare module '@sendbird/uikit-react/ui/ConnectionStatus' {
-  const ConnectionStatus: React.VoidFunctionComponent;
+  const ConnectionStatus: React.FunctionComponent;
   export default ConnectionStatus;
 }
 
@@ -1290,19 +1371,22 @@ declare module '@sendbird/uikit-react/ui/Dropdown' {
 }
 
 declare module '@sendbird/uikit-react/ui/EmojiReactions' {
+  import type { EmojiCategory } from '@sendbird/chat';
+  import type { FileMessage, UserMessage } from '@sendbird/chat/message';
+
   interface EmojiContainer {
-    emojiCategories: Array<SendBird.EmojiCategory>;
+    emojiCategories: Array<EmojiCategory>;
     emojiHash: string;
   }
   interface EmojiReactionsProps {
     className?: string | Array<string>;
     userId: string;
-    message: SendBird.UserMessage | SendBird.FileMessage;
+    message: UserMessage | FileMessage;
     emojiContainer: EmojiContainer;
     memberNicknamesMap: Map<string, string>;
     spaceFromTrigger?: Record<string, unknown>;
     isByMe?: boolean;
-    toggleReaction?: (message: SendBird.UserMessage | SendBird.FileMessage, key: string, byMe: boolean) => void;
+    toggleReaction?: (message: UserMessage | FileMessage, key: string, byMe: boolean) => void;
   }
   const EmojiReactions: React.FC<EmojiReactionsProps>;
   export default EmojiReactions;
@@ -1310,9 +1394,11 @@ declare module '@sendbird/uikit-react/ui/EmojiReactions' {
 }
 
 declare module '@sendbird/uikit-react/ui/FileMessageItemBody' {
+  import type { FileMessage } from '@sendbird/chat/message';
+
   interface FileMessageItemBodyProps {
     className?: string | Array<string>;
-    message: SendBird.FileMessage;
+    message: FileMessage;
     isByMe?: boolean;
     mouseHover?: boolean;
   }
@@ -1322,8 +1408,10 @@ declare module '@sendbird/uikit-react/ui/FileMessageItemBody' {
 }
 
 declare module '@sendbird/uikit-react/ui/FileViewer' {
+  import type { FileMessage } from '@sendbird/chat/message';
+
   interface FileViewerBodyProps {
-    message: SendBird.FileMessage;
+    message: FileMessage;
     isByMe?: boolean;
     onClose?: () => void,
     onDelete?: () => void,
@@ -1435,32 +1523,48 @@ declare module '@sendbird/uikit-react/ui/MentionUserLabel' {
   export default MentionUserLabel;
 }
 
+declare module '@sendbird/uikit-react/ui/MentionLabel' {
+  interface MentionLabelProps {
+    mentionTemplate: string;
+    mentionedUserId: string;
+    isByMe: boolean;
+  }
+  const MentionUserLabel: React.FC<MentionLabelProps>;
+  export default MentionUserLabel;
+}
+
 declare module '@sendbird/uikit-react/ui/MessageContent' {
+  import type { GroupChannel, Member } from '@sendbird/chat/groupChannel';
+  import type { EmojiContainer } from '@sendbird/chat';
+  import type { AdminMessage, FileMessage, UserMessage } from '@sendbird/chat/message';
+  import type SenbirdUIKitGlobal from 'SendbirdUIKitGlobal';
   interface MessageContentProps {
     className?: string | Array<string>;
     userId: string;
-    channel: SendBird.GroupChannel;
-    message: CoreMessageType;
+    channel: GroupChannel;
+    message: AdminMessage | FileMessage | UserMessage;
     disabled?: boolean;
     chainTop?: boolean;
     chainBottom?: boolean;
     useReaction?: boolean;
-    replyType?: ReplyType;
+    replyType?: SenbirdUIKitGlobal.ReplyType;
     nicknamesMap?: Map<string, string>;
-    emojiContainer?: SendBird.EmojiContainer;
+    emojiContainer?: EmojiContainer;
     scrollToMessage?: (createdAt: number, messageId: number) => void;
     showEdit?: (bool: boolean) => void;
     showRemove?: (bool: boolean) => void;
     showFileViewer?: (bool: boolean) => void;
-    resendMessage?: (message: SendBird.UserMessage | SendBird.FileMessage) => void;
-    toggleReaction?: (message: SendBird.UserMessage | SendBird.FileMessage, reactionKey: string, isReacted: boolean) => void;
-    setQuoteMessage?: (message: SendBird.UserMessage | SendBird.FileMessage) => void;
+    resendMessage?: (message: UserMessage | FileMessage) => void;
+    toggleReaction?: (message: UserMessage | FileMessage, reactionKey: string, isReacted: boolean) => void;
+    setQuoteMessage?: (message: UserMessage | FileMessage) => void;
   }
   const MessageContent: React.FC<MessageContentProps>;
   export default MessageContent;
 }
 
 declare module '@sendbird/uikit-react/ui/MessageInput' {
+  import type { User } from '@sendbird/chat';
+
   interface MessageInputProps {
     className?: string[],
     isEdit?: boolean,
@@ -1475,8 +1579,8 @@ declare module '@sendbird/uikit-react/ui/MessageInput' {
     onCancelEdit?: () => void,
     onStartTyping?: () => void,
     channelUrl: string,
-    mentionSelectedUser?: Array<SendBird.User>,
-    onUserMentioned?: (user: SendBird.User) => void,
+    mentionSelectedUser?: Array<User>,
+    onUserMentioned?: (user: User) => void,
     onMentionStringChange?: (str: string) => void,
     onMentionedUserIdsUpdated?: (userIds: Array<string>) => void,
     onKeyUp?: (e: React.KeyboardEvent<HTMLDivElement>) => void,
@@ -1487,17 +1591,22 @@ declare module '@sendbird/uikit-react/ui/MessageInput' {
 }
 
 declare module '@sendbird/uikit-react/ui/MessageItemMenu' {
+  import type { GroupChannel } from '@sendbird/chat/groupChannel';
+  import type { FileMessage, UserMessage } from '@sendbird/chat/message';
+  import type { OpenChannel } from '@sendbird/chat/openChannel';
+  import type SenbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+
   interface MessageItemMenuProps {
     className?: string | Array<string>;
-    message: SendBird.UserMessage | SendBird.FileMessage;
-    channel: SendBird.GroupChannel | SendBird.OpenChannel;
+    message: UserMessage | FileMessage;
+    channel: GroupChannel | OpenChannel;
     isByMe?: boolean;
     disabled?: boolean;
-    replyType?: ReplyType;
+    replyType?: SenbirdUIKitGlobal.ReplyType;
     showEdit?: (bool: boolean) => void;
     showRemove?: (bool: boolean) => void;
-    resendMessage?: (message: SendBird.UserMessage | SendBird.FileMessage) => void;
-    setQuoteMessage?: (message: SendBird.UserMessage | SendBird.FileMessage) => void;
+    resendMessage?: (message: UserMessage | FileMessage) => void;
+    setQuoteMessage?: (message: UserMessage | FileMessage) => void;
     setSupposedHover?: (bool: boolean) => void;
   }
   const MessageItemMenu: React.FC<MessageItemMenuProps>;
@@ -1506,13 +1615,16 @@ declare module '@sendbird/uikit-react/ui/MessageItemMenu' {
 }
 
 declare module '@sendbird/uikit-react/ui/MessageItemReactionMenu' {
+  import type { EmojiContainer } from '@sendbird/chat';
+  import type { FileMessage, UserMessage } from '@sendbird/chat/message';
+
   interface MessageItemReactionMenuProps {
     className?: string | Array<string>;
-    message: SendBird.UserMessage | SendBird.FileMessage;
+    message: UserMessage | FileMessage;
     userId: string;
     spaceFromTrigger?: Record<string, unknown>;
-    emojiContainer?: SendBird.EmojiContainer;
-    toggleReaction?: (message: SendBird.UserMessage | SendBird.FileMessage, reactionKey: string, isReacted: boolean) => void;
+    emojiContainer?: EmojiContainer;
+    toggleReaction?: (message: UserMessage | FileMessage, reactionKey: string, isReacted: boolean) => void;
     setSupposedHover?: (bool: boolean) => void;
   }
   const MessageItemReactionMenu: React.FC<MessageItemReactionMenuProps>;
@@ -1520,11 +1632,13 @@ declare module '@sendbird/uikit-react/ui/MessageItemReactionMenu' {
 }
 
 declare module '@sendbird/uikit-react/ui/MessageSearchFileItem' {
+  import type SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+
   interface MessageSearchFileItemProps {
     className?: string | Array<string>;
-    message: ClientFileMessage;
+    message: SendbirdUIKitGlobal.ClientFileMessage;
     selected?: boolean;
-    onClick?: (message: ClientFileMessage) => void;
+    onClick?: (message: SendbirdUIKitGlobal.ClientFileMessage) => void;
   }
   const MessageSearchFileItem: React.FC<MessageSearchFileItemProps>;
   export default MessageSearchFileItem;
@@ -1532,11 +1646,13 @@ declare module '@sendbird/uikit-react/ui/MessageSearchFileItem' {
 }
 
 declare module '@sendbird/uikit-react/ui/MessageSearchItem' {
+  import type SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
+
   interface MessageSearchItemProps {
     className?: string | Array<string>;
-    message: ClientUserMessage;
+    message: SendbirdUIKitGlobal.ClientUserMessage;
     selected?: boolean;
-    onClick?: (message: ClientMessage) => void;
+    onClick?: (message: SendbirdUIKitGlobal.ClientMessage) => void;
     }
   const MessageSearchItem: React.FC<MessageSearchItemProps>;
   export default MessageSearchItem;
@@ -1544,10 +1660,13 @@ declare module '@sendbird/uikit-react/ui/MessageSearchItem' {
 }
 
 declare module '@sendbird/uikit-react/ui/MessageStatus' {
+  import type { UserMessage, FileMessage } from '@sendbird/chat/message';
+  import type { GroupChannel } from '@sendbird/chat/groupChannel';
+
   interface MessageStatusProps {
     className?: string;
-    message: SendBird.UserMessage | SendBird.FileMessage;
-    channel: SendBird.GroupChannel;
+    message: UserMessage | FileMessage;
+    channel: GroupChannel;
   }
   const MessageStatus: React.FC<MessageStatusProps>;
   export default MessageStatus;
@@ -1569,9 +1688,10 @@ declare module '@sendbird/uikit-react/ui/Modal' {
 }
 
 declare module '@sendbird/uikit-react/ui/OGMessageItemBody' {
+  import type { UserMessage } from '@sendbird/chat/message';
   interface OGMessageItemBodyProps {
     className?: string | Array<string>;
-    message: SendBird.UserMessage;
+    message: UserMessage;
     isByMe?: boolean;
     mouseHover?: boolean;
   }
@@ -1580,9 +1700,10 @@ declare module '@sendbird/uikit-react/ui/OGMessageItemBody' {
 }
 
 declare module '@sendbird/uikit-react/ui/OpenChannelAdminMessage' {
+  import type { AdminMessage } from '@sendbird/chat/message';
   interface OpenChannelAdminMessageProps {
     className?: string | Array<string>;
-    message: ClientAdminMessage;
+    message: AdminMessage;
   }
   const OpenChannelAdminMessage: React.FC<OpenChannelAdminMessageProps>;
   export default OpenChannelAdminMessage;
@@ -1601,28 +1722,30 @@ declare module '@sendbird/uikit-react/ui/OpenChannelConversationHeader' {
 }
 
 declare module '@sendbird/uikit-react/ui/OpenChannelFileMessage' {
+  import type SenbirdUIKitGlobal from 'SendbirdUIKitGlobal';
   interface OpenChannelFileMessageProps {
     className?: string | Array<string>;
-    message: ClientFileMessage;
+    message: SenbirdUIKitGlobal.ClientFileMessage;
     userId: string;
     disabled?: boolean;
     chainTop?: boolean;
     chainBottom?: boolean;
     showRemove(bool: boolean): void;
-    resendMessage(message: ClientFileMessage): void;
+    resendMessage(message: SenbirdUIKitGlobal.ClientFileMessage): void;
   }
   const OpenChannelFileMessage: React.FC<OpenChannelFileMessageProps>;
   export default OpenChannelFileMessage;
 }
 
 declare module '@sendbird/uikit-react/ui/OpenChannelOGMessage' {
+  import type SenbirdUIKitGlobal from 'SendbirdUIKitGlobal';
   interface OOpenChannelOGMessageProps {
-    message: ClientUserMessage;
+    message: SenbirdUIKitGlobal.ClientUserMessage;
     className?: string | Array<string>;
     disabled?: boolean;
     showEdit(bool: boolean): void;
     showRemove(bool: boolean): void;
-    resendMessage(message: ClientUserMessage): void;
+    resendMessage(message: SenbirdUIKitGlobal.ClientUserMessage): void;
     chainTop?: boolean;
     chainBottom?: boolean;
     userId: string;
@@ -1632,30 +1755,32 @@ declare module '@sendbird/uikit-react/ui/OpenChannelOGMessage' {
 }
 
 declare module '@sendbird/uikit-react/ui/OpenChannelThumbnailMessage' {
+  import type SenbirdUIKitGlobal from 'SendbirdUIKitGlobal';
   interface OpenChannelThumbnailMessageProps {
     className?: string | Array<string>;
-    message: ClientFileMessage;
+    message: SenbirdUIKitGlobal.ClientFileMessage;
     disabled: boolean;
     userId: string;
     chainTop: boolean;
     chainBottom: boolean;
     onClick(bool: boolean): void,
     showRemove(bool: boolean): void,
-    resendMessage(message: ClientFileMessage): void;
+    resendMessage(message: SenbirdUIKitGlobal.ClientFileMessage): void;
   }
   const OpenChannelThumbnailMessage: React.FC<OpenChannelThumbnailMessageProps>;
   export default OpenChannelThumbnailMessage;
 }
 
 declare module '@sendbird/uikit-react/ui/OpenChannelUserMessage' {
+  import type SenbirdUIKitGlobal from 'SendbirdUIKitGlobal';
   interface OpenChannelUserMessageProps {
     className?: string | Array<string>;
-    message: ClientUserMessage;
+    message: SenbirdUIKitGlobal.ClientUserMessage;
     userId: string;
     disabled?: boolean;
     showEdit(bool: boolean): void;
     showRemove(bool: boolean): void;
-    resendMessage(message: ClientUserMessage): void;
+    resendMessage(message: SenbirdUIKitGlobal.ClientUserMessage): void;
     chainTop?: boolean;
     chainBottom?: boolean;
   }
@@ -1675,8 +1800,9 @@ declare module '@sendbird/uikit-react/ui/PlaceHolder' {
 }
 
 declare module '@sendbird/uikit-react/ui/QuoteMessage' {
+  import type { UserMessage, FileMessage } from '@sendbird/chat/message';
   interface QuoteMessageProps {
-    message?: SendBird.UserMessage | SendBird.FileMessage;
+    message?: UserMessage | FileMessage;
     userId?: string;
     isByMe?: boolean;
     className?: string | Array<string>;
@@ -1687,10 +1813,11 @@ declare module '@sendbird/uikit-react/ui/QuoteMessage' {
 }
 
 declare module '@sendbird/uikit-react/ui/QuoteMessageInput' {
+  import type SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
   interface QuoteMessageInputProps {
     className?: string | Array<string>;
-    replyingMessage: CoreMessageType;
-    onClose?: (message: CoreMessageType) => void;
+    replyingMessage: SendbirdUIKitGlobal.CoreMessageType;
+    onClose?: (message: SendbirdUIKitGlobal.CoreMessageType) => void;
   }
   const QuoteMessageInput: React.FC<QuoteMessageInputProps>;
   export default QuoteMessageInput;
@@ -1748,9 +1875,10 @@ declare module '@sendbird/uikit-react/ui/TextButton' {
 }
 
 declare module '@sendbird/uikit-react/ui/TextMessageItemBody' {
+  import type { UserMessage } from '@sendbird/chat/message';
   interface TextMessageItemBodyProps {
     className?: string | Array<string>;
-    message: SendBird.UserMessage;
+    message: UserMessage;
     isByMe?: boolean;
     mouseHover?: boolean;
   }
@@ -1759,9 +1887,10 @@ declare module '@sendbird/uikit-react/ui/TextMessageItemBody' {
 }
 
 declare module '@sendbird/uikit-react/ui/ThumbnailMessageItemBody' {
+  import type { FileMessage } from '@sendbird/chat/message';
   interface ThumbnailMessageItemBodyProps {
     className?: string | Array<string>;
-    message: SendBird.FileMessage;
+    message: FileMessage;
     isByMe?: boolean;
     mouseHover?: boolean;
     showFileViewer?: (bool: boolean) => void;
@@ -1790,10 +1919,11 @@ declare module '@sendbird/uikit-react/ui/TooltipWrapper' {
 }
 
 declare module '@sendbird/uikit-react/ui/UnknownMessageItemBody' {
+  import type SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
   interface UnknownMessageItemBodyProps {
     className?: string | Array<string>;
     isByMe?: boolean;
-    message: CoreMessageType;
+    message: SendbirdUIKitGlobal.CoreMessageType;
     mouseHover?: boolean;
   }
   const UnknownMessageItemBody: React.FC<UnknownMessageItemBodyProps>;
@@ -1801,9 +1931,10 @@ declare module '@sendbird/uikit-react/ui/UnknownMessageItemBody' {
 }
 
 declare module '@sendbird/uikit-react/ui/UserListItem' {
+  import type  { User } from '@sendbird/chat';
   interface UserListItemProps {
     className?: string | Array<string>;
-    user?: SendBird.User,
+    user?: User,
     checkBox?: boolean,
     disableMessaging?: boolean,
     currentUser?: string,
@@ -1816,13 +1947,17 @@ declare module '@sendbird/uikit-react/ui/UserListItem' {
 }
 
 declare module '@sendbird/uikit-react/ui/UserProfile' {
+  import type  { User } from '@sendbird/chat';
+  import type  { SendbirdGroupChat, GroupChannelCreateParams, GroupChannel } from '@sendbird/chat/groupChannel';
+  import type  { SendbirdOpenChat } from '@sendbird/chat/openChannel';
+  import type SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
   interface UserProfileProps {
-    user: SendBird.User;
+    user: User;
     currentUserId?: string;
-    sdk?: SendBird.SendBirdInstance;
-    logger?: Logger;
+    sdk?: SendbirdGroupChat | SendbirdOpenChat;
+    logger?: SendbirdUIKitGlobal.Logger;
     disableMessaging?: boolean;
-    createChannel?(params: SendBird.GroupChannelParams): Promise<SendBird.GroupChannel>;
+    createChannel?(params: GroupChannelCreateParams): Promise<GroupChannel>;
     onSuccess?(): void;
   }
   const UserProfile: React.FC<UserProfileProps>;