/**
 * Type Definitions for SendbirdUIKit 3.0.2
 * homepage: https://sendbird.com/
 * git: https://github.com/sendbird/sendbird-uikit-react
 */
 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;
    customApiHost?: string,
    customWebSocketHost?: 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;
  }

  export type Logger = {
    info?(title?: unknown, description?: unknown): void;
    error?(title?: unknown, description?: unknown): void;
    warning?(title?: unknown, description?: unknown): void;
  }

  export type MessageHandler = (message: UserMessage | FileMessage) => void;

  export interface UikitMessageHandler {
    onPending: (handler: MessageHandler) => UikitMessageHandler;
    onFailed: (handler: MessageHandler) => UikitMessageHandler;
    onSucceeded: (handler: MessageHandler) => UikitMessageHandler;
  }

  export interface UserListQuery {
    hasNext?: boolean;
    next(): Promise<Array<User>>;
  }

  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;
    customApiHost?: string,
    customWebSocketHost?: 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 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,
    },
  }

  export type UserDispatcherParams = {
    type: string,
    payload: User;
  };

  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 ChannelListProviderProps, 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;
  };

  /**
   * Channel
   */
  export interface RenderMessageProps {
    message: EveryMessage;
    chainTop: boolean;
    chainBottom: boolean;
  }

  export type ChannelQueries = {
    messageListParams?: MessageListParams;
  };

  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;
  };

  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;
  };

  export type MessageListProps = {
    renderMessage?: (props: RenderMessageProps) => React.ReactNode;
    renderPlaceholderEmpty?: () => React.ReactNode;
    renderCustomSeperator?: () => 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>;
  };

  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;
  };

  export interface UnreadCountProps {
    count: number;
    time: string;
    onClick(): void;
  }

  export interface ChannelProps extends ChannelContextProps, ChannelUIProps {
  }

  export interface RemoveMessageProps {
    onCancel: () => void;
    message: EveryMessage;
  }

  /**
   * 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>,
    },
  };

  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;
  }

  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>;
  }

  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;
  }

  export interface OpenChannelUIProps {
    renderMessage?: (props: RenderMessageProps) => React.ReactNode;
    renderHeader?: () => React.ReactNode;
    renderInput?: () => React.ReactNode;
    renderPlaceHolderEmptyList?: () => React.ReactNode;
    renderPlaceHolderError?: () => React.ReactNode;
    renderPlaceHolderLoading?: () => React.ReactNode;
  }

  export interface OpenChannelProps extends OpenChannelProviderProps, OpenChannelUIProps {
  }

  export type OpenchannelMessageListProps = {
    renderMessage?: (props: RenderMessageProps) => React.ReactNode;
    renderPlaceHolderEmptyList?: () => React.ReactNode;
  }

  export type OpenChannelMessageProps = {
    renderMessage?: (props: RenderMessageProps) => React.ReactNode;
    message: EveryMessage;
    chainTop?: boolean;
    chainBottom?: boolean;
    hasSeparator?: boolean;
    editDisabled?: boolean;
  };

  /**
   * 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;
  }

  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 {
    onCloseClick?: () => void;
  }

  /**
   * 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'  {
  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: SendbirdUIKitGlobal.SendBirdState) => unknown
  ): (props: unknown) => React.ReactNode;
  export function useSendbirdStateContext(): SendbirdUIKitGlobal.SendBirdState;
}

declare module '@sendbird/uikit-react/App' {
  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
  const App: React.FunctionComponent<SendbirdUIKitGlobal.AppProps>
  export default App;
}

declare module '@sendbird/uikit-react/SendbirdProvider' {
  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
  const SendbirdProvider: React.FunctionComponent<SendbirdUIKitGlobal.SendbirdProviderProps>;
  export default SendbirdProvider;
}

declare module '@sendbird/uikit-react/sendbirdSelectors' {
  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
  const sendBirdSelectors: SendbirdUIKitGlobal.sendbirdSelectorsInterface;
  export default sendBirdSelectors;
}

declare module '@sendbird/uikit-react/useSendbirdStateContext' {
  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
  function useSendbirdStateContext(): SendbirdUIKitGlobal.SendBirdState;
  export default useSendbirdStateContext;
}

declare module '@sendbird/uikit-react/withSendbird' {
  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
  function withSendbird(
    ChildComp: React.Component | React.ElementType,
    mapStoreToProps?: (store: SendbirdUIKitGlobal.SendBirdState) => unknown
  ): (props: unknown) => React.ReactNode;
  export default withSendbird;
}

/** ChannelList */
declare module '@sendbird/uikit-react/ChannelList' {
  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
  const ChannelList: React.FunctionComponent<SendbirdUIKitGlobal.ChannelListProps>;
  export default ChannelList;
}

declare module '@sendbird/uikit-react/ChannelList/context' {
  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.FunctionComponent;
  export default AddChannel;
}

