@sendbird/uikit-react-native-foundation 2.1.0 → 2.3.0

package/lib/module/ui/GroupChannelPreview/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","View","conditionChaining","Icon","Image","Text","createStyleSheet","useUIKitTheme","Badge","GroupChannelPreview","customCover","coverUrl","memberCount","badgeCount","maxBadgeCount","body","bodyIcon","title","titleCaption","titleCaptionLeft","frozen","notificationOff","broadcast","colors","color","ui","groupChannelPreview","styles","container","backgroundColor","default","none","background","coverContainer","Boolean","channelCover","coverBackground","uri","rightSection","rightTopSection","channelInfoContainer","secondary","channelInfoBroadcast","channelInfoTitle","textTitle","channelInfoMemberCount","primary","channelInfoFrozen","onBackground03","titleCaptionContainer","textTitleCaption","titleCaptionText","rightBottomSection","bodyWrapper","bodyIconBackground","bodyText","textBody","separator","Separator","height","width","flexDirection","alignItems","justifyContent","marginLeft","marginRight","borderRadius","flex","paddingTop","paddingRight","marginBottom","flexShrink","marginTop","unreadBadge","minWidth","minHeight","position","left","right","bottom"],"sources":["index.tsx"],"sourcesContent":["import React from 'react';\nimport { View } from 'react-native';\n\nimport { conditionChaining } from '@sendbird/uikit-utils';\n\nimport Icon from '../../components/Icon';\nimport Image from '../../components/Image';\nimport Text from '../../components/Text';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\nimport Badge from '../Badge';\n\ntype Props = {\n  customCover?: React.ReactElement;\n  coverUrl: string;\n\n  title: string;\n\n  titleCaption: string;\n  titleCaptionLeft?: React.ReactElement;\n\n  bodyIcon?: keyof typeof Icon.Assets;\n  body: string;\n\n  memberCount?: number;\n  badgeCount: number;\n  maxBadgeCount?: number;\n\n  frozen?: boolean;\n  notificationOff?: boolean;\n  broadcast?: boolean;\n};\n\nconst GroupChannelPreview = ({\n  customCover,\n  coverUrl,\n  memberCount,\n  badgeCount,\n  maxBadgeCount,\n  body,\n  bodyIcon,\n  title,\n  titleCaption,\n  titleCaptionLeft,\n  frozen,\n  notificationOff,\n  broadcast,\n}: Props) => {\n  const { colors } = useUIKitTheme();\n  const color = colors.ui.groupChannelPreview;\n\n  return (\n    <View style={[styles.container, { backgroundColor: color.default.none.background }]}>\n      <View style={styles.coverContainer}>\n        {conditionChaining(\n          [Boolean(customCover)],\n          [\n            customCover,\n            <Image\n              resizeMode={'cover'}\n              style={[styles.channelCover, { backgroundColor: color.default.none.coverBackground }]}\n              source={{ uri: coverUrl }}\n            />,\n          ],\n        )}\n      </View>\n      <View style={styles.rightSection}>\n        <View style={styles.rightTopSection}>\n          <View style={styles.channelInfoContainer}>\n            {broadcast && (\n              <Icon\n                size={16}\n                icon={'broadcast'}\n                color={colors.secondary}\n                containerStyle={styles.channelInfoBroadcast}\n              />\n            )}\n            <Text numberOfLines={1} subtitle1 style={styles.channelInfoTitle} color={color.default.none.textTitle}>\n              {title}\n            </Text>\n            {Boolean(memberCount) && (\n              <Text caption1 style={styles.channelInfoMemberCount} color={color.default.none.memberCount}>\n                {memberCount}\n              </Text>\n            )}\n            {frozen && (\n              <Icon size={16} icon={'freeze'} color={colors.primary} containerStyle={styles.channelInfoFrozen} />\n            )}\n            {notificationOff && <Icon size={16} icon={'notifications-off-filled'} color={colors.onBackground03} />}\n          </View>\n          <View style={styles.titleCaptionContainer}>\n            {titleCaptionLeft}\n            <Text caption2 color={color.default.none.textTitleCaption} style={styles.titleCaptionText}>\n              {titleCaption}\n            </Text>\n          </View>\n        </View>\n\n        <View style={styles.rightBottomSection}>\n          <View style={styles.body}>\n            <View style={styles.bodyWrapper}>\n              {bodyIcon && (\n                <Icon\n                  size={18}\n                  icon={bodyIcon}\n                  color={color.default.none.bodyIcon}\n                  containerStyle={[\n                    styles.bodyIcon,\n                    { backgroundColor: colors.ui.groupChannelPreview.default.none.bodyIconBackground },\n                  ]}\n                />\n              )}\n              <Text body3 numberOfLines={1} style={styles.bodyText} color={color.default.none.textBody}>\n                {body}\n              </Text>\n            </View>\n          </View>\n          <View>{badgeCount > 0 && <Badge count={badgeCount} maxCount={maxBadgeCount} />}</View>\n        </View>\n        <Separator color={color.default.none.separator} />\n      </View>\n    </View>\n  );\n};\n\ntype SeparatorProps = { color: string };\nconst Separator = ({ color }: SeparatorProps) => <View style={[styles.separator, { backgroundColor: color }]} />;\n\nconst styles = createStyleSheet({\n  container: {\n    height: 76,\n    width: '100%',\n    flexDirection: 'row',\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n  coverContainer: {\n    marginLeft: 16,\n    marginRight: 16,\n  },\n  channelCover: {\n    width: 56,\n    height: 56,\n    borderRadius: 28,\n  },\n  rightSection: {\n    flex: 1,\n    paddingTop: 10,\n    paddingRight: 16,\n  },\n  rightTopSection: {\n    flexDirection: 'row',\n    marginBottom: 4,\n  },\n  channelInfoContainer: {\n    flex: 1,\n    marginRight: 4,\n    alignItems: 'center',\n    flexDirection: 'row',\n  },\n  channelInfoBroadcast: {\n    marginRight: 4,\n  },\n  channelInfoTitle: {\n    flexShrink: 1,\n    marginRight: 4,\n  },\n  channelInfoMemberCount: {\n    paddingTop: 2,\n    marginRight: 4,\n  },\n  channelInfoFrozen: {\n    marginRight: 4,\n  },\n  titleCaptionContainer: {\n    alignItems: 'flex-start',\n    flexDirection: 'row',\n    marginLeft: 4,\n  },\n  titleCaptionText: {\n    marginTop: 2,\n  },\n  rightBottomSection: {\n    flex: 1,\n    height: '100%',\n    flexDirection: 'row',\n  },\n  body: {\n    marginRight: 4,\n    flex: 1,\n    flexDirection: 'row',\n    alignItems: 'flex-start',\n  },\n  bodyWrapper: {\n    flexDirection: 'row',\n    alignItems: 'center',\n  },\n  bodyText: {\n    flex: 1,\n  },\n  bodyIcon: {\n    borderRadius: 8,\n    width: 26,\n    height: 26,\n    marginRight: 4,\n  },\n  unreadBadge: {\n    minWidth: 20,\n    minHeight: 20,\n    borderRadius: 99,\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n  separator: {\n    position: 'absolute',\n    left: 0,\n    right: -16,\n    bottom: 0,\n    height: 1,\n  },\n});\n\nexport default GroupChannelPreview;\n"],"mappings":"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"}
+{"version":3,"names":["React","View","conditionChaining","Icon","Image","Text","createStyleSheet","useUIKitTheme","Badge","GroupChannelPreview","customCover","coverUrl","memberCount","badgeCount","maxBadgeCount","body","bodyIcon","title","titleCaption","titleCaptionLeft","frozen","notificationOff","broadcast","mentioned","mentionTrigger","colors","color","ui","groupChannelPreview","styles","container","backgroundColor","default","none","background","coverContainer","Boolean","channelCover","coverBackground","uri","rightSection","rightTopSection","channelInfoContainer","secondary","channelInfoBroadcast","channelInfoTitle","textTitle","channelInfoMemberCount","primary","channelInfoFrozen","onBackground03","titleCaptionContainer","textTitleCaption","titleCaptionText","rightBottomSection","bodyWrapper","bodyIconBackground","bodyText","textBody","unreadContainer","badge","unreadMention","separator","Separator","height","width","flexDirection","alignItems","justifyContent","marginLeft","marginRight","borderRadius","flex","paddingTop","paddingRight","marginBottom","flexShrink","marginTop","position","left","right","bottom"],"sources":["index.tsx"],"sourcesContent":["import React from 'react';\nimport { View } from 'react-native';\n\nimport { conditionChaining } from '@sendbird/uikit-utils';\n\nimport Icon from '../../components/Icon';\nimport Image from '../../components/Image';\nimport Text from '../../components/Text';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\nimport Badge from '../Badge';\n\ntype Props = {\n  customCover?: React.ReactElement;\n  coverUrl: string;\n\n  title: string;\n\n  titleCaption: string;\n  titleCaptionLeft?: React.ReactElement;\n\n  bodyIcon?: keyof typeof Icon.Assets;\n  body: string;\n\n  memberCount?: number;\n  badgeCount: number;\n  maxBadgeCount?: number;\n\n  frozen?: boolean;\n  notificationOff?: boolean;\n  broadcast?: boolean;\n  mentioned?: boolean;\n  mentionTrigger?: string;\n};\n\nconst GroupChannelPreview = ({\n  customCover,\n  coverUrl,\n  memberCount,\n  badgeCount,\n  maxBadgeCount,\n  body,\n  bodyIcon,\n  title,\n  titleCaption,\n  titleCaptionLeft,\n  frozen,\n  notificationOff,\n  broadcast,\n  mentioned,\n  mentionTrigger = '@',\n}: Props) => {\n  const { colors } = useUIKitTheme();\n  const color = colors.ui.groupChannelPreview;\n\n  return (\n    <View style={[styles.container, { backgroundColor: color.default.none.background }]}>\n      <View style={styles.coverContainer}>\n        {conditionChaining(\n          [Boolean(customCover)],\n          [\n            customCover,\n            <Image\n              resizeMode={'cover'}\n              style={[styles.channelCover, { backgroundColor: color.default.none.coverBackground }]}\n              source={{ uri: coverUrl }}\n            />,\n          ],\n        )}\n      </View>\n      <View style={styles.rightSection}>\n        <View style={styles.rightTopSection}>\n          <View style={styles.channelInfoContainer}>\n            {broadcast && (\n              <Icon\n                size={16}\n                icon={'broadcast'}\n                color={colors.secondary}\n                containerStyle={styles.channelInfoBroadcast}\n              />\n            )}\n            <Text numberOfLines={1} subtitle1 style={styles.channelInfoTitle} color={color.default.none.textTitle}>\n              {title}\n            </Text>\n            {Boolean(memberCount) && (\n              <Text caption1 style={styles.channelInfoMemberCount} color={color.default.none.memberCount}>\n                {memberCount}\n              </Text>\n            )}\n            {frozen && (\n              <Icon size={16} icon={'freeze'} color={colors.primary} containerStyle={styles.channelInfoFrozen} />\n            )}\n            {notificationOff && <Icon size={16} icon={'notifications-off-filled'} color={colors.onBackground03} />}\n          </View>\n          <View style={styles.titleCaptionContainer}>\n            {titleCaptionLeft}\n            <Text caption2 color={color.default.none.textTitleCaption} style={styles.titleCaptionText}>\n              {titleCaption}\n            </Text>\n          </View>\n        </View>\n\n        <View style={styles.rightBottomSection}>\n          <View style={styles.body}>\n            <View style={styles.bodyWrapper}>\n              {bodyIcon && (\n                <Icon\n                  size={18}\n                  icon={bodyIcon}\n                  color={color.default.none.bodyIcon}\n                  containerStyle={[\n                    styles.bodyIcon,\n                    { backgroundColor: colors.ui.groupChannelPreview.default.none.bodyIconBackground },\n                  ]}\n                />\n              )}\n              <Text body3 numberOfLines={1} style={styles.bodyText} color={color.default.none.textBody}>\n                {body}\n              </Text>\n            </View>\n          </View>\n          <View style={styles.unreadContainer}>\n            {mentioned && (\n              <Text h2 color={colors.ui.badge.default.none.background} style={styles.unreadMention}>\n                {mentionTrigger}\n              </Text>\n            )}\n            {badgeCount > 0 && <Badge count={badgeCount} maxCount={maxBadgeCount} />}\n          </View>\n        </View>\n        <Separator color={color.default.none.separator} />\n      </View>\n    </View>\n  );\n};\n\ntype SeparatorProps = { color: string };\nconst Separator = ({ color }: SeparatorProps) => <View style={[styles.separator, { backgroundColor: color }]} />;\n\nconst styles = createStyleSheet({\n  container: {\n    height: 76,\n    width: '100%',\n    flexDirection: 'row',\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n  coverContainer: {\n    marginLeft: 16,\n    marginRight: 16,\n  },\n  channelCover: {\n    width: 56,\n    height: 56,\n    borderRadius: 28,\n  },\n  rightSection: {\n    flex: 1,\n    paddingTop: 10,\n    paddingRight: 16,\n  },\n  rightTopSection: {\n    flexDirection: 'row',\n    marginBottom: 4,\n  },\n  channelInfoContainer: {\n    flex: 1,\n    marginRight: 4,\n    alignItems: 'center',\n    flexDirection: 'row',\n  },\n  channelInfoBroadcast: {\n    marginRight: 4,\n  },\n  channelInfoTitle: {\n    flexShrink: 1,\n    marginRight: 4,\n  },\n  channelInfoMemberCount: {\n    paddingTop: 2,\n    marginRight: 4,\n  },\n  channelInfoFrozen: {\n    marginRight: 4,\n  },\n  titleCaptionContainer: {\n    alignItems: 'flex-start',\n    flexDirection: 'row',\n    marginLeft: 4,\n  },\n  titleCaptionText: {\n    marginTop: 2,\n  },\n  rightBottomSection: {\n    flex: 1,\n    height: '100%',\n    flexDirection: 'row',\n  },\n  body: {\n    marginRight: 4,\n    flex: 1,\n    flexDirection: 'row',\n    alignItems: 'flex-start',\n  },\n  bodyWrapper: {\n    flexDirection: 'row',\n    alignItems: 'center',\n  },\n  bodyText: {\n    flex: 1,\n  },\n  bodyIcon: {\n    borderRadius: 8,\n    width: 26,\n    height: 26,\n    marginRight: 4,\n  },\n  unreadContainer: {\n    flexDirection: 'row',\n    alignItems: 'flex-start',\n  },\n  unreadMention: {\n    marginRight: 4,\n  },\n  separator: {\n    position: 'absolute',\n    left: 0,\n    right: -16,\n    bottom: 0,\n    height: 1,\n  },\n});\n\nexport default GroupChannelPreview;\n"],"mappings":"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"}

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

@@ -44,6 +44,8 @@ declare const IconAssets: {
     play: any;
     plus: any;
     question: any;
+    'radio-off': any;
+    'radio-on': any;
     refresh: any;
     remove: any;
     'reply-filled': any;

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

@@ -1,5 +1,5 @@
 import { StyleProp, ViewStyle } from 'react-native';
-declare type Props = {
+type Props = {
     style?: StyleProp<ViewStyle>;
     space?: number;
 };

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

@@ -1,7 +1,7 @@
 import { ImageStyle, StyleProp, ViewStyle } from 'react-native';
 import IconAssets from '../../assets/icon';
-declare type IconNames = keyof typeof IconAssets;
-declare type Props = {
+type IconNames = keyof typeof IconAssets;
+type Props = {
     icon: IconNames;
     color?: string;
     size?: number;

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

@@ -9,6 +9,6 @@ export interface SendbirdImageProps extends Omit<NativeImageProps, 'onLoad' | 'o
     }) => void;
     tintColor?: string;
 }
-export declare type SendbirdImageComponent = (props: SendbirdImageProps) => JSX.Element;
+export type SendbirdImageComponent = (props: SendbirdImageProps) => JSX.Element;
 declare const _default: SendbirdImageComponent;
 export default _default;

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

@@ -1,6 +1,7 @@
 import { ModalProps, StyleProp, ViewStyle } from 'react-native';
-declare type Props = {
-    type?: 'slide' | 'fade';
+type ModalAnimationType = 'slide' | 'slide-no-gesture' | 'fade';
+type Props = {
+    type?: ModalAnimationType;
     onClose: () => void;
     backgroundStyle?: StyleProp<ViewStyle>;
     disableBackgroundClose?: boolean;

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

@@ -0,0 +1,16 @@
+import { TextProps } from '../Text';
+interface Pattern {
+    regex: RegExp;
+    replacer(params: {
+        match: string;
+        groups: string[];
+        index: number;
+        keyPrefix: string;
+        parentProps?: TextProps;
+    }): string | JSX.Element;
+}
+type Props = {
+    patterns: Pattern[];
+} & TextProps;
+declare const RegexText: ({ children, patterns, ...props }: Props) => JSX.Element;
+export default RegexText;

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

@@ -1,5 +1,5 @@
 import React from 'react';
-declare type SwitchProps = React.PropsWithChildren<{
+type SwitchProps = React.PropsWithChildren<{
     trackColor?: string;
     thumbColor?: string;
     inactiveThumbColor?: string;

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

@@ -1,7 +1,7 @@
 import { TextProps as RNTextProps } from 'react-native';
 import type { TypoName, UIKitTheme } from '../../types';
-declare type TypographyProps = Partial<Record<TypoName, boolean>>;
-export declare type TextProps = RNTextProps & TypographyProps & {
+type TypographyProps = Partial<Record<TypoName, boolean>>;
+export type TextProps = RNTextProps & TypographyProps & {
     color?: ((colors: UIKitTheme['colors']) => string) | string;
 };
 declare const Text: ({ children, color, style, ...props }: TextProps) => JSX.Element;

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

@@ -1,6 +1,6 @@
 import type { TextProps } from '../Text';
-declare type OnPressUrl = (url: string, httpProtocol: boolean) => void;
-declare type Props = TextProps & {
+type OnPressUrl = (url: string, httpProtocol: boolean) => void;
+type Props = TextProps & {
     onPressUrl?: OnPressUrl;
     strict?: boolean;
 };

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

@@ -5,6 +5,7 @@ export { default as Divider } from './components/Divider';
 export { default as Icon } from './components/Icon';
 export { default as Image } from './components/Image';
 export { default as Modal } from './components/Modal';
+export { default as RegexText } from './components/RegexText';
 export { default as Switch } from './components/Switch';
 export { default as Text } from './components/Text';
 export { default as TextInput } from './components/TextInput';

package/lib/typescript/src/styles/HeaderStyleContext.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import type { HeaderProps } from '../ui/Header';
-export declare type HeaderStyleContextType = {
+export type HeaderStyleContextType = {
     HeaderComponent: (props: HeaderProps) => React.ReactElement | null;
     defaultTitleAlign: 'left' | 'center';
     statusBarTranslucent: boolean;
@@ -8,6 +8,6 @@ export declare type HeaderStyleContextType = {
     defaultHeight: number;
 };
 export declare const HeaderStyleContext: React.Context<HeaderStyleContextType>;
-declare type Props = Pick<HeaderStyleContextType, 'statusBarTranslucent' | 'defaultTitleAlign' | 'HeaderComponent'>;
+type Props = Pick<HeaderStyleContextType, 'statusBarTranslucent' | 'defaultTitleAlign' | 'HeaderComponent'>;
 export declare const HeaderStyleProvider: ({ children, HeaderComponent, defaultTitleAlign, statusBarTranslucent, }: React.PropsWithChildren<Props>) => JSX.Element;
 export {};

package/lib/typescript/src/styles/createTypography.d.ts

@@ -1,5 +1,5 @@
 import type { FontAttributes, UIKitTypography } from '../types';
-export declare type UIKitTypographyOverrides = Partial<UIKitTypography> & {
+export type UIKitTypographyOverrides = Partial<UIKitTypography> & {
     shared?: Partial<FontAttributes>;
 };
 declare const createTypography: (overrides?: UIKitTypographyOverrides, scaleFactor?: (dp: number) => number) => UIKitTypography;

package/lib/typescript/src/theme/UIKitThemeProvider.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import type { UIKitTheme } from '../types';
-declare type Props = React.PropsWithChildren<{
+type Props = React.PropsWithChildren<{
     theme?: UIKitTheme;
 }>;
 declare const UIKitThemeProvider: ({ children, theme }: Props) => JSX.Element;

package/lib/typescript/src/theme/createTheme.d.ts

@@ -1,6 +1,6 @@
 import { UIKitTypographyOverrides } from '../styles/createTypography';
 import type { UIKitColors, UIKitTheme } from '../types';
-declare type Options = {
+type Options = {
     colorScheme: UIKitTheme['colorScheme'];
     colors: (palette: UIKitTheme['palette']) => UIKitColors;
     palette?: UIKitTheme['palette'];

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

@@ -14,9 +14,9 @@ export interface UIKitTypography {
     caption3: FontAttributes;
     caption4: FontAttributes;
 }
-export declare type TypoName = keyof UIKitTypography;
-export declare type FontAttributes = Pick<TextStyle, 'fontFamily' | 'fontSize' | 'lineHeight' | 'letterSpacing' | 'fontWeight'>;
-export declare type UIKitColorScheme = 'light' | 'dark';
+export type TypoName = keyof UIKitTypography;
+export type FontAttributes = Pick<TextStyle, 'fontFamily' | 'fontSize' | 'lineHeight' | 'letterSpacing' | 'fontWeight'>;
+export type UIKitColorScheme = 'light' | 'dark';
 export interface UIKitTheme {
     colorScheme: UIKitColorScheme;
     select<V>(options: {
@@ -26,8 +26,8 @@ export interface UIKitTheme {
     colors: UIKitColors;
     typography: UIKitTypography;
 }
-export declare type Component = 'Header' | 'Button' | 'Dialog' | 'Input' | 'Badge' | 'Placeholder' | 'Message' | 'DateSeparator' | 'GroupChannelPreview' | 'ProfileCard';
-export declare type GetColorTree<Tree extends {
+export type Component = 'Header' | 'Button' | 'Dialog' | 'Input' | 'Badge' | 'Placeholder' | 'Message' | 'DateSeparator' | 'GroupChannelPreview' | 'ProfileCard' | 'Reaction';
+export type GetColorTree<Tree extends {
     Variant: {
         [key in Component]: string;
     };
@@ -38,7 +38,7 @@ export declare type GetColorTree<Tree extends {
         [key in Component]: string;
     };
 }> = Tree;
-export declare type ComponentColorTree = GetColorTree<{
+export type ComponentColorTree = GetColorTree<{
     Variant: {
         Header: 'nav';
         Button: 'contained' | 'text';
@@ -50,6 +50,7 @@ export declare type ComponentColorTree = GetColorTree<{
         DateSeparator: 'default';
         GroupChannelPreview: 'default';
         ProfileCard: 'default';
+        Reaction: 'default' | 'rounded';
     };
     State: {
         Header: 'none';
@@ -62,6 +63,7 @@ export declare type ComponentColorTree = GetColorTree<{
         DateSeparator: 'none';
         GroupChannelPreview: 'none';
         ProfileCard: 'none';
+        Reaction: 'enabled' | 'selected';
     };
     ColorPart: {
         Header: 'background' | 'borderBottom';
@@ -74,9 +76,10 @@ export declare type ComponentColorTree = GetColorTree<{
         DateSeparator: 'text' | 'background';
         GroupChannelPreview: 'textTitle' | 'textTitleCaption' | 'textBody' | 'memberCount' | 'bodyIcon' | 'background' | 'coverBackground' | 'bodyIconBackground' | 'separator';
         ProfileCard: 'textUsername' | 'textBodyLabel' | 'textBody' | 'background';
+        Reaction: 'background' | 'highlight';
     };
 }>;
-export declare type ComponentColors<T extends Component> = {
+export type ComponentColors<T extends Component> = {
     [key in ComponentColorTree['Variant'][T]]: {
         [key in ComponentColorTree['State'][T]]: {
             [key in ComponentColorTree['ColorPart'][T]]: string;
@@ -117,17 +120,18 @@ export interface UIKitColors {
         dateSeparator: ComponentColors<'DateSeparator'>;
         groupChannelPreview: ComponentColors<'GroupChannelPreview'>;
         profileCard: ComponentColors<'ProfileCard'>;
+        reaction: ComponentColors<'Reaction'>;
     };
 }
-export declare type HeaderElement = string | ReactElement | null;
-export declare type HeaderPartProps = {
+export type HeaderElement = string | ReactElement | null;
+export type HeaderPartProps = {
     title?: HeaderElement;
     right?: HeaderElement;
     left?: HeaderElement;
     onPressLeft?: (...params: any[]) => any;
     onPressRight?: (...params: any[]) => any;
 };
-export declare type BaseHeaderProps<HeaderParts extends HeaderPartProps = {}, AdditionalProps = {}> = {
+export type BaseHeaderProps<HeaderParts extends HeaderPartProps = {}, AdditionalProps = {}> = {
     titleAlign?: 'left' | 'center' | 'right';
     children?: ReactNode;
 } & HeaderParts & AdditionalProps;

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

@@ -1,4 +1,4 @@
-export declare type ActionMenuItem = {
+export type ActionMenuItem = {
     title?: string;
     menuItems: {
         title: string;
@@ -7,7 +7,7 @@ export declare type ActionMenuItem = {
         onError?: () => void;
     }[];
 };
-declare type Props = {
+type Props = {
     visible: boolean;
     onHide: () => void;
     onError?: (error: unknown) => void;

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

@@ -1,10 +1,10 @@
 import { AlertButton } from 'react-native';
-export declare type AlertItem = {
+export type AlertItem = {
     title?: string;
     message?: string;
     buttons?: AlertButton[];
 };
-declare type Props = {
+type Props = {
     visible: boolean;
     onHide: () => void;
     onDismiss?: () => void;

package/lib/typescript/src/ui/Avatar/AvatarGroup.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import { StyleProp, ViewStyle } from 'react-native';
-declare type Props = React.PropsWithChildren<{
+type Props = React.PropsWithChildren<{
     size?: number;
     containerStyle?: StyleProp<ViewStyle>;
 }>;

package/lib/typescript/src/ui/Avatar/AvatarIcon.d.ts

@@ -1,6 +1,6 @@
 import { StyleProp, ViewStyle } from 'react-native';
 import Icon from '../../components/Icon';
-declare type Props = {
+type Props = {
     icon: keyof typeof Icon.Assets;
     size?: number;
     backgroundColor?: string;

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

@@ -1,11 +1,11 @@
 import { StyleProp, ViewStyle } from 'react-native';
 import AvatarGroup from './AvatarGroup';
 import AvatarIcon from './AvatarIcon';
-declare type SubComponents = {
+type SubComponents = {
     Group: typeof AvatarGroup;
     Icon: typeof AvatarIcon;
 };
-declare type Props = {
+type Props = {
     uri?: string;
     size?: number;
     square?: boolean;

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

@@ -1,5 +1,5 @@
 import { StyleProp, ViewStyle } from 'react-native';
-declare type Props = {
+type Props = {
     count: number;
     maxCount?: number;
     badgeColor?: string;

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

@@ -1,5 +1,8 @@
 import type Icon from '../../components/Icon';
-export declare type BottomSheetItem = {
+type HeaderProps = {
+    onClose: () => Promise<void>;
+};
+export type BottomSheetItem = {
     sheetItems: {
         icon?: keyof typeof Icon.Assets;
         iconColor?: string;
@@ -7,12 +10,13 @@ export declare type BottomSheetItem = {
         titleColor?: string;
         onPress: () => void;
     }[];
+    HeaderComponent?: (props: HeaderProps) => JSX.Element;
 };
-declare type Props = {
+type Props = {
     visible: boolean;
     onHide: () => Promise<void>;
     onError?: (error: unknown) => void;
     onDismiss?: () => void;
 } & BottomSheetItem;
-declare const BottomSheet: ({ onDismiss, onHide, visible, sheetItems }: Props) => JSX.Element;
+declare const BottomSheet: ({ onDismiss, onHide, visible, sheetItems, HeaderComponent }: Props) => JSX.Element;
 export default BottomSheet;

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

@@ -1,7 +1,7 @@
 import React from 'react';
 import { StyleProp, ViewStyle } from 'react-native';
 import Icon from '../../components/Icon';
-declare type Props = React.PropsWithChildren<{
+type Props = React.PropsWithChildren<{
     style?: StyleProp<ViewStyle>;
     icon?: keyof typeof Icon.Assets;
     variant?: 'contained' | 'text';

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

@@ -1,5 +1,5 @@
 import { StyleProp, ViewStyle } from 'react-native';
-declare type Props = {
+type Props = {
     style?: StyleProp<ViewStyle>;
     text?: string;
     textColor?: string;

package/lib/typescript/src/ui/Dialog/DialogBox.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import { StyleProp, ViewStyle } from 'react-native';
-declare type Props = React.PropsWithChildren<{
+type Props = React.PropsWithChildren<{
     style?: StyleProp<ViewStyle>;
 }>;
 declare const DialogBox: ({ style, children }: Props) => JSX.Element;

package/lib/typescript/src/ui/Dialog/DialogSheet.d.ts

@@ -1,13 +1,13 @@
 import React from 'react';
 import { StyleProp, ViewStyle } from 'react-native';
 import Icon from '../../components/Icon';
-declare type Props = React.PropsWithChildren<{
+type Props = React.PropsWithChildren<{
     style?: StyleProp<ViewStyle>;
 }>;
 declare const DialogSheet: ((props: Props) => JSX.Element) & {
     Item: typeof SheetItem;
 };
-export declare type SheetItemProps = {
+export type SheetItemProps = {
     icon?: keyof typeof Icon.Assets;
     iconColor?: string;
     title: string;

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

@@ -3,7 +3,7 @@ import type { ActionMenuItem } from '../ActionMenu';
 import type { AlertItem } from '../Alert';
 import type { BottomSheetItem } from '../BottomSheet';
 import type { PromptItem } from '../Prompt';
-declare type DialogJob = {
+type DialogJob = {
     type: 'ActionMenu';
     props: ActionMenuItem;
 } | {
@@ -16,17 +16,17 @@ declare type DialogJob = {
     type: 'BottomSheet';
     props: BottomSheetItem;
 };
-declare type DialogPropsBy<T extends DialogJob['type'], U extends DialogJob = DialogJob> = U extends {
+type DialogPropsBy<T extends DialogJob['type'], U extends DialogJob = DialogJob> = U extends {
     type: T;
     props: infer P;
 } ? P : never;
-declare type DialogContextType = {
+type DialogContextType = {
     openMenu: (props: DialogPropsBy<'ActionMenu'>) => void;
     alert: (props: DialogPropsBy<'Alert'>) => void;
     openPrompt: (props: DialogPropsBy<'Prompt'>) => void;
     openSheet: (props: DialogPropsBy<'BottomSheet'>) => void;
 };
-declare type Props = React.PropsWithChildren<{
+type Props = React.PropsWithChildren<{
     defaultLabels?: {
         alert?: {
             ok?: string;

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

@@ -1,6 +1,6 @@
 import React from 'react';
 import Icon from '../../components/Icon';
-declare type Props = {
+type Props = {
     customCover?: React.ReactElement;
     coverUrl: string;
     title: string;
@@ -14,6 +14,8 @@ declare type Props = {
     frozen?: boolean;
     notificationOff?: boolean;
     broadcast?: boolean;
+    mentioned?: boolean;
+    mentionTrigger?: string;
 };
-declare const GroupChannelPreview: ({ customCover, coverUrl, memberCount, badgeCount, maxBadgeCount, body, bodyIcon, title, titleCaption, titleCaptionLeft, frozen, notificationOff, broadcast, }: Props) => JSX.Element;
+declare const GroupChannelPreview: ({ customCover, coverUrl, memberCount, badgeCount, maxBadgeCount, body, bodyIcon, title, titleCaption, titleCaptionLeft, frozen, notificationOff, broadcast, mentioned, mentionTrigger, }: Props) => JSX.Element;
 export default GroupChannelPreview;

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

@@ -2,8 +2,8 @@ import React from 'react';
 import { TouchableOpacityProps } from 'react-native';
 import { TextProps } from '../../components/Text';
 import type { BaseHeaderProps } from '../../index';
-declare type HeaderElement = string | React.ReactElement | null;
-export declare type HeaderProps = BaseHeaderProps<{
+type HeaderElement = string | React.ReactElement | null;
+export type HeaderProps = BaseHeaderProps<{
     title?: HeaderElement;
     left?: HeaderElement;
     right?: HeaderElement;

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

@@ -1,5 +1,5 @@
 import { StyleProp, ViewStyle } from 'react-native';
-declare type Props = {
+type Props = {
     size?: number;
     color?: string;
     style?: StyleProp<ViewStyle>;

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

@@ -1,6 +1,6 @@
 import React from 'react';
 import Icon from '../../components/Icon';
-export declare type MenuBarProps = {
+export type MenuBarProps = {
     variant?: 'default' | 'contained';
     onPress: () => void;
     disabled?: boolean;

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

@@ -1,5 +1,5 @@
 import { StyleProp, ViewStyle } from 'react-native';
-declare type OutlinedButtonProps = {
+type OutlinedButtonProps = {
     children: string;
     containerStyle?: StyleProp<ViewStyle>;
     onPress?: () => void;

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

@@ -1,5 +1,5 @@
 import Icon from '../../components/Icon';
-declare type Props = {
+type Props = {
     loading?: boolean;
     icon: keyof typeof Icon.Assets;
     message?: string;

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

@@ -1,5 +1,5 @@
 import { StyleProp, ViewStyle } from 'react-native';
-declare type Props = {
+type Props = {
     uri: string;
     username: string;
     button?: JSX.Element;

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

@@ -1,4 +1,4 @@
-export declare type PromptItem = {
+export type PromptItem = {
     title: string;
     placeholder?: string;
     defaultValue?: string;
@@ -7,7 +7,7 @@ export declare type PromptItem = {
     onCancel?: () => void;
     cancelLabel?: string;
 };
-declare type Props = {
+type Props = {
     visible: boolean;
     onHide: () => void;
     onDismiss?: () => void;

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

@@ -1,9 +1,9 @@
 import React from 'react';
-declare type ToastType = 'normal' | 'error' | 'success';
-declare type Context = {
+type ToastType = 'normal' | 'error' | 'success';
+type Context = {
     show(text: string, type?: ToastType): void;
 };
-declare type Props = React.PropsWithChildren<{
+type Props = React.PropsWithChildren<{
     top?: number;
     bottom?: number;
     visible: boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sendbird/uikit-react-native-foundation",
-  "version": "2.1.0",
+  "version": "2.3.0",
   "description": "react-native-uikit",
   "main": "lib/commonjs/index",
   "module": "lib/module/index",
@@ -16,7 +16,8 @@
   "scripts": {
     "test": "jest",
     "build": "bob build",
-    "clean": "del lib"
+    "clean": "del lib",
+    "generate-icons": "node src/assets/bundle-icons.js"
   },
   "keywords": [
     "react-native",
@@ -38,7 +39,7 @@
     "access": "public"
   },
   "dependencies": {
-    "@sendbird/uikit-utils": "2.1.0"
+    "@sendbird/uikit-utils": "2.3.0"
   },
   "devDependencies": {
     "@types/react": "*",
@@ -48,7 +49,7 @@
     "react-native-builder-bob": "^0.18.0",
     "react-native-fast-image": "^8.5.11",
     "react-native-safe-area-context": "^3.3.2",
-    "typescript": "^4.1.3"
+    "typescript": "4.9.4"
   },
   "peerDependencies": {
     "react": ">=16.13.1",
@@ -80,5 +81,5 @@
     "readmeFile": "./README.md",
     "displayName": "@sendbird/uikit-react-native-foundation"
   },
-  "gitHead": "c778a84a632487047fe532db188b32dfa6e93a7f"
+  "gitHead": "a9bf41fd7919436db99f6cc3bacd0f8d791b7729"
 }