@sendbird/uikit-react-native 2.2.0 → 2.3.0

package/lib/module/platform/dynamicModule.js.map

@@ -1 +1 @@
-{"version":3,"names":["NativeModules","Logger","checkVersion","minVersion","currentVersion","minMajor","minMinor","minPatch","split","currMajor","currMinor","currPatch","checkLink","dmi","logLevel","nativeModule","moduleName","message","packageName","url","console","error","warn","SBUDynamicModuleRegistry","getPackage","require","e","SBUDynamicModule","register","mdi","getInfo","name","get"],"sources":["dynamicModule.ts"],"sourcesContent":["/* eslint-disable no-console */\nimport type RNNetInfo from '@react-native-community/netinfo';\nimport { NativeModules } from 'react-native';\nimport type RNFastImage from 'react-native-fast-image';\nimport type RNFileAccess from 'react-native-file-access';\n\nimport { Logger } from '@sendbird/uikit-utils';\n\nexport interface DynamicModules {\n  'react-native-file-access': typeof RNFileAccess;\n  'react-native-fast-image': typeof RNFastImage;\n  '@react-native-community/netinfo': typeof RNNetInfo;\n}\nexport type SBUNativeModule = keyof DynamicModules;\n\ninterface SBUDynamicModuleInfo {\n  packageName: SBUNativeModule;\n  minVersion: string;\n  moduleName: string;\n  getPackage: <T>(logLevel: 'error' | 'warn' | 'none') => T;\n  url: string;\n}\n\nexport function checkVersion(minVersion: string, currentVersion: string) {\n  const [minMajor, minMinor, minPatch] = minVersion.split('.');\n  const [currMajor, currMinor, currPatch] = currentVersion.split('.');\n\n  if (minMajor < currMajor) return true;\n  if (minMajor === currMajor) {\n    if (minMinor < currMinor) return true;\n    if (minMinor === currMinor) {\n      return minPatch <= currPatch;\n    }\n    return false;\n  }\n  return false;\n}\n\nfunction checkLink(dmi: SBUDynamicModuleInfo, logLevel: 'error' | 'warn' | 'none') {\n  const nativeModule = NativeModules[dmi.moduleName];\n  if (!nativeModule) {\n    const message = `[UIKit] Cannot use native module, you should install and link ${dmi.packageName} (${dmi.url})`;\n    if (logLevel === 'error') console.error(message);\n    if (logLevel === 'warn') console.warn(message);\n  }\n}\n\nconst SBUDynamicModuleRegistry: Record<SBUNativeModule, SBUDynamicModuleInfo> = {\n  'react-native-file-access': {\n    minVersion: '2.4.3',\n    packageName: 'react-native-file-access',\n    moduleName: 'RNFileAccess',\n    url: 'https://github.com/alpha0010/react-native-file-access',\n    getPackage(logLevel) {\n      checkLink(this, logLevel);\n\n      try {\n        return require('react-native-file-access');\n      } catch (e) {\n        return null;\n      }\n    },\n  },\n  'react-native-fast-image': {\n    minVersion: '8.5.11',\n    packageName: 'react-native-fast-image',\n    moduleName: 'FastImageView',\n    url: 'https://github.com/DylanVann/react-native-fast-image',\n    getPackage(logLevel) {\n      checkLink(this, logLevel);\n\n      try {\n        return require('react-native-fast-image');\n      } catch (e) {\n        return null;\n      }\n    },\n  },\n  '@react-native-community/netinfo': {\n    minVersion: '9.3.0',\n    packageName: '@react-native-community/netinfo',\n    moduleName: 'RNCNetInfo',\n    url: 'https://github.com/react-native-netinfo/react-native-netinfo',\n    getPackage(logLevel) {\n      checkLink(this, logLevel);\n\n      try {\n        return require('@react-native-community/netinfo');\n      } catch (e) {\n        return null;\n      }\n    },\n  },\n};\n\nconst SBUDynamicModule = {\n  register(mdi: SBUDynamicModuleInfo) {\n    SBUDynamicModuleRegistry[mdi.moduleName as SBUNativeModule] = mdi;\n  },\n  getInfo(name: SBUNativeModule) {\n    return SBUDynamicModuleRegistry[name] ?? null;\n  },\n  get<K extends SBUNativeModule, T extends DynamicModules[K]>(name: K, logLevel: 'error' | 'warn' | 'none' = 'error') {\n    const dmi = this.getInfo(name);\n    if (!dmi) Logger.warn(`${name} doesn't exist in the dynamic module`);\n    return dmi?.getPackage<T>(logLevel);\n  },\n};\n\nexport default SBUDynamicModule;\n"],"mappings":"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"}
+{"version":3,"names":["NativeModules","UIManager","Logger","checkLink","dmi","logLevel","nativeModule","isComponent","getViewManagerConfig","nativeModuleNamespace","message","packageName","url","console","error","warn","SBUDynamicModuleRegistry","getPackage","require","e","SBUDynamicModule","register","mdi","getInfo","name","get"],"sources":["dynamicModule.ts"],"sourcesContent":["/* eslint-disable no-console */\nimport type * as RNCNetInfo from '@react-native-community/netinfo';\nimport { NativeModules, UIManager } from 'react-native';\n\nimport { Logger } from '@sendbird/uikit-utils';\n\nexport type SBUNativeModule = keyof DynamicModules;\n\ninterface SBUDynamicModuleInfo {\n  packageName: SBUNativeModule;\n  nativeModuleNamespace: string;\n  getPackage: <T>(logLevel: 'error' | 'warn' | 'none') => T;\n  url: string;\n  isComponent?: boolean;\n}\n\nfunction checkLink(dmi: SBUDynamicModuleInfo, logLevel: 'error' | 'warn' | 'none') {\n  const nativeModule = (() => {\n    if (dmi.isComponent) {\n      return UIManager.getViewManagerConfig(dmi.nativeModuleNamespace);\n    } else {\n      return NativeModules[dmi.nativeModuleNamespace];\n    }\n  })();\n\n  if (!nativeModule) {\n    const message = `[UIKit] Cannot use native module, you should install and link ${dmi.packageName} (${dmi.url})`;\n    if (logLevel === 'error') console.error(message);\n    if (logLevel === 'warn') console.warn(message);\n  }\n}\n\nexport interface DynamicModules {\n  '@react-native-community/netinfo': typeof RNCNetInfo;\n}\n\nconst SBUDynamicModuleRegistry: Record<SBUNativeModule, SBUDynamicModuleInfo> = {\n  '@react-native-community/netinfo': {\n    packageName: '@react-native-community/netinfo',\n    nativeModuleNamespace: 'RNCNetInfo',\n    url: 'https://github.com/react-native-netinfo/react-native-netinfo',\n    getPackage(logLevel) {\n      checkLink(this, logLevel);\n\n      try {\n        return require('@react-native-community/netinfo');\n      } catch (e) {\n        return null;\n      }\n    },\n  },\n};\n\nconst SBUDynamicModule = {\n  register(mdi: SBUDynamicModuleInfo) {\n    SBUDynamicModuleRegistry[mdi.nativeModuleNamespace as SBUNativeModule] = mdi;\n  },\n  getInfo(name: SBUNativeModule) {\n    return SBUDynamicModuleRegistry[name] ?? null;\n  },\n  get<K extends SBUNativeModule, T extends DynamicModules[K]>(name: K, logLevel: 'error' | 'warn' | 'none' = 'error') {\n    const dmi = this.getInfo(name);\n    if (!dmi) Logger.warn(`${name} doesn't exist in the dynamic module`);\n    return dmi?.getPackage<T>(logLevel);\n  },\n};\n\nexport default SBUDynamicModule;\n"],"mappings":"AAAA;AAEA,SAASA,aAAT,EAAwBC,SAAxB,QAAyC,cAAzC;AAEA,SAASC,MAAT,QAAuB,uBAAvB;;AAYA,SAASC,SAAT,CAAmBC,GAAnB,EAA8CC,QAA9C,EAAmF;EACjF,MAAMC,YAAY,GAAG,CAAC,MAAM;IAC1B,IAAIF,GAAG,CAACG,WAAR,EAAqB;MACnB,OAAON,SAAS,CAACO,oBAAV,CAA+BJ,GAAG,CAACK,qBAAnC,CAAP;IACD,CAFD,MAEO;MACL,OAAOT,aAAa,CAACI,GAAG,CAACK,qBAAL,CAApB;IACD;EACF,CANoB,GAArB;;EAQA,IAAI,CAACH,YAAL,EAAmB;IACjB,MAAMI,OAAO,GAAI,iEAAgEN,GAAG,CAACO,WAAY,KAAIP,GAAG,CAACQ,GAAI,GAA7G;IACA,IAAIP,QAAQ,KAAK,OAAjB,EAA0BQ,OAAO,CAACC,KAAR,CAAcJ,OAAd;IAC1B,IAAIL,QAAQ,KAAK,MAAjB,EAAyBQ,OAAO,CAACE,IAAR,CAAaL,OAAb;EAC1B;AACF;;AAMD,MAAMM,wBAAuE,GAAG;EAC9E,mCAAmC;IACjCL,WAAW,EAAE,iCADoB;IAEjCF,qBAAqB,EAAE,YAFU;IAGjCG,GAAG,EAAE,8DAH4B;;IAIjCK,UAAU,CAACZ,QAAD,EAAW;MACnBF,SAAS,CAAC,IAAD,EAAOE,QAAP,CAAT;;MAEA,IAAI;QACF,OAAOa,OAAO,CAAC,iCAAD,CAAd;MACD,CAFD,CAEE,OAAOC,CAAP,EAAU;QACV,OAAO,IAAP;MACD;IACF;;EAZgC;AAD2C,CAAhF;AAiBA,MAAMC,gBAAgB,GAAG;EACvBC,QAAQ,CAACC,GAAD,EAA4B;IAClCN,wBAAwB,CAACM,GAAG,CAACb,qBAAL,CAAxB,GAAyEa,GAAzE;EACD,CAHsB;;EAIvBC,OAAO,CAACC,IAAD,EAAwB;IAC7B,OAAOR,wBAAwB,CAACQ,IAAD,CAAxB,IAAkC,IAAzC;EACD,CANsB;;EAOvBC,GAAG,CAAyDD,IAAzD,EAAiH;IAAA,IAA/CnB,QAA+C,uEAAT,OAAS;IAClH,MAAMD,GAAG,GAAG,KAAKmB,OAAL,CAAaC,IAAb,CAAZ;IACA,IAAI,CAACpB,GAAL,EAAUF,MAAM,CAACa,IAAP,CAAa,GAAES,IAAK,sCAApB;IACV,OAAOpB,GAAP,aAAOA,GAAP,uBAAOA,GAAG,CAAEa,UAAL,CAAmBZ,QAAnB,CAAP;EACD;;AAXsB,CAAzB;AAcA,eAAee,gBAAf"}