declare module '@sendbird/uikit-react/ChannelList/components/ChannelListUI' {
  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
  const ChannelListUI: React.FunctionComponent<SendbirdUIKitGlobal.ChannelListUIProps>;
  export default ChannelListUI;
}

declare module '@sendbird/uikit-react/ChannelList/components/ChannelListHeader' {
  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
  const ChannelListHeader: React.FunctionComponent<SendbirdUIKitGlobal.ChannelListHeaderInterface>;
  export default ChannelListHeader;
}

declare module '@sendbird/uikit-react/ChannelList/components/ChannelPreview' {
  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
  const ChannelPreview: React.FunctionComponent<SendbirdUIKitGlobal.ChannelPreviewInterface>;
  export default ChannelPreview;
}

declare module '@sendbird/uikit-react/ChannelList/components/ChannelPreviewAction' {
  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
  const ChannelPreviewAction: React.FunctionComponent<SendbirdUIKitGlobal.ChannelPreviewActionInterface>;
  export default ChannelPreviewAction;
}

declare module '@sendbird/uikit-react/ChannelSettings' {
  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
  const ChannelSettings: React.FunctionComponent<SendbirdUIKitGlobal.ChannelSettingsProps>;
  export default ChannelSettings;
}

declare module '@sendbird/uikit-react/ChannelSettings/context' {
  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
  export const ChannelSettingsProvider: React.FC<SendbirdUIKitGlobal.ChannelSettingsContextProps>;
  export const useChannelSettingsContext: () => SendbirdUIKitGlobal.ChannelSettingsProviderInterface;
}

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.FunctionComponent;
  export default ChannelProfile;
}

declare module '@sendbird/uikit-react/ChannelSettings/components/ChannelSettingsUI' {
  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
  const ChannelSettingsUI: React.FC<SendbirdUIKitGlobal.ChannelSettingsUIProps>;
  export default ChannelSettingsUI;
}

declare module '@sendbird/uikit-react/ChannelSettings/components/EditDetailsModal' {
  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
  const EditDetailsModal: React.FC<SendbirdUIKitGlobal.ChannelSettingsEditDetailsProps>;
  export default EditDetailsModal;
}

declare module '@sendbird/uikit-react/ChannelSettings/components/LeaveChannel' {
  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
  const LeaveChannel: React.FC<SendbirdUIKitGlobal.LeaveChannelProps>;
  export default LeaveChannel;
}

declare module '@sendbird/uikit-react/ChannelSettings/components/UserListItem' {
  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
  const UserListItem: React.FC<SendbirdUIKitGlobal.UserListItemProps>;
  export default UserListItem;
}

declare module '@sendbird/uikit-react/ChannelSettings/components/UserPanel' {
  const UserPanel: React.FunctionComponent;
  export default UserPanel;
}

/**
 * Channel
 */
declare module '@sendbird/uikit-react/Channel' {
  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
  const Channel: React.FC<SendbirdUIKitGlobal.ChannelProps>;
  export default Channel;
}

declare module '@sendbird/uikit-react/Channel/context' {
  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.FunctionComponent;
  export default ChannelHeader;
}

declare module '@sendbird/uikit-react/Channel/components/ChannelUI' {
  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
  const ChannelUI: React.FunctionComponent<SendbirdUIKitGlobal.ChannelUIProps>;
  export default ChannelUI;
}

declare module '@sendbird/uikit-react/Channel/components/FileViewer' {
  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
  const FileViewer: React.FunctionComponent<SendbirdUIKitGlobal.FileViewerProps>;
  export default FileViewer;
}

declare module '@sendbird/uikit-react/Channel/components/FrozenNotification' {
  const FrozenNotification: React.FunctionComponent;
  export default FrozenNotification;
}

declare module '@sendbird/uikit-react/Channel/components/Message' {
  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
  const Message: React.FunctionComponent<SendbirdUIKitGlobal.MessageUIProps>;
  export default Message;
}

declare module '@sendbird/uikit-react/Channel/components/MessageInput' {
  const MessageInput: React.FunctionComponent;
  export default MessageInput;
}

declare module '@sendbird/uikit-react/Channel/components/MessageList' {
  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
  const MessageList: React.FunctionComponent<SendbirdUIKitGlobal.MessageListProps>;
  export default MessageList;
}

declare module '@sendbird/uikit-react/Channel/components/SuggestedMentionList' {
  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
  const SuggestedMentionList: React.FunctionComponent<SendbirdUIKitGlobal.SuggestedMentionListProps>;
  export default SuggestedMentionList;
}

declare module '@sendbird/uikit-react/Channel/components/RemoveMessageModal' {
  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
  const RemoveMessageModal: React.FunctionComponent<SendbirdUIKitGlobal.RemoveMessageProps>;
  export default RemoveMessageModal;
}

