@sendbird/uikit-react-native-foundation 2.4.1 → 2.4.2

package/lib/module/ui/ProfileCard/index.js

@@ -5,7 +5,6 @@ import Text from '../../components/Text';
 import createStyleSheet from '../../styles/createStyleSheet';
 import useUIKitTheme from '../../theme/useUIKitTheme';
 import Avatar from '../Avatar';
-
 const ProfileCard = _ref => {
   let {
     uri,
@@ -49,7 +48,6 @@ const ProfileCard = _ref => {
     color: color.textBody
   }, body)));
 };
-
 const styles = createStyleSheet({
   container: {
     paddingTop: 32,

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

@@ -1 +1 @@
-{"version":3,"names":["React","View","Divider","Text","createStyleSheet","useUIKitTheme","Avatar","ProfileCard","uri","username","bodyLabel","body","button","containerStyle","colors","color","ui","profileCard","default","none","styles","container","backgroundColor","background","profileContainer","profileAvatar","textUsername","messageButtonArea","profileInfoContainer","textBodyLabel","profileInfoBodyLabel","textBody","paddingTop","width","alignItems","paddingHorizontal","marginBottom","padding","marginHorizontal"],"sources":["index.tsx"],"sourcesContent":["import React from 'react';\nimport { StyleProp, View, ViewStyle } from 'react-native';\n\nimport Divider from '../../components/Divider';\nimport Text from '../../components/Text';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\nimport Avatar from '../Avatar';\n\ntype Props = {\n  uri: string;\n  username: string;\n\n  button?: JSX.Element;\n\n  bodyLabel: string;\n  body: string;\n\n  containerStyle?: StyleProp<ViewStyle>;\n};\n\nconst ProfileCard = ({ uri, username, bodyLabel, body, button, containerStyle }: Props) => {\n  const { colors } = useUIKitTheme();\n  const color = colors.ui.profileCard.default.none;\n\n  return (\n    <View style={[styles.container, { backgroundColor: color.background }, containerStyle]}>\n      <View style={styles.profileContainer}>\n        <Avatar uri={uri} size={80} containerStyle={styles.profileAvatar} />\n        <Text h1 color={color.textUsername} numberOfLines={1}>\n          {username}\n        </Text>\n      </View>\n      {button && <View style={styles.messageButtonArea}>{button}</View>}\n      <Divider space={16} />\n      <View style={styles.profileInfoContainer}>\n        <Text body2 color={color.textBodyLabel} style={styles.profileInfoBodyLabel}>\n          {bodyLabel}\n        </Text>\n        <Text body3 numberOfLines={1} color={color.textBody}>\n          {body}\n        </Text>\n      </View>\n    </View>\n  );\n};\n\nconst styles = createStyleSheet({\n  container: {\n    paddingTop: 32,\n    width: '100%',\n  },\n  profileContainer: {\n    alignItems: 'center',\n    paddingHorizontal: 16,\n    marginBottom: 24,\n  },\n  profileAvatar: {\n    marginBottom: 8,\n  },\n  profileInfoContainer: {\n    padding: 16,\n  },\n  profileInfoBodyLabel: {\n    marginBottom: 4,\n  },\n  messageButtonArea: {\n    marginHorizontal: 24,\n    marginBottom: 24,\n  },\n});\n\nexport default ProfileCard;\n"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAAoBC,IAApB,QAA2C,cAA3C;AAEA,OAAOC,OAAP,MAAoB,0BAApB;AACA,OAAOC,IAAP,MAAiB,uBAAjB;AACA,OAAOC,gBAAP,MAA6B,+BAA7B;AACA,OAAOC,aAAP,MAA0B,2BAA1B;AACA,OAAOC,MAAP,MAAmB,WAAnB;;AAcA,MAAMC,WAAW,GAAG,QAAuE;EAAA,IAAtE;IAAEC,GAAF;IAAOC,QAAP;IAAiBC,SAAjB;IAA4BC,IAA5B;IAAkCC,MAAlC;IAA0CC;EAA1C,CAAsE;EACzF,MAAM;IAAEC;EAAF,IAAaT,aAAa,EAAhC;EACA,MAAMU,KAAK,GAAGD,MAAM,CAACE,EAAP,CAAUC,WAAV,CAAsBC,OAAtB,CAA8BC,IAA5C;EAEA,oBACE,oBAAC,IAAD;IAAM,KAAK,EAAE,CAACC,MAAM,CAACC,SAAR,EAAmB;MAAEC,eAAe,EAAEP,KAAK,CAACQ;IAAzB,CAAnB,EAA0DV,cAA1D;EAAb,gBACE,oBAAC,IAAD;IAAM,KAAK,EAAEO,MAAM,CAACI;EAApB,gBACE,oBAAC,MAAD;IAAQ,GAAG,EAAEhB,GAAb;IAAkB,IAAI,EAAE,EAAxB;IAA4B,cAAc,EAAEY,MAAM,CAACK;EAAnD,EADF,eAEE,oBAAC,IAAD;IAAM,EAAE,MAAR;IAAS,KAAK,EAAEV,KAAK,CAACW,YAAtB;IAAoC,aAAa,EAAE;EAAnD,GACGjB,QADH,CAFF,CADF,EAOGG,MAAM,iBAAI,oBAAC,IAAD;IAAM,KAAK,EAAEQ,MAAM,CAACO;EAApB,GAAwCf,MAAxC,CAPb,eAQE,oBAAC,OAAD;IAAS,KAAK,EAAE;EAAhB,EARF,eASE,oBAAC,IAAD;IAAM,KAAK,EAAEQ,MAAM,CAACQ;EAApB,gBACE,oBAAC,IAAD;IAAM,KAAK,MAAX;IAAY,KAAK,EAAEb,KAAK,CAACc,aAAzB;IAAwC,KAAK,EAAET,MAAM,CAACU;EAAtD,GACGpB,SADH,CADF,eAIE,oBAAC,IAAD;IAAM,KAAK,MAAX;IAAY,aAAa,EAAE,CAA3B;IAA8B,KAAK,EAAEK,KAAK,CAACgB;EAA3C,GACGpB,IADH,CAJF,CATF,CADF;AAoBD,CAxBD;;AA0BA,MAAMS,MAAM,GAAGhB,gBAAgB,CAAC;EAC9BiB,SAAS,EAAE;IACTW,UAAU,EAAE,EADH;IAETC,KAAK,EAAE;EAFE,CADmB;EAK9BT,gBAAgB,EAAE;IAChBU,UAAU,EAAE,QADI;IAEhBC,iBAAiB,EAAE,EAFH;IAGhBC,YAAY,EAAE;EAHE,CALY;EAU9BX,aAAa,EAAE;IACbW,YAAY,EAAE;EADD,CAVe;EAa9BR,oBAAoB,EAAE;IACpBS,OAAO,EAAE;EADW,CAbQ;EAgB9BP,oBAAoB,EAAE;IACpBM,YAAY,EAAE;EADM,CAhBQ;EAmB9BT,iBAAiB,EAAE;IACjBW,gBAAgB,EAAE,EADD;IAEjBF,YAAY,EAAE;EAFG;AAnBW,CAAD,CAA/B;AAyBA,eAAe7B,WAAf"}
+{"version":3,"names":["React","View","Divider","Text","createStyleSheet","useUIKitTheme","Avatar","ProfileCard","_ref","uri","username","bodyLabel","body","button","containerStyle","colors","color","ui","profileCard","default","none","createElement","style","styles","container","backgroundColor","background","profileContainer","size","profileAvatar","h1","textUsername","numberOfLines","messageButtonArea","space","profileInfoContainer","body2","textBodyLabel","profileInfoBodyLabel","body3","textBody","paddingTop","width","alignItems","paddingHorizontal","marginBottom","padding","marginHorizontal"],"sources":["index.tsx"],"sourcesContent":["import React from 'react';\nimport { StyleProp, View, ViewStyle } from 'react-native';\n\nimport Divider from '../../components/Divider';\nimport Text from '../../components/Text';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\nimport Avatar from '../Avatar';\n\ntype Props = {\n  uri: string;\n  username: string;\n\n  button?: JSX.Element;\n\n  bodyLabel: string;\n  body: string;\n\n  containerStyle?: StyleProp<ViewStyle>;\n};\n\nconst ProfileCard = ({ uri, username, bodyLabel, body, button, containerStyle }: Props) => {\n  const { colors } = useUIKitTheme();\n  const color = colors.ui.profileCard.default.none;\n\n  return (\n    <View style={[styles.container, { backgroundColor: color.background }, containerStyle]}>\n      <View style={styles.profileContainer}>\n        <Avatar uri={uri} size={80} containerStyle={styles.profileAvatar} />\n        <Text h1 color={color.textUsername} numberOfLines={1}>\n          {username}\n        </Text>\n      </View>\n      {button && <View style={styles.messageButtonArea}>{button}</View>}\n      <Divider space={16} />\n      <View style={styles.profileInfoContainer}>\n        <Text body2 color={color.textBodyLabel} style={styles.profileInfoBodyLabel}>\n          {bodyLabel}\n        </Text>\n        <Text body3 numberOfLines={1} color={color.textBody}>\n          {body}\n        </Text>\n      </View>\n    </View>\n  );\n};\n\nconst styles = createStyleSheet({\n  container: {\n    paddingTop: 32,\n    width: '100%',\n  },\n  profileContainer: {\n    alignItems: 'center',\n    paddingHorizontal: 16,\n    marginBottom: 24,\n  },\n  profileAvatar: {\n    marginBottom: 8,\n  },\n  profileInfoContainer: {\n    padding: 16,\n  },\n  profileInfoBodyLabel: {\n    marginBottom: 4,\n  },\n  messageButtonArea: {\n    marginHorizontal: 24,\n    marginBottom: 24,\n  },\n});\n\nexport default ProfileCard;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAAoBC,IAAI,QAAmB,cAAc;AAEzD,OAAOC,OAAO,MAAM,0BAA0B;AAC9C,OAAOC,IAAI,MAAM,uBAAuB;AACxC,OAAOC,gBAAgB,MAAM,+BAA+B;AAC5D,OAAOC,aAAa,MAAM,2BAA2B;AACrD,OAAOC,MAAM,MAAM,WAAW;AAc9B,MAAMC,WAAW,GAAGC,IAAA,IAAuE;EAAA,IAAtE;IAAEC,GAAG;IAAEC,QAAQ;IAAEC,SAAS;IAAEC,IAAI;IAAEC,MAAM;IAAEC;EAAsB,CAAC,GAAAN,IAAA;EACpF,MAAM;IAAEO;EAAO,CAAC,GAAGV,aAAa,EAAE;EAClC,MAAMW,KAAK,GAAGD,MAAM,CAACE,EAAE,CAACC,WAAW,CAACC,OAAO,CAACC,IAAI;EAEhD,oBACEpB,KAAA,CAAAqB,aAAA,CAACpB,IAAI;IAACqB,KAAK,EAAE,CAACC,MAAM,CAACC,SAAS,EAAE;MAAEC,eAAe,EAAET,KAAK,CAACU;IAAW,CAAC,EAAEZ,cAAc;EAAE,gBACrFd,KAAA,CAAAqB,aAAA,CAACpB,IAAI;IAACqB,KAAK,EAAEC,MAAM,CAACI;EAAiB,gBACnC3B,KAAA,CAAAqB,aAAA,CAACf,MAAM;IAACG,GAAG,EAAEA,GAAI;IAACmB,IAAI,EAAE,EAAG;IAACd,cAAc,EAAES,MAAM,CAACM;EAAc,EAAG,eACpE7B,KAAA,CAAAqB,aAAA,CAAClB,IAAI;IAAC2B,EAAE;IAACd,KAAK,EAAEA,KAAK,CAACe,YAAa;IAACC,aAAa,EAAE;EAAE,GAClDtB,QAAQ,CACJ,CACF,EACNG,MAAM,iBAAIb,KAAA,CAAAqB,aAAA,CAACpB,IAAI;IAACqB,KAAK,EAAEC,MAAM,CAACU;EAAkB,GAAEpB,MAAM,CAAQ,eACjEb,KAAA,CAAAqB,aAAA,CAACnB,OAAO;IAACgC,KAAK,EAAE;EAAG,EAAG,eACtBlC,KAAA,CAAAqB,aAAA,CAACpB,IAAI;IAACqB,KAAK,EAAEC,MAAM,CAACY;EAAqB,gBACvCnC,KAAA,CAAAqB,aAAA,CAAClB,IAAI;IAACiC,KAAK;IAACpB,KAAK,EAAEA,KAAK,CAACqB,aAAc;IAACf,KAAK,EAAEC,MAAM,CAACe;EAAqB,GACxE3B,SAAS,CACL,eACPX,KAAA,CAAAqB,aAAA,CAAClB,IAAI;IAACoC,KAAK;IAACP,aAAa,EAAE,CAAE;IAAChB,KAAK,EAAEA,KAAK,CAACwB;EAAS,GACjD5B,IAAI,CACA,CACF,CACF;AAEX,CAAC;AAED,MAAMW,MAAM,GAAGnB,gBAAgB,CAAC;EAC9BoB,SAAS,EAAE;IACTiB,UAAU,EAAE,EAAE;IACdC,KAAK,EAAE;EACT,CAAC;EACDf,gBAAgB,EAAE;IAChBgB,UAAU,EAAE,QAAQ;IACpBC,iBAAiB,EAAE,EAAE;IACrBC,YAAY,EAAE;EAChB,CAAC;EACDhB,aAAa,EAAE;IACbgB,YAAY,EAAE;EAChB,CAAC;EACDV,oBAAoB,EAAE;IACpBW,OAAO,EAAE;EACX,CAAC;EACDR,oBAAoB,EAAE;IACpBO,YAAY,EAAE;EAChB,CAAC;EACDZ,iBAAiB,EAAE;IACjBc,gBAAgB,EAAE,EAAE;IACpBF,YAAY,EAAE;EAChB;AACF,CAAC,CAAC;AAEF,eAAetC,WAAW"}

package/lib/module/ui/Prompt/index.js

@@ -9,7 +9,6 @@ import useHeaderStyle from '../../styles/useHeaderStyle';
 import useUIKitTheme from '../../theme/useUIKitTheme';
 import Button from '../Button';
 import DialogBox from '../Dialog/DialogBox';
-
 const Prompt = _ref => {
   let {
     onDismiss,
@@ -42,18 +41,18 @@ const Prompt = _ref => {
     text: submitLabel,
     onPress: () => onSubmit(text)
   }];
-  const [text, setText] = useState(defaultValue); // FIXME: autoFocus trick with modal
+  const [text, setText] = useState(defaultValue);
+
+  // FIXME: autoFocus trick with modal
   // Android
   // - InputProps.autoFocus is not trigger keyboard appearing.
   // - InputRef.focus() is trigger keyboard appearing, but position of keyboard selection is always the start of text.
   // iOS
   // - InputProps.autoFocus is trigger weird UI behavior on landscape mode.
-
   useEffect(() => {
     if (autoFocus && visible) {
       setTimeout(() => {
         var _inputRef$current, _inputRef$current2;
-
         if (Platform.OS === 'android') (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.blur();
         (_inputRef$current2 = inputRef.current) === null || _inputRef$current2 === void 0 ? void 0 : _inputRef$current2.focus();
       }, 250);
@@ -111,7 +110,6 @@ const Prompt = _ref => {
       contentColor: colors.ui.dialog.default.none.highlight,
       onPress: () => {
         Keyboard.dismiss();
-
         try {
           onPress === null || onPress === void 0 ? void 0 : onPress();
         } finally {
@@ -121,7 +119,6 @@ const Prompt = _ref => {
     }, text);
   }))));
 };
-
 const styles = createStyleSheet({
   container: {
     paddingTop: 8

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

@@ -1 +1 @@
-{"version":3,"names":["React","useEffect","useRef","useState","Keyboard","Platform","View","useWindowDimensions","NOOP","Modal","Text","TextInput","createStyleSheet","useHeaderStyle","useUIKitTheme","Button","DialogBox","Prompt","onDismiss","visible","onHide","autoFocus","title","defaultValue","placeholder","onSubmit","onCancel","submitLabel","cancelLabel","statusBarTranslucent","colors","inputRef","width","height","buttons","text","onPress","setText","setTimeout","OS","current","blur","focus","alignItems","justifyContent","styles","container","Boolean","titleContainer","ui","dialog","default","none","flex","inputContainer","paddingHorizontal","paddingVertical","buttonContainer","map","index","button","highlight","dismiss","paddingTop","marginBottom","flexDirection","padding","marginLeft"],"sources":["index.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport { Keyboard, Platform, TextInput as RNTextInput, View, useWindowDimensions } from 'react-native';\n\nimport { NOOP } from '@sendbird/uikit-utils';\n\nimport Modal from '../../components/Modal';\nimport Text from '../../components/Text';\nimport TextInput from '../../components/TextInput';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useHeaderStyle from '../../styles/useHeaderStyle';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\nimport Button from '../Button';\nimport DialogBox from '../Dialog/DialogBox';\n\nexport type PromptItem = {\n  title: string;\n  placeholder?: string;\n  defaultValue?: string;\n  onSubmit?: (text: string) => void;\n  submitLabel?: string;\n  onCancel?: () => void;\n  cancelLabel?: string;\n};\n\ntype Props = {\n  visible: boolean;\n  onHide: () => void;\n  onDismiss?: () => void;\n  autoFocus?: boolean;\n} & PromptItem;\nconst Prompt = ({\n  onDismiss,\n  visible,\n  onHide,\n  autoFocus = true,\n  title,\n  defaultValue = '',\n  placeholder = 'Enter',\n  onSubmit = NOOP,\n  onCancel = NOOP,\n  submitLabel = 'Submit',\n  cancelLabel = 'Cancel',\n}: Props) => {\n  const { statusBarTranslucent } = useHeaderStyle();\n  const { colors } = useUIKitTheme();\n  const inputRef = useRef<RNTextInput>(null);\n  const { width, height } = useWindowDimensions();\n\n  const buttons = [\n    { text: cancelLabel, onPress: onCancel },\n    { text: submitLabel, onPress: () => onSubmit(text) },\n  ];\n\n  const [text, setText] = useState(defaultValue);\n\n  // FIXME: autoFocus trick with modal\n  // Android\n  // - InputProps.autoFocus is not trigger keyboard appearing.\n  // - InputRef.focus() is trigger keyboard appearing, but position of keyboard selection is always the start of text.\n  // iOS\n  // - InputProps.autoFocus is trigger weird UI behavior on landscape mode.\n  useEffect(() => {\n    if (autoFocus && visible) {\n      setTimeout(() => {\n        if (Platform.OS === 'android') inputRef.current?.blur();\n        inputRef.current?.focus();\n      }, 250);\n    }\n  }, [autoFocus, visible, `${width}-${height}`]);\n\n  return (\n    <Modal\n      enableKeyboardAvoid\n      disableBackgroundClose\n      onClose={onHide}\n      onDismiss={() => {\n        setText('');\n        onDismiss?.();\n      }}\n      statusBarTranslucent={statusBarTranslucent}\n      visible={visible}\n      backgroundStyle={{ alignItems: 'center', justifyContent: 'center' }}\n    >\n      <DialogBox style={styles.container}>\n        {Boolean(title) && (\n          <View style={styles.titleContainer}>\n            <Text h1 color={colors.ui.dialog.default.none.text} numberOfLines={1} style={{ flex: 1 }}>\n              {title}\n            </Text>\n          </View>\n        )}\n\n        <View style={styles.inputContainer}>\n          <TextInput\n            autoFocus={autoFocus && Platform.OS === 'android'}\n            ref={inputRef}\n            placeholder={placeholder}\n            variant={'underline'}\n            value={text}\n            onChangeText={setText}\n            style={{ paddingHorizontal: 0, paddingVertical: 10 }}\n          />\n        </View>\n\n        <View style={styles.buttonContainer}>\n          {buttons.map(({ text, onPress }, index) => {\n            return (\n              <Button\n                key={text + index}\n                variant={'text'}\n                style={styles.button}\n                contentColor={colors.ui.dialog.default.none.highlight}\n                onPress={() => {\n                  Keyboard.dismiss();\n                  try {\n                    onPress?.();\n                  } finally {\n                    onHide();\n                  }\n                }}\n              >\n                {text}\n              </Button>\n            );\n          })}\n        </View>\n      </DialogBox>\n    </Modal>\n  );\n};\n\nconst styles = createStyleSheet({\n  container: {\n    paddingTop: 8,\n  },\n  titleContainer: {\n    marginBottom: 12,\n    paddingVertical: 12,\n    paddingHorizontal: 24,\n    flexDirection: 'row',\n    alignItems: 'center',\n  },\n  inputContainer: {\n    paddingHorizontal: 24,\n    marginBottom: 12,\n  },\n  buttonContainer: {\n    flexDirection: 'row',\n    alignItems: 'center',\n    justifyContent: 'flex-end',\n    padding: 12,\n  },\n  button: {\n    marginLeft: 8,\n  },\n});\n\nexport default Prompt;\n"],"mappings":"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"}
+{"version":3,"names":["React","useEffect","useRef","useState","Keyboard","Platform","View","useWindowDimensions","NOOP","Modal","Text","TextInput","createStyleSheet","useHeaderStyle","useUIKitTheme","Button","DialogBox","Prompt","_ref","onDismiss","visible","onHide","autoFocus","title","defaultValue","placeholder","onSubmit","onCancel","submitLabel","cancelLabel","statusBarTranslucent","colors","inputRef","width","height","buttons","text","onPress","setText","setTimeout","_inputRef$current","_inputRef$current2","OS","current","blur","focus","createElement","enableKeyboardAvoid","disableBackgroundClose","onClose","backgroundStyle","alignItems","justifyContent","style","styles","container","Boolean","titleContainer","h1","color","ui","dialog","default","none","numberOfLines","flex","inputContainer","ref","variant","value","onChangeText","paddingHorizontal","paddingVertical","buttonContainer","map","_ref2","index","key","button","contentColor","highlight","dismiss","paddingTop","marginBottom","flexDirection","padding","marginLeft"],"sources":["index.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport { Keyboard, Platform, TextInput as RNTextInput, View, useWindowDimensions } from 'react-native';\n\nimport { NOOP } from '@sendbird/uikit-utils';\n\nimport Modal from '../../components/Modal';\nimport Text from '../../components/Text';\nimport TextInput from '../../components/TextInput';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useHeaderStyle from '../../styles/useHeaderStyle';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\nimport Button from '../Button';\nimport DialogBox from '../Dialog/DialogBox';\n\nexport type PromptItem = {\n  title: string;\n  placeholder?: string;\n  defaultValue?: string;\n  onSubmit?: (text: string) => void;\n  submitLabel?: string;\n  onCancel?: () => void;\n  cancelLabel?: string;\n};\n\ntype Props = {\n  visible: boolean;\n  onHide: () => void;\n  onDismiss?: () => void;\n  autoFocus?: boolean;\n} & PromptItem;\nconst Prompt = ({\n  onDismiss,\n  visible,\n  onHide,\n  autoFocus = true,\n  title,\n  defaultValue = '',\n  placeholder = 'Enter',\n  onSubmit = NOOP,\n  onCancel = NOOP,\n  submitLabel = 'Submit',\n  cancelLabel = 'Cancel',\n}: Props) => {\n  const { statusBarTranslucent } = useHeaderStyle();\n  const { colors } = useUIKitTheme();\n  const inputRef = useRef<RNTextInput>(null);\n  const { width, height } = useWindowDimensions();\n\n  const buttons = [\n    { text: cancelLabel, onPress: onCancel },\n    { text: submitLabel, onPress: () => onSubmit(text) },\n  ];\n\n  const [text, setText] = useState(defaultValue);\n\n  // FIXME: autoFocus trick with modal\n  // Android\n  // - InputProps.autoFocus is not trigger keyboard appearing.\n  // - InputRef.focus() is trigger keyboard appearing, but position of keyboard selection is always the start of text.\n  // iOS\n  // - InputProps.autoFocus is trigger weird UI behavior on landscape mode.\n  useEffect(() => {\n    if (autoFocus && visible) {\n      setTimeout(() => {\n        if (Platform.OS === 'android') inputRef.current?.blur();\n        inputRef.current?.focus();\n      }, 250);\n    }\n  }, [autoFocus, visible, `${width}-${height}`]);\n\n  return (\n    <Modal\n      enableKeyboardAvoid\n      disableBackgroundClose\n      onClose={onHide}\n      onDismiss={() => {\n        setText('');\n        onDismiss?.();\n      }}\n      statusBarTranslucent={statusBarTranslucent}\n      visible={visible}\n      backgroundStyle={{ alignItems: 'center', justifyContent: 'center' }}\n    >\n      <DialogBox style={styles.container}>\n        {Boolean(title) && (\n          <View style={styles.titleContainer}>\n            <Text h1 color={colors.ui.dialog.default.none.text} numberOfLines={1} style={{ flex: 1 }}>\n              {title}\n            </Text>\n          </View>\n        )}\n\n        <View style={styles.inputContainer}>\n          <TextInput\n            autoFocus={autoFocus && Platform.OS === 'android'}\n            ref={inputRef}\n            placeholder={placeholder}\n            variant={'underline'}\n            value={text}\n            onChangeText={setText}\n            style={{ paddingHorizontal: 0, paddingVertical: 10 }}\n          />\n        </View>\n\n        <View style={styles.buttonContainer}>\n          {buttons.map(({ text, onPress }, index) => {\n            return (\n              <Button\n                key={text + index}\n                variant={'text'}\n                style={styles.button}\n                contentColor={colors.ui.dialog.default.none.highlight}\n                onPress={() => {\n                  Keyboard.dismiss();\n                  try {\n                    onPress?.();\n                  } finally {\n                    onHide();\n                  }\n                }}\n              >\n                {text}\n              </Button>\n            );\n          })}\n        </View>\n      </DialogBox>\n    </Modal>\n  );\n};\n\nconst styles = createStyleSheet({\n  container: {\n    paddingTop: 8,\n  },\n  titleContainer: {\n    marginBottom: 12,\n    paddingVertical: 12,\n    paddingHorizontal: 24,\n    flexDirection: 'row',\n    alignItems: 'center',\n  },\n  inputContainer: {\n    paddingHorizontal: 24,\n    marginBottom: 12,\n  },\n  buttonContainer: {\n    flexDirection: 'row',\n    alignItems: 'center',\n    justifyContent: 'flex-end',\n    padding: 12,\n  },\n  button: {\n    marginLeft: 8,\n  },\n});\n\nexport default Prompt;\n"],"mappings":"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"}

package/lib/module/ui/Toast/index.js

@@ -6,10 +6,8 @@ import Text from '../../components/Text';
 import createStyleSheet from '../../styles/createStyleSheet';
 import useUIKitTheme from '../../theme/useUIKitTheme';
 const ToastContext = /*#__PURE__*/createContext(null);
-
 const useOpacity = () => {
   const opacity = useRef(new Animated.Value(0)).current;
-
   const transition = value => {
     Animated.timing(opacity, {
       toValue: value,
@@ -17,14 +15,12 @@ const useOpacity = () => {
       useNativeDriver: true
     }).start();
   };
-
   return {
     opacity,
     show: () => transition(1),
     hide: () => transition(0)
   };
 };
-
 const Toast = _ref => {
   let {
     visible,
@@ -50,14 +46,12 @@ const Toast = _ref => {
         light: palette.error200
       });
     }
-
     if (type === 'success') {
       return select({
         dark: palette.secondary300,
         light: palette.secondary200
       });
     }
-
     return 'transparent';
   }, [type, select]);
   const backgroundColor = useMemo(() => {
@@ -88,7 +82,6 @@ const Toast = _ref => {
     style: styles.text
   }, children));
 };
-
 const VISIBLE_MS = 3000;
 export const ToastProvider = _ref2 => {
   let {
@@ -106,7 +99,8 @@ export const ToastProvider = _ref2 => {
   useEffect(() => {
     if (!state.visible) return;
     const hideTimeout = setTimeout(() => {
-      setState(prev => ({ ...prev,
+      setState(prev => ({
+        ...prev,
         visible: false
       }));
     }, dismissTimeout);

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

@@ -1 +1 @@
-{"version":3,"names":["React","createContext","useContext","useEffect","useMemo","useRef","useState","Animated","KeyboardAvoidingView","Platform","useSafeAreaInsets","Icon","Text","createStyleSheet","useUIKitTheme","ToastContext","useOpacity","opacity","Value","current","transition","value","timing","toValue","duration","useNativeDriver","start","show","hide","Toast","visible","type","children","top","bottom","colors","select","palette","color","dark","error300","light","error200","secondary300","secondary200","backgroundColor","styles","toast","icon","onBackgroundReverse01","text","VISIBLE_MS","ToastProvider","dismissTimeout","state","setState","hideTimeout","setTimeout","prev","clearTimeout","OS","undefined","toastPosition","useToast","context","Error","position","height","paddingHorizontal","justifyContent","alignItems","alignSelf","borderRadius","flexDirection","marginRight","maxWidth"],"sources":["index.tsx"],"sourcesContent":["import React, { createContext, useContext, useEffect, useMemo, useRef, useState } from 'react';\nimport { Animated, KeyboardAvoidingView, Platform } from 'react-native';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\n\nimport Icon from '../../components/Icon';\nimport Text from '../../components/Text';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\n\ntype ToastType = 'normal' | 'error' | 'success';\ntype Context = { show(text: string, type?: ToastType): void };\n\nconst ToastContext = createContext<Context | null>(null);\n\ntype Props = React.PropsWithChildren<{\n  top?: number;\n  bottom?: number;\n  visible: boolean;\n  type: ToastType;\n  children: string;\n}>;\n\nconst useOpacity = () => {\n  const opacity = useRef(new Animated.Value(0)).current;\n  const transition = (value: number) => {\n    Animated.timing(opacity, { toValue: value, duration: 500, useNativeDriver: true }).start();\n  };\n\n  return {\n    opacity,\n    show: () => transition(1),\n    hide: () => transition(0),\n  };\n};\n\nconst Toast = ({ visible, type, children, top, bottom }: Props) => {\n  const { colors, select, palette } = useUIKitTheme();\n  const { opacity, show, hide } = useOpacity();\n\n  const color = useMemo(() => {\n    if (type === 'error') {\n      return select({ dark: palette.error300, light: palette.error200 });\n    }\n    if (type === 'success') {\n      return select({ dark: palette.secondary300, light: palette.secondary200 });\n    }\n    return 'transparent';\n  }, [type, select]);\n\n  const backgroundColor = useMemo(() => {\n    return select({ light: 'rgba(0,0,0,0.64)', dark: 'rgba(255,255,255,0.64)' });\n  }, [select]);\n\n  useEffect(() => {\n    visible ? show() : hide();\n  }, [visible]);\n\n  return (\n    <Animated.View pointerEvents={'none'} style={[styles.toast, { opacity, top, bottom, backgroundColor }]}>\n      {type !== 'normal' && (\n        <Icon icon={type === 'success' ? 'done' : 'error'} color={color} containerStyle={styles.icon} />\n      )}\n      <Text color={colors.onBackgroundReverse01} body3 numberOfLines={2} style={styles.text}>\n        {children}\n      </Text>\n    </Animated.View>\n  );\n};\n\nconst VISIBLE_MS = 3000;\nexport const ToastProvider = ({\n  children,\n  dismissTimeout = VISIBLE_MS,\n}: React.PropsWithChildren<{ dismissTimeout?: number }>) => {\n  const [state, setState] = useState({ visible: false, type: 'error' as ToastType, text: '' });\n  const { bottom } = useSafeAreaInsets();\n\n  useEffect(() => {\n    if (!state.visible) return;\n\n    const hideTimeout = setTimeout(() => {\n      setState((prev) => ({ ...prev, visible: false }));\n    }, dismissTimeout);\n    return () => clearTimeout(hideTimeout);\n  });\n\n  return (\n    <ToastContext.Provider value={{ show: (text, type = 'normal') => text && setState({ text, type, visible: true }) }}>\n      {children}\n      <KeyboardAvoidingView\n        behavior={Platform.OS === 'ios' ? 'position' : undefined}\n        keyboardVerticalOffset={-bottom}\n        pointerEvents={'none'}\n      >\n        <Toast type={state.type} visible={state.visible} bottom={bottom + styles.toastPosition.bottom}>\n          {state.text}\n        </Toast>\n      </KeyboardAvoidingView>\n    </ToastContext.Provider>\n  );\n};\n\nexport const useToast = () => {\n  const context = useContext(ToastContext);\n  if (!context) throw new Error('ToastContext is not provided, wrap your app with ToastProvider');\n  return context;\n};\n\nconst styles = createStyleSheet({\n  toast: {\n    position: 'absolute',\n    height: 48,\n    paddingHorizontal: 12,\n    justifyContent: 'center',\n    alignItems: 'center',\n    alignSelf: 'center',\n    borderRadius: 24,\n    flexDirection: 'row',\n  },\n  icon: {\n    marginRight: 4,\n  },\n  text: {\n    maxWidth: 240,\n    paddingHorizontal: 4,\n  },\n  toastPosition: {\n    bottom: 60,\n  },\n});\n\nexport default Toast;\n"],"mappings":"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"}
+{"version":3,"names":["React","createContext","useContext","useEffect","useMemo","useRef","useState","Animated","KeyboardAvoidingView","Platform","useSafeAreaInsets","Icon","Text","createStyleSheet","useUIKitTheme","ToastContext","useOpacity","opacity","Value","current","transition","value","timing","toValue","duration","useNativeDriver","start","show","hide","Toast","_ref","visible","type","children","top","bottom","colors","select","palette","color","dark","error300","light","error200","secondary300","secondary200","backgroundColor","createElement","View","pointerEvents","style","styles","toast","icon","containerStyle","onBackgroundReverse01","body3","numberOfLines","text","VISIBLE_MS","ToastProvider","_ref2","dismissTimeout","state","setState","hideTimeout","setTimeout","prev","clearTimeout","Provider","arguments","length","undefined","behavior","OS","keyboardVerticalOffset","toastPosition","useToast","context","Error","position","height","paddingHorizontal","justifyContent","alignItems","alignSelf","borderRadius","flexDirection","marginRight","maxWidth"],"sources":["index.tsx"],"sourcesContent":["import React, { createContext, useContext, useEffect, useMemo, useRef, useState } from 'react';\nimport { Animated, KeyboardAvoidingView, Platform } from 'react-native';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\n\nimport Icon from '../../components/Icon';\nimport Text from '../../components/Text';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\n\ntype ToastType = 'normal' | 'error' | 'success';\ntype Context = { show(text: string, type?: ToastType): void };\n\nconst ToastContext = createContext<Context | null>(null);\n\ntype Props = React.PropsWithChildren<{\n  top?: number;\n  bottom?: number;\n  visible: boolean;\n  type: ToastType;\n  children: string;\n}>;\n\nconst useOpacity = () => {\n  const opacity = useRef(new Animated.Value(0)).current;\n  const transition = (value: number) => {\n    Animated.timing(opacity, { toValue: value, duration: 500, useNativeDriver: true }).start();\n  };\n\n  return {\n    opacity,\n    show: () => transition(1),\n    hide: () => transition(0),\n  };\n};\n\nconst Toast = ({ visible, type, children, top, bottom }: Props) => {\n  const { colors, select, palette } = useUIKitTheme();\n  const { opacity, show, hide } = useOpacity();\n\n  const color = useMemo(() => {\n    if (type === 'error') {\n      return select({ dark: palette.error300, light: palette.error200 });\n    }\n    if (type === 'success') {\n      return select({ dark: palette.secondary300, light: palette.secondary200 });\n    }\n    return 'transparent';\n  }, [type, select]);\n\n  const backgroundColor = useMemo(() => {\n    return select({ light: 'rgba(0,0,0,0.64)', dark: 'rgba(255,255,255,0.64)' });\n  }, [select]);\n\n  useEffect(() => {\n    visible ? show() : hide();\n  }, [visible]);\n\n  return (\n    <Animated.View pointerEvents={'none'} style={[styles.toast, { opacity, top, bottom, backgroundColor }]}>\n      {type !== 'normal' && (\n        <Icon icon={type === 'success' ? 'done' : 'error'} color={color} containerStyle={styles.icon} />\n      )}\n      <Text color={colors.onBackgroundReverse01} body3 numberOfLines={2} style={styles.text}>\n        {children}\n      </Text>\n    </Animated.View>\n  );\n};\n\nconst VISIBLE_MS = 3000;\nexport const ToastProvider = ({\n  children,\n  dismissTimeout = VISIBLE_MS,\n}: React.PropsWithChildren<{ dismissTimeout?: number }>) => {\n  const [state, setState] = useState({ visible: false, type: 'error' as ToastType, text: '' });\n  const { bottom } = useSafeAreaInsets();\n\n  useEffect(() => {\n    if (!state.visible) return;\n\n    const hideTimeout = setTimeout(() => {\n      setState((prev) => ({ ...prev, visible: false }));\n    }, dismissTimeout);\n    return () => clearTimeout(hideTimeout);\n  });\n\n  return (\n    <ToastContext.Provider value={{ show: (text, type = 'normal') => text && setState({ text, type, visible: true }) }}>\n      {children}\n      <KeyboardAvoidingView\n        behavior={Platform.OS === 'ios' ? 'position' : undefined}\n        keyboardVerticalOffset={-bottom}\n        pointerEvents={'none'}\n      >\n        <Toast type={state.type} visible={state.visible} bottom={bottom + styles.toastPosition.bottom}>\n          {state.text}\n        </Toast>\n      </KeyboardAvoidingView>\n    </ToastContext.Provider>\n  );\n};\n\nexport const useToast = () => {\n  const context = useContext(ToastContext);\n  if (!context) throw new Error('ToastContext is not provided, wrap your app with ToastProvider');\n  return context;\n};\n\nconst styles = createStyleSheet({\n  toast: {\n    position: 'absolute',\n    height: 48,\n    paddingHorizontal: 12,\n    justifyContent: 'center',\n    alignItems: 'center',\n    alignSelf: 'center',\n    borderRadius: 24,\n    flexDirection: 'row',\n  },\n  icon: {\n    marginRight: 4,\n  },\n  text: {\n    maxWidth: 240,\n    paddingHorizontal: 4,\n  },\n  toastPosition: {\n    bottom: 60,\n  },\n});\n\nexport default Toast;\n"],"mappings":"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"}

package/package.json

@@ -1,7 +1,18 @@
 {
   "name": "@sendbird/uikit-react-native-foundation",
-  "version": "2.4.1",
-  "description": "react-native-uikit",
+  "version": "2.4.2",
+  "description": "A foundational UI kit for building chat-enabled React Native apps.",
+  "keywords": [
+    "sendbird",
+    "uikit",
+    "React Native",
+    "chat",
+    "messaging",
+    "UI components",
+    "customizable",
+    "theme",
+    "design system"
+  ],
   "main": "lib/commonjs/index",
   "module": "lib/module/index",
   "types": "lib/typescript/src/index.d.ts",
@@ -19,10 +30,6 @@
     "clean": "del lib",
     "generate-icons": "node src/assets/bundle-icons.js"
   },
-  "keywords": [
-    "react-native",
-    "sendbird"
-  ],
   "repository": {
     "type": "git",
     "url": "https://github.com/sendbird/sendbird-uikit-react-native.git",
@@ -39,7 +46,7 @@
     "access": "public"
   },
   "dependencies": {
-    "@sendbird/uikit-utils": "2.4.1"
+    "@sendbird/uikit-utils": "2.4.2"
   },
   "devDependencies": {
     "@types/react": "*",
@@ -81,5 +88,5 @@
     "readmeFile": "./README.md",
     "displayName": "@sendbird/uikit-react-native-foundation"
   },
-  "gitHead": "9ba7a005c941a3edd5b0f78d88d8cd1df6c280fc"
+  "gitHead": "ae9e60edc60cdd4f6e9b0e4019e84584e807bc2c"
 }

package/src/components/Image/Image.fastimage.tsx

@@ -30,6 +30,13 @@ function convertSource(source: SendbirdImageProps['source']): Source | number {
     cache: convertCache(source.cache), //'immutable' | 'web' | 'cacheOnly'
   };
 }
+function convertDefaultSource(source?: SendbirdImageProps['defaultSource']): number | undefined {
+  if (typeof source === 'number') {
+    return source;
+  }
+
+  return undefined;
+}
 
 function convertResizeMode(mode?: SendbirdImageProps['resizeMode']): ResizeMode | undefined {
   switch (mode) {
@@ -52,7 +59,15 @@ try {
   FastImage = require('react-native-fast-image') as (props: FastImageProps) => JSX.Element;
 } catch {}
 
-const Image_FastImage: SendbirdImageComponent = ({ source, resizeMode, onLoad, onError, style, ...props }) => {
+const Image_FastImage: SendbirdImageComponent = ({
+  source,
+  defaultSource,
+  resizeMode,
+  onLoad,
+  onError,
+  style,
+  ...props
+}) => {
   return (
     <FastImage
       {...props}
@@ -60,6 +75,7 @@ const Image_FastImage: SendbirdImageComponent = ({ source, resizeMode, onLoad, o
       onError={onError && (() => onError({}))}
       style={style as FastImageProps['style']}
       source={convertSource(source)}
+      defaultSource={convertDefaultSource(defaultSource)}
       resizeMode={convertResizeMode(resizeMode)}
     />
   );