package/lib/module/platform/types.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["types.ts"],"sourcesContent":["import type SBUError from '../libs/SBUError';\n\nexport type Unsubscribe = () => void | undefined;\nexport type DownloadedPath = string;\nexport type FilePickerResponse = FileType | null;\nexport type FileType = { uri: string; size: number; name: string; type: string };\n\n// ---------- NotificationService ---------- //\nexport interface NotificationServiceInterface {\n  hasPushPermission(): Promise<boolean>;\n  requestPushPermission(): Promise<boolean>;\n\n  getAPNSToken(): Promise<string | null>;\n  getFCMToken(): Promise<string | null>;\n  onTokenRefresh(handler: (token: string) => void): Unsubscribe;\n}\n\n// ---------- ClipboardService ---------- //\nexport interface ClipboardServiceInterface {\n  setString(text: string): void;\n  getString(): Promise<string>;\n}\n\n// ---------- FileService ---------- //\nexport interface FileServiceInterface extends FilePickerServiceInterface, FileSystemServiceInterface {}\n\nexport interface OpenResultListener {\n  onOpenFailure?: (error: SBUError, originError?: unknown) => void;\n}\nexport interface OpenMediaLibraryOptions extends OpenResultListener {\n  selectionLimit?: number;\n  mediaType?: 'photo' | 'video' | 'all';\n}\nexport interface OpenCameraOptions extends OpenResultListener {\n  cameraType?: 'front' | 'back';\n  mediaType?: 'photo' | 'video' | 'all';\n}\nexport type OpenDocumentOptions = OpenResultListener;\nexport interface SaveOptions {\n  fileUrl: string;\n  fileName: string;\n  fileType?: string | null;\n}\n\nexport interface FilePickerServiceInterface {\n  openMediaLibrary(options?: OpenMediaLibraryOptions): Promise<null | FilePickerResponse[]>;\n  openCamera(options?: OpenCameraOptions): Promise<FilePickerResponse>;\n  openDocument(options?: OpenDocumentOptions): Promise<FilePickerResponse>;\n}\n\nexport interface FileSystemServiceInterface {\n  // NOTE: On iOS, You can access the downloaded files by providing options below to info.plist\n  // - Supports opening documents in place\n  // - Application supports iTunes file sharing\n  save(options?: SaveOptions): Promise<DownloadedPath | null>;\n}\n\n// ---------- MediaService ---------- //\ninterface VideoProps {\n  source: { uri: string } | number;\n  resizeMode?: 'cover' | 'contain' | 'stretch';\n  onLoad?: () => void;\n}\ninterface GetVideoThumbnailOptions {\n  url: string;\n  timeMills?: number;\n  quality?: number;\n}\nexport interface MediaServiceInterface {\n  VideoComponent<Props = {}>(props: VideoProps & Props): JSX.Element;\n  getVideoThumbnail(options: GetVideoThumbnailOptions): Promise<{ path: string } | null>;\n  // compressImage(options: {\n  //   path: string;\n  //   compressionRate: number;\n  //   resizingWidth: number;\n  //   resizingHeight: number;\n  // }): Promise<{ path: string }>;\n}\n"],"mappings":""}
+{"version":3,"names":[],"sources":["types.ts"],"sourcesContent":["import type SBUError from '../libs/SBUError';\n\nexport type Unsubscribe = () => void | undefined;\nexport type DownloadedPath = string;\nexport type FilePickerResponse = FileType | null;\nexport type FileType = { uri: string; size: number; name: string; type: string };\n\n// ---------- NotificationService ---------- //\nexport interface NotificationServiceInterface {\n  hasPushPermission(): Promise<boolean>;\n  requestPushPermission(): Promise<boolean>;\n\n  getAPNSToken(): Promise<string | null>;\n  getFCMToken(): Promise<string | null>;\n  onTokenRefresh(handler: (token: string) => void): Unsubscribe;\n}\n\n// ---------- ClipboardService ---------- //\nexport interface ClipboardServiceInterface {\n  setString(text: string): void;\n  getString(): Promise<string>;\n}\n\n// ---------- FileService ---------- //\nexport interface FileServiceInterface extends FilePickerServiceInterface, FileSystemServiceInterface {}\n\nexport interface OpenResultListener {\n  onOpenFailure?: (error: SBUError, originError?: unknown) => void;\n}\nexport interface OpenMediaLibraryOptions extends OpenResultListener {\n  selectionLimit?: number;\n  mediaType?: 'photo' | 'video' | 'all';\n}\nexport interface OpenCameraOptions extends OpenResultListener {\n  cameraType?: 'front' | 'back';\n  mediaType?: 'photo' | 'video' | 'all';\n}\nexport type OpenDocumentOptions = OpenResultListener;\nexport interface SaveOptions {\n  fileUrl: string;\n  fileName: string;\n  fileType?: string | null;\n}\n\nexport interface FilePickerServiceInterface {\n  openMediaLibrary(options?: OpenMediaLibraryOptions): Promise<null | FilePickerResponse[]>;\n  openCamera(options?: OpenCameraOptions): Promise<FilePickerResponse>;\n  openDocument(options?: OpenDocumentOptions): Promise<FilePickerResponse>;\n}\n\nexport interface FileSystemServiceInterface {\n  // NOTE: On iOS, You can access the downloaded files by providing options below to info.plist\n  // - Supports opening documents in place\n  // - Application supports iTunes file sharing\n  save(options?: SaveOptions): Promise<DownloadedPath | null>;\n}\n\n// ---------- MediaService ---------- //\ninterface VideoProps {\n  source: { uri: string } | number;\n  resizeMode?: 'cover' | 'contain' | 'stretch';\n  onLoad?: () => void;\n}\ninterface GetVideoThumbnailOptions {\n  url: string;\n  timeMills?: number;\n  quality?: number;\n}\n\ninterface CompressImageOptions {\n  /**\n   * A uri of image file to compress\n   * */\n  uri: string;\n\n  /**\n   * A resize width, apply only to downscale\n   * */\n  maxWidth?: number;\n\n  /**\n   * A resize height, apply only to downscale\n   * */\n  maxHeight?: number;\n\n  /**\n   * A value in range 0.0 - 1.0 specifying compression level of the result image.\n   * 1 means highest quality and 0 the lowest quality.\n   * */\n  compressionRate?: number;\n}\n\ntype GetVideoThumbnailResult = Promise<{ path: string } | null>;\ntype CompressImageResult = Promise<{ uri: string; size: number } | null>;\n\nexport interface MediaServiceInterface {\n  VideoComponent<Props = {}>(props: VideoProps & Props): JSX.Element;\n  getVideoThumbnail(options: GetVideoThumbnailOptions): GetVideoThumbnailResult;\n  compressImage(options: CompressImageOptions): CompressImageResult;\n}\n"],"mappings":""}