declare module '@sendbird/uikit-react/Channel/components/TypingIndicator' {
  const TypingIndicator: React.FunctionComponent;
  export default TypingIndicator;
}

declare module '@sendbird/uikit-react/Channel/components/UnreadCount' {
  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
  const UnreadCount: React.FunctionComponent<SendbirdUIKitGlobal.UnreadCountProps>;
  export default UnreadCount;
}

/**
 * OpenChannel
 */
declare module '@sendbird/uikit-react/OpenChannel' {
  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
  const OpenChannel: React.FC<SendbirdUIKitGlobal.OpenChannelProps>;
  export default OpenChannel;
}

declare module '@sendbird/uikit-react/OpenChannel/context' {
  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.FunctionComponent;
  export default FrozenChannelNotification;
}

declare module '@sendbird/uikit-react/OpenChannel/components/OpenChannelHeader' {
  const OpenChannelHeader: React.FunctionComponent;
  export default OpenChannelHeader;
}

declare module '@sendbird/uikit-react/OpenChannel/components/OpenChannelInput' {
  const OpenChannelInput: React.FunctionComponent;
  export default OpenChannelInput;

}

declare module '@sendbird/uikit-react/OpenChannel/components/OpenChannelMessage' {
  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
  const OpenChannelMessage: React.FC<SendbirdUIKitGlobal.OpenChannelMessageProps>;
  export default OpenChannelMessage;
}

declare module '@sendbird/uikit-react/OpenChannel/components/OpenChannelMessageList' {
  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
  const OpenChannelMessageList: React.FC<SendbirdUIKitGlobal.OpenchannelMessageListProps>;
  export default OpenChannelMessageList;
}

declare module '@sendbird/uikit-react/OpenChannel/components/OpenChannelUI' {
  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
  const OpenChannelUI: React.FC<SendbirdUIKitGlobal.OpenChannelUIProps>;
  export default OpenChannelUI;
}

/**
 * OpenChannelSettings
 */
declare module '@sendbird/uikit-react/OpenChannelSettings' {
  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
  const OpenChannelSettings: React.FC<SendbirdUIKitGlobal.OpenChannelSettingsProps>;
  export default OpenChannelSettings;
}

declare module '@sendbird/uikit-react/OpenChannelSettings/context' {
  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
  export const useOpenChannelSettingsContext: () => SendbirdUIKitGlobal.OpenChannelSettingsContextType;
  export const OpenChannelSettingsProvider: React.FC<SendbirdUIKitGlobal.OpenChannelSettingsContextProps>;
}

declare module '@sendbird/uikit-react/OpenChannelSettings/components/EditDetailsModal' {
  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
  const EditDetailsModal: React.FC<SendbirdUIKitGlobal.OpenChannelEditDetailsProps>;
  export default EditDetailsModal;
}

declare module '@sendbird/uikit-react/OpenChannelSettings/components/OpenChannelSettingsUI' {
  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
  const OpenChannelSettingsUI: React.FC<SendbirdUIKitGlobal.OpenChannelSettingsUIProps>;
  export default OpenChannelSettingsUI;
}

declare module '@sendbird/uikit-react/OpenChannelSettings/components/OperatorUI' {
  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
  const OperatorUI: React.FC<SendbirdUIKitGlobal.OperatorUIProps>;
  export default OperatorUI;
}

declare module '@sendbird/uikit-react/OpenChannelSettings/components/ParticipantUI' {
  const ParticipantUI: React.FunctionComponent;
  export default ParticipantUI;
}

/**
 * MessageSearch
 */
declare module '@sendbird/uikit-react/MessageSearch' {
  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
  const MessageSearch: React.FC<SendbirdUIKitGlobal.MessageSearchProps>;
  export default MessageSearch;
}

declare module '@sendbird/uikit-react/MessageSearch/context' {
  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
  export const useMessageSearchContext: () => SendbirdUIKitGlobal.MessageSearchProviderInterface;
  export const MessageSearchProvider: React.FC<SendbirdUIKitGlobal.MessageSearchProviderProps>;
}

declare module '@sendbird/uikit-react/MessageSearch/components/MessageSearchUI' {
  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
  const MessageSearchUI: React.FC<SendbirdUIKitGlobal.MessageSearchUIProps>;
  export default MessageSearchUI;
}

/**
 * CreateChannel
 */
declare module '@sendbird/uikit-react/CreateChannel' {
  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
  const CreateChannel: React.FC<SendbirdUIKitGlobal.CreateChannelProps>;
  export default CreateChannel;
}

declare module '@sendbird/uikit-react/CreateChannel/context' {
  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
  export const CreateChannelProvider: React.FC<SendbirdUIKitGlobal.CreateChannelProviderProps>;
  export function useCreateChannelContext (): SendbirdUIKitGlobal.CreateChannelContextInterface;
}

declare module '@sendbird/uikit-react/CreateChannel/components/CreateChannelUI' {
  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
  const CreateChannelUI: React.FC<SendbirdUIKitGlobal.CreateChannelUIProps>;
  export default CreateChannelUI;
}

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' {
  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
  const SelectChannelType: React.FC<SendbirdUIKitGlobal.SelectChannelTypeProps>;
  export default SelectChannelType;
}

/**
 * EditUserProfile
 */
declare module '@sendbird/uikit-react/EditUserProfile' {
  import SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
  const EditProfile: React.FC<SendbirdUIKitGlobal.EditUserProfileProps>;
  export default EditProfile;
}

declare module '@sendbird/uikit-react/EditUserProfile/context' {
  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.FunctionComponent;
  export default EditUserProfileUI;
}

declare module '@sendbird/uikit-react/ui/Accordion' {
  interface AccordionProps {
    className?: string | Array<string>;
    id: string;
    renderTitle(): React.ReactElement;
    renderContent(): React.ReactElement;
    renderFooter?(): React.ReactElement;
  }
  const Accordion: React.FC<AccordionProps>;
  export default Accordion;
}

declare module '@sendbird/uikit-react/ui/AccordionGroup' {
  interface AccordionTypeProps {
    children: Array<React.ReactElement> | React.ReactElement;
    defaultOpened?: string;
    className?: string;
  }
  const AccordionGroup: React.FC<AccordionTypeProps>;
  export default AccordionGroup;
}

declare module '@sendbird/uikit-react/ui/AdminMessage' {
  import type { AdminMessage } from '@sendbird/chat/message';
  interface AdminMessageProps {
    className?: string,
    message: AdminMessage,
  }
  const AdminMessageComponent: React.FC<AdminMessageProps>;
  export default AdminMessageComponent;
}

declare module '@sendbird/uikit-react/ui/Avatar' {
  interface AvatarProps {
    className?: string | Array<string>,
    height?: string | number,
    width?: string | number,
    src?: string | Array<string>,
    alt?: string,
    onClick?(): void,
    customDefaultComponent?({ width, height }: { width: number | string, height: number | string }): React.ReactElement;
  }
  const Avatar: React.FC<AvatarProps>;
  export default Avatar;
}

declare module '@sendbird/uikit-react/ui/MutedAvatarOverlay' {
  interface MutedAvatarOverlayProps {
    height?: number;
    width?: number;
  }
  const MutedAvatarOverlay: React.FC<MutedAvatarOverlayProps>;
  export default MutedAvatarOverlay;
}

declare module '@sendbird/uikit-react/ui/Badge' {
  interface BadgeProps {
    count: number,
    maxLevel?: number,
    className?: string | string [],
  }
  const Badge: React.FC<BadgeProps>;
  export default Badge;
}

declare module '@sendbird/uikit-react/ui/Button' {
  interface ButtonProps {
    className?: string | string[];
    type?: 'PRIMARY' | 'SECONDARY' | 'DANGER' | 'DISABLED';
    size?: 'BIG' | 'SMALL';
    children?: string | React.ReactElement;
    disabled?: boolean;
    onClick?: () => void;
  }
  const Button: React.FC<ButtonProps>;
  export default Button;
}

declare module '@sendbird/uikit-react/ui/ChannelAvatar' {
  import type { GroupChannel } from '@sendbird/chat/groupChannel'
  interface ChannelAvatarProps {
    channel: GroupChannel;
    userId: string;
    theme: string;
    width?: number,
    height?: number,
  }
  const ChannelAvatar: React.FC<ChannelAvatarProps>;
  export default ChannelAvatar;
}

declare module '@sendbird/uikit-react/ui/OpenChannelAvatar' {
  import type { OpenChannel } from '@sendbird/chat/OpenChannel'
  interface OpenChannelAvatarProps {
    channel: OpenChannel;
    theme: string;
    height?: number;
    width?: number;
  }
  const OpenChannelAvatar: React.FC<OpenChannelAvatarProps>;
  export default OpenChannelAvatar;
}

declare module '@sendbird/uikit-react/ui/ChannelPreview' {
  import type { User } from '@sendbird/chat';
  import type { GroupChannel } from '@sendbird/chat/groupChannel';
  interface ChannelPreviewProps {
    channel?: GroupChannel,
    currentUser?: User,
    isActive?: boolean,
    ChannelAction: React.ReactElement,
    theme?: 'light' | 'dark',
    onClick?: () => void,
    tabIndex?: number,
  }
  const ChannelPreview: React.FC<ChannelPreviewProps>;
  export default ChannelPreview;
}