package/lib/module/version.js

@@ -1,3 +1,3 @@
-const VERSION = '2.2.0';
+const VERSION = '2.3.0';
 export default VERSION;
 //# sourceMappingURL=version.js.map

package/lib/module/version.js.map

@@ -1 +1 @@
-{"version":3,"names":["VERSION"],"sources":["version.ts"],"sourcesContent":["const VERSION = '2.2.0';\nexport default VERSION;\n"],"mappings":"AAAA,MAAMA,OAAO,GAAG,OAAhB;AACA,eAAeA,OAAf"}
+{"version":3,"names":["VERSION"],"sources":["version.ts"],"sourcesContent":["const VERSION = '2.3.0';\nexport default VERSION;\n"],"mappings":"AAAA,MAAMA,OAAO,GAAG,OAAhB;AACA,eAAeA,OAAf"}

package/lib/typescript/src/containers/SendbirdUIKitContainer.d.ts

@@ -2,12 +2,13 @@ import React from 'react';
 import type { HeaderStyleContextType, UIKitTheme } from '@sendbird/uikit-react-native-foundation';
 import type { SendbirdBaseChannel, SendbirdChatSDK, SendbirdGroupChannelCreateParams, SendbirdMember, SendbirdUser } from '@sendbird/uikit-utils';
 import type { UIKitFeaturesInSendbirdChatContext } from '../contexts/SendbirdChatCtx';