declare module '@sendbird/uikit-react/ui/ChatHeader' {
  import type { User } from '@sendbird/chat';
  import type { GroupChannel } from '@sendbird/chat/groupChannel';
  interface ChatHeaderProps {
    currentGroupChannel?: GroupChannel;
    currentUser?: User;
    title?: string;
    subTitle?: string;
    isMuted?: boolean;
    theme?: 'light' | 'dark';
    showSearchIcon?: false;
    onSearchClick?: () => void;
    onActionClick?: () => void;
  }
  const ChatHeader: React.FC<ChatHeaderProps>;
  export default ChatHeader;
}

declare module '@sendbird/uikit-react/ui/Checkbox' {
  interface CheckboxProps {
    id?: string,
    checked?: boolean,
    onChange?: () => void,
  }
  const Checkbox: React.FC<CheckboxProps>;
  export default Checkbox;
}

declare module '@sendbird/uikit-react/ui/ConnectionStatus' {
  const ConnectionStatus: React.FunctionComponent;
  export default ConnectionStatus;
}

declare module '@sendbird/uikit-react/ui/ContextMenu' {
  interface ContextMenuProps {
    menuTrigger: () => void;
    menuItems: () => void;
  }
  const ContextMenu: React.FC<ContextMenuProps>;
  export default ContextMenu;
}

declare module '@sendbird/uikit-react/ui/DateSeparator' {
  enum COLORS {
    ONBACKGROUND_1 ='ONBACKGROUND_1',
    ONBACKGROUND_2 ='ONBACKGROUND_2',
    ONBACKGROUND_3 ='ONBACKGROUND_3',
    ONBACKGROUND_4 ='ONBACKGROUND_4',
    ONCONTENT_1 ='ONCONTENT_1',
    ONCONTENT_2 ='ONCONTENT_2',
    PRIMARY ='PRIMARY',
    ERROR ='ERROR',
    SECONDARY_3 ='SECONDARY_3',
  }
  interface DateSeparatorProps {
    className?: string | string[];
    children?: string | React.ReactElement,
    separatorColor: COLORS,
  }
  const DateSeparator: React.FC<DateSeparatorProps>;
  export default DateSeparator;
}

declare module '@sendbird/uikit-react/ui/Dropdown' {
  interface DropdownProps {
    renderButton: () => React.ReactElement,
    renderItems: () => React.ReactElement,
  }
  const Dropdown: React.FC<DropdownProps>;
  export default 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<EmojiCategory>;
    emojiHash: string;
  }
  interface EmojiReactionsProps {
    className?: string | Array<string>;
    userId: string;
    message: UserMessage | FileMessage;
    emojiContainer: EmojiContainer;
    memberNicknamesMap: Map<string, string>;
    spaceFromTrigger?: Record<string, unknown>;
    isByMe?: boolean;
    toggleReaction?: (message: UserMessage | FileMessage, key: string, byMe: boolean) => void;
  }
  const EmojiReactions: React.FC<EmojiReactionsProps>;
  export default EmojiReactions;

}

declare module '@sendbird/uikit-react/ui/FileMessageItemBody' {
  import type { FileMessage } from '@sendbird/chat/message';

  interface FileMessageItemBodyProps {
    className?: string | Array<string>;
    message: FileMessage;
    isByMe?: boolean;
    mouseHover?: boolean;
  }
  const FileMessageItemBody: React.FC<FileMessageItemBodyProps>;
  export default FileMessageItemBody;

}

declare module '@sendbird/uikit-react/ui/FileViewer' {
  import type { FileMessage } from '@sendbird/chat/message';

  interface FileViewerBodyProps {
    message: FileMessage;
    isByMe?: boolean;
    onClose?: () => void,
    onDelete?: () => void,
  }
  const FileViewerBody: React.FC<FileViewerBodyProps>;
  export default FileViewerBody;
}

declare module '@sendbird/uikit-react/ui/Icon' {
  interface IconProps {
    className?: string,
    children?: string | React.ReactElement,
    fillColor?: string,
    width?: number,
    height?: number,
    onClick?: () => void,
  }
  const Icon: React.FC<IconProps>;
  export default Icon;
}

declare module '@sendbird/uikit-react/ui/IconButton' {
  interface IconButtonProps {
    className?: string | string[],
    children?: string | React.ReactElement,
    disabled?: boolean,
    width?: number,
    height?: number,
    type: string,
    onClick?: () => void,
    onBlur?: () => void,
  }
  const IconButton: React.FC<IconButtonProps>;
  export default IconButton;
}

declare module '@sendbird/uikit-react/ui/ImageRenderer' {
  interface ImageRendererProps {
    className?: string | string[],
    defaultComponent?: () => React.ReactElement,
    placeHolder?:  () => React.ReactElement,
    alt?: string,
    width?: number,
    height?: number,
    fixedSize?: boolean,
    circle?: boolean,
    onLoad?: () => void,
    onError?: () => void,
  }
  const ImageRenderer: React.FC<ImageRendererProps>;
  export default ImageRenderer;
}

declare module '@sendbird/uikit-react/ui/Input' {
  interface InputProps {
    name: string,
    required?: boolean,
    disabled?: boolean,
    placeHolder?: string,
    value?: string,
  }
  const Input: React.FC<InputProps>;
  export default Input;
}

declare module '@sendbird/uikit-react/ui/Label' {
  interface LabelProps {
    className: string[],
    type: string,
    color: string,
    children: React.ReactElement,
  }
  const Label: React.FC<LabelProps>;
  export default Label;
}

declare module '@sendbird/uikit-react/ui/LinkLabel' {
  interface LinkLabelProps {
    className?: string[],
    src: string,
    type?: string,
    color?: string,
    children: React.ReactElement | string,
  }
  const LinkLabel: React.FC<LinkLabelProps>;
  export default LinkLabel;
}

declare module '@sendbird/uikit-react/ui/Loader' {
  interface LoaderProps {
    className?: string[],
    width?: number,
    height?: number,
    children: React.ReactElement | string,
  }
  const Loader: React.FC<LoaderProps>;
  export default Loader;
}

declare module '@sendbird/uikit-react/ui/MentionUserLabel' {
  interface MentionUserLabelProps {
    className?: string
    children?: string;
    isReverse?: boolean;
    color?: string;
    userId?: string;
  }
  const MentionUserLabel: React.FC<MentionUserLabelProps>;
  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: GroupChannel;
    message: AdminMessage | FileMessage | UserMessage;
    disabled?: boolean;
    chainTop?: boolean;
    chainBottom?: boolean;
    useReaction?: boolean;
    replyType?: SenbirdUIKitGlobal.ReplyType;
    nicknamesMap?: Map<string, string>;
    emojiContainer?: EmojiContainer;
    scrollToMessage?: (createdAt: number, messageId: number) => void;
    showEdit?: (bool: boolean) => void;
    showRemove?: (bool: boolean) => void;
    showFileViewer?: (bool: boolean) => 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,
    isMentionEnabled?: boolean;
    disabled?: boolean,
    value?: string,
    name: string,
    placeholder?: string,
    maxLength?: number,
    onFileUpload?: () => void,
    onSendMessage?: () => void,
    onCancelEdit?: () => void,
    onStartTyping?: () => void,
    channelUrl: string,
    mentionSelectedUser?: Array<User>,
    onUserMentioned?: (user: User) => void,
    onMentionStringChange?: (str: string) => void,
    onMentionedUserIdsUpdated?: (userIds: Array<string>) => void,
    onKeyUp?: (e: React.KeyboardEvent<HTMLDivElement>) => void,
    onKeyDown?: (e: React.KeyboardEvent<HTMLDivElement>) => void,
  }
  const MessageInput: React.FC<MessageInputProps>;
  export default 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: UserMessage | FileMessage;
    channel: GroupChannel | OpenChannel;
    isByMe?: boolean;
    disabled?: boolean;
    replyType?: SenbirdUIKitGlobal.ReplyType;
    showEdit?: (bool: boolean) => void;
    showRemove?: (bool: boolean) => void;
    resendMessage?: (message: UserMessage | FileMessage) => void;
    setQuoteMessage?: (message: UserMessage | FileMessage) => void;
    setSupposedHover?: (bool: boolean) => void;
  }
  const MessageItemMenu: React.FC<MessageItemMenuProps>;
  export default 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: UserMessage | FileMessage;
    userId: string;
    spaceFromTrigger?: Record<string, unknown>;
    emojiContainer?: EmojiContainer;
    toggleReaction?: (message: UserMessage | FileMessage, reactionKey: string, isReacted: boolean) => void;
    setSupposedHover?: (bool: boolean) => void;
  }
  const MessageItemReactionMenu: React.FC<MessageItemReactionMenuProps>;
  export default MessageItemReactionMenu;
}

declare module '@sendbird/uikit-react/ui/MessageSearchFileItem' {
  import type SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';

  interface MessageSearchFileItemProps {
    className?: string | Array<string>;
    message: SendbirdUIKitGlobal.ClientFileMessage;
    selected?: boolean;
    onClick?: (message: SendbirdUIKitGlobal.ClientFileMessage) => void;
  }
  const MessageSearchFileItem: React.FC<MessageSearchFileItemProps>;
  export default MessageSearchFileItem;

}

declare module '@sendbird/uikit-react/ui/MessageSearchItem' {
  import type SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';

  interface MessageSearchItemProps {
    className?: string | Array<string>;
    message: SendbirdUIKitGlobal.ClientUserMessage;
    selected?: boolean;
    onClick?: (message: SendbirdUIKitGlobal.ClientMessage) => void;
    }
  const MessageSearchItem: React.FC<MessageSearchItemProps>;
  export default 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: UserMessage | FileMessage;
    channel: GroupChannel;
  }
  const MessageStatus: React.FC<MessageStatusProps>;
  export default MessageStatus;

}