+import type { ImageCompressionConfigInterface } from '../libs/ImageCompressionConfig';
 import { MentionConfigInterface } from '../libs/MentionConfig';
 import type { StringSet } from '../localization/StringSet.type';
 import type { ClipboardServiceInterface, FileServiceInterface, MediaServiceInterface, NotificationServiceInterface } from '../platform/types';
 import type { ErrorBoundaryProps, LocalCacheStorage } from '../types';
 export declare const SendbirdUIKit: Readonly<{
-    VERSION: "2.2.0";
+    VERSION: "2.3.0";
     PLATFORM: string;
     DEFAULT: {
         AUTO_PUSH_TOKEN_REGISTRATION: boolean;
@@ -15,6 +16,7 @@ export declare const SendbirdUIKit: Readonly<{
         CHANNEL_LIST_MESSAGE_RECEIPT_STATUS: boolean;
         USE_USER_ID_FOR_NICKNAME: boolean;
         USER_MENTION: boolean;
+        IMAGE_COMPRESSION: boolean;
     };
 }>;
 export type SendbirdUIKitContainerProps = React.PropsWithChildren<{
@@ -23,7 +25,7 @@ export type SendbirdUIKitContainerProps = React.PropsWithChildren<{
         file: FileServiceInterface;
         notification: NotificationServiceInterface;
         clipboard: ClipboardServiceInterface;
-        media?: MediaServiceInterface;
+        media: MediaServiceInterface;
     };
     chatOptions?: {
         localCacheStorage?: LocalCacheStorage;
@@ -39,6 +41,10 @@ export type SendbirdUIKitContainerProps = React.PropsWithChildren<{
         defaultHeaderHeight?: number;
         HeaderComponent?: HeaderStyleContextType['HeaderComponent'];
     };
+    errorBoundary?: {
+        onError?: (props: ErrorBoundaryProps) => void;
+        ErrorInfoComponent?: (props: ErrorBoundaryProps) => JSX.Element;
+    };
     toast?: {
         dismissTimeout?: number;
     };
@@ -47,10 +53,7 @@ export type SendbirdUIKitContainerProps = React.PropsWithChildren<{
         onBeforeCreateChannel?: (channelParams: SendbirdGroupChannelCreateParams, users: SendbirdUser[] | SendbirdMember[]) => SendbirdGroupChannelCreateParams | Promise<SendbirdGroupChannelCreateParams>;
     };
     userMention?: Pick<Partial<MentionConfigInterface>, 'mentionLimit' | 'suggestionLimit' | 'debounceMills'>;
-    errorBoundary?: {
-        onError?: (props: ErrorBoundaryProps) => void;
-        ErrorInfoComponent?: (props: ErrorBoundaryProps) => JSX.Element;
-    };
+    imageCompression?: Partial<ImageCompressionConfigInterface>;
 }>;
-declare const SendbirdUIKitContainer: ({ children, appId, chatOptions, platformServices, localization, styles, toast, userProfile, userMention, errorBoundary, }: SendbirdUIKitContainerProps) => JSX.Element;
+declare const SendbirdUIKitContainer: ({ children, appId, chatOptions, platformServices, localization, styles, errorBoundary, toast, userProfile, userMention, imageCompression, }: SendbirdUIKitContainerProps) => JSX.Element;
 export default SendbirdUIKitContainer;

package/lib/typescript/src/contexts/PlatformServiceCtx.d.ts

@@ -4,8 +4,14 @@ type Props = React.PropsWithChildren<{
     fileService: FileServiceInterface;
     clipboardService: ClipboardServiceInterface;
     notificationService: NotificationServiceInterface;
-    mediaService?: MediaServiceInterface;
+    mediaService: MediaServiceInterface;
 }>;
-export declare const PlatformServiceContext: React.Context<Props | null>;
+export type PlatformServiceContextType = {
+    fileService: FileServiceInterface;
+    clipboardService: ClipboardServiceInterface;
+    notificationService: NotificationServiceInterface;
+    mediaService: MediaServiceInterface;
+};
+export declare const PlatformServiceContext: React.Context<PlatformServiceContextType | null>;
 export declare const PlatformServiceProvider: ({ children, fileService, clipboardService, notificationService, mediaService, }: Props) => JSX.Element;
 export {};

package/lib/typescript/src/contexts/SendbirdChatCtx.d.ts

@@ -1,6 +1,7 @@
 import React from 'react';
 import type { SendbirdChatSDK, SendbirdGroupChannel, SendbirdUser } from '@sendbird/uikit-utils';
 import type EmojiManager from '../libs/EmojiManager';
+import type ImageCompressionConfig from '../libs/ImageCompressionConfig';
 import type MentionManager from '../libs/MentionManager';
 import type { FileType } from '../platform/types';
 export interface UIKitFeaturesInSendbirdChatContext {
@@ -9,16 +10,19 @@ export interface UIKitFeaturesInSendbirdChatContext {
     enableChannelListMessageReceiptStatus: boolean;
     enableUseUserIdForNickname: boolean;
     enableUserMention: boolean;
+    enableImageCompression: boolean;
 }
 interface Props extends UIKitFeaturesInSendbirdChatContext, React.PropsWithChildren {
     sdkInstance: SendbirdChatSDK;
     emojiManager: EmojiManager;
     mentionManager: MentionManager;
+    imageCompressionConfig: ImageCompressionConfig;
 }
-type Context = {
+export type SendbirdChatContextType = {
     sdk: SendbirdChatSDK;
     emojiManager: EmojiManager;
     mentionManager: MentionManager;
+    imageCompressionConfig: ImageCompressionConfig;
     currentUser?: SendbirdUser;
     setCurrentUser: React.Dispatch<React.SetStateAction<SendbirdUser | undefined>>;
     updateCurrentUserInfo: (nickname?: string, profile?: string | FileType) => Promise<SendbirdUser>;
@@ -29,12 +33,13 @@ type Context = {
         channelListMessageReceiptStatusEnabled: boolean;
         useUserIdForNicknameEnabled: boolean;
         userMentionEnabled: boolean;
+        imageCompressionEnabled: boolean;
         deliveryReceiptEnabled: boolean;
         broadcastChannelEnabled: boolean;
         superGroupChannelEnabled: boolean;
         reactionEnabled: boolean;
     };
 };
-export declare const SendbirdChatContext: React.Context<Context | null>;
-export declare const SendbirdChatProvider: ({ children, sdkInstance, emojiManager, mentionManager, enableAutoPushTokenRegistration, enableChannelListMessageReceiptStatus, enableChannelListTypingIndicator, enableUseUserIdForNickname, enableUserMention, }: Props) => JSX.Element;
+export declare const SendbirdChatContext: React.Context<SendbirdChatContextType | null>;
+export declare const SendbirdChatProvider: ({ children, sdkInstance, emojiManager, mentionManager, imageCompressionConfig, enableAutoPushTokenRegistration, enableChannelListMessageReceiptStatus, enableChannelListTypingIndicator, enableUseUserIdForNickname, enableUserMention, enableImageCompression, }: Props) => JSX.Element;
 export {};

package/lib/typescript/src/hooks/useContext.d.ts

@@ -1,32 +1,5 @@
-/// <reference types="react" />
 export declare const useLocalization: () => import("../contexts/LocalizationCtx").LocalizationContextType;
-export declare const usePlatformService: () => {
-    fileService: import("..").FileServiceInterface;
-    clipboardService: import("..").ClipboardServiceInterface;
-    notificationService: import("..").NotificationServiceInterface;
-    mediaService?: import("../platform/types").MediaServiceInterface | undefined;
-} & {
-    children?: import("react").ReactNode;
-};
-export declare const useSendbirdChat: () => {
-    sdk: import("packages/uikit-utils/lib/typescript/src").SendbirdChatSDK;
-    emojiManager: import("../libs/EmojiManager").default;
-    mentionManager: import("../libs/MentionManager").default;
-    currentUser?: import("@sendbird/chat").User | undefined;
-    setCurrentUser: import("react").Dispatch<import("react").SetStateAction<import("@sendbird/chat").User | undefined>>;
-    updateCurrentUserInfo: (nickname?: string | undefined, profile?: string | import("..").FileType | undefined) => Promise<import("@sendbird/chat").User>;
-    markAsDeliveredWithChannel: (channel: import("@sendbird/chat/groupChannel").GroupChannel) => void;
-    features: {
-        autoPushTokenRegistrationEnabled: boolean;
-        channelListTypingIndicatorEnabled: boolean;
-        channelListMessageReceiptStatusEnabled: boolean;
-        useUserIdForNicknameEnabled: boolean;
-        userMentionEnabled: boolean;
-        deliveryReceiptEnabled: boolean;
-        broadcastChannelEnabled: boolean;
-        superGroupChannelEnabled: boolean;
-        reactionEnabled: boolean;
-    };
-};
+export declare const usePlatformService: () => import("../contexts/PlatformServiceCtx").PlatformServiceContextType;
+export declare const useSendbirdChat: () => import("../contexts/SendbirdChatCtx").SendbirdChatContextType;
 export declare const useUserProfile: () => import("../contexts/UserProfileCtx").UserProfileContextType;
 export declare const useReaction: () => import("../contexts/ReactionCtx").ReactionContextType;

package/lib/typescript/src/index.d.ts

@@ -46,7 +46,7 @@ export { default as createExpoFileService } from './platform/createFileService.e
 export { default as createExpoClipboardService } from './platform/createClipboardService.expo';
 export { default as createExpoNotificationService } from './platform/createNotificationService.expo';
 export { default as createExpoMediaService } from './platform/createMediaService.expo';
-export type { FileServiceInterface, ClipboardServiceInterface, FilePickerServiceInterface, FileSystemServiceInterface, SaveOptions, OpenDocumentOptions, OpenCameraOptions, OpenMediaLibraryOptions, OpenResultListener, DownloadedPath, Unsubscribe, FilePickerResponse, FileType, NotificationServiceInterface, } from './platform/types';
+export type { FileServiceInterface, ClipboardServiceInterface, FilePickerServiceInterface, FileSystemServiceInterface, SaveOptions, OpenDocumentOptions, OpenCameraOptions, OpenMediaLibraryOptions, OpenResultListener, DownloadedPath, Unsubscribe, FilePickerResponse, FileType, NotificationServiceInterface, MediaServiceInterface, } from './platform/types';
 /** Domain **/
 export * from './domain/groupChannel';
 export type { GroupChannelProps, GroupChannelModule, GroupChannelFragment, GroupChannelContextsType, } from './domain/groupChannel/types';

package/lib/typescript/src/libs/ImageCompressionConfig.d.ts

@@ -0,0 +1,16 @@
+export interface ImageCompressionConfigInterface {
+    compressionRate: number;
+    width?: number;
+    height?: number;
+}
+declare class ImageCompressionConfig {
+    private _config;
+    static DEFAULT: {
+        COMPRESSION_RATE: number;
+    };
+    constructor(_config: ImageCompressionConfigInterface);
+    get compressionRate(): number;
+    get width(): number | undefined;
+    get height(): number | undefined;
+}
+export default ImageCompressionConfig;

package/lib/typescript/src/libs/SBUUtils.d.ts

@@ -1,3 +1,9 @@
 export default class SBUUtils {
     static openSettings(): void;
+    static openURL(url: string): void;
+    static getImageSize(uri: string): Promise<{
+        width: number;
+        height: number;
+    }>;
+    static safeRun(callback: () => Promise<void>): Promise<void>;
 }

package/lib/typescript/src/localization/StringSet.type.d.ts

@@ -144,6 +144,9 @@ export interface StringSet {
         }) => string;
     };
     LABELS: {
+        PERMISSION_APP_NAME: string;
+        PERMISSION_CAMERA: string;
+        PERMISSION_DEVICE_STORAGE: string;
         USER_NO_NAME: string;
         CHANNEL_NO_MEMBERS: string;
         TYPING_INDICATOR_TYPINGS: (users: SendbirdUser[]) => string | undefined;

package/lib/typescript/src/platform/createMediaService.expo.d.ts

@@ -1,9 +1,13 @@
 import type * as ExpoAV from 'expo-av';
+import type * as ExpoFS from 'expo-file-system';
+import type * as ExpoImageManipulator from 'expo-image-manipulator';
 import type * as ExpoVideoThumbnail from 'expo-video-thumbnails';
 import type { MediaServiceInterface } from './types';
 type Modules = {
     avModule: typeof ExpoAV;
     thumbnailModule: typeof ExpoVideoThumbnail;
+    imageManipulator: typeof ExpoImageManipulator;
+    fsModule: typeof ExpoFS;
 };
-declare const createExpoMediaService: ({ avModule, thumbnailModule }: Modules) => MediaServiceInterface;
+declare const createExpoMediaService: ({ avModule, thumbnailModule, imageManipulator, fsModule, }: Modules) => MediaServiceInterface;
 export default createExpoMediaService;

package/lib/typescript/src/platform/createMediaService.native.d.ts

@@ -1,9 +1,11 @@
-import type * as CreateThumbnail from 'react-native-create-thumbnail';
-import type Video from 'react-native-video';
+import type * as RNImageResizer from '@bam.tech/react-native-image-resizer';
+import type * as RNCreateThumbnail from 'react-native-create-thumbnail';
+import type RNVideo from 'react-native-video';
 import type { MediaServiceInterface } from './types';
 type Modules = {
-    VideoComponent: typeof Video;
-    thumbnailModule: typeof CreateThumbnail;
+    VideoComponent: typeof RNVideo;
+    thumbnailModule: typeof RNCreateThumbnail;
+    imageResizerModule: typeof RNImageResizer;
 };
-declare const createNativeMediaService: ({ VideoComponent, thumbnailModule }: Modules) => MediaServiceInterface;
+declare const createNativeMediaService: ({ VideoComponent, thumbnailModule, imageResizerModule, }: Modules) => MediaServiceInterface;
 export default createNativeMediaService;

package/lib/typescript/src/platform/dynamicModule.d.ts

@@ -1,23 +1,18 @@
-import type RNNetInfo from '@react-native-community/netinfo';
-import type RNFastImage from 'react-native-fast-image';
-import type RNFileAccess from 'react-native-file-access';
-export interface DynamicModules {
-    'react-native-file-access': typeof RNFileAccess;
-    'react-native-fast-image': typeof RNFastImage;
-    '@react-native-community/netinfo': typeof RNNetInfo;
-}
+import type * as RNCNetInfo from '@react-native-community/netinfo';
 export type SBUNativeModule = keyof DynamicModules;
 interface SBUDynamicModuleInfo {
     packageName: SBUNativeModule;
-    minVersion: string;
-    moduleName: string;
+    nativeModuleNamespace: string;
     getPackage: <T>(logLevel: 'error' | 'warn' | 'none') => T;
     url: string;
+    isComponent?: boolean;
+}
+export interface DynamicModules {
+    '@react-native-community/netinfo': typeof RNCNetInfo;
 }
-export declare function checkVersion(minVersion: string, currentVersion: string): boolean;
 declare const SBUDynamicModule: {
     register(mdi: SBUDynamicModuleInfo): void;
     getInfo(name: SBUNativeModule): SBUDynamicModuleInfo;
-    get<K extends keyof DynamicModules, T extends DynamicModules[K]>(name: K, logLevel?: 'error' | 'warn' | 'none'): T;
+    get<K extends "@react-native-community/netinfo", T extends DynamicModules[K]>(name: K, logLevel?: 'error' | 'warn' | 'none'): T;
 };
 export default SBUDynamicModule;

package/lib/typescript/src/platform/types.d.ts

@@ -58,10 +58,35 @@ interface GetVideoThumbnailOptions {
     timeMills?: number;
     quality?: number;
 }
+interface CompressImageOptions {
+    /**
+     * A uri of image file to compress
+     * */
+    uri: string;
+    /**
+     * A resize width, apply only to downscale
+     * */
+    maxWidth?: number;
+    /**
+     * A resize height, apply only to downscale
+     * */
+    maxHeight?: number;
+    /**
+     * A value in range 0.0 - 1.0 specifying compression level of the result image.
+     * 1 means highest quality and 0 the lowest quality.
+     * */
+    compressionRate?: number;
+}
+type GetVideoThumbnailResult = Promise<{
+    path: string;
+} | null>;
+type CompressImageResult = Promise<{
+    uri: string;
+    size: number;
+} | null>;
 export interface MediaServiceInterface {
     VideoComponent<Props = {}>(props: VideoProps & Props): JSX.Element;
-    getVideoThumbnail(options: GetVideoThumbnailOptions): Promise<{
-        path: string;
-    } | null>;
+    getVideoThumbnail(options: GetVideoThumbnailOptions): GetVideoThumbnailResult;
+    compressImage(options: CompressImageOptions): CompressImageResult;
 }
 export {};

package/lib/typescript/src/version.d.ts

@@ -1,2 +1,2 @@
-declare const VERSION = "2.2.0";
+declare const VERSION = "2.3.0";
 export default VERSION;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sendbird/uikit-react-native",
-  "version": "2.2.0",
+  "version": "2.3.0",
   "description": "react-native-uikit",
   "main": "lib/commonjs/index",
   "module": "lib/module/index",
@@ -41,11 +41,12 @@
     "access": "public"
   },
   "dependencies": {
-    "@sendbird/uikit-chat-hooks": "2.2.0",
-    "@sendbird/uikit-react-native-foundation": "2.2.0",
-    "@sendbird/uikit-utils": "2.2.0"
+    "@sendbird/uikit-chat-hooks": "2.3.0",
+    "@sendbird/uikit-react-native-foundation": "2.3.0",
+    "@sendbird/uikit-utils": "2.3.0"
   },
   "devDependencies": {
+    "@bam.tech/react-native-image-resizer": "^3.0.4",
     "@react-native-camera-roll/camera-roll": "^5.0.4",
     "@react-native-clipboard/clipboard": "^1.8.5",
     "@react-native-community/netinfo": "^9.3.0",
@@ -59,6 +60,7 @@
     "expo-clipboard": "^2.1.1",
     "expo-document-picker": "^10.1.3",
     "expo-file-system": "^13.1.4",
+    "expo-image-manipulator": "^11.0.0",
     "expo-image-picker": "^12.0.2",
     "expo-media-library": "^14.0.1",
     "expo-notifications": "^0.14.1",
@@ -79,6 +81,7 @@
     "typescript": "4.9.4"
   },
   "peerDependencies": {
+    "@bam.tech/react-native-image-resizer": ">=3.0.0",
     "@react-native-camera-roll/camera-roll": ">=5.0.0",
     "@react-native-clipboard/clipboard": ">=1.8.5",
     "@react-native-community/netinfo": ">=9.3.0",
@@ -89,6 +92,7 @@
     "expo-clipboard": ">=2.1.1",
     "expo-document-picker": ">=10.1.3",
     "expo-file-system": ">=13.1.4",
+    "expo-image-manipulator": ">=11.0.0",
     "expo-image-picker": ">=12.0.2",
     "expo-notifications": ">=0.14.1",
     "expo-video-thumbnails": ">=6.4.0",
@@ -103,6 +107,9 @@
     "react-native-video": ">=5.2.0"
   },
   "peerDependenciesMeta": {
+    "@bam.tech/react-native-image-resizer": {
+      "optional": true
+    },
     "@react-native-camera-roll/camera-roll": {
       "optional": true
     },
@@ -124,6 +131,9 @@
     "expo-file-system": {
       "optional": true
     },
+    "expo-image-manipulator": {
+      "optional": true
+    },
     "expo-image-picker": {
       "optional": true
     },
@@ -171,5 +181,5 @@
     "readmeFile": "./README.md",
     "displayName": "@sendbird/uikit-react-native"
   },
-  "gitHead": "bd7ab217a07e91ba644c0cb69694a92b123326bf"
+  "gitHead": "a9bf41fd7919436db99f6cc3bacd0f8d791b7729"
 }

package/src/components/FileViewer.tsx

@@ -63,10 +63,8 @@ const FileViewer = ({
   const fileType = getFileType(fileMessage.type || getFileExtension(fileMessage.url));
 
   useEffect(() => {
-    if (!mediaService?.VideoComponent || fileType === 'file') {
-      onClose();
-    }
-  }, [mediaService]);
+    if (fileType === 'file') onClose();
+  }, []);
 
   const fileViewer = useIIFE(() => {
     switch (fileType) {
@@ -83,7 +81,6 @@ const FileViewer = ({
 
       case 'video':
       case 'audio': {
-        if (!mediaService?.VideoComponent) return null;
         return (
           <mediaService.VideoComponent
             source={{ uri: fileMessage.url }}

package/src/components/MessageRenderer/FileMessage/ImageFileMessage.tsx

@@ -44,7 +44,12 @@ const ImageFileMessage = ({ message, children, variant }: FileMessageProps) => {
   const key = useRetry(imageNotFound);
 
   return (
-    <View style={[styles.bubbleContainer, { backgroundColor: colors.ui.message[variant].enabled.background }]}>
+    <View
+      style={[
+        styles.bubbleContainer,
+        { backgroundColor: imageNotFound ? colors.onBackground04 : colors.ui.message[variant].enabled.background },
+      ]}
+    >
       <View style={style}>
         <Image
           key={key}

package/src/components/MessageRenderer/FileMessage/VideoFileMessage.tsx

@@ -15,7 +15,7 @@ const useRetry = (videoFileUrl: string, retryCount = 5) => {
   const { mediaService } = usePlatformService();
 
   const fetchThumbnail = () => {
-    return mediaService?.getVideoThumbnail({ url: videoFileUrl, timeMills: 1000 }).then((result) => {
+    return mediaService.getVideoThumbnail({ url: videoFileUrl, timeMills: 1000 }).then((result) => {
       setState({ loading: false, thumbnail: result?.path ?? null });
     });
   };

package/src/components/MessageRenderer/FileMessage/index.tsx

@@ -2,7 +2,6 @@ import React from 'react';
 
 import { SendbirdFileMessage, getFileExtension, getFileType } from '@sendbird/uikit-utils';
 
-import { usePlatformService } from '../../../hooks/useContext';
 import type { MessageRendererInterface } from '../index';
 import BaseFileMessage from './BaseFileMessage';
 import ImageFileMessage from './ImageFileMessage';
@@ -10,12 +9,10 @@ import VideoFileMessage from './VideoFileMessage';
 
 export type FileMessageProps = MessageRendererInterface<SendbirdFileMessage>;
 const FileMessage = (props: FileMessageProps) => {
-  const { mediaService } = usePlatformService();
-
   const fileType = getFileType(props.message.type || getFileExtension(props.message.name));
 
   if (fileType === 'image') return <ImageFileMessage {...props} />;
-  if (fileType === 'video' && mediaService?.getVideoThumbnail) return <VideoFileMessage {...props} />;
+  if (fileType === 'video') return <VideoFileMessage {...props} />;
 
   return <BaseFileMessage {...props} type={fileType} />;
 };

package/src/components/MessageRenderer/UserMessage/BaseUserMessage.tsx

@@ -5,7 +5,7 @@ import { RegexText, Text, createStyleSheet, useUIKitTheme } from '@sendbird/uiki
 import { urlRegexStrict } from '@sendbird/uikit-utils';
 
 import { useLocalization, useSendbirdChat, useUserProfile } from '../../../hooks/useContext';
-import { openUrl } from '../../../utils/common';
+import SBUUtils from '../../../libs/SBUUtils';
 import type { UserMessageProps } from './index';
 
 const BaseUserMessage = ({
@@ -62,7 +62,7 @@ const BaseUserMessage = ({
                     <Text
                       {...parentProps}
                       key={`${keyPrefix}-${index}`}
-                      onPress={() => openUrl(match)}
+                      onPress={() => SBUUtils.openURL(match)}
                       onLongPress={onLongPressURL}
                       style={[parentProps?.style, { textDecorationLine: 'underline' }]}
                     >

package/src/components/MessageRenderer/UserMessage/OpenGraphUserMessage.tsx

@@ -1,12 +1,12 @@
 import React, { useState } from 'react';
-import { Linking, TouchableOpacity, View } from 'react-native';
+import { TouchableOpacity, View } from 'react-native';
 
 import type { OGMetaData } from '@sendbird/chat/message';
 import { Icon, Image, RegexText, Text, createStyleSheet, useUIKitTheme } from '@sendbird/uikit-react-native-foundation';
 import { conditionChaining, urlRegexRough } from '@sendbird/uikit-utils';
 
 import { useLocalization, useSendbirdChat, useUserProfile } from '../../../hooks/useContext';
-import { openUrl } from '../../../utils/common';
+import SBUUtils from '../../../libs/SBUUtils';
 import type { UserMessageProps } from './index';
 
 type Props = UserMessageProps & {
@@ -73,7 +73,7 @@ const OpenGraphUserMessage = ({
                       <Text
                         {...parentProps}
                         key={`${keyPrefix}-${index}`}
-                        onPress={() => openUrl(match)}
+                        onPress={() => SBUUtils.openURL(match)}
                         onLongPress={onLongPressURL}
                         style={[parentProps?.style, styles.urlText]}
                       >
@@ -98,7 +98,7 @@ const OpenGraphUserMessage = ({
         <TouchableOpacity
           style={{ backgroundColor: select({ dark: palette.background500, light: palette.background200 }) }}
           activeOpacity={0.85}
-          onPress={() => Linking.openURL(ogMetaData.url).catch()}
+          onPress={() => SBUUtils.openURL(ogMetaData.url)}
         >
           <View
             style={[