declare module '@sendbird/uikit-react/ui/Modal' {
  interface ModalProps {
    className?: string[],
    onCancel: () => void,
    onSubmit: () => void,
    hideFooter?: boolean,
    disabled?: boolean,
    type?: string,
    children: React.ReactElement | string,
  }
  const Modal: React.FC<ModalProps>;
  export default Modal;
}

declare module '@sendbird/uikit-react/ui/OGMessageItemBody' {
  import type { UserMessage } from '@sendbird/chat/message';
  interface OGMessageItemBodyProps {
    className?: string | Array<string>;
    message: UserMessage;
    isByMe?: boolean;
    mouseHover?: boolean;
  }
  const OGMessageItemBody: React.FC<OGMessageItemBodyProps>;
  export default OGMessageItemBody;
}

declare module '@sendbird/uikit-react/ui/OpenChannelAdminMessage' {
  import type { AdminMessage } from '@sendbird/chat/message';
  interface OpenChannelAdminMessageProps {
    className?: string | Array<string>;
    message: AdminMessage;
  }
  const OpenChannelAdminMessage: React.FC<OpenChannelAdminMessageProps>;
  export default OpenChannelAdminMessage;
}

declare module '@sendbird/uikit-react/ui/OpenChannelConversationHeader' {
  interface OpenChannelConversationHeaderProps {
    coverImage?: string;
    title?: string;
    subTitle?: string;
    amIOperator?: boolean;
    onActionClick?(): void;
  }
  const OpenChannelConversationHeader: React.FC<OpenChannelConversationHeaderProps>;
  export default OpenChannelConversationHeader;
}

declare module '@sendbird/uikit-react/ui/OpenChannelFileMessage' {
  import type SenbirdUIKitGlobal from 'SendbirdUIKitGlobal';
  interface OpenChannelFileMessageProps {
    className?: string | Array<string>;
    message: SenbirdUIKitGlobal.ClientFileMessage;
    userId: string;
    disabled?: boolean;
    chainTop?: boolean;
    chainBottom?: boolean;
    showRemove(bool: boolean): 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: SenbirdUIKitGlobal.ClientUserMessage;
    className?: string | Array<string>;
    disabled?: boolean;
    showEdit(bool: boolean): void;
    showRemove(bool: boolean): void;
    resendMessage(message: SenbirdUIKitGlobal.ClientUserMessage): void;
    chainTop?: boolean;
    chainBottom?: boolean;
    userId: string;
  }
  const OOpenChannelOGMessage: React.FC<OOpenChannelOGMessageProps>;
  export default OOpenChannelOGMessage;
}

declare module '@sendbird/uikit-react/ui/OpenChannelThumbnailMessage' {
  import type SenbirdUIKitGlobal from 'SendbirdUIKitGlobal';
  interface OpenChannelThumbnailMessageProps {
    className?: string | Array<string>;
    message: SenbirdUIKitGlobal.ClientFileMessage;
    disabled: boolean;
    userId: string;
    chainTop: boolean;
    chainBottom: boolean;
    onClick(bool: boolean): void,
    showRemove(bool: boolean): 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: SenbirdUIKitGlobal.ClientUserMessage;
    userId: string;
    disabled?: boolean;
    showEdit(bool: boolean): void;
    showRemove(bool: boolean): void;
    resendMessage(message: SenbirdUIKitGlobal.ClientUserMessage): void;
    chainTop?: boolean;
    chainBottom?: boolean;
  }
  const OpenChannelUserMessage: React.FC<OpenChannelUserMessageProps>;
  export default OpenChannelUserMessage;
}

declare module '@sendbird/uikit-react/ui/PlaceHolder' {
  interface PlaceHolderProps {
    className?: string | Array<string>;
    type?: 'LOADING' | 'NO_CHANNELS' | 'NO_MESSAGES' | 'WRONG' | 'SEARCH_IN' | 'SEARCHING' | 'NO_RESULT',
    retryToConnect?: () => void,
    searchInString?: string,
  }
  const PlaceHolder: React.FC<PlaceHolderProps>;
  export default PlaceHolder;
}

declare module '@sendbird/uikit-react/ui/QuoteMessage' {
  import type { UserMessage, FileMessage } from '@sendbird/chat/message';
  interface QuoteMessageProps {
    message?: UserMessage | FileMessage;
    userId?: string;
    isByMe?: boolean;
    className?: string | Array<string>;
    onClick?: () => void;
  }
  const QuoteMessage: React.FC<QuoteMessageProps>;
  export default QuoteMessage;
}

declare module '@sendbird/uikit-react/ui/QuoteMessageInput' {
  import type SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
  interface QuoteMessageInputProps {
    className?: string | Array<string>;
    replyingMessage: SendbirdUIKitGlobal.CoreMessageType;
    onClose?: (message: SendbirdUIKitGlobal.CoreMessageType) => void;
  }
  const QuoteMessageInput: React.FC<QuoteMessageInputProps>;
  export default QuoteMessageInput;
}

declare module '@sendbird/uikit-react/ui/ReactionBadge' {
  interface ReactionBadgeProps {
    className?: string | Array<string>;
    children?: React.ReactElement;
    count?: boolean,
    selected?: boolean,
    isAdd?: boolean,
    onClick?: () => void,
  }
  const ReactionBadge: React.FC<ReactionBadgeProps>;
  export default ReactionBadge;
}

declare module '@sendbird/uikit-react/ui/ReactionButton' {
  interface ReactionButtonProps {
    className?: string | Array<string>;
    width?: number,
    height?: number,
    selected: boolean,
    onClick?: () => void,
    children?: React.ReactElement;
  }
  const ReactionButton: React.FC<ReactionButtonProps>;
  export default ReactionButton;
}

declare module '@sendbird/uikit-react/ui/SortByRow' {
  interface SortByRowProps {
    maxItemCount?: number,
    itemWidth?: number,
    itemHeight?: number,
    children?: React.ReactElement;
    className?: string | Array<string>;
  }
  const SortByRow: React.FC<SortByRowProps>;
  export default SortByRow;
}

declare module '@sendbird/uikit-react/ui/TextButton' {
  interface TextButtonProps {
    children?: React.ReactElement;
    className?: string | Array<string>;
    color?: 'ONBACKGROUND_1' | 'ONBACKGROUND_2' | 'ONBACKGROUND_3' | 'ONBACKGROUND_4' | 'ONCONTENT_1' | 'PRIMARY' | 'ERROR',
    disabled?: boolean,
    notUnderline?: boolean,
    onClick?: () => void,
  }
  const TextButton: React.FC<TextButtonProps>;
  export default TextButton;
}

declare module '@sendbird/uikit-react/ui/TextMessageItemBody' {
  import type { UserMessage } from '@sendbird/chat/message';
  interface TextMessageItemBodyProps {
    className?: string | Array<string>;
    message: UserMessage;
    isByMe?: boolean;
    mouseHover?: boolean;
  }
  const TextMessageItemBody: React.FC<TextMessageItemBodyProps>;
  export default TextMessageItemBody;
}

declare module '@sendbird/uikit-react/ui/ThumbnailMessageItemBody' {
  import type { FileMessage } from '@sendbird/chat/message';
  interface ThumbnailMessageItemBodyProps {
    className?: string | Array<string>;
    message: FileMessage;
    isByMe?: boolean;
    mouseHover?: boolean;
    showFileViewer?: (bool: boolean) => void;
  }
  const ThumbnailMessageItemBody: React.FC<ThumbnailMessageItemBodyProps>;
  export default ThumbnailMessageItemBody;
}

declare module '@sendbird/uikit-react/ui/Tooltip' {
  interface TooltipProps {
    children?: React.ReactElement;
    className?: string | Array<string>;
  }
  const Tooltip: React.FC<TooltipProps>;
  export default Tooltip;
}

declare module '@sendbird/uikit-react/ui/TooltipWrapper' {
  interface OpenChannelFileMessageProps {
    hoverTooltip?: React.ReactElement;
    children?: React.ReactElement;
    className?: string | Array<string>;
  }
  const OpenChannelFileMessage: React.FC<OpenChannelFileMessageProps>;
  export default OpenChannelFileMessage;
}

declare module '@sendbird/uikit-react/ui/UnknownMessageItemBody' {
  import type SendbirdUIKitGlobal from 'SendbirdUIKitGlobal';
  interface UnknownMessageItemBodyProps {
    className?: string | Array<string>;
    isByMe?: boolean;
    message: SendbirdUIKitGlobal.CoreMessageType;
    mouseHover?: boolean;
  }
  const UnknownMessageItemBody: React.FC<UnknownMessageItemBodyProps>;
  export default UnknownMessageItemBody;
}

declare module '@sendbird/uikit-react/ui/UserListItem' {
  import type  { User } from '@sendbird/chat';
  interface UserListItemProps {
    className?: string | Array<string>;
    user?: User,
    checkBox?: boolean,
    disableMessaging?: boolean,
    currentUser?: string,
    checked?: boolean,
    onChange?: () => void,
    action?: () => React.ReactElement,
  }
  const UserListItem: React.FC<UserListItemProps>;
  export default 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: User;
    currentUserId?: string;
    sdk?: SendbirdGroupChat | SendbirdOpenChat;
    logger?: SendbirdUIKitGlobal.Logger;
    disableMessaging?: boolean;
    createChannel?(params: GroupChannelCreateParams): Promise<GroupChannel>;
    onSuccess?(): void;
  }
  const UserProfile: React.FC<UserProfileProps>;
  export default UserProfile;
}
